Feature/iyk fix

src/api/RestAPI/hooks/useIykHooks.ts

@@ -11,14 +11,16 @@ interface IYKRefStruct {
   uid: string;
   isValidRef: boolean;
   linkedToken: LinkedToken | undefined;
-  poapEvents: [
-    {
-      id: number;
-      otp: string;
-      poapEventId: string;
-      status: 'active' | 'expired' | 'pending-approval' | 'future' | 'rejected';
-    }
-  ];
+  poapEvents:
+    | [
+        {
+          id: number;
+          otp: string;
+          poapEventId: string;
+          status: 'active' | 'expired' | 'pending-approval' | 'future' | 'rejected';
+        }
+      ]
+    | [];
 }
 
 const httpClient = getCustomClient(`https://api.iyk.app/`, {});
@@ -37,6 +39,7 @@ export function useIYKRefQuery(ref: string | null) {
     select: (data) => {
       if (data) {
         const { isValidRef, linkedToken, poapEvents } = data;
+
         return { isValidRef, linkedToken, poapEvents };
       } else return undefined;
     },
@@ -51,7 +54,11 @@ interface MintIykPoapTokenProps {
   deviceId?: string | null;
 }
 
-export function useMintIYKPOAPToken() {
+interface mintIykParams {
+  onSuccessfullMint?: (data: any) => void;
+}
+
+export function useMintIYKPOAPToken({ onSuccessfullMint }: mintIykParams) {
   const getIykData = async ({ otpCode, recipient, deviceId, poapEventId }: MintIykPoapTokenProps) => {
     if (!otpCode || !recipient || !poapEventId) return undefined;
 
@@ -71,5 +78,5 @@ export function useMintIYKPOAPToken() {
     return data;
   };
 
-  return useMutation(['fetchIykData'], getIykData);
+  return useMutation(['fetchIykData'], getIykData, { onSuccess: onSuccessfullMint });
 }

src/pages/NimiPage.tsx

@@ -29,6 +29,7 @@ const eventUrlToThemeMapping = {
 export default function NimiPage() {
   const { nimiUsername: ensName } = useParams();
   const [isMounted, setIsMounted] = useState(false);
+  const [isMinted, setIsMinted] = useState(false);
   // const [autoClaimPOAPLocalStorage, setAutoClaimPOAPLocalStorage] = useAtom(autoClaimPOAPAtom);
   const [autoClaimPOAP, setAutoClaimPOAP] = useAtom(autoClaimPOAPAtom);
   const [autoClaimPOAPRecentReceiver, setAutoClaimPOAPRecentReciever] = useAtom(autoClaimPOAPRecentReceiverAtom);
@@ -47,10 +48,12 @@ export default function NimiPage() {
   const iykRef = searchParams.get('iykRef');
   const event = searchParams.get('event');
   const { data: refData, isFetching: isRefDataLoading } = useIYKRefQuery(iykRef);
+  console.log('refData', refData);
   const poapEventId = refData?.poapEvents?.[0]?.poapEventId;
 
   // Retrieve the POAP event data and check if the user has already claimed the POAP
   const { data: poapEvent, isFetching: isPoapEventLoading } = usePOAPEventQuery(poapEventId);
+  console.log('poapEvent', poapEvent);
 
   // Fetch the Nimi data for the ENS name
   const { data: initialNimi, isGenerated } = useInitialtNimiData({
@@ -68,8 +71,12 @@ export default function NimiPage() {
     account: debouncedPOAPReciever,
     enabled: !!debouncedPOAPReciever,
   });
+
+  const onSuccessfullMint = () => {
+    setIsMinted(true);
+  };
   // Mint the POAP token
-  const { mutateAsync: mintIYKPOAPToken } = useMintIYKPOAPToken();
+  const { mutateAsync: mintIYKPOAPToken } = useMintIYKPOAPToken({ onSuccessfullMint });
 
   // Debugging
   console.log({
@@ -86,28 +93,36 @@ export default function NimiPage() {
       setClaimStep(ClaimModalState.CLAIMED);
       return;
     }
-    try {
-      const mintResponse = await mintIYKPOAPToken({
-        otpCode: refData?.poapEvents[0].otp,
-        recipient: debouncedPOAPReciever,
-        poapEventId: poapEventId!,
-      });
-      console.log({ mintResponse });
-
-      if (mintResponse.success) {
-        setClaimStep(ClaimModalState.SUCCESS);
-        // If the user wants to auto claim the POAP, save the reciever address to local storage
-        setAutoClaimPOAPRecentReciever(debouncedPOAPReciever);
-      } else {
+
+    if (refData && refData.poapEvents && refData.poapEvents[0] && !isMinted) {
+      // check if these are defined
+      try {
+        const mintResponse = await mintIYKPOAPToken({
+          otpCode: refData.poapEvents[0].otp,
+          recipient: debouncedPOAPReciever,
+          poapEventId: poapEventId!,
+        });
+        console.log({ mintResponse });
+
+        if (mintResponse.success) {
+          setClaimStep(ClaimModalState.SUCCESS);
+          // If the user wants to auto claim the POAP, save the reciever address to local storage
+          setAutoClaimPOAPRecentReciever(debouncedPOAPReciever);
+        } else {
+          setClaimStep(ClaimModalState.ERROR);
+        }
+      } catch (error) {
+        console.error(error);
         setClaimStep(ClaimModalState.ERROR);
       }
-    } catch (error) {
-      console.error(error);
-      setClaimStep(ClaimModalState.ERROR);
+    } else {
+      console.error('refData or refData.poapEvents[0] is not defined.');
+      return;
     }
 
     return;
   };
+
   useEffect(() => {
     // On first render, attempt to claim the POAP if the user has auto claim enabled
     const attemptClaim = async () => {