add wallet sign

src/app/home/components/Header.tsx

@@ -5,7 +5,7 @@ import { useStore, useWallet } from "@/hooks";
 import { Button } from "@/components/Button";
 
 export const Header: React.FunctionComponent<{}> = () => {
-  const { appStatus } = useStore();
+  const { appStatus, wallet } = useStore();
   const { onWalletConnect } = useWallet();
 
   return (
@@ -17,6 +17,7 @@ export const Header: React.FunctionComponent<{}> = () => {
         </Button>
       </Block>
       <Status text="Application status" mark={appStatus} />
+      {wallet && <p className="mt-3 text-sm">Wallet connected: {wallet}</p> }
     </>
   );
 };

src/app/home/components/Keystore.tsx

@@ -6,7 +6,7 @@ import { useRLN, useStore } from "@/hooks";
 import { useKeystore } from "@/hooks/useKeystore";
 
 export const Keystore: React.FunctionComponent<{}> = () => {
-  const { walletConnected, keystoreCredentials } = useStore();
+  const { wallet, keystoreCredentials } = useStore();
   const { onReadCredentials, onRegisterCredentials } = useKeystore();
 
   const { password, onPasswordChanged } = usePassword();
@@ -65,9 +65,9 @@ export const Keystore: React.FunctionComponent<{}> = () => {
       <Block className="mt-4">
         <p className="text-s mb-2">Generate new credentials from wallet and register on chain</p>
         <Button
-          disabled={!walletConnected}
+          disabled={!wallet || !password}
           onClick={() => onRegisterCredentials(password)}
-          className={walletConnected ? "" : "cursor-not-allowed"}
+          className={wallet && password ? "" : "cursor-not-allowed"}
         >
           Register new credentials
         </Button>

src/hooks/useStore.ts

@@ -23,8 +23,8 @@ type StoreResult = {
   wakuStatus: string;
   setWakuStatus: (v: string) => void;
 
-  walletConnected: boolean;
-  setWalletConnected: () => void;
+  wallet: string;
+  setWallet: (v: string) => void;
 };
 
 const DEFAULT_VALUE = "none";
@@ -45,8 +45,8 @@ export const useStore = create<StoreResult>((set) => {
     setCredentials: (v: undefined | IdentityCredential) =>
       set((state) => ({ ...state, credentials: v })),
 
-    walletConnected: false,
-    setWalletConnected: () => set((state) => ({ ...state, walletConnected: true })),
+    wallet: "",
+    setWallet: (v: string) => set((state) => ({ ...state, wallet: v })),
   };
 
   const wakuModule = {

src/hooks/useWallet.ts

@@ -9,7 +9,7 @@ type UseWalletResult = {
 
 export const useWallet = (): UseWalletResult => {
   const { rln } = useRLN();
-  const { setEthAccount, setChainID, setWalletConnected } = useStore();
+  const { setEthAccount, setChainID, setWallet } = useStore();
 
   React.useEffect(() => {
     const ethereum = window.ethereum;
@@ -49,9 +49,9 @@ export const useWallet = (): UseWalletResult => {
     }
     
     try {
-      await window.ethereum.request({ method: 'eth_requestAccounts' });
+      const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' }) as unknown as string[];
       await rln.initRLNContract(rln.rlnInstance);
-      setWalletConnected();
+      setWallet(accounts?.[0] || "");
     } catch(error) {
       console.error("Failed to conenct to wallet.");
     }