refactor: change the naming RewardCertificates to RewardCertificate

Author: mhenriette

src/components/cards/challenge/Challenge.tsx

@@ -6,7 +6,7 @@ import Badges from "./Badges";
 import { useMemo } from "react";
 import { useTranslation } from "next-i18next";
 import Image from "next/image";
-import RewardCertificates from "./RewardCertificates";
+import RewardCertificate from "./RewardCertificate";
 
 /**
  * `ChallengeCard` is a function component that renders a card
@@ -66,7 +66,7 @@ export default function ChallengeCard({ data, community, isCourseEnd }: Challeng
         </div>
         <div className="">
           <h1 className="font-bold text-gray-400 text-xs uppercase pb-2">{t("communities.overview.challenge.unlock.certificate")}</h1>
-          <RewardCertificates rewards={data?.rewards}/>
+          <RewardCertificate rewards={data?.rewards}/>
         </div>
         {data?.isHackathon && <p className="py-2 border-t border-gray-200 text-sm">{t("communities.overview.challenge.participate", { token: reward?.token })}</p>}
       </div>

src/components/cards/challenge/RewardCertificates.tsx renamed to src/components/cards/challenge/RewardCertificate.tsx

@@ -5,20 +5,20 @@ import { Reward } from "@/types/course";
 import classNames from "classnames";
 import { ReactElement } from "react";
 
-interface RewardCertificatesProps {
+interface RewardCertificateProps {
   rewards: Reward[];
   isReward?: boolean;
 }
 
 /**
- * RewardCertificates component is a function component that renders a list of rewards
+ * RewardCertificate component is a function component that renders a list of rewards
  * for a challenge.
  *
- * @param {RewardCertificatesProps} { rewards, isReward }
- * @returns {JSX.Element} The rendered RewardCertificates component.
+ * @param {RewardCertificateProps} { rewards, isReward }
+ * @returns {JSX.Element} The rendered RewardCertificate component.
  */
 
-export default function RewardCertificates({ rewards, isReward }: RewardCertificatesProps): ReactElement {
+export default function RewardCertificate({ rewards, isReward }: RewardCertificateProps): ReactElement {
   const { t } = useTranslation();
   return (
     <>

src/components/sections/challenges/Rewards.tsx

@@ -4,7 +4,7 @@ import { useTranslation } from "next-i18next";
 import { ReactElement } from "react";
 import Certificate from "@/components/ui/Certificate";
 import { useRouter } from "next/router";
-import RewardCertificates from "@/components/cards/challenge/RewardCertificates";
+import RewardCertificate from "@/components/cards/challenge/RewardCertificate";
 
 /**
  * Overview reward section component
@@ -28,7 +28,7 @@ export function OverviewRewards(): ReactElement {
         </div>
         <div className="flex flex-col lg:flex-row justify-between gap-2 items-start w-full">
           <div className="flex flex-col w-full lg:w-1/2">
-            {challenge?.rewards && <RewardCertificates rewards={challenge?.rewards} isReward />}
+            {challenge?.rewards && <RewardCertificate rewards={challenge?.rewards} isReward />}
           </div>
           {challenge?.isHackathon && <div className="pb-2 border-b border-gray-200 w-full lg:w-1/2">{t("communities.overview.challenge.participate", { token: token })}</div>}
         </div>