Persist subscriber ID in local storage

src/pages/ConnectWallet.tsx

@@ -15,9 +15,7 @@ const ConnectWallet = () => {
   useEffect(() => {
 
     if (session) {
-      navigate("/sign-with-nitro-key", {
-        state: location.state
-      });
+      navigate("/sign-with-nitro-key");
     }
   }, [session, navigate, location]);
 

src/pages/OnboardingSuccess.tsx

@@ -48,6 +48,8 @@ const OnboardingSuccess = () => {
           return;
         }
 
+        localStorage.removeItem('subscriberIdHash');
+
         setParticipant(participant);
       } catch (error) {
         console.error("Error fetching participants", error);

src/pages/SignWithCosmos.tsx

@@ -25,17 +25,17 @@ const SignWithCosmos = () => {
 
   const navigate = useNavigate();
 
-  const {message: innerMessage, cosmosAddress, receivedEthSig: ethSignature, subscriberIdHash} = location.state as {
+  const {message: innerMessage, cosmosAddress, receivedEthSig: ethSignature} = location.state as {
     message?: {
       msg: string;
       address: string;
     };
     cosmosAddress?: string;
     receivedEthSig?: string;
-    subscriberIdHash?: string;
   };
 
   const ethAddress = innerMessage!.address;
+  const subscriberIdHash = localStorage.getItem('subscriberIdHash');
 
   const createCosmosClient = useCallback(async (endpoint: string) => {
     return await StargateClient.connect(endpoint);

src/pages/SignWithNitroKey.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useMemo, useEffect } from "react";
-import { useLocation, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 import { enqueueSnackbar } from "notistack";
 import canonicalStringify from "canonical-json";
 
@@ -27,7 +27,6 @@ const SignWithNitroKey = () => {
   }, [session, signClient, checkPersistedState]);
 
   const navigate = useNavigate();
-  const location = useLocation();
   const [ethAddress, setEthAddress] = useState("");
   const [ethSignature, setEthSignature] = useState("");
 
@@ -35,6 +34,15 @@ const SignWithNitroKey = () => {
 
   const [isLoading, setIsLoading] = useState(false);
 
+  const subscriberIdHash = localStorage.getItem('subscriberIdHash');
+
+  useEffect(()=>{
+    if(!subscriberIdHash){
+      setIsLoading(false)
+      enqueueSnackbar("Subscriber ID not found. Please verify your email and try again", { variant: "error" });
+    }
+  }, [subscriberIdHash])
+
   const message = useMemo(() => {
     return {
       msg: "Register my account as a participant on the Laconic network",
@@ -68,20 +76,11 @@ const SignWithNitroKey = () => {
             },
           });
         } else {
-          const state = location.state as {
-            subscriberIdHash?: string
-          }
-
-          if (!state.subscriberIdHash) {
-            throw new Error("Subscriber ID not found. Please verify your email and try again")
-          }
-
           navigate("/sign-with-cosmos", {
             state: {
               message,
               cosmosAddress,
               receivedEthSig,
-              subscriberIdHash: state.subscriberIdHash,
             },
           });
         }

src/pages/Thanks.tsx

@@ -19,6 +19,11 @@ const Thanks: React.FC = () => {
   const [err, setErr] = useState<string>();
 
   useEffect(() => {
+    const localSubscriberIdHash = localStorage.getItem('localSubscriberIdHash');
+    if(localSubscriberIdHash){
+      navigate('/connect-wallet');
+    }
+
     const queryParams = new URLSearchParams(location.search);
     const token = queryParams.get('jwt_token');
 
@@ -38,14 +43,12 @@ const Thanks: React.FC = () => {
         throw new Error("Token has expired");
       }
 
-      const subscriberIdBytes = ethers.utils.toUtf8Bytes(decoded.subscriber_id)
+      const subscriberIdBytes = ethers.utils.toUtf8Bytes(decoded.subscriber_id);
       const subscriberIdHash = ethers.utils.sha256(subscriberIdBytes);
 
-      navigate('/connect-wallet', {
-        state:{
-          subscriberIdHash
-        }
-      });
+      localStorage.setItem('subscriberIdHash', subscriberIdHash);
+
+      navigate('/connect-wallet');
     } catch (error) {
       setErr(String(error));
     }

src/pages/UserVerification.tsx

@@ -45,12 +45,13 @@ const UserVerification = () => {
   useEffect(() => {
     if (applicationSubmitted && kycId !== '') {
       const kycIdHash = ethers.utils.sha256(ethers.utils.toUtf8Bytes(kycId));
+      localStorage.setItem('subscriberIdHash', kycIdHash);
+
       navigate("/sign-with-cosmos", {
         state: {
           message,
           cosmosAddress,
           receivedEthSig,
-          subscriberIdHash: kycIdHash,
         }})
     }
   }, [applicationSubmitted, kycId, navigate, cosmosAddress, message, receivedEthSig]);