refactor: declare new variables for cleaner code

Author: serapieTuyishime

src/components/cards/challenge/Challenge.tsx

@@ -30,7 +30,7 @@ export default function ChallengeCard({ data, community, isCourseEnd }: Challeng
   const link = `/communities/${community.slug}/challenges/${data.id}`;
   const expiresAt = useMemo(() => (data.expiresAt ? new Date(data.expiresAt).toLocaleDateString() : null), [data.expiresAt]);
   const reward = isCourseEnd ? data?.rewards?.find((reward) => reward.type === "SUBMISSION") : data?.reward;
-  const totalReward = data?.rewards?.reduce((acc, reward) => (acc += Number(reward.amount)), 0);
+  const amount = shortenNumber(data?.rewards?.reduce((acc, reward) => (acc += Number(reward.amount)), 0));
 
   return (
     <div className="border-solid border border-gray-200 bg-gray-50 rounded-3xl mb-5 group text-gray-700">
@@ -61,9 +61,9 @@ export default function ChallengeCard({ data, community, isCourseEnd }: Challeng
                   <div className="flex text-sm text-gray-700">
                     <span className="block font-medium">
                       {data?.isHackathon ? <>{reward?.fiatCurrency ?
-                        t('communities.overview.reward.fiat.prize.pool', { amount: shortenNumber(totalReward), currency: reward.fiatCurrency, token: reward?.token }) :
-                        t('communities.overview.reward.crypto.prize.pool', { amount: shortenNumber(totalReward), token: reward?.token })
-                      } </> : <>{shortenNumber(totalReward)} {reward?.token} </>}
+                        t('communities.overview.reward.fiat.prize.pool', { amount, currency: reward.fiatCurrency, token: reward?.token }) :
+                        t('communities.overview.reward.crypto.prize.pool', { amount, token: reward?.token })
+                      } </> : <>{amount} {reward?.token} </>}
 
                       {t("communities.overview.reward.title")}
                     </span>

src/components/sections/challenges/_partials/HackathonPrize.tsx

@@ -5,14 +5,14 @@ import { useTranslation } from "react-i18next";
 export default function HackathonPrize({ reward, description }: { reward: Reward; description: string }) {
   const { t } = useTranslation()
   const { first, second, third } = reward?.distribution || ({} as Distribution);
-
+  const amount = shortenNumber(reward?.amount);
   return (
     <>
       <div className="flex gap-1 text-gray-700 font-medium">
         <span>
           {reward?.fiatCurrency ?
-            t('communities.overview.reward.fiat.prize.pool', { amount: shortenNumber(reward?.amount), currency: reward.fiatCurrency, token: reward?.token }) :
-            t('communities.overview.reward.crypto.prize.pool', { amount: shortenNumber(reward?.amount), token: reward?.token })}
+            t('communities.overview.reward.fiat.prize.pool', { amount, currency: reward.fiatCurrency, token: reward?.token }) :
+            t('communities.overview.reward.crypto.prize.pool', { amount, token: reward?.token })}
         </span>
         <span>{description}</span>
       </div>