bigbuffet-rw/app/soapbox/components/icon_with_counter.js
2021-09-12 19:45:17 -05:00

22 lines
580 B
JavaScript

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