Merge pull request #130 from gnosisguild/sign-typed-data

handle wallet signature requests and improve simulations

extension/package.json

@@ -27,11 +27,11 @@
     "@eslint/js": "^9.7.0",
     "@gnosis.pm/zodiac": "^4.0.3",
     "@noble/hashes": "^1.4.0",
-    "@safe-global/api-kit": "^2.4.2",
-    "@safe-global/protocol-kit": "^4.0.2",
+    "@safe-global/api-kit": "^2.4.4",
+    "@safe-global/protocol-kit": "^4.0.4",
     "@safe-global/safe-apps-sdk": "^9.1.0",
-    "@safe-global/safe-core-sdk-types": "^5.0.2",
-    "@safe-global/safe-gateway-typescript-sdk": "^3.21.10",
+    "@safe-global/safe-core-sdk-types": "^5.0.3",
+    "@safe-global/safe-gateway-typescript-sdk": "^3.22.2",
     "@shazow/whatsabi": "^0.13.2",
     "@testing-library/dom": "^10.3.1",
     "@testing-library/jest-dom": "^6.4.6",

extension/src/app.tsx

@@ -12,7 +12,7 @@ import ProvideProvider from './browser/ProvideProvider'
 import { ProvideState } from './state'
 import ZodiacToastContainer from './components/Toast'
 import { pushLocation } from './location'
-import { ProvideMetaMask, ProvideTenderly } from './providers'
+import { ProvideMetaMask } from './providers'
 import { useMatchConnectionsRoute, usePushConnectionsRoute } from './routing'
 import { ProvideRoutes } from './routes'
 import { useRoutes, useUpdateLastUsedRoute } from './routes/routeHooks'
@@ -55,12 +55,10 @@ root.render(
     <ProvideState>
       <ProvideRoutes>
         <ProvideMetaMask>
-          <ProvideTenderly>
-            <ProvideProvider>
-              <Routes />
-              <ZodiacToastContainer />
-            </ProvideProvider>
-          </ProvideTenderly>
+          <ProvideProvider>
+            <Routes />
+            <ZodiacToastContainer />
+          </ProvideProvider>
         </ProvideMetaMask>
       </ProvideRoutes>
     </ProvideState>

extension/src/background.ts

@@ -13,6 +13,7 @@ const activeExtensionTabs = new Set<number>()
 
 const startTrackingTab = (tabId: number) => {
   activeExtensionTabs.add(tabId)
+  clearStaleRules()
   updateHeadersRule()
   console.log('Pilot: started tracking tab', tabId)
 }
@@ -21,6 +22,7 @@ const stopTrackingTab = (tabId: number) => {
   removeRpcRedirectRules(tabId)
   activeExtensionTabs.delete(tabId)
   simulatingExtensionTabs.delete(tabId)
+  clearStaleRules()
   updateHeadersRule()
   console.log('Pilot: stopped tracking tab', tabId)
 }
@@ -99,12 +101,10 @@ chrome.action.onClicked.addListener(toggle)
 // a fork network.
 const simulatingExtensionTabs = new Map<number, Fork>()
 
-// Hash the RPC URL+ tab ID to a number, so we can use it as a declarativeNetRequest rule ID.
+// Hash the RPC URL + tab ID to a number, so we can use it as a declarativeNetRequest rule ID.
 // Implementation taken from https://github.com/darkskyapp/string-hash (CC0 Public Domain)
 function hash(rpcUrl: string, tabId: number) {
-  const urlComponents = rpcUrl.split('/')
-  const forkId = urlComponents[urlComponents.length - 1]
-  const str = `${tabId}:${forkId}`
+  const str = `${tabId}:${rpcUrl}`
   const MAX_RULE_ID = 0xffffff // chrome throws an error if the rule ID is too large ("expected integer, got number")
 
   let hash = 5381,
@@ -120,6 +120,46 @@ function hash(rpcUrl: string, tabId: number) {
   return (hash >>> 0) % MAX_RULE_ID
 }
 
+async function clearStaleRules() {
+  const openTabIds = await new Promise<Set<number>>((resolve) => {
+    chrome.tabs.query({}, (tabs) => {
+      resolve(new Set(tabs.map((tab) => tab.id).filter(Boolean) as number[]))
+    })
+  })
+
+  // clear activeExtensionTabs that are not open anymore
+  activeExtensionTabs.difference(openTabIds).forEach((tabId) => {
+    activeExtensionTabs.delete(tabId)
+  })
+  console.log({ activeExtensionTabs, openTabIds })
+
+  // clear simulatingExtensionTabs that are not active (= extension is activated) anymore
+  const simulatingTabIds = new Set(simulatingExtensionTabs.keys())
+  simulatingTabIds.difference(activeExtensionTabs).forEach((tabId) => {
+    simulatingExtensionTabs.delete(tabId)
+  })
+
+  // remove rules for tabs that are not simulating anymore
+  const staleRules = await new Promise<chrome.declarativeNetRequest.Rule[]>(
+    (resolve) => {
+      chrome.declarativeNetRequest.getSessionRules((rules) => {
+        resolve(
+          rules.filter(
+            (rule) =>
+              rule.condition.tabIds?.length === 1 &&
+              !simulatingExtensionTabs.has(rule.condition.tabIds[0])
+          )
+        )
+      })
+    }
+  )
+  chrome.declarativeNetRequest.updateSessionRules({
+    removeRuleIds: staleRules.map((r) => r.id),
+  })
+
+  console.debug('Cleared stale rules', staleRules)
+}
+
 const updateRpcRedirectRules = (tabId: number) => {
   const fork = simulatingExtensionTabs.get(tabId)
   if (!fork) {
@@ -156,6 +196,10 @@ const updateRpcRedirectRules = (tabId: number) => {
     addRules,
     removeRuleIds: ruleIds,
   })
+
+  chrome.declarativeNetRequest.getSessionRules((rules) => {
+    console.debug('RPC redirect rules updated', tabId, rules)
+  })
 }
 
 const removeRpcRedirectRules = (tabId: number) => {
@@ -176,9 +220,6 @@ const removeRpcRedirectRules = (tabId: number) => {
       735219801
     )
   )
-  chrome.declarativeNetRequest.getSessionRules((rules) =>
-    console.log('removeRpcRedirectRules getSessionRules', rules)
-  )
 }
 
 chrome.runtime.onMessage.addListener((message, sender) => {
@@ -202,6 +243,7 @@ chrome.runtime.onMessage.addListener((message, sender) => {
       rpcUrl
     )
   }
+
   if (message.type === 'stopSimulating') {
     console.log('stopSimulating', sender.tab.id, { simulatingExtensionTabs })
     simulatingExtensionTabs.delete(sender.tab.id)
@@ -233,6 +275,9 @@ chrome.webRequest.onBeforeRequest.addListener(
     // don't consider requests that are already redirected to the fork RPC
     if (details.url === simulatingExtensionTabs.get(details.tabId)?.rpcUrl)
       return
+    // ignore requests to fork RPCs
+    if (details.url.startsWith('https://virtual.mainnet.rpc.tenderly.co/'))
+      return
     // only consider requests with a JSON RPC body
     if (!getJsonRpcBody(details)) return
 

extension/src/bridge/SafeAppBridge.ts

@@ -235,7 +235,7 @@ export default class SafeAppBridge {
       // assume on-chain signature
       const safeTxHash = await this.provider.request({
         method: 'eth_signTypedData_v4',
-        params: [typedData],
+        params: [this.connection.avatarAddress, JSON.stringify(typedData)],
       })
       return { safeTxHash }
     },

extension/src/browser/Drawer/DecodedTransaction.tsx

@@ -8,25 +8,23 @@ interface Props {
   functionFragment: FunctionFragment
   data: Result
 }
-const DecodedTransaction: React.FC<Props> = ({ functionFragment, data }) => {
-  return (
-    <div className={classes.transaction}>
-      {functionFragment.inputs.length > 0 && (
-        <fieldset>
-          {functionFragment.inputs.map((input, i) => (
-            <label key={input.name}>
-              <span>
-                {input.name} <i className={classes.inputType}>{input.type}</i>
-              </span>
-              <Box p={1} bg>
-                <input type="text" value={data[i]} readOnly />
-              </Box>
-            </label>
-          ))}
-        </fieldset>
-      )}
-    </div>
-  )
-}
+const DecodedTransaction: React.FC<Props> = ({ functionFragment, data }) => (
+  <div className={classes.transaction}>
+    {functionFragment.inputs.length > 0 && (
+      <fieldset>
+        {functionFragment.inputs.map((input, i) => (
+          <label key={input.name}>
+            <span>
+              {input.name} <i className={classes.inputType}>{input.type}</i>
+            </span>
+            <Box p={1} bg>
+              <input type="text" value={data[i].toString()} readOnly />
+            </Box>
+          </label>
+        ))}
+      </fieldset>
+    )}
+  </div>
+)
 
 export default DecodedTransaction