Hot fix data repeat problem

client/hooks/api/referral/useSearchReferralList.tsx

@@ -18,20 +18,18 @@ const useSearchReferralList = (
   type: "referer" | "referee"
 ) => {
   const fetchRefererList = async ({ pageParam = 0, queryKey }: any) => {
-    const NUMBER_OF_DATE_PER_FETCH = 3
+    const NUMBER_OF_DATE_PER_FETCH = 30
     const countryUuid = queryKey[1].filterMeta.countryUuid
     const provinceUuid = queryKey[1].filterMeta.provinceUuid
     const cityUuid = queryKey[1].filterMeta.cityUuid
     const industryUuid = queryKey[1].filterMeta.industryUuid
     const sort = queryKey[1].sorting.split(",")
     const order = sort[1] === "dec" ? false : true
     const from = pageParam * NUMBER_OF_DATE_PER_FETCH
-    const to = from + NUMBER_OF_DATE_PER_FETCH - 1
+    const to = from + NUMBER_OF_DATE_PER_FETCH
 
-    let query = supabase
-      .from("user")
-      .select(
-        `
+    let query = supabase.from("user").select(
+      `
           uuid,
           email,
           username,
@@ -56,42 +54,44 @@ const useSearchReferralList = (
     ),
     is_referer
     `
-      )
-
-      .lte(
-        "year_of_experience",
-        filterMeta.yoeMax ? parseInt(filterMeta.yoeMax) : 100
-      )
-      .gte(
-        "year_of_experience",
-        filterMeta.yoeMin ? parseInt(filterMeta.yoeMin) : 0
-      )
-      .order("year_of_experience", { ascending: order })
-      .range(from, to)
+    )
 
     if (type === "referer") {
       query = query.eq("is_referer", true)
     }
 
-    if (filterMeta.companyName.length > 0) {
-      query = query.ilike("company_name", `%${filterMeta.companyName}%`)
-    }
     if (type === "referee") {
       query = query.eq("is_referee", true)
     }
-    if (countryUuid !== undefined) {
+
+    if (countryUuid) {
       query = query.eq("country_uuid", countryUuid)
     }
-    if (provinceUuid !== undefined) {
+    if (provinceUuid) {
       query = query.eq("province_uuid", provinceUuid)
     }
-    if (cityUuid !== undefined) {
+    if (cityUuid) {
       query = query.eq("city_uuid", cityUuid)
     }
-    if (industryUuid !== undefined) {
+    if (industryUuid) {
       query = query.eq("industry_uuid", industryUuid)
     }
+
+    if (filterMeta.companyName.length > 0) {
+      query = query.ilike("company_name", `%${filterMeta.companyName}%`)
+    }
+
     const { data } = await query
+      .lte(
+        "year_of_experience",
+        filterMeta.yoeMax ? parseInt(filterMeta.yoeMax) : 100
+      )
+      .gte(
+        "year_of_experience",
+        filterMeta.yoeMin ? parseInt(filterMeta.yoeMin) : 0
+      )
+      .order("year_of_experience", { ascending: order })
+      .range(from, to)
 
     return data
   }

client/modules/referral/referee/template.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent, useState } from "react"
+import React, { ChangeEvent, useMemo, useState } from "react"
 import { referralSortingOptions } from "@/utils/common/sorting/referer"
 
 import { IReferralResponse } from "@/types/api/response/referral"
@@ -105,10 +105,23 @@ const RefereePageTemplate: React.FunctionComponent<
     }
   }
 
-  const list =
-    refereeListData && refereeListData.pages.length > 0
-      ? (refereeListData?.pages.flatMap((d) => d) as IReferralResponse[])
-      : []
+  const list = useMemo(() => {
+    if (refereeListData && refereeListData.pages.length > 0) {
+      const uuidSet = new Set()
+      const list = refereeListData?.pages.flatMap(
+        (d) => d
+      ) as IReferralResponse[]
+      const mappedList = list.map((data) => {
+        if (!uuidSet.has(data.uuid)) {
+          uuidSet.add(data.uuid)
+          return data
+        }
+      })
+      return mappedList.filter((d) => d !== undefined) as IReferralResponse[]
+    } else {
+      return []
+    }
+  }, [refereeListData, refereeListData?.pages])
 
   return (
     <>

client/modules/referral/referer/template.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent, useState } from "react"
+import React, { ChangeEvent, useMemo, useState } from "react"
 import { referralSortingOptions } from "@/utils/common/sorting/referer"
 
 import { IReferralResponse } from "@/types/api/response/referral"
@@ -105,10 +105,23 @@ const RefererPageTemplate: React.FunctionComponent<
     }
   }
 
-  const list =
-    refererListData && refererListData.pages.length > 0
-      ? (refererListData?.pages.flatMap((d) => d) as IReferralResponse[])
-      : []
+  const list = useMemo(() => {
+    if (refererListData && refererListData.pages.length > 0) {
+      const uuidSet = new Set()
+      const list = refererListData?.pages.flatMap(
+        (d) => d
+      ) as IReferralResponse[]
+      const mappedList = list.map((data) => {
+        if (!uuidSet.has(data.uuid)) {
+          uuidSet.add(data.uuid)
+          return data
+        }
+      })
+      return mappedList.filter((d) => d !== undefined) as IReferralResponse[]
+    } else {
+      return []
+    }
+  }, [refererListData, refererListData?.pages])
 
   return (
     <>