refactor: resolve conflicts withing referrals service

Author: serapieTuyishime

public/locales/bg/common.json

@@ -207,8 +207,10 @@
   "testimonials.community.stats.card-3.description": "learners gave to submissions of their peers.",
   "testimonials.community.join": "{{appName}} on Discord",
   "testimonials.text": "Dacade is really encouraging, I didn't realize the little that I know would matter. Thank you for making us learn more and to make research too.",
-  "footer.text": "Dacade is created in collaboration with multiple contributors. If you are interested in collaborating, please <a href=\"https://discord.gg/U38KQHDtHe\">get in touch.</a>",
+  "footer.text": "Dacade е отворена платформа и е създадена в сътрудничество с множество приносители. Отидете на <a href=\"https://github.com/dacadeorg/dacade-frontend-app\"> хранилището </a>, за да започнете да допринасяте.",
   "footer.privacy-policy": "Impressum & Privacy Policy",
+  "footer.open.source": "Дакейд е платформа с отворен код.",
+  "footer.open.source.contribute": "Станете един от нашите сътрудници",
   "feedback.bounty": "Feedback bounty",
   "feedback.issued": "Issued",
   "feedback.ends": "ending in ",

public/locales/en/common.json

@@ -211,8 +211,10 @@
   "testimonials.community.stats.card-3.description": "learners gave to submissions of their peers.",
   "testimonials.community.join": "{{appName}} on Discord",
   "testimonials.text": "Dacade is really encouraging, I didn't realize the little that I know would matter. Thank you for making us learn more and to make research too.",
-  "footer.text": "Dacade is created in collaboration with multiple contributors. If you are interested in collaborating, please <a href=\"https://discord.gg/U38KQHDtHe\">get in touch.</a>",
+  "footer.text": "Dacade is an open-sourced platform and is created in collaboration with multiple contributors. Go to the <a href=\"https://github.com/dacadeorg/dacade-frontend-app\"> repository  </a>  to start contributing.",
   "footer.privacy-policy": "Impressum & Privacy Policy",
+  "footer.open.source" : "Dacade is an open-sourced platform.",
+  "footer.open.source.contribute":"Become one of our contributors",
   "feedback.bounty": "Feedback bounty",
   "feedback.issued": "Issued",
   "feedback.ends": "ending in ",

public/locales/es/common.json

@@ -209,7 +209,9 @@
   "testimonials.community.stats.card-3.description": "los estudiantes mostraron sus propuestas a sus compañeras",
   "testimonials.community.join": "{{appName}} en Discord",
   "testimonials.text": "Dacade es muy motivadora, no era consciente de que mis pocos conocimientos podrían ser útiles. Gracias por permitirnos aprender e investigar más.",
-  "footer.text": "Dacade ha sido creada en colaboración con múltiples contribuciones. Si le interesa colaborar <a href=\"https://discord.gg/U38KQHDtHe\">contáctenos.</a>",
+  "footer.text": "Dacade es una plataforma de código abierto y se creó en colaboración con múltiples contribuyentes. Visita el <a href=\"https://github.com/dacadeorg/dacade-frontend-app\"> repositorio </a>  para empezar a contribuir.",
+  "footer.open.source": "Dacade es una plataforma de código abierto.",
+  "footer.open.source.contribute": "Conviértase en uno de nuestros colaboradores",
   "footer.privacy-policy": "Impressum & Política de Privacidad",
   "feedback.bounty": "Premio por Feedback",
   "feedback.issued": "Emitido",

public/locales/hr/common.json

@@ -207,8 +207,10 @@
   "testimonials.community.stats.card-3.description": "learners gave to submissions of their peers.",
   "testimonials.community.join": "{{appName}} on Discord",
   "testimonials.text": "Dacade is really encouraging, I didn't realize the little that I know would matter. Thank you for making us learn more and to make research too.",
-  "footer.text": "Dacade is created in collaboration with multiple contributors. If you are interested in collaborating, please <a href=\"https://discord.gg/U38KQHDtHe\">get in touch.</a>",
+  "footer.text": "Dacade je platforma s otvorenim kodom i stvorena je u suradnji s višestrukim suradnicima. Posjetite <a href=\"https://github.com/dacadeorg/dacade-frontend-app\"> repozitorij </a> kako biste počeli doprinositi.",
   "footer.privacy-policy": "Impressum & Privacy Policy",
+  "footer.open.source": "Dacade je platforma otvorenog koda.",
+  "footer.open.source.contribute": "Postanite jedan od naših suradnika",
   "feedback.bounty": "Feedback bounty",
   "feedback.issued": "Issued",
   "feedback.ends": "ending in ",

src/components/cards/profile/Request.tsx

@@ -1,9 +1,16 @@
-import { useSelector } from "@/hooks/useTypedSelector";
+import { useMultiSelector } from "@/hooks/useTypedSelector";
 import Avatar from "@/components/ui/Avatar";
 import { ReactElement } from "react";
 import { useRouter } from "next/router";
 import Right from "@/icons/angle-right.svg";
 import Link from "next/link";
+import { Referral } from "@/types/community";
+import { IRootState } from "@/store";
+
+interface ReferralsMultiSelector {
+  referrals: Referral[];
+  count: number;
+}
 
 /**
  * Request component
@@ -13,7 +20,10 @@ import Link from "next/link";
  * @returns {}
  */
 export default function Request(): ReactElement {
-  const referrals = useSelector((state) => state.userReferrals.userReferralList);
+  const { referrals, count } = useMultiSelector<unknown, ReferralsMultiSelector>({
+    referrals: (state: IRootState) => state.userReferrals.userReferralList,
+    count: (state: IRootState) => state.userReferrals.count,
+  });
   const previewList = referrals.slice(0, 3);
   const router = useRouter();
 
@@ -31,14 +41,13 @@ export default function Request(): ReactElement {
             ))}
           </div>
           <div className="relative pl-3  font-normal cursor-pointer md:flex md:font-medium" onClick={onClick}>
-            <span className="md:inline-block">{referrals?.length} Friends have used your invite code</span>
+            <span className="md:inline-block">{count} Friends have used your invite code</span>
           </div>
         </div>
 
         <div className="md:pl-4 py-4 md:py-0">4 Pending invitations</div>
       </div>
       <Link href={`/profile/referrals`} className="text-primary flex items-center justify-between gap-4 cursor-pointer">
-        {" "}
         <span>See all</span>
         <Right />
       </Link>

src/components/sections/homepage/OpenSource.tsx

@@ -0,0 +1,27 @@
+import Link from "next/link";
+import ArrowRightIcon from "@/icons/arrow-right.svg";
+import { useTranslation } from "next-i18next";
+
+/**
+ * Open source section
+ * @date 3/27/2023 - 5:26:28 PM
+ *
+ * @export
+ * @returns {ReactElement}
+ */
+
+export default function OpenSource() {
+  const { t } = useTranslation();
+  return (
+    <div className="text-4xl lg:text-5xl pt-24 flex flex-col text-wrap space-y-2">
+      <p >
+        {t("footer.open.source")}
+        <br className="block md:hidden lg:block" />
+        <Link href="https://github.com/dacadeorg/dacade-frontend-app" target="_blank" className="text-primary items-center space-x-2">
+          <span> {t("footer.open.source.contribute")}</span>
+          <ArrowRightIcon className="w-6.5 h-5.5 inline-flex" />
+        </Link>
+      </p>
+    </div>
+  );
+}

src/components/sections/homepage/Testimonials.tsx

@@ -4,6 +4,7 @@ import { ReactElement } from "react";
 import CommunityStats from "./_partials/testimonials/CommunityStats";
 import { useTranslation } from "next-i18next";
 import { TFunction } from "i18next";
+import OpenSource from "./OpenSource";
 
 /**
  * Interface for the testimonial
@@ -80,6 +81,7 @@ export default function TestimonialsSection(): ReactElement {
     <Section type="secondary-light" padding="py-6 xl:py-10 md:py-8 mt-5">
       <CommunityStats />
       <Stories list={stories(t)} />
+      <OpenSource/>
     </Section>
   );
 }

src/store/feature/user/referrals.slice.ts

@@ -9,12 +9,14 @@ interface UserReferralsState {
   userReferralList: Referral[];
   current: Referral | null;
   hasMore: boolean;
+  count: number;
 }
 
 const initialState: UserReferralsState = {
   userReferralList: [],
   current: null,
   hasMore: true,
+  count: 0,
 };
 
 /**
@@ -38,9 +40,12 @@ const userReferralsSlice = createSlice({
     setHasMoreReferrals: (state, action) => {
       state.hasMore = action.payload;
     },
+    setCount: (state, action) => {
+      state.count = action.payload;
+    },
   },
 });
 
-export const { setCurrent, clear, setUserReferralsList, setHasMoreReferrals } = userReferralsSlice.actions;
+export const { setCurrent, clear, setUserReferralsList, setHasMoreReferrals, setCount } = userReferralsSlice.actions;
 
 export default userReferralsSlice;

src/store/services/referrals.service.ts

@@ -1,7 +1,7 @@
 import baseQuery from "@/config/baseQuery";
 import { createApi } from "@reduxjs/toolkit/dist/query";
 import { setReferralsList } from "../feature/referrals.slice";
-import { clear, setUserReferralsList, setHasMoreReferrals } from "../feature/user/referrals.slice";
+import { clear, setUserReferralsList, setHasMoreReferrals, setCount } from "../feature/user/referrals.slice";
 import { Referral } from "@/types/community";
 
 /**
@@ -43,9 +43,10 @@ const referralsService = createApi({
             dispatch(clear());
           }
 
-          list.push(...(data.list || []));
+          list.push(...(data?.list || []));
           dispatch(setUserReferralsList(list));
-          dispatch(setHasMoreReferrals(data.list?.length > 0 ? true : false));
+          dispatch(setCount(data?.count));
+          dispatch(setHasMoreReferrals(data?.list?.length > 0 ? true : false));
         } catch (error) {
           console.log("error in fetching the userFetchReferrals ", error);
         }