diff options
author | Eugen Rochko <eugen@zeonfederated.com> | 2018-06-04 05:15:50 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2018-06-04 05:15:50 +0200 |
commit | 1bbe81030c72e5b4ff8bc78cf4a9eaf7fbfe2301 (patch) | |
tree | 8cabcc219ae3b6c16ee2b6bfadef942d998198cd /app/javascript | |
parent | 5bf500338478f819a65d25636a0af61a482972d3 (diff) |
Display numbers in account header using shortNumberFormat for consistency (#7723)
Diffstat (limited to 'app/javascript')
-rw-r--r-- | app/javascript/mastodon/components/hashtag.js | 11 | ||||
-rw-r--r-- | app/javascript/mastodon/features/account/components/action_bar.js | 9 | ||||
-rw-r--r-- | app/javascript/mastodon/utils/numbers.js | 10 |
3 files changed, 17 insertions, 13 deletions
diff --git a/app/javascript/mastodon/components/hashtag.js b/app/javascript/mastodon/components/hashtag.js index cc37a91e2..a407df31e 100644 --- a/app/javascript/mastodon/components/hashtag.js +++ b/app/javascript/mastodon/components/hashtag.js @@ -1,16 +1,9 @@ import React from 'react'; import { Sparklines, SparklinesCurve } from 'react-sparklines'; import { Link } from 'react-router-dom'; -import { FormattedMessage, FormattedNumber } from 'react-intl'; +import { FormattedMessage } from 'react-intl'; import ImmutablePropTypes from 'react-immutable-proptypes'; - -const shortNumberFormat = number => { - if (number < 1000) { - return <FormattedNumber value={number} />; - } else { - return <React.Fragment><FormattedNumber value={number / 1000} maximumFractionDigits={1} />K</React.Fragment>; - } -}; +import { shortNumberFormat } from '../utils/numbers'; const Hashtag = ({ hashtag }) => ( <div className='trends__item'> diff --git a/app/javascript/mastodon/features/account/components/action_bar.js b/app/javascript/mastodon/features/account/components/action_bar.js index 3a1f92811..2d0f72be2 100644 --- a/app/javascript/mastodon/features/account/components/action_bar.js +++ b/app/javascript/mastodon/features/account/components/action_bar.js @@ -3,8 +3,9 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import DropdownMenuContainer from '../../../containers/dropdown_menu_container'; import { Link } from 'react-router-dom'; -import { defineMessages, injectIntl, FormattedMessage, FormattedNumber } from 'react-intl'; +import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import { me } from '../../../initial_state'; +import { shortNumberFormat } from '../../../utils/numbers'; const messages = defineMessages({ mention: { id: 'account.mention', defaultMessage: 'Mention @{name}' }, @@ -146,17 +147,17 @@ export default class ActionBar extends React.PureComponent { <div className='account__action-bar-links'> <Link className='account__action-bar__tab' to={`/accounts/${account.get('id')}`}> <span><FormattedMessage id='account.posts' defaultMessage='Toots' /></span> - <strong><FormattedNumber value={account.get('statuses_count')} /></strong> + <strong>{shortNumberFormat(account.get('statuses_count'))}</strong> </Link> <Link className='account__action-bar__tab' to={`/accounts/${account.get('id')}/following`}> <span><FormattedMessage id='account.follows' defaultMessage='Follows' /></span> - <strong><FormattedNumber value={account.get('following_count')} /></strong> + <strong>{shortNumberFormat(account.get('following_count'))}</strong> </Link> <Link className='account__action-bar__tab' to={`/accounts/${account.get('id')}/followers`}> <span><FormattedMessage id='account.followers' defaultMessage='Followers' /></span> - <strong><FormattedNumber value={account.get('followers_count')} /></strong> + <strong>{shortNumberFormat(account.get('followers_count'))}</strong> </Link> </div> </div> diff --git a/app/javascript/mastodon/utils/numbers.js b/app/javascript/mastodon/utils/numbers.js new file mode 100644 index 000000000..fdd8269ae --- /dev/null +++ b/app/javascript/mastodon/utils/numbers.js @@ -0,0 +1,10 @@ +import React, { Fragment } from 'react'; +import { FormattedNumber } from 'react-intl'; + +export const shortNumberFormat = number => { + if (number < 1000) { + return <FormattedNumber value={number} />; + } else { + return <Fragment><FormattedNumber value={number / 1000} maximumFractionDigits={1} />K</Fragment>; + } +}; |