add local storage key

src/App.tsx

@@ -353,7 +353,7 @@ export default function App() {
           <ChatUIProvider
             user={userPushSDKInstance}
             theme={darkMode && darkChatTheme}
-            debug={true}
+            debug={false}
             uiConfig={{
               suppressToast: false,
             }}

src/blocks/icons/components/Stopwatch.tsx

@@ -0,0 +1,30 @@
+import { FC } from 'react';
+import { IconWrapper } from '../IconWrapper';
+import { IconProps } from '../Icons.types';
+
+const Stopwatch: FC<IconProps> = (allProps) => {
+  const { svgProps: props, ...restProps } = allProps;
+  return (
+    <IconWrapper
+      componentName="Stopwatch"
+      icon={
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          width="inherit"
+          height="inherit"
+          viewBox="0 0 9 10"
+          fill="none"
+          {...props}
+        >
+          <path
+            d="M4.28572 1.42857C3.43808 1.42857 2.60948 1.67992 1.9047 2.15084C1.19992 2.62176 0.650608 3.2911 0.326232 4.07421C0.00185694 4.85733 -0.0830145 5.71904 0.0823507 6.55039C0.247716 7.38173 0.655891 8.14537 1.25526 8.74474C1.85463 9.34411 2.61827 9.75228 3.44961 9.91765C4.28096 10.083 5.14268 9.99814 5.92579 9.67377C6.7089 9.34939 7.37824 8.80008 7.84916 8.0953C8.32008 7.39052 8.57143 6.56192 8.57143 5.71428C8.57013 4.57804 8.11818 3.48871 7.31474 2.68526C6.51129 1.88182 5.42196 1.42987 4.28572 1.42857ZM6.32411 4.18125L4.53839 5.96696C4.50521 6.00015 4.46582 6.02647 4.42246 6.04443C4.37911 6.06238 4.33264 6.07163 4.28572 6.07163C4.23879 6.07163 4.19232 6.06238 4.14897 6.04443C4.10561 6.02647 4.06622 6.00015 4.03304 5.96696C3.99986 5.93378 3.97353 5.89439 3.95558 5.85103C3.93762 5.80768 3.92837 5.76121 3.92837 5.71428C3.92837 5.66736 3.93762 5.62089 3.95558 5.57754C3.97353 5.53418 3.99986 5.49479 4.03304 5.46161L5.81875 3.67589C5.85193 3.64271 5.89133 3.61639 5.93468 3.59843C5.97804 3.58047 6.0245 3.57123 6.07143 3.57123C6.11836 3.57123 6.16482 3.58047 6.20818 3.59843C6.25153 3.61639 6.29093 3.64271 6.32411 3.67589C6.35729 3.70907 6.38361 3.74847 6.40157 3.79182C6.41953 3.83518 6.42877 3.88164 6.42877 3.92857C6.42877 3.9755 6.41953 4.02197 6.40157 4.06532C6.38361 4.10867 6.35729 4.14807 6.32411 4.18125ZM2.85714 0.357143C2.85714 0.262423 2.89477 0.171582 2.96175 0.104605C3.02873 0.0376274 3.11957 0 3.21429 0H5.35714C5.45186 0 5.54271 0.0376274 5.60968 0.104605C5.67666 0.171582 5.71429 0.262423 5.71429 0.357143C5.71429 0.451863 5.67666 0.542704 5.60968 0.609681C5.54271 0.676658 5.45186 0.714286 5.35714 0.714286H3.21429C3.11957 0.714286 3.02873 0.676658 2.96175 0.609681C2.89477 0.542704 2.85714 0.451863 2.85714 0.357143Z"
+            fill="currentColor"
+          />
+        </svg>
+      }
+      {...restProps}
+    />
+  );
+};
+
+export default Stopwatch;

src/blocks/icons/index.ts

@@ -145,6 +145,8 @@ export { default as Star } from './components/Star';
 
 export { default as Settings } from './components/Settings';
 
+export { default as Stopwatch } from './components/Stopwatch';
+
 export { default as Swap } from './components/Swap';
 
 export { default as Tick } from './components/Tick';

src/common/Common.localStorageKeys.ts

@@ -1,5 +1,6 @@
 const CommonLocalStorageKeys = {
   notificationShown: 'notificationShown',
+  resetStakeEndDate: 'resetStakeEndDate',
 };
 
 export { CommonLocalStorageKeys };

src/modules/rewards/components/StakePushSection.tsx

@@ -1,5 +1,5 @@
 // React and other libraries
-import { FC, useState } from 'react';
+import { FC, useMemo, useState } from 'react';
 
 // hooks
 import { useAccount } from 'hooks';
@@ -10,7 +10,7 @@ import { useRewardsContext } from 'contexts/RewardsContext';
 import { walletToCAIP10 } from 'helpers/w2w';
 
 // components
-import { Alert, Box, Clockwise, Skeleton, Text } from 'blocks';
+import { Alert, Box, Clockwise, Lozenge, Skeleton, Stopwatch, Text } from 'blocks';
 import { StakePushActivitiesListItem } from './StakePushActivitiesListItem';
 import { RewardsActivityTitle } from './RewardsActivityTitle';
 import { useStakeRewardsResetTime } from '../hooks/useStakeRewardsResetTime';
@@ -36,6 +36,16 @@ const StakePushSection: FC<StakePushPoints> = ({ title, subtitle, timeline, mult
     caip10WalletAddress: caip10WalletAddress,
   });
 
+  const activityResetDate = daysToReset + 7;
+
+  const isEpochStatusActive = useMemo(() => {
+    return daysToReset != null && !multiplier && daysToReset >= 0 && activityResetDate > 7;
+  }, [daysToReset, multiplier, activityResetDate]);
+
+  const hasEpochEnded = useMemo(() => {
+    return daysToReset != null && activityResetDate >= 0 && activityResetDate <= 7 && !multiplier;
+  }, [daysToReset, activityResetDate, multiplier]);
+
   return (
     <Box
       display="flex"
@@ -50,12 +60,37 @@ const StakePushSection: FC<StakePushPoints> = ({ title, subtitle, timeline, mult
         gap={{ ml: 'spacing-sm' }}
       >
         <Box>
-          <Text
-            variant="h4-bold"
-            color="text-primary"
+          <Box
+            display="flex"
+            justifyContent="align-items"
+            alignItems="center"
+            gap="spacing-xs"
           >
-            {title}
-          </Text>
+            <Text
+              variant="h4-bold"
+              color="text-primary"
+            >
+              {title}
+            </Text>
+
+            {isEpochStatusActive && (
+              <Lozenge
+                size="small"
+                icon={<Stopwatch color="icon-brand-medium" />}
+              >
+                {daysToReset} DAYS
+              </Lozenge>
+            )}
+
+            {hasEpochEnded && (
+              <Lozenge
+                size="small"
+                icon={<Stopwatch color="icon-brand-medium" />}
+              >
+                ENDED
+              </Lozenge>
+            )}
+          </Box>
 
           <RewardsActivityTitle
             activityTitle={subtitle}
@@ -71,7 +106,7 @@ const StakePushSection: FC<StakePushPoints> = ({ title, subtitle, timeline, mult
           alignItems="center"
           gap="spacing-xxxs"
         >
-          {isWalletConnected && timeline && daysToReset > 0 && (
+          {isWalletConnected && timeline && activityResetDate != null && activityResetDate >= 0 && (
             <Skeleton
               isLoading={daysToReset == null}
               width="240px"
@@ -89,9 +124,9 @@ const StakePushSection: FC<StakePushPoints> = ({ title, subtitle, timeline, mult
                 />
                 <Text
                   variant="bs-semibold"
-                  color="text-tertiary"
+                  color={activityResetDate <= 7 ? 'text-brand-medium' : 'text-tertiary'}
                 >
-                  Activity resets in {daysToReset} days
+                  Activity resets in {activityResetDate} days
                 </Text>
               </Box>
             </Skeleton>
@@ -151,6 +186,16 @@ const StakePushSection: FC<StakePushPoints> = ({ title, subtitle, timeline, mult
           ))}
         </Box>
       </Box>
+
+      {!multiplier && (
+        <Text
+          textAlign="center"
+          variant="bs-semibold"
+          color="text-tertiary"
+        >
+          Staking rewards can be claimed once per reset after a cooldown period of 7 days.
+        </Text>
+      )}
     </Box>
   );
 };

src/modules/rewards/hooks/useStakeRewardsResetTime.tsx

@@ -13,6 +13,7 @@ import { walletToCAIP10 } from 'helpers/w2w';
 import { getActivityStatus } from '../utils/resolveRecentActivityStatus';
 import { useRewardsContext } from 'contexts/RewardsContext';
 import { filterAndSortActivities, filterAndSortAllActivities } from '../utils/stakeRewardUtilities';
+import { CommonLocalStorageKeys } from 'common';
 
 export type StakeRewardsResetTime = {
   multiplier?: boolean;
@@ -64,48 +65,56 @@ const useStakeRewardsResetTime = ({ multiplier }: StakeRewardsResetTime) => {
     );
   }, [rewardActivitiesResponse]);
 
-  const allUniV2Array = useMemo(() => {
-    return filterAndSortAllActivities(
-      'multiplier-uni',
-      'point-uni',
-      rewardActivitiesResponse?.activities.flatMap((page) => page) || []
-    );
-  }, [rewardActivitiesResponse]);
+  // const allUniV2Array = useMemo(() => {
+  //   return filterAndSortAllActivities(
+  //     'multiplier-uni',
+  //     'point-uni',
+  //     rewardActivitiesResponse?.activities.flatMap((page) => page) || []
+  //   );
+  // }, [rewardActivitiesResponse]);
 
   const daysToReset = useMemo(() => {
     const currentTime = Date.now() / 1000; // Current time in seconds
     const differenceInSeconds = (resetDate as number) - currentTime;
-    return Math.floor(differenceInSeconds / (60 * 60 * 24) + 7); // Convert seconds to days and add the 7 days rest period
+    return Math.floor(differenceInSeconds / (60 * 60 * 24)); // Convert seconds to days and add the 7 days rest period
   }, [resetDate]);
 
+  // Helper function to check if 7 days have passed since the stored epoch time (in seconds)
+  const hasSevenDaysPassed = (storedEpochTime: number) => {
+    const currentTime = Math.floor(Date.now() / 1000); // Current time in epoch seconds
+    const sevenDays = 7; // 7 days
+    const differenceInSeconds = Math.floor((currentTime - storedEpochTime) / (60 * 60 * 24));
+
+    return differenceInSeconds > sevenDays; // Return true if 7 days or more have passed since the stored epoch time
+  };
+
   // Function to handle fetch and timestamp/epoch comparison
   const fetchAndHandleData = () => {
     if (!pushStakeData || !uniV2StakeData) {
       console.error('Missing stake data');
       return;
     }
 
-    const latestPushTimestamp = pushStakeData.toTimestamp;
-    const latestUniV2Timestamp = uniV2StakeData.toTimestamp;
+    const latestPushTimestamp = pushStakeData?.toTimestamp;
+    // const latestUniV2Timestamp = uniV2StakeData.toTimestamp;
+    const resetStakeEndDate = localStorage.getItem(CommonLocalStorageKeys.resetStakeEndDate);
 
-    // Determine which timestamp is later and store it in state
-    const laterTimestamp = latestPushTimestamp > latestUniV2Timestamp ? latestPushTimestamp : latestUniV2Timestamp;
-    setResetDate(laterTimestamp); // Update state with the later timestamp
+    // confirm: push timestamp matches yield farming
+    const laterTimestamp = latestPushTimestamp;
 
-    // Call the appropriate fetch function based on the later timestamp
-    if (laterTimestamp === latestPushTimestamp && allPushArray.length > 0) {
-      handleFetchData(allPushArray, 'push');
-    } else if (laterTimestamp === latestUniV2Timestamp && allUniV2Array.length > 0) {
-      handleFetchData(allUniV2Array, 'uniV2');
+    if (!resetStakeEndDate || hasSevenDaysPassed(Number(laterTimestamp))) {
+      localStorage.setItem(CommonLocalStorageKeys.resetStakeEndDate, laterTimestamp.toString());
     }
+    setResetDate(laterTimestamp);
+    // Call the appropriate fetch function based on the later timestamp
+    handleFetchData(allPushArray, 'push');
   };
 
   // Handle get latest data function for both push and uniV2
   const handleFetchData = (activities: any[], stakeType: 'push' | 'uniV2') => {
     if (!userDetails?.userId || activities.length <= 0) return;
 
     const activityTitles = activities.map((activity) => activity.activityType);
-
     sendRecentActivities(
       {
         userId: userDetails.userId as string,
@@ -127,15 +136,15 @@ const useStakeRewardsResetTime = ({ multiplier }: StakeRewardsResetTime) => {
     const mostRecentStakeActivity = dataActivity?.[latestActivityKey];
     const stakeData = stakeType === 'push' ? pushStakeData : uniV2StakeData;
     const toTimestamp = stakeData?.toTimestamp as number;
-    const currentDate = Date.now();
 
     const isEpochActive = mostRecentStakeActivity?.data?.currentEpoch === stakeData?.currentEpoch;
-    const isPastSevenDays = currentDate > toTimestamp * 1000;
+    const isPastSevenDays = hasSevenDaysPassed(Number(toTimestamp));
 
     if (!isEpochActive && isPastSevenDays) {
       setResetEpoch(true);
       console.log(`${stakeType} epoch is reset`);
     } else {
+      setResetEpoch(false);
       console.log(`${stakeType} epoch is not reset`);
     }
   };