feat(suite): minimal walletconnect implementation for evm

Author: martykan

packages/suite-desktop-connect-popup/src/connectPopupThunks.ts

@@ -7,24 +7,22 @@ import { serializeError } from '@trezor/connect/src/constants/errors';
 
 const CONNECT_POPUP_MODULE = '@common/connect-popup';
 
-export const connectPopupCallThunk = createThunk(
+export const connectPopupCallThunk = createThunk<
+    Promise<{
+        id: number;
+        success: boolean;
+        payload: any;
+    }>,
+    {
+        id: number;
+        method: string;
+        payload: any;
+        processName?: string;
+        origin?: string;
+    }
+>(
     `${CONNECT_POPUP_MODULE}/callThunk`,
-    async (
-        {
-            id,
-            method,
-            payload,
-            processName,
-            origin,
-        }: {
-            id: number;
-            method: string;
-            payload: any;
-            processName?: string;
-            origin?: string;
-        },
-        { dispatch, getState, extra },
-    ) => {
+    async ({ id, method, payload, processName, origin }, { dispatch, getState, extra }) => {
         try {
             const device = selectSelectedDevice(getState());
 
@@ -71,17 +69,18 @@ export const connectPopupCallThunk = createThunk(
 
             dispatch(extra.actions.onModalCancel());
 
-            desktopApi.connectPopupResponse({
+            return {
                 ...response,
                 id,
-            });
+            };
         } catch (error) {
             console.error('connectPopupCallThunk', error);
-            desktopApi.connectPopupResponse({
+
+            return {
                 success: false,
                 payload: serializeError(error),
                 id,
-            });
+            };
         }
     },
 );
@@ -90,8 +89,9 @@ export const connectPopupInitThunk = createThunk(
     `${CONNECT_POPUP_MODULE}/initPopupThunk`,
     async (_, { dispatch }) => {
         if (desktopApi.available && (await desktopApi.connectPopupEnabled())) {
-            desktopApi.on('connect-popup/call', params => {
-                dispatch(connectPopupCallThunk(params));
+            desktopApi.on('connect-popup/call', async params => {
+                const response = await dispatch(connectPopupCallThunk(params)).unwrap();
+                desktopApi.connectPopupResponse(response);
             });
             desktopApi.connectPopupReady();
         }

packages/suite-walletconnect/package.json

@@ -0,0 +1,26 @@
+{
+    "name": "@trezor/suite-walletconnect",
+    "version": "1.0.0",
+    "private": true,
+    "license": "See LICENSE.md in repo root",
+    "sideEffects": false,
+    "main": "src/index",
+    "scripts": {
+        "depcheck": "yarn g:depcheck",
+        "type-check": "yarn g:tsc --build",
+        "test:unit": "yarn g:jest -c ../../jest.config.base.js",
+        "test-unit:watch": "yarn g:jest -c ../../jest.config.base.js -o --watch"
+    },
+    "dependencies": {
+        "@reduxjs/toolkit": "1.9.5",
+        "@reown/walletkit": "^1.1.1",
+        "@suite-common/redux-utils": "workspace:*",
+        "@suite-common/suite-types": "workspace:*",
+        "@trezor/connect": "workspace:*",
+        "@walletconnect/core": "^2.17.2",
+        "@walletconnect/utils": "^2.17.2"
+    },
+    "devDependencies": {
+        "redux-thunk": "^2.4.2"
+    }
+}

packages/suite-walletconnect/src/index.ts

@@ -0,0 +1,2 @@
+export * from './walletConnectThunks';
+export * from './walletConnectMiddleware';

packages/suite-walletconnect/src/walletConnectMiddleware.ts

@@ -0,0 +1,27 @@
+import { accountsActions } from '@suite-common/wallet-core';
+import { createMiddlewareWithExtraDeps } from '@suite-common/redux-utils';
+
+import * as walletConnectActions from './walletConnectThunks';
+
+export const prepareWalletConnectMiddleware = createMiddlewareWithExtraDeps(
+    async (action, { dispatch, next }) => {
+        await next(action);
+
+        if (accountsActions.updateSelectedAccount.match(action) && action.payload.account) {
+            dispatch(
+                walletConnectActions.switchSelectedAccountThunk({
+                    account: action.payload.account,
+                }),
+            );
+        }
+
+        if (
+            accountsActions.createAccount.match(action) ||
+            accountsActions.removeAccount.match(action)
+        ) {
+            dispatch(walletConnectActions.updateAccountsThunk());
+        }
+
+        return action;
+    },
+);