refactor: extract shared prime rank label helper

Author: cuzz-venus

apps/evm/src/containers/PrimeRank/Footer/index.tsx

@@ -1,11 +1,9 @@
-import BigNumber from 'bignumber.js';
-
 import { routes } from 'constants/routing';
 import { Link } from 'containers/Link';
 import { useTranslation } from 'libs/translations';
-import { shortenValueWithSuffix } from 'utilities';
 
 import { EligibilityStatus } from '../EligibilityStatus';
+import { getRankLabels } from '../getRankLabels';
 import { useGetPrimeRank } from '../useGetPrimeRank';
 
 export interface FooterProps {
@@ -15,13 +13,10 @@ export interface FooterProps {
 export const Footer: React.FC<FooterProps> = ({ hideLeaderboardLink }) => {
   const { t, Trans } = useTranslation();
 
-  const { hasStakedXvs, isCandidate, isPrime, hasSupplied, rank, primeScore, gapXvsTokens } =
-    useGetPrimeRank();
+  const rankData = useGetPrimeRank();
+  const { hasStakedXvs, isCandidate, isPrime, hasSupplied, gapXvsTokens } = rankData;
 
-  const rankLabel = hasStakedXvs ? `#${rank}` : '#-';
-  const primeScoreLabel = hasStakedXvs
-    ? shortenValueWithSuffix({ value: new BigNumber(primeScore) })
-    : '-';
+  const { rankLabel, primeScoreLabel } = getRankLabels(rankData);
 
   return (
     <div className="flex flex-col gap-1 rounded-lg border border-dark-blue-hover p-3">

apps/evm/src/containers/PrimeRank/getRankLabels/index.ts

@@ -0,0 +1,21 @@
+import BigNumber from 'bignumber.js';
+
+import { shortenValueWithSuffix } from 'utilities';
+
+import type { PrimeRankData } from '../useGetPrimeRank';
+
+export interface RankLabels {
+  rankLabel: string;
+  primeScoreLabel: string;
+}
+
+export const getRankLabels = ({
+  hasStakedXvs,
+  rank,
+  primeScore,
+}: Pick<PrimeRankData, 'hasStakedXvs' | 'rank' | 'primeScore'>): RankLabels => ({
+  rankLabel: hasStakedXvs ? `#${rank}` : '#-',
+  primeScoreLabel: hasStakedXvs
+    ? shortenValueWithSuffix({ value: new BigNumber(primeScore) })
+    : '-',
+});

apps/evm/src/pages/PrimeLeaderboard/RankCard/index.tsx

@@ -1,9 +1,8 @@
 import { cn } from '@venusprotocol/ui';
-import BigNumber from 'bignumber.js';
 
 import { EligibilityStatus } from 'containers/PrimeRank/EligibilityStatus';
+import { getRankLabels } from 'containers/PrimeRank/getRankLabels';
 import type { PrimeRankData } from 'containers/PrimeRank/useGetPrimeRank';
-import { shortenValueWithSuffix } from 'utilities';
 
 import { ConnectPrompt } from './ConnectPrompt';
 import { RankActions } from './RankActions';
@@ -32,13 +31,9 @@ export const RankCard: React.FC<RankCardProps> = ({
     );
   }
 
-  const { hasStakedXvs, isCandidate, isPrime, hasSupplied, rank, primeScore, gapXvsTokens } =
-    rankData;
+  const { hasStakedXvs, isCandidate, isPrime, hasSupplied, gapXvsTokens } = rankData;
 
-  const rankLabel = hasStakedXvs ? `#${rank}` : '#-';
-  const primeScoreLabel = hasStakedXvs
-    ? shortenValueWithSuffix({ value: new BigNumber(primeScore) })
-    : '-';
+  const { rankLabel, primeScoreLabel } = getRankLabels(rankData);
 
   return (
     <div className={cn(cardClassName, 'justify-between')}>