feat:add dapp-connected-management

packages/kit/src/background/providers/ProviderApiWalletConnect.ts

@@ -36,10 +36,6 @@ class ProviderApiWalletConnect extends WalletConnectClientForWallet {
       ({ connector }: IWalletConnectClientEventDestroy) => {
         if (connector) {
           this.removeConnectedAccounts(connector);
-          // passively disconnects the walletConnect, does not perform connector.killsession() in _destroyConnector,so here close session
-          this.backgroundApi.serviceDapp.closeWalletConnectedSession(
-            connector.session,
-          );
         }
       },
     );

packages/kit/src/background/services/ServiceDapp.ts

@@ -22,11 +22,6 @@ import { SendRoutes } from '@onekeyhq/kit/src/views/Send/types';
 import platformEnv from '@onekeyhq/shared/src/platformEnv';
 
 import { ModalRoutes, RootRoutes } from '../../routes/routesEnum';
-import {
-  dappCloseWalletConnectSession,
-  dappSaveWalletConnectSession,
-  dappUpdateWalletConnectSession,
-} from '../../store/reducers/dapp';
 import { backgroundClass, backgroundMethod } from '../decorators';
 import { IDappSourceInfo } from '../IBackgroundApi';
 import {
@@ -89,21 +84,6 @@ class ServiceDapp extends ServiceBase {
     this.backgroundApi.dispatch(dappRemoveSiteConnections(payload));
   }
 
-  @backgroundMethod()
-  updateWalletConnectedSession(session: IWalletConnectSession) {
-    this.backgroundApi.dispatch(dappUpdateWalletConnectSession(session));
-  }
-
-  @backgroundMethod()
-  saveWalletConnectedSession(session: IWalletConnectSession) {
-    this.backgroundApi.dispatch(dappSaveWalletConnectSession(session));
-  }
-
-  @backgroundMethod()
-  closeWalletConnectedSession(session: IWalletConnectSession) {
-    this.backgroundApi.dispatch(dappCloseWalletConnectSession(session));
-  }
-
   @backgroundMethod()
   async cancellConnectedSite(payload: DappSiteConnection): Promise<void> {
     // check walletConnect
@@ -113,20 +93,22 @@ class ServiceDapp extends ServiceBase {
         payload.site.origin
     ) {
       this.backgroundApi.walletConnect.disconnect();
-    } else {
-      this.removeConnectedAccounts({
-        origin: payload.site.origin,
-        networkImpl: payload.networkImpl,
-        addresses: [payload.address],
-      });
     }
+    this.removeConnectedAccounts({
+      origin: payload.site.origin,
+      networkImpl: payload.networkImpl,
+      addresses: [payload.address],
+    });
     await this.backgroundApi.serviceAccount.notifyAccountsChanged();
   }
 
   @backgroundMethod()
-  manuallyAddInpageCannected(request: CommonRequestParams['request']) {
-    if (request.origin) {
-      this.openConnectionModal(request);
+  async updateWalletConnectSession() {
+    if (this.backgroundApi.walletConnect.connector) {
+      const { session } = this.backgroundApi.walletConnect.connector;
+      return Promise.resolve(
+        this.backgroundApi.walletConnect.connector.connected ? session : null,
+      );
     }
   }
 
@@ -154,6 +136,7 @@ class ServiceDapp extends ServiceBase {
     return Boolean(accounts && accounts.length);
   }
 
+  @backgroundMethod()
   openConnectionModal(request: CommonRequestParams['request']) {
     return this.openModal({
       request,

packages/kit/src/components/WalletConnect/OneKeyWalletConnector.ts

@@ -7,12 +7,6 @@ import * as cryptoLib from '@walletconnect/iso-crypto';
 import SocketTransport from '@walletconnect/socket-transport';
 import { toLower } from 'lodash';
 
-import backgroundApiProxy from '../../background/instance/backgroundApiProxy';
-import {
-  closeWalletConnectSession,
-  updateWalletConnectSession,
-} from '../../store/reducers/walletConnectSession';
-
 import {
   WALLET_CONNECT_BRIDGE,
   WALLET_CONNECT_PROTOCOL,
@@ -121,23 +115,6 @@ export class OneKeyWalletConnector extends Connector {
     }
   }
 
-  override approveSession(sessionStatus: ISessionStatus): void {
-    super.approveSession(sessionStatus);
-    backgroundApiProxy.serviceDapp.saveWalletConnectedSession(this.session);
-  }
-
-  override updateSession(sessionStatus: ISessionStatus): void {
-    super.updateSession(sessionStatus);
-    backgroundApiProxy.serviceDapp.updateWalletConnectedSession(this.session);
-  }
-
-  override async killSession(
-    sessionError?: ISessionError | undefined,
-  ): Promise<void> {
-    await super.killSession(sessionError);
-    backgroundApiProxy.serviceDapp.closeWalletConnectedSession(this.session);
-  }
-
   once(event: string, listener: (...args: any[]) => void) {
     let executed = false;
     const listenerOnce = (...args: any[]) => {

packages/kit/src/components/WalletConnect/WalletConnectClientForWallet.ts

@@ -5,6 +5,8 @@ import { IMPL_EVM } from '@onekeyhq/engine/src/constants';
 import debugLogger from '@onekeyhq/shared/src/logger/debugLogger';
 
 import { backgroundMethod } from '../../background/decorators';
+import backgroundApiProxy from '../../background/instance/backgroundApiProxy';
+import { getActiveWalletAccount } from '../../hooks/redux';
 
 import { OneKeyWalletConnector } from './OneKeyWalletConnector';
 import {
@@ -97,6 +99,16 @@ export abstract class WalletConnectClientForWallet extends WalletConnectClientBa
     } catch (error) {
       debugLogger.walletConnect.info('walletConnect.connect reject', error);
       connector.rejectSession(error as any);
+    } finally {
+      //  walletConnect session update to update connecttions
+      const { accountAddress, networkImpl } = getActiveWalletAccount();
+      backgroundApiProxy.serviceDapp.saveConnectedAccounts({
+        site: {
+          origin,
+        },
+        networkImpl,
+        address: accountAddress,
+      });
     }
   }
 }

packages/kit/src/store/reducers/dapp.ts

@@ -1,7 +1,5 @@
 import { PayloadAction, createSlice } from '@reduxjs/toolkit';
 
-import type { IWalletConnectSession } from '@walletconnect/types';
-
 export type DappSiteInfo = {
   origin: string;
   hostname?: string;
@@ -28,12 +26,10 @@ export type DappSiteConnection = DappSiteConnectionSavePayload & {
 
 export type DappInitialState = {
   connections: DappSiteConnection[];
-  walletConnectSessions: IWalletConnectSession[];
 };
 
 const initialState: DappInitialState = {
   connections: [],
-  walletConnectSessions: [],
 };
 
 export const dappSlicer = createSlice({
@@ -83,70 +79,13 @@ export const dappSlicer = createSlice({
       info.lastTime = Date.now();
       state.connections = connections;
     },
-    dappUpdateWalletConnectSession(
-      state,
-      action: PayloadAction<IWalletConnectSession>,
-    ) {
-      const { payload } = action;
-      let sessions = [...state.walletConnectSessions];
-      sessions = sessions.map((session) => {
-        if (session.peerMeta?.url === payload.peerMeta?.url) {
-          Object.assign(session, payload);
-        }
-        return session;
-      });
-      sessions = sessions.filter((session) => session.connected);
-      state.walletConnectSessions = sessions;
-    },
-    dappSaveWalletConnectSession(
-      state,
-      action: PayloadAction<IWalletConnectSession>,
-    ) {
-      const { payload } = action;
-      const sessions = [...state.walletConnectSessions];
-      // save only connected session
-      if (payload.connected) {
-        if (
-          sessions.find(
-            (session) => session.peerMeta?.url === payload.peerMeta?.url,
-          )
-        ) {
-          this.dappUpdateWalletConnectSession(state, action);
-        } else {
-          sessions.push(payload);
-        }
-      }
-      state.walletConnectSessions = sessions;
-    },
-    dappCloseWalletConnectSession(
-      state,
-      action: PayloadAction<IWalletConnectSession>,
-    ) {
-      const { payload } = action;
-      if (!payload) {
-        this.dappClearWalletConnectSession(state);
-      } else {
-        let sessions = [...state.walletConnectSessions];
-        sessions = sessions.filter(
-          (session) => session.peerMeta?.url !== payload.peerMeta?.url,
-        );
-        state.walletConnectSessions = sessions;
-      }
-    },
-    dappClearWalletConnectSession(state) {
-      state.walletConnectSessions = [];
-    },
   },
 });
 
 export const {
   dappSaveSiteConnection,
   dappClearSiteConnection,
   dappRemoveSiteConnections,
-  dappUpdateWalletConnectSession,
-  dappSaveWalletConnectSession,
-  dappCloseWalletConnectSession,
-  dappClearWalletConnectSession,
 } = dappSlicer.actions;
 
 export default dappSlicer.reducer;

packages/kit/src/views/ManageConnectedSites/Component/AddConnectionSite.tsx

@@ -36,9 +36,7 @@ const AddConnectionSiteDialog: FC<AddConnectionSideDialogProps> = ({
             ) {
               origin = `https://${origin}`;
             }
-            backgroundApiProxy.serviceDapp.manuallyAddInpageCannected({
-              origin,
-            });
+            backgroundApiProxy.serviceDapp.openConnectionModal({ origin });
           }
           closeOverlay();
         },

packages/kit/src/views/ManageConnectedSites/Component/ConnectedSitesHeader.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback } from 'react';
+import React, { FC, useCallback, useEffect, useState } from 'react';
 
 import { Image } from 'native-base';
 import { useIntl } from 'react-intl';
@@ -22,11 +22,19 @@ import { ConnectedSitesHeaderProps } from '../types';
 import type { IWalletConnectSession } from '@walletconnect/types';
 
 const ConnectedSitesHeader: FC<ConnectedSitesHeaderProps> = ({
-  walletConnectSessions = [],
+  connections,
   onAddConnectSite,
   onDisConnectWalletConnected,
 }) => {
   const intl = useIntl();
+  const [walletConnectSessions, setSessions] = useState<
+    IWalletConnectSession[]
+  >(() => []);
+  useEffect(() => {
+    backgroundApiProxy.serviceDapp.updateWalletConnectSession().then((s) => {
+      setSessions(() => (s ? [s] : []));
+    });
+  }, [connections]);
 
   const renderItem: ListRenderItem<IWalletConnectSession> = useCallback(
     ({ item, index }) => {

packages/kit/src/views/ManageConnectedSites/ConnectedSites.tsx

@@ -25,8 +25,6 @@ import { showOverlay } from '../../utils/overlayUtils';
 import AddConnectionSiteDialog from './Component/AddConnectionSite';
 import ConnectedSitesHeader from './Component/ConnectedSitesHeader';
 
-import type { IWalletConnectSession } from '@walletconnect/types';
-
 const sortConnectionsSite = (connections: DappSiteConnection[]) => {
   let parseConnections: DappSiteConnection[] = JSON.parse(
     JSON.stringify(connections),
@@ -45,13 +43,13 @@ const sortConnectionsSite = (connections: DappSiteConnection[]) => {
 
 export default function ConnectedSites() {
   const intl = useIntl();
-  const connections: DappSiteConnection[] = sortConnectionsSite(
-    useAppSelector((s) => s.dapp.connections),
-  );
-
-  const walletConnectSessions = useAppSelector(
-    (s) => s.dapp.walletConnectSessions,
+  const connections: DappSiteConnection[] = useAppSelector(
+    (s) => s.dapp.connections,
   );
+  const sortConnections = sortConnectionsSite(connections);
+  // const walletConnectSessions = useAppSelector(
+  //   (s) => s.dapp.walletConnectSessions,
+  // );
 
   const openDeleteDialog = useCallback(
     (dappName: string, disconnect: () => Promise<any>) => {
@@ -176,12 +174,12 @@ export default function ConnectedSites() {
         ListHeaderComponent:
           connections.length > 0 ? (
             <ConnectedSitesHeader
-              walletConnectSessions={walletConnectSessions}
+              connections={connections}
               onDisConnectWalletConnected={openDeleteDialog}
               onAddConnectSite={openAddDialog}
             />
           ) : null,
-        data: connections,
+        data: sortConnections,
         // @ts-ignore
         renderItem,
         ListEmptyComponent: (

packages/kit/src/views/ManageConnectedSites/types.ts

@@ -1,4 +1,4 @@
-import type { IWalletConnectSession } from '@walletconnect/types';
+import { DappSiteConnection } from '../../store/reducers/dapp';
 
 export enum ManageConnectedSitesRoutes {
   ManageConnectedSitesModel = 'ManageConnectedSitesModal',
@@ -14,7 +14,7 @@ export type ConnectedSitesHeaderProps = {
     disconnect: () => Promise<any>,
   ) => void;
   onAddConnectSite: () => void;
-  walletConnectSessions: IWalletConnectSession[];
+  connections: DappSiteConnection[];
 };
 
 export type AddConnectionSideDialogProps = {