app/javascript/mastodon/components/common_counter.js

   1 // @ts-check
   2 import React from 'react';
   3 import { FormattedMessage } from 'react-intl';
   4
   5 /**
   6  * Returns custom renderer for one of the common counter types
   7  *
   8  * @param {"statuses" | "following" | "followers"} counterType
   9  * Type of the counter
  10  * @param {boolean} isBold Whether display number must be displayed in bold
  11  * @returns {(displayNumber: JSX.Element, pluralReady: number) => JSX.Element}
  12  * Renderer function
  13  * @throws If counterType is not covered by this function
  14  */
  15 export function counterRenderer(counterType, isBold = true) {
  16   /**
  17    * @type {(displayNumber: JSX.Element) => JSX.Element}
  18    */
  19   const renderCounter = isBold
  20     ? (displayNumber) => <strong>{displayNumber}</strong>
  21     : (displayNumber) => displayNumber;
  22
  23   switch (counterType) {
  24   case 'statuses': {
  25     return (displayNumber, pluralReady) => (
  26       <FormattedMessage
  27         id='account.statuses_counter'
  28         defaultMessage='{count, plural, one {{counter} Toot} other {{counter} Toots}}'
  29         values={{
  30           count: pluralReady,
  31           counter: renderCounter(displayNumber),
  32         }}
  33       />
  34     );
  35   }
  36   case 'following': {
  37     return (displayNumber, pluralReady) => (
  38       <FormattedMessage
  39         id='account.following_counter'
  40         defaultMessage='{count, plural, one {{counter} Following} other {{counter} Following}}'
  41         values={{
  42           count: pluralReady,
  43           counter: renderCounter(displayNumber),
  44         }}
  45       />
  46     );
  47   }
  48   case 'followers': {
  49     return (displayNumber, pluralReady) => (
  50       <FormattedMessage
  51         id='account.followers_counter'
  52         defaultMessage='{count, plural, one {{counter} Follower} other {{counter} Followers}}'
  53         values={{
  54           count: pluralReady,
  55           counter: renderCounter(displayNumber),
  56         }}
  57       />
  58     );
  59   }
  60   default: throw Error(`Incorrect counter name: ${counterType}. Ensure it accepted by commonCounter function`);
  61   }
  62 }