[HOTFIX] Correct epoch passed to fetch assets in history (#180)

Author: aziolek

client/src/components/Earn/EarnHistory/EarnHistoryItemDetails/EarnHistoryItemDetailsAllocation/EarnHistoryItemDetailsAllocation.tsx

@@ -29,12 +29,12 @@ const EarnHistoryItemDetailsAllocation: FC<EarnHistoryItemDetailsAllocationProps
   const { data: isDecisionWindowOpen } = useIsDecisionWindowOpen();
   const { data: epochTimestampHappenedIn, isFetching: isFetchingEpochTimestampHappenedIn } =
     useEpochTimestampHappenedIn(timestamp);
-  const { data: epochLeverage, isFetching: isFetchingEpochLeverage } = useEpochLeverage(
-    epochTimestampHappenedIn ? epochTimestampHappenedIn - 1 : undefined,
-  );
 
   const allocationEpoch = epochTimestampHappenedIn ? epochTimestampHappenedIn - 1 : undefined;
 
+  const { data: epochLeverage, isFetching: isFetchingEpochLeverage } =
+    useEpochLeverage(allocationEpoch);
+
   const { data: individualReward, isFetching: isFetchingIndividualReward } =
     useIndividualReward(allocationEpoch);
 
@@ -132,7 +132,8 @@ const EarnHistoryItemDetailsAllocation: FC<EarnHistoryItemDetailsAllocationProps
             <ProjectAllocationDetailRow
               key={allocation.address}
               {...allocation}
-              epoch={epochTimestampHappenedIn}
+              epoch={allocationEpoch}
+              isLoading={isFetchingEpochTimestampHappenedIn}
             />
           ))}
         </BoxRounded>

client/src/components/shared/ProjectAllocationDetailRow/ProjectAllocationDetailRow.tsx

@@ -15,6 +15,7 @@ const ProjectAllocationDetailRow: FC<ProjectAllocationDetailRowProps> = ({
   address,
   amount,
   epoch,
+  isLoading,
 }) => {
   const { ipfsGateways } = env;
   const {
@@ -29,10 +30,12 @@ const ProjectAllocationDetailRow: FC<ProjectAllocationDetailRowProps> = ({
   const { data: projectIpfs, isFetching: isFetchingProjectIpfs } = useProjectsIpfs(
     [address],
     epoch,
+    !isLoading,
   );
+
   return (
     <div className={styles.root}>
-      {isFetchingProjectIpfs ? (
+      {isLoading || isFetchingProjectIpfs ? (
         <div className={styles.skeleton} />
       ) : (
         <Fragment>

client/src/components/shared/ProjectAllocationDetailRow/types.ts

@@ -2,4 +2,5 @@ export default interface ProjectAllocationDetailRowProps {
   address: string;
   amount: bigint;
   epoch?: number;
+  isLoading: boolean;
 }

client/src/hooks/queries/useProjectsEpoch.ts

@@ -1,12 +1,15 @@
-import { UseQueryResult, useQuery } from '@tanstack/react-query';
+import { UseQueryResult, useQuery, UseQueryOptions } from '@tanstack/react-query';
 
 import { apiGetProjects, Projects } from 'api/calls/projects';
 import { QUERY_KEYS } from 'api/queryKeys';
 
 import useCurrentEpoch from './useCurrentEpoch';
 import useIsDecisionWindowOpen from './useIsDecisionWindowOpen';
 
-export default function useProjectsEpoch(epoch?: number): UseQueryResult<Projects, unknown> {
+export default function useProjectsEpoch(
+  epoch?: number,
+  options?: Omit<UseQueryOptions<Projects, unknown, Projects, any>, 'queryKey'>,
+): UseQueryResult<Projects, unknown> {
   const { data: isDecisionWindowOpen } = useIsDecisionWindowOpen();
   const { data: currentEpoch } = useCurrentEpoch();
 
@@ -19,5 +22,6 @@ export default function useProjectsEpoch(epoch?: number): UseQueryResult<Project
 
     queryFn: () => apiGetProjects(epochToUse),
     queryKey: epoch || currentEpoch ? QUERY_KEYS.projectsEpoch(epochToUse) : [''],
+    ...options,
   });
 }

client/src/hooks/queries/useProjectsIpfs.ts

@@ -14,14 +14,15 @@ import useProjectsEpoch from './useProjectsEpoch';
 export default function useProjectsIpfs(
   projectsAddresses?: string[],
   epoch?: number,
+  isEnabled?: boolean,
 ): { data: ExtendedProject[]; isFetching: boolean; refetch: () => void } {
   const { t } = useTranslation('translation', { keyPrefix: 'api.errorMessage' });
   const { data: currentEpoch } = useCurrentEpoch();
   const {
     data: projectsEpoch,
     refetch,
     isFetching: isFetchingProjectsEpoch,
-  } = useProjectsEpoch(epoch);
+  } = useProjectsEpoch(epoch, { enabled: isEnabled });
 
   const projectsIpfsResults: UseQueryResult<BackendProposal & { ipfsGatewayUsed: string }>[] =
     useQueries({