moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Pass iconset into IconButton, IconWithCounter

This commit is contained in:
Alex Gleason 2021-09-12 19:45:17 -05:00
parent 7de9fbcda8
commit d6201905c8
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
2 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/soapbox/components/icon_button.js
View File

@ -12,6 +12,7 @@ export default class IconButton extends React.PureComponent {
className: PropTypes.string,
title: PropTypes.string.isRequired,
icon: PropTypes.string.isRequired,
iconset: PropTypes.string,
onClick: PropTypes.func,
onMouseDown: PropTypes.func,
onKeyUp: PropTypes.func,
@ -97,6 +98,7 @@ export default class IconButton extends React.PureComponent {
disabled,
expanded,
icon,
iconset,
inverted,
overlay,
pressed,
@ -136,7 +138,7 @@ export default class IconButton extends React.PureComponent {
<div style={style}>
{emoji
? <div className='icon-button__emoji' dangerouslySetInnerHTML={{ __html: emojify(emoji) }} aria-hidden='true' />
: <Icon id={icon} fixedWidth aria-hidden='true' />}
: <Icon id={icon} iconset={iconset} fixedWidth aria-hidden='true' />}
</div>
{text && <span className='icon_button__text'>{text}</span>}
</button>
@ -165,7 +167,7 @@ export default class IconButton extends React.PureComponent {
<div style={style}>
{emoji
? <div className='icon-button__emoji' style={{ transform: `rotate(${rotate}deg)` }} dangerouslySetInnerHTML={{ __html: emojify(emoji) }} aria-hidden='true' />
: <Icon id={icon} style={{ transform: `rotate(${rotate}deg)` }} fixedWidth aria-hidden='true' />}
: <Icon id={icon} iconset={iconset} style={{ transform: `rotate(${rotate}deg)` }} fixedWidth aria-hidden='true' />}
</div>
{text && <span className='icon_button__text'>{text}</span>}
</button>

5
app/soapbox/components/icon_with_counter.js
View File

@ -3,10 +3,10 @@ import PropTypes from 'prop-types';
import Icon from 'soapbox/components/icon';
import { shortNumberFormat } from 'soapbox/utils/numbers';
const IconWithCounter = ({ icon, count, fixedWidth }) => {
const IconWithCounter = ({ icon, count, ...rest }) => {
return (
<div className='icon-with-counter'>
<Icon id={icon} fixedWidth={fixedWidth} />
<Icon id={icon} {...rest} />
{count > 0 && <i className='icon-with-counter__counter'>
{shortNumberFormat(count)}
</i>}
@ -17,7 +17,6 @@ const IconWithCounter = ({ icon, count, fixedWidth }) => {
IconWithCounter.propTypes = {
icon: PropTypes.string.isRequired,
count: PropTypes.number.isRequired,
fixedWidth: PropTypes.bool,
};
export default IconWithCounter;