updated the keypair generation mechanism to use user signatures inste…

…ad of storing the keys in the localstorage

packages/nextjs/app/_components/RegisterButton.tsx

@@ -1,19 +1,34 @@
+import { Keypair, PrivKey } from "@se-2/hardhat/maci-ts/domainobjs";
 import { useAuthContext } from "~~/contexts/AuthContext";
 import { useScaffoldContractWrite } from "~~/hooks/scaffold-eth";
 
 export default function RegisterButton() {
-  const { keypair, isRegistered } = useAuthContext();
+  const { keypair, isRegistered, signMessageAsync } = useAuthContext();
 
   const { writeAsync } = useScaffoldContractWrite({
     contractName: "MACI",
     functionName: "signUp",
     args: [keypair?.pubKey.asContractParam(), "0x", "0x"],
   });
 
+  async function register() {
+    try {
+      let userKeypair = keypair;
+      if (!userKeypair) {
+        const signature = await signMessageAsync();
+        userKeypair = new Keypair(new PrivKey(signature));
+      }
+
+      await writeAsync({ args: [userKeypair?.pubKey.asContractParam(), "0x", "0x"] });
+    } catch (err) {
+      console.log(err);
+    }
+  }
+
   if (isRegistered) return <div>Thanks for Registration</div>;
 
   return (
-    <button className="border border-slate-600 bg-primary px-3 py-2 rounded-lg font-bold" onClick={() => writeAsync()}>
+    <button className="border border-slate-600 bg-primary px-3 py-2 rounded-lg font-bold" onClick={register}>
       Register
     </button>
   );

packages/nextjs/contexts/AuthContext.tsx

@@ -1,17 +1,17 @@
 "use client";
 
 import { createContext, useContext, useEffect, useState } from "react";
-import { Keypair } from "@se-2/hardhat/maci-ts/domainobjs";
-import { useAccount } from "wagmi";
+import { Keypair, PrivKey } from "@se-2/hardhat/maci-ts/domainobjs";
+import { useAccount, useSignMessage } from "wagmi";
 import deployedContracts from "~~/contracts/deployedContracts";
 import { useScaffoldContractRead, useScaffoldEventHistory, useScaffoldEventSubscriber } from "~~/hooks/scaffold-eth";
 import scaffoldConfig from "~~/scaffold.config";
-import { fetchOrCreateUserKeyPair } from "~~/utils/crypto";
 
 interface IAuthContext {
   isRegistered: boolean;
   keypair: Keypair | null;
   stateIndex: bigint | null;
+  signMessageAsync: () => Promise<`0x${string}`>;
 }
 
 export const AuthContext = createContext<IAuthContext>({} as IAuthContext);
@@ -20,11 +20,30 @@ export default function AuthContextProvider({ children }: { children: React.Reac
   const { address } = useAccount();
   const [keypair, setKeyPair] = useState<Keypair | null>(null);
   const [stateIndex, setStateIndex] = useState<bigint | null>(null);
+  const [signatureMessage, setSignatureMessage] = useState<string>("");
+
+  const { signMessage, signMessageAsync, data: signature } = useSignMessage({ message: signatureMessage });
+
+  useEffect(() => {
+    setSignatureMessage(`Login to ${window.location.origin}`);
+  }, []);
 
   useEffect(() => {
-    setKeyPair(fetchOrCreateUserKeyPair(address));
+    if (!address) {
+      setKeyPair(null);
+      return;
+    }
+
+    signMessage();
   }, [address]);
 
+  useEffect(() => {
+    if (!signature) return;
+
+    const userKeyPair = new Keypair(new PrivKey(signature));
+    setKeyPair(userKeyPair);
+  }, [signature]);
+
   const { data: isRegistered, refetch: refetchIsRegistered } = useScaffoldContractRead({
     contractName: "MACI",
     functionName: "isPublicKeyRegistered",
@@ -74,7 +93,7 @@ export default function AuthContextProvider({ children }: { children: React.Reac
   });
 
   return (
-    <AuthContext.Provider value={{ isRegistered: Boolean(isRegistered), keypair, stateIndex }}>
+    <AuthContext.Provider value={{ isRegistered: Boolean(isRegistered), keypair, stateIndex, signMessageAsync }}>
       {children}
     </AuthContext.Provider>
   );