chore: Add hashed safe account flow

zkemail · Oct 24, 2024 · 70ee1e8 · 70ee1e8
1 parent b7ed1d6
commit 70ee1e8
Show file tree

Hide file tree

Showing 6 changed files with 6,150 additions and 15 deletions.
diff --git a/contracts.base-sepolia.json b/contracts.base-sepolia.json
@@ -1,5 +1,5 @@
 {
-  "safeEmailRecoveryModule": "0x87a5647a625a0DB1237C550A27C3629a3de4B65c",
+  "safeEmailRecoveryModule": "0xf2Fcd6b51F1a58E76667DBAF06B5E655166fb738",
   "universalEmailRecoveryModule": "0x29a26b4f4fDA819415Ef2d93255998E8FF864066",
   "validatorsAddress": "0xd9Ef4a48E4C067d640a9f784dC302E97B21Fd691",
   "safe4337ModuleAddress": "0x31724D48Ba93c3c31617d3346cB7Ec79705013e3",

diff --git a/src/abi/AccountHidingRecoveryCommandHandler.json b/src/abi/AccountHidingRecoveryCommandHandler.json
diff --git a/src/components/EnableSafeModule.tsx b/src/components/EnableSafeModule.tsx
@@ -38,7 +38,7 @@ const EnableSafeModule = () => {
     }
 
     toast("Please check Safe Website to complete transaction", {
-      icon: <img src={infoIcon} />,
+      icon: <img src={infoIcon} alt="info-icon" />,
       style: {
         background: "white",
       },

diff --git a/src/components/GuardianSetup.tsx b/src/components/GuardianSetup.tsx
@@ -19,12 +19,13 @@ import {
   useState,
 } from "react";
 import toast from "react-hot-toast";
+import { encodePacked, keccak256 } from "viem";
 import { useAccount, useReadContract, useWriteContract } from "wagmi";
 import { readContract } from "wagmi/actions";
 import { Button } from "./Button";
-import InputField from "./InputField";
 import Loader from "./Loader";
 import { safeEmailRecoveryModule } from "../../contracts.base-sepolia.json";
+import { abi as accountHidingRecoveryCommandHandlerAbi } from "../abi/AccountHidingRecoveryCommandHandler.json";
 import { safeAbi } from "../abi/Safe";
 import { safeEmailRecoveryModuleAbi } from "../abi/SafeEmailRecoveryModule";
 import { StepsContext } from "../App";
@@ -145,7 +146,7 @@ const GuardianSetup = () => {
       toast(
         "Please check Safe Website to complete transaction and check your email later",
         {
-          icon: <img src={infoIcon} />,
+          icon: <img src={infoIcon} alt="info-icon" />,
           style: {
             background: "white",
           },
@@ -184,6 +185,15 @@ const GuardianSetup = () => {
         ],
       });
 
+      await writeContractAsync({
+        abi: accountHidingRecoveryCommandHandlerAbi,
+        address: "0x11AAEEd0629124A0075A0074Ff4AB54286F72D3d" as `0x${string}`,
+        functionName: "storeAccountHash",
+        args: [address],
+      });
+
+      const accountHash = keccak256(encodePacked(["address"], [address]));
+
       // This function fetches the command template for the acceptanceRequest API call. The command template will be in the following format: [['Accept', "guardian", "request", "for", "{ethAddr}"]]
       const command = await readContract(config, {
         abi: safeEmailRecoveryModuleAbi,
@@ -202,7 +212,7 @@ const GuardianSetup = () => {
           command[0]
             .join()
             ?.replaceAll(",", " ")
-            .replaceAll("{ethAddr}", address)
+            .replaceAll("{string}", accountHash)
         );
       } catch (error) {
         // retry mechanism as this API call fails for the first time
@@ -216,7 +226,7 @@ const GuardianSetup = () => {
           command[0]
             .join()
             ?.replaceAll(",", " ")
-            .replaceAll("{ethAddr}", address)
+            .replaceAll("{string}", accountHash)
         );
       }
 

diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
@@ -134,7 +134,7 @@ const MobileNav = ({
           target="_blank"
           sx={{
             marginRight: theme.spacing(2),
-            color: 'white',
+            color: "white",
             textTransform: "none",
           }}
         >
@@ -202,7 +202,11 @@ const NavBar: React.FC = () => {
               }}
             >
               <Link to="/">
-                <img style={{ verticalAlign: "middle" }} src={zkEmailLogo} />
+                <img
+                  style={{ verticalAlign: "middle" }}
+                  src={zkEmailLogo}
+                  alt="zkemail-logo"
+                />
               </Link>
             </Box>
           </Grid>
@@ -271,7 +275,7 @@ const NavBar: React.FC = () => {
                 sx={{
                   display: { xs: "none", lg: "block" },
                   textTransform: "none",
-                  lineHeight: '14px'
+                  lineHeight: "14px",
                 }}
               >
                 Learn More

diff --git a/src/components/RequestedRecoveries.tsx b/src/components/RequestedRecoveries.tsx
@@ -3,7 +3,12 @@ import { Box, Grid, Typography } from "@mui/material";
 import { useCallback, useContext, useEffect, useRef, useState } from "react";
 import toast from "react-hot-toast";
 import { useNavigate } from "react-router-dom";
-import { encodeAbiParameters, encodeFunctionData } from "viem";
+import {
+  encodeAbiParameters,
+  encodeFunctionData,
+  encodePacked,
+  keccak256,
+} from "viem";
 import { useAccount, useReadContract, useWriteContract } from "wagmi";
 import { readContract } from "wagmi/actions";
 import { Button } from "./Button";
@@ -13,16 +18,16 @@ import Loader from "./Loader";
 import { safeEmailRecoveryModule } from "../../contracts.base-sepolia.json";
 import { safeAbi } from "../abi/Safe";
 import { safeEmailRecoveryModuleAbi } from "../abi/SafeEmailRecoveryModule";
+import { StepsContext } from "../App";
 import cancelRecoveryIcon from "../assets/cancelRecoveryIcon.svg";
 import completeRecoveryIcon from "../assets/completeRecoveryIcon.svg";
 import infoIcon from "../assets/infoIcon.svg";
+import { STEPS } from "../constants";
 import { useAppContext } from "../context/AppContextHook";
 
 import { config } from "../providers/config";
 import { relayer } from "../services/relayer";
 import { templateIdx } from "../utils/email";
-import { StepsContext } from "../App";
-import { STEPS } from "../constants";
 
 const BUTTON_STATES = {
   TRIGGER_RECOVERY: "Trigger Recovery",
@@ -132,6 +137,25 @@ const RequestedRecoveries = () => {
       args: [],
     });
 
+    const accountHash = keccak256(encodePacked(["address"], [address]));
+
+    const swapOwnerCallData = encodeFunctionData({
+      abi: safeAbi,
+      functionName: "swapOwner",
+      args: [
+        "0x0000000000000000000000000000000000000001", // If there is no previous owner of the safe, then the default value will be this
+        safeOwnersData[0],
+        newOwner,
+      ],
+    });
+
+    const recoveryCalldata = encodeAbiParameters(
+      [{ type: "address" }, { type: "bytes" }],
+      [safeWalletAddress, swapOwnerCallData]
+    );
+
+    const recoveryCallDatahash = keccak256(recoveryCalldata)
+
     try {
       // requestId
       await relayer.recoveryRequest(
@@ -141,9 +165,8 @@ const RequestedRecoveries = () => {
         command[0]
           .join()
           ?.replaceAll(",", " ")
-          .replace("{ethAddr}", safeWalletAddress)
-          .replace("{ethAddr}", safeOwnersData[0])
-          .replace("{ethAddr}", newOwner)
+          .replace("{string}", accountHash)
+          .replace("{string}", recoveryCallDatahash)
       );
 
       intervalRef.current = setInterval(() => {