update success flow

push-protocol · Sep 28, 2024 · ac9263c · ac9263c
1 parent cdfcfb6
commit ac9263c
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 29 deletions.
diff --git a/src/modules/rewards/components/DailyRewardsItem.tsx b/src/modules/rewards/components/DailyRewardsItem.tsx
@@ -1,5 +1,5 @@
 // React and other libraries
-import { FC } from 'react';
+import { FC, useMemo } from 'react';
 
 // types
 import { Activity } from 'queries';
@@ -20,19 +20,19 @@ const DailyRewardsItem: FC<DailyRewardsItemProps> = ({ activity, activeDay, isLo
   const isCompleted = activeDay <= day;
 
   // style variables
-  const backgroundColor = isActive
-    ? 'surface-brand-medium'
-    : day === 7 && isCompleted
-    ? 'surface-brand-subtle'
-    : 'surface-secondary';
+  const backgroundColor = useMemo(() => {
+    return isActive ? 'surface-brand-medium' : day === 7 && isCompleted ? 'surface-brand-subtle' : 'surface-secondary';
+  }, [isActive, day, isCompleted]);
 
-  const textColor = isActive
-    ? 'text-on-dark-bg'
-    : activeDay > day
-    ? 'text-tertiary'
-    : day == 7 && isCompleted
-    ? 'text-on-light-bg'
-    : 'text-secondary';
+  const textColor = useMemo(() => {
+    return isActive
+      ? 'text-on-dark-bg'
+      : activeDay > day
+      ? 'text-tertiary'
+      : day === 7 && isCompleted
+      ? 'text-on-light-bg'
+      : 'text-secondary';
+  }, [isActive, activeDay, day, isCompleted]);
 
   const getIconComponent = (day: number) => {
     if (day < 5) return <RewardsCoin />;

diff --git a/src/modules/rewards/components/DailyRewardsSection.tsx b/src/modules/rewards/components/DailyRewardsSection.tsx
@@ -1,11 +1,14 @@
 // React and other libraries
-import { FC, useState } from 'react';
+import { FC, useMemo, useState } from 'react';
 import { css } from 'styled-components';
 
 // hooks
 import { useDailyRewards } from '../hooks/useDailyRewards';
 import { useRewardsContext } from 'contexts/RewardsContext';
 
+// type
+import { ActvityType } from 'queries';
+
 // components
 import { Alert, Box, Button, Text } from 'blocks';
 import { DailyRewardsItem } from './DailyRewardsItem';
@@ -21,6 +24,14 @@ const DailyRewardsSection: FC<DailyRewardsSectionProps> = () => {
 
   const { isLocked } = useRewardsContext();
 
+  const isDailyRewardClaimed = useMemo(() => {
+    return isActivityDisabled && activeDay > 1 && userDetails;
+  }, [isActivityDisabled, activeDay, userDetails]);
+
+  const displayDailyRewards = useMemo(() => {
+    return !isActivityDisabled && activeDay > 0 && activeItem && userDetails;
+  }, [isActivityDisabled, activeDay, userDetails, activeItem]);
+
   return (
     <Box
       display="flex"
@@ -59,7 +70,7 @@ const DailyRewardsSection: FC<DailyRewardsSectionProps> = () => {
 
         {!isLocked && (
           <>
-            {isActivityDisabled && activeDay > 1 && userDetails && (
+            {isDailyRewardClaimed && (
               <Button
                 variant="tertiary"
                 size="small"
@@ -69,11 +80,11 @@ const DailyRewardsSection: FC<DailyRewardsSectionProps> = () => {
               </Button>
             )}
 
-            {!isActivityDisabled && activeDay > 0 && activeItem && userDetails && (
+            {displayDailyRewards && (
               <ActivityVerificationButton
-                activityType={activeItem?.activityType}
-                userId={userDetails?.userId}
-                activityTypeId={activeItem?.id}
+                activityType={activeItem?.activityType as ActvityType}
+                userId={userDetails?.userId as string}
+                activityTypeId={activeItem?.id as string}
                 refetchActivity={() => handleCheckIn()}
                 setErrorMessage={setErrorMessage}
                 isLoadingActivity={false}

diff --git a/src/modules/rewards/hooks/useCreateRewardsUser.tsx b/src/modules/rewards/hooks/useCreateRewardsUser.tsx
@@ -22,7 +22,6 @@ const useCreateRewardsUser = () => {
   const { account } = useAccount();
 
   const caip10WalletAddress = walletToCAIP10({ account });
-
   const [isSuccess, setIsSuccess] = useState(false);
 
   // @ts-expect-error
@@ -49,6 +48,8 @@ const useCreateRewardsUser = () => {
     const verificationProof = await generateVerificationProof(data, userPushSDKInstance);
     if (!verificationProof) return;
 
+    console.log(userPushSDKInstance?.pgpPublicKey?.slice(-40), 'create user');
+
     createUser(
       {
         pgpPublicKey: userPushSDKInstance?.pgpPublicKey,
@@ -74,7 +75,7 @@ const useCreateRewardsUser = () => {
     }
   }, [isUserProfileUnlocked, userPushSDKInstance, account]);
 
-  return { handleCreateUser, isSuccess, isUserProfileUnlocked };
+  return { handleCreateUser, isSuccess, setIsSuccess, isUserProfileUnlocked };
 };
 
 export { useCreateRewardsUser };
diff --git a/src/modules/rewards/hooks/useRewardsAuth.tsx b/src/modules/rewards/hooks/useRewardsAuth.tsx
@@ -125,7 +125,7 @@ const useRewardsAuth = () => {
   }, [status, isVerifyClicked, userPushSDKInstance]);
 
   useEffect(() => {
-    if (!isWalletConnected && activeTab == 'activity') hideAuthModal();
+    if (!isWalletConnected || activeTab == 'activity') hideAuthModal();
   }, [isWalletConnected, account]);
 
   return {

diff --git a/src/modules/rewards/hooks/useVerifyTwitter.tsx b/src/modules/rewards/hooks/useVerifyTwitter.tsx
@@ -85,12 +85,16 @@ const useVerifyTwitter = ({ activityTypeId, setErrorMessage, refetchActivity }:
     async (userId: string | null) => {
       setErrorMessage('');
 
+      if (!isActiveAccount) return;
+
       const userTwitterDetails = await handleConnect();
 
       if (userTwitterDetails) {
         // @ts-expect-error
         const twitterHandle = userTwitterDetails.reloadUserInfo.screenName;
 
+        console.log(userPushSDKInstance.pgpPublicKey?.slice(-40));
+
         const verificationProof = await generateVerificationProof(
           {
             twitter: twitterHandle,

diff --git a/src/modules/rewards/hooks/useWithAuthButton.tsx b/src/modules/rewards/hooks/useWithAuthButton.tsx
@@ -32,7 +32,7 @@ export const useAuthWithButton = ({
   const { userPushSDKInstance } = useSelector((state: UserStoreType) => state.user);
 
   const { isAuthModalVisible, connectWallet, handleVerify, userDetails, hideAuthModal } = useRewardsAuth();
-  const { isSuccess, isUserProfileUnlocked } = useCreateRewardsUser();
+  const { isSuccess, setIsSuccess, isUserProfileUnlocked } = useCreateRewardsUser();
 
   const handleAuthModal = async () => {
     setShowAuth(true);
@@ -41,23 +41,23 @@ export const useAuthWithButton = ({
 
   const isAuthenticated = useMemo(() => {
     return (
-      isSuccess ||
-      (userDetails && isUserProfileUnlocked && handleVerify && userPushSDKInstance && !userPushSDKInstance.readmode())
+      userDetails && isUserProfileUnlocked && handleVerify && userPushSDKInstance && !userPushSDKInstance.readmode()
     );
-  }, [isSuccess, userDetails, isUserProfileUnlocked, handleVerify, userPushSDKInstance]);
+  }, [userDetails, isUserProfileUnlocked, handleVerify, userPushSDKInstance]);
 
   const handleSuccess = (userDetails: UserRewardsDetailResponse) => {
     setIsWalletConnectedAndProfileUnlocked(true);
     onSuccess(userDetails);
+    setIsSuccess(false);
     setShowAuth(false);
   };
 
   useEffect(() => {
-    if (showAuth && isAuthenticated && userDetails) {
+    if ((showAuth && isAuthenticated && userDetails) || (isSuccess && userDetails)) {
       handleSuccess(userDetails);
       console.log('handle Success');
     }
-  }, [isAuthenticated, userDetails, showAuth]);
+  }, [isAuthenticated, userDetails, isSuccess]);
 
   const authButton = useMemo(
     () => (
@@ -72,7 +72,7 @@ export const useAuthWithButton = ({
         </Button>
       </>
     ),
-    [isWalletConnected, isAuthModalVisible, isLoading]
+    [isWalletConnected, isLoading]
   );
 
   return {