42917806e9
removed unnecessary components, combined where necessary added each component to a folder, added individual css style modules optimized some component rendering flows removed functional components in favor of pure components linted and formatted all of the files
48 lines
1.6 KiB
JavaScript
48 lines
1.6 KiB
JavaScript
import { Sparklines, SparklinesCurve } from 'react-sparklines';
|
|
import { FormattedMessage } from 'react-intl';
|
|
import ImmutablePropTypes from 'react-immutable-proptypes';
|
|
import ImmutablePureComponent from 'react-immutable-pure-component';
|
|
import Permalink from '../permalink';
|
|
import { shortNumberFormat } from '../../utils/numbers';
|
|
|
|
import './index.scss';
|
|
|
|
export default class TrendingItem extends ImmutablePureComponent {
|
|
|
|
static propTypes = {
|
|
hashtag: ImmutablePropTypes.map.isRequired,
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<div className='trending-item'>
|
|
<div className='trending-item__text'>
|
|
<Permalink href={hashtag.get('url')} to={`/tags/${hashtag.get('name')}`}>
|
|
#<span>{hashtag.get('name')}</span>
|
|
</Permalink>
|
|
|
|
<FormattedMessage
|
|
id='trends.count_by_accounts'
|
|
defaultMessage='{count} {rawCount, plural, one {person} other {people}} talking'
|
|
values={{
|
|
rawCount: hashtag.getIn(['history', 0, 'accounts']),
|
|
count: <strong>{shortNumberFormat(hashtag.getIn(['history', 0, 'accounts']))}</strong>,
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div className='trending-item__uses'>
|
|
{shortNumberFormat(hashtag.getIn(['history', 0, 'uses']))}
|
|
</div>
|
|
|
|
<div className='trending-item__sparkline'>
|
|
<Sparklines width={50} height={28} data={hashtag.get('history').reverse().map(day => day.get('uses')).toArray()}>
|
|
<SparklinesCurve style={{ fill: 'none' }} />
|
|
</Sparklines>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
}
|