Merge pull request #176 from AElfProject/feature/tg-acceleration

feat: support tg login acceleration for phase 2

Author: aelf-lxy

packages/base/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aelf-web-login/wallet-adapter-base",
-  "version": "0.1.19",
+  "version": "0.2.0",
   "type": "module",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -33,8 +33,8 @@
     "@babel/core": "^7.24.7",
     "@babel/preset-env": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
-    "@portkey/did-ui-react": "^2.13.2",
-    "@portkey/types": "^2.13.2",
+    "@portkey/did-ui-react": "^2.14.0-alpha.6",
+    "@portkey/types": "^2.14.0-alpha.6",
     "@types/jest": "^29.5.12",
     "babel-jest": "^29.7.0",
     "jest": "^29.7.0",
@@ -44,7 +44,7 @@
     "typescript": "^5.3.3"
   },
   "peerDependencies": {
-    "@portkey/did-ui-react": "^2.13.2"
+    "@portkey/did-ui-react": "^2.14.0-alpha.6"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org",

packages/base/src/adapter.ts

@@ -6,10 +6,10 @@ import {
   TSignatureParams,
   TWalletInfo,
   TChainId,
-  WalletStateEnum,
   ICallContractParams,
   IMultiTransactionParams,
   IMultiTransactionResult,
+  LoginStatusEnum,
 } from './types';
 
 export { EventEmitter };
@@ -22,6 +22,7 @@ export interface IWalletAdapterEvents {
   lock(): void;
   // readyStateChange(readyState: WalletStateEnum): void;
   error(error: TWalletError): void;
+  loginOnChainStatusChanged(status: LoginStatusEnum): void;
 }
 export interface IWalletAdapter<Name extends string = string> {
   name: WalletName<Name>;

packages/base/src/types.ts

@@ -1,4 +1,4 @@
-import { SendOptions, IContract } from '@portkey/types';
+import { SendOptions, IContract, LoginStatusEnum } from '@portkey/types';
 
 export enum WalletStateEnum {
   // Wallet plug-in detected
@@ -100,3 +100,21 @@ export interface IMultiTransactionParams<T> {
 export interface IMultiTransactionResult {
   string: string[];
 }
+
+export enum OperationTypeEnum {
+  unknown = 0,
+  register = 1,
+  communityRecovery = 2,
+  addGuardian = 3,
+  deleteGuardian = 4,
+  editGuardian = 5,
+  removeOtherManager = 6,
+  setLoginAccount = 7,
+  managerApprove = 8,
+  modifyTransferLimit = 9,
+  transferApprove = 10,
+  unsetLoginAccount = 11,
+  setupBackupMailbox = 13,
+}
+
+export { LoginStatusEnum };

packages/bridge/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aelf-web-login/wallet-adapter-bridge",
-  "version": "0.1.19",
+  "version": "0.2.0",
   "type": "module",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -29,21 +29,22 @@
   },
   "dependencies": {
     "@aelf-web-login/wallet-adapter-base": "workspace:*",
-    "@portkey/services": "^2.13.2",
+    "@portkey/services": "^2.14.0-alpha.6",
     "@reduxjs/toolkit": "^2.2.3",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
   },
   "devDependencies": {
-    "@portkey/did-ui-react": "^2.13.2",
+    "@portkey/types": "^2.14.0-alpha.6",
+    "@portkey/did-ui-react": "^2.14.0-alpha.6",
     "@types/react": "^18.3.1",
     "@types/react-dom": "^18.3.0",
     "antd": "4.24.14",
     "father": "^4.3.8",
     "typescript": "^5.3.3"
   },
   "peerDependencies": {
-    "@portkey/did-ui-react": "^2.13.2"
+    "@portkey/did-ui-react": "^2.14.0-alpha.6"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org",

packages/bridge/src/bridge.ts

@@ -14,6 +14,7 @@ import {
   utils,
   IMultiTransactionParams,
   IMultiTransactionResult,
+  LoginStatusEnum,
 } from '@aelf-web-login/wallet-adapter-base';
 import {
   setWalletInfo,
@@ -24,6 +25,7 @@ import {
   dispatch,
   setLoginError,
   clearLoginError,
+  setLoginOnChainStatus,
 } from './store';
 import { CreatePendingInfo, DIDWalletInfo, TelegramPlatform } from '@portkey/did-ui-react';
 import { IBaseConfig } from '.';
@@ -53,6 +55,7 @@ class Bridge {
       disconnected: this.onDisConnectedHandler,
       lock: this.onLockHandler,
       error: this.onConnectErrorHandler,
+      loginOnChainStatusChanged: this.onLoginOnChainStatusChangedHandler,
     };
     this.bindEvents();
   }
@@ -229,6 +232,7 @@ class Bridge {
     dispatch(clearWalletType());
     dispatch(clearLoginError());
     dispatch(setLocking(false));
+    dispatch(setLoginOnChainStatus(LoginStatusEnum.INIT));
   };
 
   onLockHandler = () => {
@@ -253,6 +257,10 @@ class Bridge {
     dispatch(setLoginError(err));
   };
 
+  onLoginOnChainStatusChangedHandler = (status: LoginStatusEnum) => {
+    dispatch(setLoginOnChainStatus(status));
+  };
+
   bindEvents = () => {
     console.log('bindEvents', this.activeWallet);
     if (!this.activeWallet) {
@@ -375,6 +383,7 @@ class Bridge {
         dispatch(setLocking(false));
         dispatch(clearLoginError());
       }
+
       return walletInfo;
     } catch (error) {
       console.log('onPortkeyAAUnLockFail----------');

packages/bridge/src/store.ts

@@ -1,18 +1,21 @@
 import { createSlice, configureStore, EnhancedStore } from '@reduxjs/toolkit';
 import { TWalletInfo, WalletTypeEnum, TWalletError } from '@aelf-web-login/wallet-adapter-base';
+import { LoginStatusEnum } from '@portkey/types';
 
 type TState = {
   walletInfo: TWalletInfo;
   isLocking: boolean;
   walletType: WalletTypeEnum;
   loginError: TWalletError | null;
+  loginOnChainStatus: LoginStatusEnum;
 };
 
 const initialState: TState = {
   walletInfo: undefined,
   isLocking: false,
   walletType: WalletTypeEnum.unknown,
   loginError: null,
+  loginOnChainStatus: LoginStatusEnum.INIT,
 };
 
 const aelfWebLoginSlice = createSlice({
@@ -40,6 +43,9 @@ const aelfWebLoginSlice = createSlice({
     clearLoginError: (state) => {
       state.loginError = null;
     },
+    setLoginOnChainStatus: (state, action) => {
+      state.loginOnChainStatus = action.payload;
+    },
   },
 });
 
@@ -79,6 +85,7 @@ export const {
   clearWalletType,
   setLoginError,
   clearLoginError,
+  setLoginOnChainStatus,
 } = aelfWebLoginSlice.actions;
 
 export type AppDispatch = typeof store.dispatch;

packages/bridge/src/ui.tsx

@@ -4,6 +4,7 @@ import {
   utils,
   enhancedLocalStorage,
   PORTKEYAA,
+  OperationTypeEnum,
 } from '@aelf-web-login/wallet-adapter-base';
 import { Bridge } from './bridge';
 import {
@@ -15,6 +16,9 @@ import {
   TelegramPlatform,
   CreatePendingInfo,
   setLoading,
+  GuardianApprovalModal,
+  getOperationDetails,
+  ConfigProvider,
 } from '@portkey/did-ui-react';
 import '@portkey/did-ui-react/dist/assets/index.css';
 import { IBaseConfig } from '.';
@@ -230,7 +234,16 @@ const SignInModal: React.FC<ISignInModalProps> = (props: ISignInModalProps) => {
   const [isWrongPassword, setIsWrongPassword] = useState(false);
   const [isShowConfirmLogoutPanel, setIsShowConfirmLogoutPanel] = useState(false);
   const [isShowNestedModal, setIsShowNestedModal] = useState(false);
-  const { handleTelegram, currentLifeCircle } = useTelegram(
+  const {
+    handleTelegram,
+    currentLifeCircle,
+    guardianList,
+    approvalVisible,
+    setApprovalVisible,
+    caHash,
+    originChainId,
+    onTGSignInApprovalSuccess,
+  } = useTelegram(
     baseConfig.enableAcceleration,
     baseConfig.defaultPin,
     baseConfig.chainId,
@@ -282,10 +295,24 @@ const SignInModal: React.FC<ISignInModalProps> = (props: ISignInModalProps) => {
       }
       console.log('begin to excute autoAuthInTelegram');
       if (enhancedLocalStorage.getItem('connectedWallet') === PORTKEYAA) {
+        ConfigProvider.setGlobalConfig({
+          globalLoadingHandler: {
+            onSetLoading: (loadingInfo) => {
+              console.log(loadingInfo, 'loadingInfo===');
+            },
+          },
+        });
         await bridgeInstance.onPortkeyAAUnLock(defaultPin);
         return;
       }
       if (!cancelAutoLoginInTelegram) {
+        ConfigProvider.setGlobalConfig({
+          globalLoadingHandler: {
+            onSetLoading: (loadingInfo) => {
+              console.log(loadingInfo, 'loadingInfo===');
+            },
+          },
+        });
         console.log('begin to excute handleTelegram');
         handleTelegram();
       }
@@ -527,6 +554,23 @@ const SignInModal: React.FC<ISignInModalProps> = (props: ISignInModalProps) => {
         </DynamicWrapper>
       )}
 
+      {guardianList?.length && (
+        <GuardianApprovalModal
+          open={approvalVisible}
+          isAsyncVerify
+          networkType={baseConfig.networkType}
+          caHash={caHash}
+          originChainId={originChainId}
+          targetChainId={baseConfig.chainId}
+          guardianList={guardianList}
+          operationType={OperationTypeEnum.communityRecovery}
+          operationDetails={getOperationDetails(OperationTypeEnum.communityRecovery)}
+          onClose={() => setApprovalVisible(false)}
+          onBack={() => setApprovalVisible(false)}
+          onApprovalSuccess={onTGSignInApprovalSuccess}
+        />
+      )}
+
       <FinalConfirmLogoutDialog
         visible={isShowConfirmLogoutPanel}
         onOk={confirmLogoutHandler}