feat(evm): cancel connect request

* cancel connect request

* typo correction

* implement cancelRequest in evm connector

* killSession on request cancel

* style: fix code formatting

* chore: update changeset

Co-authored-by: Erno <[email protected]>
Co-authored-by: Erno Wever <[email protected]>

.changeset/afraid-pans-kiss.md

@@ -0,0 +1,10 @@
+---
+"@moralisweb3/core": patch
+"@moralisweb3/evm": patch
+"@moralisweb3/test-app-all": patch
+"@moralisweb3/evm-connector-utils": patch
+"@moralisweb3/evm-wallet-connect-connector": patch
+"@moralisweb3/wallet-connect-wrapper": patch
+---
+
+Allow to cancel an Evm connect request

demos/test-app-all/src/Evm.tsx

@@ -19,6 +19,7 @@ export const Evm = () => {
         Connect via walletconnect
       </button>
       <button onClick={() => Moralis.Evm.disconnect()}>Disconnect</button>
+      <button onClick={() => Moralis.Evm.cancelRequest()}>Cancel request</button>
       <button onClick={() => console.log(Moralis.Evm.connector)}>get connector</button>
       <button onClick={() => console.log(Moralis.Evm.account)}>get account</button>
       <button onClick={() => console.log(Moralis.Evm.chain)}>get chainId</button>

packages/core/src/Error/ErrorCode.ts

@@ -49,7 +49,8 @@ export enum NetworkErrorCode {
   WALLET_NOT_FOUND = 'N0006',
   CONTRACT_NOT_SET = 'N0007',
   NO_CHAIN_SET = 'N0008',
-  CHAIN_MISMATCH = 'N0009',
+  CANNOT_CANCEL = 'N0009',
+  CHAIN_MISMATCH = 'N0010',
 
   NOT_IMPLEMENTED = 'N9000',
 }

packages/evm/src/Connection/Connection.ts

@@ -13,7 +13,7 @@ import {
 } from '@moralisweb3/core';
 import { EvmAbstractConnector, EvmConnectorEvent } from '@moralisweb3/evm-connector-utils';
 import { EvmNetworkEvent, EvmNetworkEventMap } from '../events/EvmNetworkEvent';
-import { connectWallet } from './connectWallet';
+import { connectWallet, cancelWalletRequest } from './walletConnection';
 import { Connectors } from './Connectors';
 import { StateContext, State, StateEvent } from './types';
 
@@ -271,6 +271,31 @@ export class Connection extends MoralisState<StateContext, StateEvent, State> {
     this.transition({ type: 'DISCONNECT' });
   };
 
+  cancelRequest = async () => {
+    if (!this.isConnecting) {
+      throw new MoralisNetworkError({
+        code: NetworkErrorCode.CANNOT_CANCEL,
+        message: 'Cannot cancel request, as no connection attempt is pending',
+      });
+    }
+    cancelWalletRequest(this.connector!)
+      .then(() => {
+        this.transition({
+          type: 'CONNECT_ERROR',
+          data: new MoralisNetworkError({
+            code: NetworkErrorCode.CANNOT_CONNECT,
+            message: 'Request cancelled',
+          }),
+        });
+      })
+      .catch(() => {
+        throw new MoralisNetworkError({
+          code: NetworkErrorCode.CANNOT_CANCEL,
+          message: 'Cannot cancel request',
+        });
+      });
+  };
+
   /**
    * Getters
    */

packages/evm/src/Connection/connectWallet.ts → packages/evm/src/Connection/walletConnection.ts

@@ -1,4 +1,5 @@
 import { EvmBaseConnectOptions } from '@moralisweb3/core';
+import { EvmAbstractConnector } from '@moralisweb3/evm-connector-utils';
 import { Connectors } from './Connectors';
 
 export const connectWallet = async <Options extends EvmBaseConnectOptions>(
@@ -11,3 +12,7 @@ export const connectWallet = async <Options extends EvmBaseConnectOptions>(
 
   return { ...data, connector };
 };
+
+export const cancelWalletRequest = async (connector: EvmAbstractConnector) => {
+  await connector.cancelRequest();
+};

packages/evm/src/MoralisEvm.ts

@@ -103,6 +103,10 @@ export class MoralisEvm extends NetworkModule<EvmNetworkEventMap> {
     return this.connection.disconnect();
   };
 
+  cancelRequest = () => {
+    return this.connection.cancelRequest();
+  };
+
   /**
    * Chain Methods
    */

packages/evmConnectors/EvmConnectorUtils/src/EvmAbstractConnector.ts

@@ -13,6 +13,8 @@ import {
   ProviderRpcError,
   Logger,
   MoralisCore,
+  MoralisNetworkConnectorError,
+  NetworkConnectorErrorCode,
 } from '@moralisweb3/core';
 
 export interface EvmAbstractConnectorConfig {
@@ -135,6 +137,13 @@ export abstract class EvmAbstractConnector<
     this.emit(EvmConnectorEvent.DISCONNECT, error);
   }
 
+  async cancelRequest(): Promise<void> {
+    throw new MoralisNetworkConnectorError({
+      code: NetworkConnectorErrorCode.NOT_IMPLEMENTED,
+      message: 'cancelRequest() is not implemented',
+    });
+  }
+
   // /**
   //  * Cleans all active listners, connections and stale references
   //  */

packages/evmConnectors/EvmWalletconnectConnector/src/EvmWalletConnectConnector.ts

@@ -78,13 +78,23 @@ export class EvmWalletConnectConnector extends EvmAbstractConnector<
     };
   }
 
+  async cancelRequest() {
+    if (this.provider) {
+      await this.provider.wc.killSession();
+    }
+    throw new MoralisNetworkConnectorError({
+      code: NetworkConnectorErrorCode.GENERIC_NETWORK_CONNECTOR_ERROR,
+      message: 'No pending request to cancel',
+    });
+  }
+
   public cleanup() {
     try {
       if (window) {
         window.localStorage.removeItem('walletconnect');
       }
     } catch (error) {
-      // Do nothing
+      this.logger.verbose('Failed to cleanup', { error });
     }
   }
 

packages/evmConnectors/walletConnectWrapper/index.d.ts

@@ -1,9 +1,11 @@
-import { IWalletConnectProviderOptions } from '@walletconnect/types';
+import { IWalletConnectProviderOptions, IConnector } from '@walletconnect/types';
 
 export declare class WalletConnectProviderWrapper {
   constructor(opts: IWalletConnectProviderOptions);
   chainId: number;
   enable(): Promise<string[]>;
+  disconnect(): Promise<void>;
+  wc: IConnector;
   request(args: { method: string; params?: unknown[] | object }): Promise<unknown>;
   on(event: string, listener: (args: never) => void): void;
   once(event: string, listener: (args: unknown) => void): void;

packages/evmConnectors/walletConnectWrapper/src/index.js

@@ -14,6 +14,14 @@ export class WalletConnectProviderWrapper {
     return this.provider.enable();
   }
 
+  disconnect() {
+    return this.provider.disconnect();
+  }
+
+  wc() {
+    return this.provider.wc;
+  }
+
   request(args) {
     return this.provider.request(args);
   }