1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162 |
- // @ts-check
- import React from 'react';
- import { FormattedMessage } from 'react-intl';
- /**
- * Returns custom renderer for one of the common counter types
- *
- * @param {"statuses" | "following" | "followers"} counterType
- * Type of the counter
- * @param {boolean} isBold Whether display number must be displayed in bold
- * @returns {(displayNumber: JSX.Element, pluralReady: number) => JSX.Element}
- * Renderer function
- * @throws If counterType is not covered by this function
- */
- export function counterRenderer(counterType, isBold = true) {
- /**
- * @type {(displayNumber: JSX.Element) => JSX.Element}
- */
- const renderCounter = isBold
- ? (displayNumber) => <strong>{displayNumber}</strong>
- : (displayNumber) => displayNumber;
- switch (counterType) {
- case 'statuses': {
- return (displayNumber, pluralReady) => (
- <FormattedMessage
- id='account.statuses_counter'
- defaultMessage='{count, plural, one {{counter} Post} other {{counter} Posts}}'
- values={{
- count: pluralReady,
- counter: renderCounter(displayNumber),
- }}
- />
- );
- }
- case 'following': {
- return (displayNumber, pluralReady) => (
- <FormattedMessage
- id='account.following_counter'
- defaultMessage='{count, plural, one {{counter} Following} other {{counter} Following}}'
- values={{
- count: pluralReady,
- counter: renderCounter(displayNumber),
- }}
- />
- );
- }
- case 'followers': {
- return (displayNumber, pluralReady) => (
- <FormattedMessage
- id='account.followers_counter'
- defaultMessage='{count, plural, one {{counter} Follower} other {{counter} Followers}}'
- values={{
- count: pluralReady,
- counter: renderCounter(displayNumber),
- }}
- />
- );
- }
- default: throw Error(`Incorrect counter name: ${counterType}. Ensure it accepted by commonCounter function`);
- }
- }
|