@stats-forge/github-stats-forge-core 0.2.0 → 0.4.0

package/src/cards/{stats.ts → stats/index.ts}

@@ -5,23 +5,25 @@ import {
   FONT_WEIGHT,
   firefoxFontSize,
   font,
-} from '../common/brand.ts';
-import { Card } from '../common/Card.ts';
-import { getLightDarkColors } from '../common/color.ts';
-import type { CardColors } from '../common/color.ts';
-import type { GitHubDateRange } from '../common/date.ts';
-import { formatRange } from '../common/date.ts';
-import { CardError } from '../common/error.ts';
-import { I18n } from '../common/I18n.ts';
-import { icons, rankIcon } from '../common/icons.ts';
-import { buildSearchFilter, clampValue } from '../common/ops.ts';
-import { NUMBER_FORMATS, createTextNode, flexLayout, measureText } from '../common/render.ts';
-import type { StatsData } from '../fetchers/types.ts';
-import type { Child, CssChild } from '../markup/index.ts';
-import { atRule, cssComment, el, rule } from '../markup/index.ts';
-import { statCardLocales, wakatimeCardLocales } from '../translations.ts';
-
-import type { CardOptions, CommonCardOptions } from './options.ts';
+} from '../../common/brand.ts';
+import { Card } from '../../common/Card.ts';
+import { getLightDarkColors } from '../../common/color.ts';
+import type { CardColors } from '../../common/color.ts';
+import type { GitHubDateRange } from '../../common/date.ts';
+import { formatRange } from '../../common/date.ts';
+import { CardError } from '../../common/error.ts';
+import { icons, rankIcon } from '../../common/icons.ts';
+import { commonLocales } from '../../common/locales.ts';
+import type { Localized } from '../../common/localize.ts';
+import { localize } from '../../common/localize.ts';
+import { buildSearchFilter, clampValue } from '../../common/ops.ts';
+import { NUMBER_FORMATS, createTextNode, flexLayout, measureText } from '../../common/render.ts';
+import type { StatsData } from '../../fetchers/types.ts';
+import type { Child, CssChild } from '../../markup/index.ts';
+import { atRule, cssComment, el, rule } from '../../markup/index.ts';
+import type { CardOptions, CommonCardOptions } from '../options.ts';
+
+import { statCardLocales } from './locales.ts';
 
 const CARD_MIN_WIDTH = 287;
 const CARD_DEFAULT_WIDTH = CARD_WIDTH.compact;
@@ -221,13 +223,13 @@ const getStyles = ({
 const getTotalCommitsRangeLabel = (
   include_all_commits: boolean,
   commitsRange: GitHubDateRange | undefined,
-  i18n: I18n,
+  commonT: Localized<typeof commonLocales>,
 ): string =>
   include_all_commits
     ? ''
     : commitsRange
       ? ` (${formatRange(commitsRange)})`
-      : ` (${i18n.t('wakatimecard.lastyear')})`;
+      : ` (${commonT.lastYear()})`;
 
 /**
  * Renders the stats card.
@@ -291,19 +293,14 @@ const renderCard = (
   const shows = (stat: ShowStat): boolean => show.includes(stat);
 
   const apostrophe = /s$/i.test(name.trim()) ? '' : 's';
-  const i18n = new I18n({
-    locale,
-    translations: {
-      ...statCardLocales({ name, apostrophe }),
-      ...wakatimeCardLocales,
-    },
-  });
+  const t = localize(statCardLocales, locale);
+  const commonT = localize(commonLocales, locale);
 
   // Meta data for creating text nodes with createTextNode function
   const STATS: Partial<Record<StatId, StatItem>> = {
     stars: {
       icon: icons.star,
-      label: i18n.t('statcard.totalstars'),
+      label: t.totalStars(),
       value: totalStars,
       id: 'stars',
     },
@@ -312,7 +309,7 @@ const renderCard = (
   if (shows('contributions')) {
     STATS['contributions'] = {
       icon: icons.contributions,
-      label: i18n.t('statcard.contributions'),
+      label: t.contributions(),
       value: totalContributions,
       id: 'contributions',
     };
@@ -320,17 +317,13 @@ const renderCard = (
 
   STATS['commits'] = {
     icon: icons.commits,
-    label: `${i18n.t('statcard.commits')}${getTotalCommitsRangeLabel(
-      include_all_commits,
-      commitsRange,
-      i18n,
-    )}`,
+    label: `${t.commits()}${getTotalCommitsRangeLabel(include_all_commits, commitsRange, commonT)}`,
     value: totalCommits,
     id: 'commits',
   };
   STATS['prs'] = {
     icon: icons.prs,
-    label: i18n.t('statcard.prs'),
+    label: t.prs(),
     value: totalPRs,
     id: 'prs',
   };
@@ -338,7 +331,7 @@ const renderCard = (
   if (shows('prs_merged')) {
     STATS['prs_merged'] = {
       icon: icons.prs_merged,
-      label: i18n.t('statcard.prs-merged'),
+      label: t.prsMerged(),
       value: totalPRsMerged,
       id: 'prs_merged',
     };
@@ -347,7 +340,7 @@ const renderCard = (
   if (shows('prs_merged_percentage')) {
     STATS['prs_merged_percentage'] = {
       icon: icons.prs_merged_percentage,
-      label: i18n.t('statcard.prs-merged-percentage'),
+      label: t.prsMergedPercentage(),
       value: mergedPRsPercentage.toFixed(
         number_precision !== undefined && Number.isFinite(number_precision)
           ? clampValue(number_precision, 0, 2)
@@ -361,7 +354,7 @@ const renderCard = (
   if (shows('reviews')) {
     STATS['reviews'] = {
       icon: icons.reviews,
-      label: i18n.t('statcard.reviews'),
+      label: t.reviews(),
       value: totalReviews,
       id: 'reviews',
     };
@@ -369,7 +362,7 @@ const renderCard = (
 
   STATS['issues'] = {
     icon: icons.issues,
-    label: i18n.t('statcard.issues'),
+    label: t.issues(),
     value: totalIssues,
     id: 'issues',
   };
@@ -377,7 +370,7 @@ const renderCard = (
   if (shows('discussions_started')) {
     STATS['discussions_started'] = {
       icon: icons.discussions_started,
-      label: i18n.t('statcard.discussions-started'),
+      label: t.discussionsStarted(),
       value: totalDiscussionsStarted,
       id: 'discussions_started',
     };
@@ -385,7 +378,7 @@ const renderCard = (
   if (shows('discussions_answered')) {
     STATS['discussions_answered'] = {
       icon: icons.discussions_answered,
-      label: i18n.t('statcard.discussions-answered'),
+      label: t.discussionsAnswered(),
       value: totalDiscussionsAnswered,
       id: 'discussions_answered',
     };
@@ -396,7 +389,7 @@ const renderCard = (
   if (shows('prs_authored')) {
     STATS['prs_authored'] = {
       icon: icons.prs,
-      label: i18n.t('statcard.prs-authored'),
+      label: t.prsAuthored(),
       value: totalPRsAuthored,
       id: 'prs_authored',
       link: `https://github.com/search?q=${repoFilter}author%3A${encodedUsername}&amp;type=pullrequests`,
@@ -405,7 +398,7 @@ const renderCard = (
   if (shows('prs_commented')) {
     STATS['prs_commented'] = {
       icon: icons.comments,
-      label: i18n.t('statcard.prs-commented'),
+      label: t.prsCommented(),
       value: totalPRsCommented,
       id: 'prs_commented',
       link: `https://github.com/search?q=${repoFilter}commenter%3A${encodedUsername}+-author%3A${encodedUsername}&amp;type=pullrequests`,
@@ -414,7 +407,7 @@ const renderCard = (
   if (shows('prs_reviewed')) {
     STATS['prs_reviewed'] = {
       icon: icons.reviews,
-      label: i18n.t('statcard.prs-reviewed'),
+      label: t.prsReviewed(),
       value: totalPRsReviewed,
       id: 'prs_reviewed',
       link: `https://github.com/search?q=${repoFilter}reviewed-by%3A${encodedUsername}+-author%3A${encodedUsername}&amp;type=pullrequests`,
@@ -423,7 +416,7 @@ const renderCard = (
   if (shows('issues_authored')) {
     STATS['issues_authored'] = {
       icon: icons.issues,
-      label: i18n.t('statcard.issues-authored'),
+      label: t.issuesAuthored(),
       value: totalIssuesAuthored,
       id: 'issues_authored',
       link: `https://github.com/search?q=${repoFilter}author%3A${encodedUsername}&amp;type=issues`,
@@ -432,7 +425,7 @@ const renderCard = (
   if (shows('issues_commented')) {
     STATS['issues_commented'] = {
       icon: icons.discussions_started,
-      label: i18n.t('statcard.issues-commented'),
+      label: t.issuesCommented(),
       value: totalIssuesCommented,
       id: 'issues_commented',
       link: `https://github.com/search?q=${repoFilter}commenter%3A${encodedUsername}+-author%3A${encodedUsername}&amp;type=issues`,
@@ -441,7 +434,7 @@ const renderCard = (
 
   STATS['contribs'] = {
     icon: icons.repo,
-    label: i18n.t('statcard.contribs'),
+    label: t.contribs(),
     value: contributedTo,
     id: 'contribs',
   };
@@ -449,7 +442,7 @@ const renderCard = (
   if (shows('all_time_contribs')) {
     STATS['all_time_contribs'] = {
       icon: icons.repo,
-      label: i18n.t('statcard.all-time-contribs'),
+      label: t.allTimeContribs(),
       value: allTimeContributedTo,
       id: 'all_time_contribs',
     };
@@ -468,6 +461,9 @@ const renderCard = (
   }
 
   // check if all used labels are short
+  const defaultTitle =
+    visibleStats.length > 0 ? t.title({ name, apostrophe }) : t.rankTitle({ name, apostrophe });
+
   const longLabels = visibleStats.some(([, stat]) => stat.label.length > 18);
 
   // The rank ring sets the floor: 150 beside the stats, 180 when it is the whole card.
@@ -479,11 +475,7 @@ const renderCard = (
   // the lower the user's percentile the better
   const progress = 100 - rank.percentile;
 
-  const calculateTextWidth = (): number =>
-    measureText(
-      custom_title ||
-        (visibleStats.length > 0 ? i18n.t('statcard.title') : i18n.t('statcard.ranktitle')),
-    );
+  const calculateTextWidth = (): number => measureText(custom_title || defaultTitle);
 
   const iconWidth = show_icons && visibleStats.length > 0 ? 16 + /* padding */ 1 : 0;
   // The icons ride inside the step's own slack, so a default card lands on the width grid;
@@ -539,7 +531,7 @@ const renderCard = (
 
   const card = new Card({
     customTitle: custom_title,
-    defaultTitle: visibleStats.length > 0 ? i18n.t('statcard.title') : i18n.t('statcard.ranktitle'),
+    defaultTitle,
     titlePrefixIcon: CARD_ICON.stats,
     width,
     height,
@@ -587,10 +579,10 @@ const renderCard = (
   const labels = visibleStats
     .map(([key, stat]) => {
       if (key === 'commits') {
-        return `${i18n.t('statcard.commits')} ${getTotalCommitsRangeLabel(
+        return `${t.commits()} ${getTotalCommitsRangeLabel(
           include_all_commits,
           commitsRange,
-          i18n,
+          commonT,
         )} : ${stat.value}`;
       }
       return `${stat.label}: ${stat.value}`;
@@ -598,7 +590,7 @@ const renderCard = (
     .join(', ');
 
   card.setAccessibilityLabel({
-    title: `${card.title}, ${i18n.t('statcard.rank')}: ${rank.level}`,
+    title: t.accessibilityTitle({ title: card.title, level: rank.level }),
     desc: labels,
   });