refactor: resolve merge conflicts within a certificate

Author: serapieTuyishime

public/img/certificates/icp-ai-web3-hackathon.svg

@@ -113,6 +113,14 @@
   "communities.overview.challenge.rewards": "Награди",
   "communities.overview.challenge.subtitle": "При успешно завършване",
   "communities.overview.challenge.expiry": "Срок на изтичане на предизвикателството:",
+  "communities.overview.challenge.take.challenge": "Вземете предизвикателството",
+  "communities.overview.challenge.see.challenge": "Вижте предизвикателството",
+  "communities.overview.challenge.unlock.certificate": "Отключване с сертификат",
+  "communities.overview.challenge.participate": "Участвайте в хакатони {{token}}",
+  "communities.overview.challenge.for.certificate": "за сертификата",
+  "communities.overview.challenge.for.feedback": "за всеки отзив",
+  "communities.overview.challenge.learning.modules.included": "Включени образователни модули",
+  "communities.overview.challenge.no.learning.modules": "Без включени образователни модули",
   "communities.overview.challenge.learning.title": "Следните учебни материали ще ви осигурят техническите умения, необходими за успешното справяне с предизвикателството.",
   "communities.overview.challenge.learning.start": "започнете сега",
   "communities.overview.challenge.team.setup.title": "Създайте вашия екип",
@@ -193,6 +201,7 @@
   "course.challenge.reward": "REWARD",
   "course.challenge.reward.description": "By completing the challenge in this course you can earn {{amount}} {{token}}",
   "course.challenge.reward.stable.description": "By completing the challenge in this course you can earn {{currency}}{{amount}} in {{token}}",
+  "course.challenge.reward.certificate.description": "Завършете курса, за да получите сертификата и отключете нови възможности.",
   "course.scoreboard.button": "Load more",
   "learning-module.material.open.lesson": "Open Lesson",
   "learning-module.material.open.article": "Open Article",
@@ -314,8 +323,13 @@
   "referrals.empty-state.title": "No referrals yet",
   "referrals.empty-state.subtitle": "Once someone uses your referral code to signup, they will showup here",
   "referrals.joined": "Joined",
-  "referrals.challenge-participation": "Participated in a challenge in",
-  "referrals.submission.evaluation": "Submission evaluated",
+  "referrals.challenge-participation": "Participated in a challenge",
+  "referrals.challenge.evaluation.status.passed": "Успешно преминал",
+  "referrals.challenge.evaluation.status.failed": "Не премина",
+  "referrals.challenge.evaluation..status.pending": "Участвал в",
+  "referrals.challenge.evaluation.pending": "Изчаква оценка ...",
+  "referrals.submission.evaluation": "Прегледан принос",
+  "referrals.submission.challenge": "предизвикателство",
   "referrals.submission.points": "points",
   "referrals.reward.text": "You earned the referral reward",
   "submissions.empty-state.title": "No submissions yet.",

public/locales/bg/common.json

@@ -119,6 +119,14 @@
   "communities.overview.challenge.certificate": "Certificate",
   "communities.overview.challenge.subtitle": "Upon successful completion",
   "communities.overview.challenge.expiry": "Challenge expiry date:",
+  "communities.overview.challenge.take.challenge":"Take the challenge",
+  "communities.overview.challenge.see.challenge": "See the challenge",
+  "communities.overview.challenge.for.certificate":"for the certificate",
+  "communities.overview.challenge.for.feedback":"for every feedback",
+  "communities.overview.challenge.unlock.certificate":"Unlock with Certificate",
+  "communities.overview.challenge.participate":"Participate in {{token}} hackathons",
+  "communities.overview.challenge.learning.modules.included": "Learning modules included",
+  "communities.overview.challenge.no.learning.modules":"No learning modules included",
   "communities.overview.challenge.learning.title": "The following learning materials will equip you with the technical expertise required to successfully address the challenge.",
   "communities.overview.challenge.learning.start": "Start now",
   "communities.overview.challenge.team.setup.title": "Form your team",
@@ -195,6 +203,7 @@
   "course.challenge.reward": "REWARD",
   "course.challenge.reward.description": "By completing the challenge in this course you can earn {{amount}} {{token}}",
   "course.challenge.reward.stable.description": "By completing the challenge in this course you can earn {{currency}}{{amount}} in {{token}}",
+  "course.challenge.reward.certificate.description":"Complete the course to achieve the certificate and unlock new opportunities",
   "course.challenge.certificate": "CERTIFICATE",
   "course.challenge.certificate.description": "By completing the challenge in this course you can earn a certificate.",
   "course.scoreboard.button": "Load more",
@@ -344,7 +353,12 @@
   "referrals.empty-state.subtitle": "Once someone uses your referral code to signup, they will showup here",
   "referrals.joined": "Joined",
   "referrals.challenge-participation": "Participated in a challenge in",
+  "referrals.challenge.evaluation.status.passed": "Successfully passed",
+  "referrals.challenge.evaluation.status.failed": "Did not pass",
+  "referrals.challenge.evaluation.status.pending": "Participated in",
+  "referrals.challenge.evaluation.pending": "Pending evaluation ...",
   "referrals.submission.evaluation": "Submission evaluated",
+  "referrals.submission.challenge": "challenge",
   "referrals.submission.points": "points",
   "referrals.reward.text": "You earned the referral reward",
   "submissions.empty-state.title": "No submissions yet.",

public/locales/en/common.json

@@ -118,6 +118,14 @@
   "communities.overview.challenge.certificate": "Certificate",
   "communities.overview.challenge.subtitle": "Al completar con éxito",
   "communities.overview.challenge.expiry": "Fecha de vencimiento del desafío:",
+  "communities.overview.challenge.take.challenge": "Toma el desafío",
+  "communities.overview.challenge.see.challenge": "Ver el desafío",
+  "communities.overview.challenge.unlock.certificate": "Desbloquear con certificado",
+  "communities.overview.challenge.participate": "Participa en hackatones {{token}}",
+  "communities.overview.challenge.for.certificate": "para el certificado",
+  "communities.overview.challenge.for.feedback": "para cada retroalimentación",
+  "communities.overview.challenge.learning.modules.included": "Módulos de aprendizaje incluidos",
+  "communities.overview.challenge.no.learning.modules": "No se incluyen módulos de aprendizaje",
   "communities.overview.challenge.learning.title": "Los siguientes materiales de aprendizaje le proporcionarán la experiencia técnica necesaria para abordar con éxito el desafío.",
   "communities.overview.challenge.learning.start": "Comenzar ahora",
   "communities.overview.challenge.team.setup.title": "Forma tu equipo",
@@ -195,6 +203,7 @@
   "course.challenge.reward": "RECOMPENSA",
   "course.challenge.reward.description": "Completando este reto de este curso puede asegurarse la cantidad de {{amount}} {{token}}",
   "course.challenge.reward.stable.description": "Completando este reto de este curso puede asegurarse {{currency}}{{amount}} en {{token}}",
+  "course.challenge.reward.certificate.description": "Completa el curso para obtener el certificado y desbloquear nuevas oportunidades.",
   "course.scoreboard.button": "Cargar más",
   "learning-module.material.open.lesson": "Abrir lección",
   "learning-module.material.open.article": "Abrir artículo",
@@ -315,7 +324,12 @@
   "referrals.empty-state.title": "No hay recomendaciones",
   "referrals.joined": "Registro completo",
   "referrals.challenge-participation": "Participó en un reto en",
+  "referrals.challenge.evaluation.status.passed": "Successfully passed",
+  "referrals.challenge.evaluation.status.failed": "No pasó",
+  "referrals.challenge.evaluation.status.pending": "Participó en",
+  "referrals.challenge.evaluation.pending": "Pendiente de evaluación ...",
   "referrals.submission.evaluation": "Propuestas evaluadas",
+  "referrals.submission.challenge": "desafío",
   "referrals.submission.points": "puntos",
   "referrals.reward.text": "Ha ganado una recompensa por recomendación",
   "submissions.empty-state.title": "No hay propuestas todavía.",

public/locales/es/common.json

@@ -166,6 +166,14 @@
   "communities.overview.challenge.subtitle": "Nakon uspješnog završetka",
   "communities.overview.challenge.certificate": "Certificate",
   "communities.overview.challenge.expiry": "Datum isteka izazova:",
+  "communities.overview.challenge.take.challenges": "Prihvati izazov",
+  "communities.overview.challenge.see.challenge": "Pogledaj izazov",
+  "communities.overview.challenge.unlock.certificate": "Otključajte s certifikatom",
+  "communities.overview.challenge.participate": "Sudjelujte na ${token} hakatonima",
+  "communities.overview.challenge.for.certificate": "za certifikat",
+  "communities.overview.challenge.for.feedback": "za svaki povratni odgovor",
+  "communities.overview.challenge.learning.modules.included": "Uključeni moduli učenja",
+  "communities.overview.challenge.no.learning.modules": "Nema uključenih modula učenja",
   "communities.overview.challenge.learning.title": "Sljedeći materijali za učenje opskrbit će vas tehničkim stručnostima potrebnim za uspješno rješavanje izazova.",
   "communities.overview.challenge.learning.start": "Počnite sada",
   "communities.overview.challenge.team.setup.title": "Sastavite svoj tim",
@@ -193,6 +201,7 @@
   "course.challenge.reward": "REWARD",
   "course.challenge.reward.description": "By completing the challenge in this course you can earn {{amount}} {{token}}",
   "course.challenge.reward.stable.description": "By completing the challenge in this course you can earn {{currency}}{{amount}} in {{token}}",
+  "course.challenge.reward.certificate.description": "Završite tečaj kako biste dobili certifikat i otključali nove prilike",
   "course.scoreboard.button": "Load more",
   "learning-module.material.open.lesson": "Open Lesson",
   "learning-module.material.open.article": "Otvori članak",
@@ -315,7 +324,12 @@
   "referrals.empty-state.subtitle": "Once someone uses your referral code to signup, they will showup here",
   "referrals.joined": "Joined",
   "referrals.challenge-participation": "Participated in a challenge in",
-  "referrals.submission.evaluation": "Submission evaluated",
+  "referrals.challenge.evaluation.status.passed": "Successfully passed",
+  "referrals.challenge.evaluation.status.failed": "Nije prošao",
+  "referrals.challenge.evaluation.status.pending": "Sudjelovao u",
+  "referrals.challenge.evaluation.pending": "Na čekanju evaluacije ...",
+  "referrals.submission.evaluation": "Ocijenjen prilog",
+  "referrals.submission.challenge": "izazov",
   "referrals.submission.points": "points",
   "referrals.reward.text": "You earned the referral reward",
   "submissions.empty-state.title": "No submissions yet.",

public/locales/hr/common.json

@@ -1,6 +1,5 @@
 import Avatar from "@/components/ui/Avatar";
-import { Reward as IReward } from "@/types/course";
-import { Community } from "@/types/community";
+import { Referral as TReferral } from "@/types/community";
 import RewardBadge from "../badges/RewardBadge";
 import { useTranslation } from "next-i18next";
 import { ReactElement } from "react";
@@ -16,11 +15,7 @@ import { useDispatch } from "@/hooks/useTypedDispatch";
  */
 
 interface ReferralProps {
-  referral: {
-    title?: string;
-    community: Community;
-    reward: IReward;
-  };
+  referral: TReferral;
 }
 
 /**

src/components/cards/Referral.tsx

@@ -1,14 +1,12 @@
-import Certificate from "@/components/ui/Certificate";
-import Coin from "@/components/ui/Coin";
 import ArrowButton from "@/components/ui/button/Arrow";
 import { Community } from "@/types/community";
 import { Challenge } from "@/types/course";
 import Link from "next/link";
-import RelatedContent from "./RelatedContent";
 import Badges from "./Badges";
 import { useMemo } from "react";
 import { useTranslation } from "next-i18next";
-import { shortenNumber } from "@/utilities";
+import Image from "next/image";
+import RewardCertificate from "./RewardCertificate";
 
 /**
  * `ChallengeCard` is a function component that renders a card
@@ -26,86 +24,52 @@ interface ChallengeCardProps {
 }
 export default function ChallengeCard({ data, community, isCourseEnd }: ChallengeCardProps) {
   const { t } = useTranslation();
-
   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 amount = shortenNumber(data?.rewards?.reduce((acc, reward) => (acc += Number(reward.amount)), 0));
+  const learningModulesCount = data?.learningModules?.length || 0;
 
   return (
-    <div className="border-solid border border-gray-200 bg-gray-50 rounded-3xl mb-5 group text-gray-700">
-      <div className="border-solid border-b border-gray-300 bg-white rounded-3xl sm:p-8 sm:pb-6 w-full p-6">
-        <div className="w-full">
-          <div className="lg:flex mb-1">
-            <div className="lg:pr-20 w-full lg:w-3/5">
-              <div className="text-lg text-gray-900 font-medium leading-normal">{data.name}</div>
-              <div className="text-sm mt-3 pb-2 text-gray-700">{data.description}</div>
-              <Badges challenge={data} className="md:hidden" />
-            </div>
-
-            <div className="flex flex-col mb-6 lg:mb-0 mt-6 md:mt-0 max-w-max text-sm">
-              <div className="flex items-center mb-8 gap-2 md:gap-0">
-                <Certificate size="medium" name={community.slug} />
-                <div className="md:pl-2 max-w-max">
-                  <div className="flex text-sm text-gray-700">
-                    <span className="block font-medium pr-1">
-                      {community?.slug === "celo" && "NFT"} {t("communities.overview.challenge.certificate")}
-                    </span>
-                  </div>
-                  <div className="text-gray-400 text-xs font-normal">Upon successful completion</div>
-                </div>
-              </div>
-              <div className="flex items-center">
-                <Coin size="medium" token={reward?.token} />
-                <div className="md:pl-2 max-w-max">
-                  <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, 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>
-                  </div>
-                  <div className="text-gray-400 text-xs font-normal">{data?.isHackathon ? "Top projects win money prizes" : "For submission and feedback"}</div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div className="divide-y-2 divide-gray-200 divide-dotted flex flex-col">
-          <Badges challenge={data} className="hidden md:flex" />
-          <div className="lg:flex lg:flex-row flex-col justify-between pt-6 items-center">
+    <div className="w-full justify-between- flex flex-col sm:flex-row  md:flex-col lg:flex-row  border-solid border border-gray-200 bg-gray-50 rounded-3xl mb-5 group text-gray-700">
+      <div className="border-solid border-b border-gray-300 bg-white rounded-3xl sm:p-8 sm:pb-6 p-6 lg:w-2/3">
+        <div className="flex flex-col mb-1">
+          <div className="lg:pr-20 lg:w-3/5-">
             <div className="text-gray-400 lg:w-2/3 text-sm font-normal mb-6 lg:mb-0">
               {expiresAt && (
                 <>
-                  <span>Deadline</span>
+                  <span>{t("communities.overview.challenge.deadline")}</span>
                   <span className="font-medium pl-1">{expiresAt}</span>
                 </>
               )}
             </div>
-
-            <Link href={link}>
-              <ArrowButton communityStyles={true} variant="outline-primary">
-                {isCourseEnd ? "Take the challenge" : "See the challenge"}
-              </ArrowButton>
-            </Link>
+            <div className="text-lg text-gray-900 font-medium leading-normal mb-6">{data.name}</div>
+            <Badges challenge={data} className="" />
+            <div className="text-sm pb-2 text-gray-700">{data.description}</div>
+          </div>
+          <div className="divide-y-2 divide-gray-200 divide-dotted flex flex-col mt-3">
+            <p className="pb-6">
+              {learningModulesCount ? `${learningModulesCount}  learning ${learningModulesCount === 1 ? "module" : "modules"} included` : "No learning modules included"}
+            </p>
+            <div className="lg:flex lg:flex-row flex-col justify-between pt-6 items-center">
+              <Link href={link}>
+                <ArrowButton communityStyles={true} variant="outline-primary">
+                  {isCourseEnd ? t("communities.overview.challenge.take.challenge") : t("communities.overview.challenge.see.challenge")}
+                </ArrowButton>
+              </Link>
+            </div>
           </div>
         </div>
       </div>
-
-      {(data.courses?.length > 0 || data.learningModules?.length > 0) && !isCourseEnd && (
-        <div className="sm:px-8 sm:pt-6 sm:pb-9 w-full p-6 rounded-3xl text-sm">
-          <div className="mb-3 text-gray-400 font-semibold uppercase text-xxs">related content</div>
-          {data.courses?.map((course) => (
-            <RelatedContent key={course.id} content={course} />
-          ))}
-          {data.learningModules?.map((learningModule) => (
-            <RelatedContent key={learningModule.id} content={learningModule} />
-          ))}
+      <div className="p-6">
+        <div className={"mx-auto relative rounded-full mb-5 w-[147px] h-[184px]"}>
+          <Image src={data?.certificateData?.icon} alt="achievement" fill />
+        </div>
+        <div className="">
+          <h1 className="font-bold text-gray-400 text-xs uppercase pb-2">{t("communities.overview.challenge.unlock.certificate")}</h1>
+          <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>
     </div>
   );
 }