fix: can not query campaign

src/pages/Campaign/index.tsx

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import { useLocation, useNavigate } from 'react-router-dom'
-import { useGetCampaignsQuery, useGetLeaderboardQuery } from 'services/campaign'
+import { useGetCampaignsQuery, useGetLeaderboardQuery, useLazyGetCampaignByIdQuery } from 'services/campaign'
 
 import { APP_PATHS, CAMPAIGN_LEADERBOARD_ITEM_PER_PAGE, EMPTY_ARRAY } from 'constants/index'
 import { useActiveWeb3React } from 'hooks'
@@ -90,6 +90,7 @@ export default function CampaignsUpdater() {
     dispatch(setCampaignDataByPage({ campaigns: campaignData || [], isReset: queryParams.offset === 0 }))
   }, [campaignData, dispatch, queryParams.offset])
 
+  const [getCampaignById] = useLazyGetCampaignByIdQuery()
   useEffect(() => {
     if (!currentCampaigns?.length) return
     const navigateFirsOne = () => {
@@ -102,12 +103,18 @@ export default function CampaignsUpdater() {
       return
     }
     const selectedCampaign = currentCampaigns.find(campaign => campaign.id.toString() === selectedCampaignId)
+
     if (selectedCampaign) {
       dispatch(setSelectedCampaign({ campaign: selectedCampaign }))
-    } else {
-      navigateFirsOne()
+      return
     }
-  }, [currentCampaigns, dispatch, selectedCampaignId, navigate])
+    getCampaignById(selectedCampaignId)
+      .unwrap()
+      .then(data => {
+        dispatch(setSelectedCampaign({ campaign: data }))
+      })
+      .catch(navigateFirsOne)
+  }, [currentCampaigns, dispatch, selectedCampaignId, navigate, getCampaignById])
 
   useEffect(() => {
     if (isLoadingCampaignData === false) dispatch(setLoadingCampaignData(isLoadingCampaignData))

src/services/campaign.ts

@@ -36,7 +36,9 @@ const formatRewards = (rewards: CampaignLeaderboardReward[]) =>
     }),
   ) || []
 
-const formatListCampaign = (response: CampaignData[]) => {
+const formatListCampaign = (data: CampaignData[]) => {
+  if (!data) return []
+  const response = Array.isArray(data) ? data : [data]
   const campaigns: CampaignData[] = response.map((item: CampaignData) => ({
     ...item,
     startTime: item.startTime * 1000,
@@ -209,6 +211,12 @@ const campaignApi = createApi({
       }),
       transformResponse: (data: any) => formatListCampaign(data?.data || []),
     }),
+    getCampaignById: builder.query<any, string>({
+      query: campaignId => ({
+        url: `/${campaignId}`,
+      }),
+      transformResponse: (data: any) => formatListCampaign(data?.data)?.[0],
+    }),
     getLeaderboard: builder.query<
       any,
       { pageSize: number; pageNumber: number; userAddress: string; lookupAddress: string; campaignId: number }
@@ -255,6 +263,7 @@ export const {
   useGetLuckyWinnersQuery,
   useJoinCampaignMutation,
   useGetTxsCampaignQuery,
+  useLazyGetCampaignByIdQuery,
 } = campaignApi
 
 export default campaignApi

src/state/campaigns/reducer.ts

@@ -69,9 +69,15 @@ export default createReducer<CampaignsState>(initialState, builder =>
       }
     })
     .addCase(setCampaignDataByPage, (state, { payload: { campaigns, isReset } }) => {
+      const oldData = state.data
+      const newData = isReset
+        ? campaigns
+        : oldData.some(e => e.id === campaigns[0]?.id)
+        ? oldData
+        : oldData.concat(campaigns)
       return {
         ...state,
-        data: isReset ? campaigns : state.data.concat(campaigns),
+        data: newData,
       }
     })
     .addCase(setLoadingCampaignData, (state, { payload: loading }) => {