feat: restart an initiated registration process when connected wallet…

… is changed

src/app/[pohid]/claim/Form.tsx

@@ -1,7 +1,12 @@
 "use client";
 
 import { enableReactUse } from "@legendapp/state/config/enableReactUse";
-import { Show, Switch, useObservable } from "@legendapp/state/react";
+import {
+  Show,
+  Switch,
+  useEffectOnce,
+  useObservable,
+} from "@legendapp/state/react";
 import cn from "classnames";
 import withClientConnected from "components/HighOrder/withClientConnected";
 import { SupportedChain, SupportedChainId } from "config/chains";
@@ -10,8 +15,9 @@ import usePoHWrite from "contracts/hooks/usePoHWrite";
 import { ContractData } from "data/contract";
 import { RegistrationQuery } from "generated/graphql";
 import { useLoading } from "hooks/useLoading";
-import { useParams } from "next/navigation";
-import { Fragment, useMemo } from "react";
+import { RedirectType } from "next/dist/client/components/redirect";
+import { redirect, useParams } from "next/navigation";
+import { Fragment, MutableRefObject, useEffect, useMemo, useRef } from "react";
 import { toast } from "react-toastify";
 import { machinifyId } from "utils/identifier";
 import { uploadToIPFS } from "utils/ipfs";
@@ -59,6 +65,8 @@ export default withClientConnected<FormProps & JSX.IntrinsicAttributes>(
   function Form({ contractData, totalCosts, renewal }) {
     const params = useParams();
     const { address, isConnected } = useAccount();
+    const initiatingAddress: MutableRefObject<typeof address> =
+      useRef(undefined);
     const chainId = useChainId() as SupportedChainId;
 
     const step$ = useObservable(Step.info);
@@ -164,6 +172,20 @@ export default withClientConnected<FormProps & JSX.IntrinsicAttributes>(
         />
       );
 
+    useEffectOnce(() => {
+      initiatingAddress.current = address;
+    });
+
+    useEffect(() => {
+      if (initiatingAddress.current) {
+        if (
+          !renewal &&
+          initiatingAddress.current.toLowerCase() !== address?.toLowerCase()
+        )
+          redirect(`/${address}`, RedirectType.replace);
+      }
+    }, [address, initiatingAddress]);
+
     return (
       <>
         <Show if={() => step$.get() !== Step.finalized}>

src/app/[pohid]/claim/Review.tsx

@@ -163,16 +163,13 @@ function Review({
             <span className="text-orange mt-2">
               <span className="font-semibold underline">Beware</span>: Your PoH
               ID differs from the wallet address connected to your account. If
-              you're registering for the first time, this discrepancy is a
-              consequence of changing the connected wallet during the
-              registration process. In such cases, to make both addresses match,
-              you may need to change the connected wallet to the original wallet
-              used at the beginning of the registration process, or else
-              reinitiate the registration process. If you are not a newcomer and
-              wish to reclaim your ID from a different wallet (e.g., if you have
-              lost the private key to your original wallet), please confirm that
-              the PoH ID you are using is the one from your initial
-              registration.
+              you are registering for the first time, this discrepancy will
+              result in fund loss. To make both addresses match, you may need to
+              change the connected wallet, or else reinitiate the registration
+              process. If you are not a newcomer and wish to reclaim your ID
+              from a different wallet (e.g., if you have lost the private key to
+              your original wallet), please confirm that the PoH ID you are
+              using is the one from your initial registration.
             </span>
           ) : null}
         </div>