refactor: change structure of the additional info type

Author: serapieTuyishime

src/components/sections/challenges/Rubric.tsx

@@ -9,6 +9,7 @@ import Accordion from "@/components/ui/accordion/Accordion";
 import { IRootState } from "@/store";
 import { Colors } from "@/types/community";
 import Coin from "@/components/ui/Coin";
+import { GRADING_CRITERIA } from "@/constants/challengeInfo";
 
 /**
  * Rubic header component props interface
@@ -58,7 +59,7 @@ export default function RubricHeader({ ratingCriteria, selected, hideTitle = fal
     return (
       <div className="text-base font-normal text-slate-700 pt-8 md:w-182.5 inline-flex flex-wrap items-center gap-1">
         {challenge?.isHackathon ? (
-          <div dangerouslySetInnerHTML={{ __html: challenge?.additionalInfo?.gradingCriteria || hackatonPassingScore }} />
+          <div dangerouslySetInnerHTML={{ __html: challenge?.additionalInfo?.[GRADING_CRITERIA].text || hackatonPassingScore }} />
         ) : (
           passingScoreParts.map((part, index) => {
             if (index === passingScoreParts.length - 1) {

src/components/sections/challenges/SetupTeamChallenge.tsx

@@ -7,6 +7,7 @@ import { useTranslation } from "next-i18next";
 import { IRootState } from "@/store";
 import { Invite } from "@/types/challenge";
 import { Challenge } from "@/types/course";
+import { TEAM_FORMATION } from "@/constants/challengeInfo";
 
 interface Props {
   invite: Invite;
@@ -26,7 +27,7 @@ export default function SetupTeamChallenge(): JSX.Element {
     <Section title="Submission">
       <div className="text-base font-normal text-slate-700 pt-8 pb-7 md:w-182.5">{t("communities.overview.challenge.team.setup.info")}</div>
       <div className="md:flex flex-row gap-5">
-        <FormTeamCard index={1} title="Form your team" description={challenge?.additionalInfo?.teamFormation || t("communities.overview.challenge.team.organization")} />
+        <FormTeamCard index={1} title="Form your team" description={challenge?.additionalInfo?.[TEAM_FORMATION].text || t("communities.overview.challenge.team.organization")} />
         {invite && !invite.team?.locked ? (
           <ConfirmTeamInvitation index={2} title="Submit your team" text={`The maximum team members for this challenge is ${challenge?.teamLimit || "3"} people`} invite={invite} />
         ) : (

src/constants/challengeInfo.ts

@@ -0,0 +1,2 @@
+export const GRADING_CRITERIA = "GRADING_CRITERIA";
+export const TEAM_FORMATION = "TEAM_FORMATION";

src/types/course.d.ts

@@ -78,10 +78,12 @@ export type Challenge = {
   teamLimit?: number;
   isHackathon?: boolean;
   multipleSubmissions?: boolean;
-  additionalInfo?: {
-    gradingCriteria?: string;
-    teamFormation?: string;
-  };
+  additionalInfo?: { [type: string]: AdditionalInfo };
+};
+
+type AdditionalInfo = {
+  type: string;
+  text: string;
 };
 
 export type RatingCriteria = {