fix: metamask works

bob-collective · Oct 31, 2023 · 03c618b · 03c618b
1 parent e69ad01
commit 03c618b
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 18 deletions.
diff --git a/examples/account-abstraction/safe/src/App.tsx b/examples/account-abstraction/safe/src/App.tsx
@@ -20,7 +20,7 @@ function App() {
   const flagOwner = useQuery<string, Error, string>(['owner'], {
     enabled: !!contract,
     queryFn: () => read('flagHolder') as Promise<string>,
-    refetchInterval: 10000
+    refetchInterval: 5000
   });
 
   const capturaFlagMutation = useMutation({
@@ -80,6 +80,8 @@ function App() {
   useEffect(() => {
     setTransferAddress('');
     setTransfering(false);
+
+    flagOwner.refetch();
   }, [safeSelected]);
 
   const isCurrentOwner = safeSelected === flagOwner.data;

diff --git a/examples/account-abstraction/safe/src/context/AuthContext.tsx b/examples/account-abstraction/safe/src/context/AuthContext.tsx
@@ -7,8 +7,9 @@ import { createContext, useCallback, useContext, useEffect, useState } from 'rea
 import AccountAbstraction from '@safe-global/account-abstraction-kit-poc';
 import { Web3AuthModalPack } from '@safe-global/auth-kit';
 
+import Safe, { EthersAdapter } from '@safe-global/protocol-kit';
 import { GelatoRelayPack } from '@safe-global/relay-kit';
-import { MetaTransactionData, MetaTransactionOptions } from '@safe-global/safe-core-sdk-types';
+import { MetaTransactionData } from '@safe-global/safe-core-sdk-types';
 import { useQuery } from '@tanstack/react-query';
 
 const goerliChain: Chain = {
@@ -196,7 +197,7 @@ const AccountAbstractionProvider = ({ children }: { children: JSX.Element }) =>
     const getSafeAddress = async () => {
       if (web3Provider) {
         const signer = web3Provider.getSigner();
-        const relayPack = new GelatoRelayPack();
+        const relayPack = new GelatoRelayPack('_H2parOk7AeLqmhXkgRhPjVOUUYz31FNFGJA7CwNEzE_');
         const safeAccountAbstraction = new AccountAbstraction(signer);
 
         await safeAccountAbstraction.init({ relayPack });
@@ -232,20 +233,31 @@ const AccountAbstractionProvider = ({ children }: { children: JSX.Element }) =>
     setIsRelayerLoading(true);
 
     const signer = web3Provider.getSigner();
-    const relayPack = new GelatoRelayPack();
-    const safeAccountAbstraction = new AccountAbstraction(signer);
 
-    await safeAccountAbstraction.init({ relayPack });
+    const ethAdapter = new EthersAdapter({
+      ethers,
+      signerOrProvider: signer
+    });
 
-    const dumpSafeTransafer: MetaTransactionData[] = [transaction];
+    const safeSDK = await Safe.create({
+      ethAdapter,
+      safeAddress: safeSelected
+    });
 
-    const options: MetaTransactionOptions = {
-      isSponsored: false,
-      gasLimit: '600000', // in this alfa version we need to manually set the gas limit
-      gasToken: ethers.constants.AddressZero // native token
-    };
+    const relayPack = new GelatoRelayPack('_H2parOk7AeLqmhXkgRhPjVOUUYz31FNFGJA7CwNEzE_');
+
+    const transactions: MetaTransactionData[] = [transaction];
+
+    const safeTransaction = await relayPack.createRelayedTransaction({
+      safe: safeSDK,
+      transactions
+    });
+
+    const signedSafeTransaction = await safeSDK.signTransaction(safeTransaction);
+
+    const response = await relayPack.executeRelayTransaction(signedSafeTransaction, safeSDK);
 
-    const gelatoTaskId = await safeAccountAbstraction.relayTransaction(dumpSafeTransafer, options);
+    console.log(`Relay Transaction Task ID: https://relay.gelato.digital/tasks/status/${response.taskId}`);
 
     setIsRelayerLoading(false);
     setGelatoTaskId(gelatoTaskId);

diff --git a/examples/account-abstraction/safe/src/hooks/useContract.ts b/examples/account-abstraction/safe/src/hooks/useContract.ts
@@ -5,22 +5,27 @@ import { useAccountAbstraction } from '../context/AuthContext';
 
 function useContract(contractType: ContractType) {
   const [contract, setContract] = useState<ethers.Contract | null>(null);
-  const { web3Provider } = useAccountAbstraction();
+  const { web3Provider, safeSelected } = useAccountAbstraction();
 
   useEffect(() => {
     // Ensure you have an Ethereum provider set up, e.g., with MetaMask
     if (window.ethereum && web3Provider) {
-      console.log(web3Provider.network);
       const signer = web3Provider.getSigner();
 
       const contractObj = contracts[contractType];
 
-      const contractInit = new ethers.Contract(contractObj.address, contractObj.abi, signer);
-      setContract(contractInit);
+      if (safeSelected) {
+        const contractInit = new ethers.Contract(contractObj.address, contractObj.abi, signer);
+        setContract(contractInit);
+      } else {
+        const contractInit = new ethers.Contract(contractObj.address, contractObj.abi, web3Provider);
+
+        setContract(contractInit);
+      }
     } else {
       console.error('Ethereum provider not found. Make sure you have MetaMask or a similar provider installed.');
     }
-  }, [contractType, web3Provider]);
+  }, [contractType, web3Provider, safeSelected]);
 
   // Read function
   const read = async (methodName: string, ...args: unknown[]) => {