From 7ffae24ff67a7a9f59f36dd28e855ca2f76f82c5 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Mon, 16 Dec 2024 14:36:16 +0200 Subject: [PATCH 01/17] Add waiting screen for extension --- .../ExtensionProviderStrategy.ts | 126 +++++++++++++++++- .../PendingTransactionsStateManagement.ts | 58 ++++++++ .../pendingTransactions.types.ts | 15 +++ src/lib/sdkDappCoreUi.ts | 1 + 4 files changed, 198 insertions(+), 2 deletions(-) create mode 100644 src/core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement.ts create mode 100644 src/core/providers/helpers/pendingTransactions/pendingTransactions.types.ts diff --git a/src/core/providers-strategy/ExtensionProviderStrategy.ts b/src/core/providers-strategy/ExtensionProviderStrategy.ts index 273438a..3609f56 100644 --- a/src/core/providers-strategy/ExtensionProviderStrategy.ts +++ b/src/core/providers-strategy/ExtensionProviderStrategy.ts @@ -1,11 +1,25 @@ +import { Message, Transaction } from '@multiversx/sdk-core/out'; import { ExtensionProvider } from '@multiversx/sdk-extension-provider/out/extensionProvider'; +import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { IProvider } from 'core/providers/types/providerFactory.types'; +import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; +import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; +import { + IProvider, + ProviderTypeEnum +} from 'core/providers/types/providerFactory.types'; + +import { PendingTransactionsModal } from 'lib/sdkDappCoreUi'; import { ProviderErrorsEnum } from 'types'; +import { createModalElement } from 'utils/createModalElement'; export class ExtensionProviderStrategy { private address: string = ''; private provider: ExtensionProvider | null = null; + private _signTransactions: + | ((transactions: Transaction[]) => Promise) + | null = null; + private _signMessage: ((message: Message) => Promise) | null = null; constructor(address?: string) { this.address = address || ''; @@ -19,16 +33,27 @@ export class ExtensionProviderStrategy { await this.provider.init(); } + // Bind in order to break reference + this._signTransactions = this.provider.signTransactions.bind( + this.provider + ) as any; + this._signMessage = this.provider.signMessage.bind(this.provider); + return this.buildProvider(); }; private buildProvider = () => { + const { address } = getAccount(); + if (!this.provider) { throw new Error(ProviderErrorsEnum.notInitialized); } const provider = this.provider as unknown as IProvider; - provider.setAccount({ address: this.address }); + provider.signTransactions = this.signTransactions; + provider.signMessage = this.signMessage; + + provider.setAccount({ address: this.address || address }); return provider; }; @@ -45,4 +70,101 @@ export class ExtensionProviderStrategy { this.address = address; }; + + private signTransactions = async (transactions: Transaction[]) => { + if (!this.provider || !this._signTransactions) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error('Event bus is not initialized'); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (cancelAction && this.provider) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + + manager.updateData({ + isPending: true, + title: 'Confirm on MultiversX DeFi Wallet', + subtitle: + 'Check your MultiversX Wallet Extension to sign the transaction', + type: ProviderTypeEnum.extension + }); + try { + const signedTransactions: Transaction[] = + await this._signTransactions(transactions); + + return signedTransactions; + } catch (error) { + this.provider.cancelAction(); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } + }; + + private signMessage = async (message: Message) => { + if (!this.provider || !this._signMessage) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error('Event bus is not initialized'); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + + manager.updateData({ + isPending: true, + title: 'Message Signing', + subtitle: 'Check your MultiversX Wallet Extension to sign the message', + type: ProviderTypeEnum.extension + }); + + try { + const signedMessage: Message = await this._signMessage(message); + + return signedMessage; + } catch (error) { + this.provider.cancelAction(); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } + }; } diff --git a/src/core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement.ts b/src/core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement.ts new file mode 100644 index 0000000..24de731 --- /dev/null +++ b/src/core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement.ts @@ -0,0 +1,58 @@ +import { ProviderTypeEnum } from 'core/providers/types/providerFactory.types'; +import { + IPendingTransactionsModalData, + PendingTransactionsEventsEnum +} from './pendingTransactions.types'; + +export interface IEventBus { + publish(event: string, data: any): void; +} + +export class PendingTransactionsStateManager { + private static instance: PendingTransactionsStateManager | null = + null; + private eventBus: T; + + private initialData: IPendingTransactionsModalData = { + isPending: false, + title: '', + subtitle: '', + shouldClose: false, + type: ProviderTypeEnum.none + }; + + private data: IPendingTransactionsModalData = { ...this.initialData }; + + private constructor(eventBus: T) { + this.eventBus = eventBus; + } + + public static getInstance( + eventBus: U + ): PendingTransactionsStateManager { + if (!PendingTransactionsStateManager.instance) { + PendingTransactionsStateManager.instance = + new PendingTransactionsStateManager(eventBus); + } + return PendingTransactionsStateManager.instance as PendingTransactionsStateManager; + } + + public closeAndReset(): void { + this.data.shouldClose = true; + this.notifyDataUpdate(); + this.resetData(); + } + + private resetData(): void { + this.data = { ...this.initialData }; + } + + public updateData(data: IPendingTransactionsModalData): void { + this.data = { ...this.data, ...data }; + this.notifyDataUpdate(); + } + + private notifyDataUpdate(): void { + this.eventBus.publish(PendingTransactionsEventsEnum.DATA_UPDATE, this.data); + } +} diff --git a/src/core/providers/helpers/pendingTransactions/pendingTransactions.types.ts b/src/core/providers/helpers/pendingTransactions/pendingTransactions.types.ts new file mode 100644 index 0000000..607172f --- /dev/null +++ b/src/core/providers/helpers/pendingTransactions/pendingTransactions.types.ts @@ -0,0 +1,15 @@ +import { ProviderTypeEnum } from 'core/providers/types/providerFactory.types'; + +// types here need to be synced with the types in sdk-dapp-core-ui +export enum PendingTransactionsEventsEnum { + 'CLOSE' = 'CLOSE', + 'DATA_UPDATE' = 'DATA_UPDATE' +} + +export interface IPendingTransactionsModalData { + isPending: boolean; + type: ProviderTypeEnum; + title: string; + subtitle?: string; + shouldClose?: boolean; +} diff --git a/src/lib/sdkDappCoreUi.ts b/src/lib/sdkDappCoreUi.ts index 7c86e35..8cc3be8 100644 --- a/src/lib/sdkDappCoreUi.ts +++ b/src/lib/sdkDappCoreUi.ts @@ -2,6 +2,7 @@ import type { CustomElementsDefineOptions } from '@multiversx/sdk-dapp-core-ui/l export type { LedgerConnectModal } from '@multiversx/sdk-dapp-core-ui/dist/components/ledger-connect-modal'; export type { SignTransactionsModal } from '@multiversx/sdk-dapp-core-ui/dist/components/sign-transactions-modal'; export type { WalletConnectModal } from '@multiversx/sdk-dapp-core-ui/dist/components/wallet-connect-modal'; +export type { PendingTransactionsModal } from '@multiversx/sdk-dapp-core-ui/dist/components/pending-transactions-modal'; export async function defineCustomElements( win?: Window, From 45128ba1f20ca3e7799faa7952c8d6a8fda4bfcc Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Mon, 16 Dec 2024 15:08:22 +0200 Subject: [PATCH 02/17] Add waiting screen for crosswindow --- .../CrossWindowProviderStrategy.ts | 100 ++++++++++++++++-- 1 file changed, 93 insertions(+), 7 deletions(-) diff --git a/src/core/providers-strategy/CrossWindowProviderStrategy.ts b/src/core/providers-strategy/CrossWindowProviderStrategy.ts index 6b1b858..a690bd2 100644 --- a/src/core/providers-strategy/CrossWindowProviderStrategy.ts +++ b/src/core/providers-strategy/CrossWindowProviderStrategy.ts @@ -2,12 +2,19 @@ import { Message, Transaction } from '@multiversx/sdk-core/out'; import { isBrowserWithPopupConfirmation } from 'constants/browser.constants'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { IProvider } from 'core/providers/types/providerFactory.types'; +import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; +import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; +import { + IProvider, + ProviderTypeEnum +} from 'core/providers/types/providerFactory.types'; +import { PendingTransactionsModal } from 'lib/sdkDappCoreUi'; import { CrossWindowProvider } from 'lib/sdkWebWalletCrossWindowProvider'; import { crossWindowConfigSelector } from 'store/selectors'; import { networkSelector } from 'store/selectors/networkSelectors'; import { getState } from 'store/store'; import { ProviderErrorsEnum } from 'types'; +import { createModalElement } from 'utils/createModalElement'; type CrossWindowProviderProps = { address?: string; @@ -83,13 +90,49 @@ export class CrossWindowProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - this.setPopupConsent(); + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error('Event bus is not initialized'); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (cancelAction && this.provider) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; - const signedTransactions: Transaction[] = - (await this._signTransactions(transactions)) ?? []; + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); - // Guarded Transactions or Signed Transactions - return this.getTransactions(signedTransactions); + manager.updateData({ + isPending: true, + title: 'Confirm on MultiversX Web Wallet', + subtitle: 'Check your MultiversX Web Wallet to sign the transaction', + type: ProviderTypeEnum.extension + }); + + this.setPopupConsent(); + + try { + const signedTransactions: Transaction[] = + (await this._signTransactions(transactions)) ?? []; + + // Guarded Transactions or Signed Transactions + return this.getTransactions(signedTransactions); + } catch (error) { + this.provider.cancelAction(); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } }; private signMessage = async (message: Message) => { @@ -97,8 +140,51 @@ export class CrossWindowProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error('Event bus is not initialized'); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + + manager.updateData({ + isPending: true, + title: 'Message Signing', + subtitle: 'Check your MultiversX Web Wallet to sign the message', + type: ProviderTypeEnum.crossWindow + }); + this.setPopupConsent(); - return this._signMessage(message); + + try { + const signedMessage: Message = await this._signMessage(message); + + return signedMessage; + } catch (error) { + this.provider.cancelAction(); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } }; private setPopupConsent = () => { From c6195863b491c5b542fa82e7c651645e68e61bd8 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Mon, 16 Dec 2024 17:03:28 +0200 Subject: [PATCH 03/17] Add waiting screen for walletConnect --- .../CrossWindowProviderStrategy.ts | 4 +- .../ExtensionProviderStrategy.ts | 4 +- .../WalletConnectProviderStrategy.ts | 161 +++++++++++++++++- .../walletConnect/walletConnect.types.ts | 3 +- src/types/provider.types.ts | 3 +- 5 files changed, 165 insertions(+), 10 deletions(-) diff --git a/src/core/providers-strategy/CrossWindowProviderStrategy.ts b/src/core/providers-strategy/CrossWindowProviderStrategy.ts index a690bd2..dfc3dfd 100644 --- a/src/core/providers-strategy/CrossWindowProviderStrategy.ts +++ b/src/core/providers-strategy/CrossWindowProviderStrategy.ts @@ -96,7 +96,7 @@ export class CrossWindowProviderStrategy { }); if (!eventBus) { - throw new Error('Event bus is not initialized'); + throw new Error(ProviderErrorsEnum.eventBusError); } const manager = PendingTransactionsStateManager.getInstance(eventBus); @@ -146,7 +146,7 @@ export class CrossWindowProviderStrategy { }); if (!eventBus) { - throw new Error('Event bus is not initialized'); + throw new Error(ProviderErrorsEnum.eventBusError); } const manager = PendingTransactionsStateManager.getInstance(eventBus); diff --git a/src/core/providers-strategy/ExtensionProviderStrategy.ts b/src/core/providers-strategy/ExtensionProviderStrategy.ts index 3609f56..6d2204d 100644 --- a/src/core/providers-strategy/ExtensionProviderStrategy.ts +++ b/src/core/providers-strategy/ExtensionProviderStrategy.ts @@ -82,7 +82,7 @@ export class ExtensionProviderStrategy { }); if (!eventBus) { - throw new Error('Event bus is not initialized'); + throw new Error(ProviderErrorsEnum.eventBusError); } const manager = PendingTransactionsStateManager.getInstance(eventBus); @@ -129,7 +129,7 @@ export class ExtensionProviderStrategy { }); if (!eventBus) { - throw new Error('Event bus is not initialized'); + throw new Error(ProviderErrorsEnum.eventBusError); } const manager = PendingTransactionsStateManager.getInstance(eventBus); diff --git a/src/core/providers-strategy/WalletConnectProviderStrategy.ts b/src/core/providers-strategy/WalletConnectProviderStrategy.ts index 968ae73..15deebe 100644 --- a/src/core/providers-strategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers-strategy/WalletConnectProviderStrategy.ts @@ -1,11 +1,15 @@ +import { Message, Transaction } from '@multiversx/sdk-core/out'; import { IProviderAccount, SessionEventTypes, - SessionTypes + SessionTypes, + OptionalOperation } from '@multiversx/sdk-wallet-connect-provider/out'; import { safeWindow } from 'constants/window.constants'; import { getIsLoggedIn } from 'core/methods/account/getIsLoggedIn'; import { getAccountProvider } from 'core/providers/accountProvider'; +import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; +import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; import { WalletConnectEventsEnum, WalletConnectV2Error, @@ -14,9 +18,14 @@ import { import { WalletConnectStateManager } from 'core/providers/helpers/walletConnect/WalletConnectStateManagement'; import { IEventBus, - IProvider + IProvider, + ProviderTypeEnum } from 'core/providers/types/providerFactory.types'; -import { defineCustomElements, WalletConnectModal } from 'lib/sdkDappCoreUi'; +import { + defineCustomElements, + PendingTransactionsModal, + WalletConnectModal +} from 'lib/sdkDappCoreUi'; import { logoutAction } from 'store/actions'; import { chainIdSelector, @@ -49,6 +58,10 @@ export class WalletConnectProviderStrategy { token?: string; }) => Promise) | null = null; + private _signTransactions: + | ((transactions: Transaction[]) => Promise) + | null = null; + private _signMessage: ((message: Message) => Promise) | null = null; constructor(config?: WalletConnectConfig) { this.config = config; @@ -71,6 +84,13 @@ export class WalletConnectProviderStrategy { // Bind in order to break reference this._login = walletConnectProvider.login.bind(walletConnectProvider); + this._signTransactions = walletConnectProvider.signTransactions.bind( + walletConnectProvider + ); + this._signMessage = walletConnectProvider.signMessage.bind( + walletConnectProvider + ); + this.provider = walletConnectProvider; this.methods = dappMethods; } @@ -85,7 +105,7 @@ export class WalletConnectProviderStrategy { this.unsubscribeEvents = () => { if (!eventBus) { - throw new Error('Event bus is not initialized'); + throw new Error(ProviderErrorsEnum.eventBusError); } eventBus.unsubscribe(WalletConnectEventsEnum.CLOSE, onClose); @@ -112,6 +132,8 @@ export class WalletConnectProviderStrategy { const provider = this.provider as unknown as IProvider; provider.login = this.login; + provider.signTransactions = this.signTransactions; + provider.signMessage = this.signMessage; return provider; }; @@ -276,4 +298,135 @@ export class WalletConnectProviderStrategy { return await reconnect(); } }; + + private signTransactions = async (transactions: Transaction[]) => { + if (!this.provider || !this._signTransactions) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (cancelAction && this.provider) { + this.sendWcRequest({ + method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, + action: OptionalOperation.CANCEL_ACTION + }); + } + + manager.closeAndReset(); + }; + + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + + manager.updateData({ + isPending: true, + title: 'Confirm on the xPortal App', + subtitle: 'Check your phone to sign the transaction', + type: ProviderTypeEnum.walletConnect + }); + try { + const signedTransactions: Transaction[] = + await this._signTransactions(transactions); + + return signedTransactions; + } catch (error) { + this.sendWcRequest({ + method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, + action: OptionalOperation.CANCEL_ACTION + }); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } + }; + + private signMessage = async (message: Message) => { + if (!this.provider || !this._signMessage) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = async (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + await this.sendWcRequest({ + method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, + action: OptionalOperation.CANCEL_ACTION + }); + } + + manager.closeAndReset(); + }; + + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + + manager.updateData({ + isPending: true, + title: 'Message Signing', + subtitle: 'Check your MultiversX xPortal App to sign the message', + type: ProviderTypeEnum.walletConnect + }); + + try { + const signedMessage: Message = await this._signMessage(message); + + return signedMessage; + } catch (error) { + this.sendWcRequest({ + method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, + action: OptionalOperation.CANCEL_ACTION + }); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } + }; + + private sendWcRequest = async ({ + action, + method + }: { + action: OptionalOperation; + method: WalletConnectOptionalMethodsEnum; + }) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + try { + await this.provider.sendCustomRequest?.({ + request: { + method, + params: { action } + } + }); + } catch (error) { + console.error(WalletConnectV2Error.actionError, error); + } + }; } diff --git a/src/core/providers/helpers/walletConnect/walletConnect.types.ts b/src/core/providers/helpers/walletConnect/walletConnect.types.ts index e9c37a6..b2222fe 100644 --- a/src/core/providers/helpers/walletConnect/walletConnect.types.ts +++ b/src/core/providers/helpers/walletConnect/walletConnect.types.ts @@ -9,7 +9,8 @@ export enum WalletConnectV2Error { userRejected = 'User rejected connection proposal', userRejectedExisting = 'User rejected existing connection proposal', errorLogout = 'Unable to remove existing pairing', - invalidChainID = 'Invalid chainID' + invalidChainID = 'Invalid chainID', + actionError = 'Unable to send event' } // types here need to be synced with the types in sdk-dapp-core-ui diff --git a/src/types/provider.types.ts b/src/types/provider.types.ts index 79c7ee7..5e69921 100644 --- a/src/types/provider.types.ts +++ b/src/types/provider.types.ts @@ -1,4 +1,5 @@ export enum ProviderErrorsEnum { notInitialized = 'Provider is not initialized.', - invalidType = 'Invalid type.' + invalidType = 'Invalid type.', + eventBusError = 'eventBus is not initialized' } From 3b406ae26a647b5221e4159c7768a1182857d565 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Mon, 16 Dec 2024 17:59:40 +0200 Subject: [PATCH 04/17] Add waiting screen for IFrame --- .../IFrameProviderStrategy.ts | 115 +++++++++++++++++- 1 file changed, 113 insertions(+), 2 deletions(-) diff --git a/src/core/providers-strategy/IFrameProviderStrategy.ts b/src/core/providers-strategy/IFrameProviderStrategy.ts index dd7fbfd..0a5f095 100644 --- a/src/core/providers-strategy/IFrameProviderStrategy.ts +++ b/src/core/providers-strategy/IFrameProviderStrategy.ts @@ -1,11 +1,19 @@ +import { Message, Transaction } from '@multiversx/sdk-core/out'; import { IframeProvider } from '@multiversx/sdk-web-wallet-iframe-provider/out'; import { IframeLoginTypes } from '@multiversx/sdk-web-wallet-iframe-provider/out/constants'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { IProvider } from 'core/providers/types/providerFactory.types'; +import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; +import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; +import { + IProvider, + ProviderTypeEnum +} from 'core/providers/types/providerFactory.types'; +import { PendingTransactionsModal } from 'lib/sdkDappCoreUi'; import { networkSelector } from 'store/selectors/networkSelectors'; import { getState } from 'store/store'; import { ProviderErrorsEnum } from 'types'; +import { createModalElement } from 'utils/createModalElement'; type IFrameProviderType = { type: IframeLoginTypes; @@ -15,6 +23,10 @@ export class IFrameProviderStrategy { private provider: IframeProvider | null = null; private address?: string; private type: IframeLoginTypes | null = null; + private _signTransactions: + | ((transactions: Transaction[]) => Promise) + | null = null; + private _signMessage: ((message: Message) => Promise) | null = null; constructor({ type, address }: IFrameProviderType) { this.type = type; @@ -36,6 +48,8 @@ export class IFrameProviderStrategy { this.provider.setLoginType(this.type); this.provider.setWalletUrl(String(network.iframeWalletAddress)); + this._signTransactions = this.provider.signTransactions.bind(this.provider); + this._signMessage = this.provider.signMessage.bind(this.provider); return this.buildProvider(); }; @@ -50,7 +64,8 @@ export class IFrameProviderStrategy { const provider = this.provider as unknown as IProvider; provider.setAccount({ address: this.address || address }); - + provider.signTransactions = this.signTransactions; + provider.signMessage = this.signMessage; return provider; }; @@ -67,4 +82,100 @@ export class IFrameProviderStrategy { this.address = address; }; + + private signTransactions = async (transactions: Transaction[]) => { + if (!this.provider || !this._signTransactions) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (cancelAction && this.provider) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + + manager.updateData({ + isPending: true, + title: `Confirm on MultiversX ${this.type}`, + subtitle: `Check your MultiversX ${this.type} to sign the transaction`, + type: this.type as unknown as ProviderTypeEnum + }); + try { + const signedTransactions: Transaction[] = + await this._signTransactions(transactions); + + return signedTransactions; + } catch (error) { + this.provider.cancelAction(); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } + }; + + private signMessage = async (message: Message) => { + if (!this.provider || !this._signMessage || !this.type) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + const { eventBus } = await createModalElement({ + name: 'pending-transactions-modal', + withEventBus: true + }); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + + eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + + manager.updateData({ + isPending: true, + title: 'Message Signing', + subtitle: `Check your MultiversX ${this.type} to sign the message`, + type: this.type as unknown as ProviderTypeEnum + }); + + try { + const signedMessage: Message = await this._signMessage(message); + + return signedMessage; + } catch (error) { + this.provider.cancelAction(); + throw error; + } finally { + onClose(false); + eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); + } + }; } From f60679c1a26908b25b92c0e8659a8c107de58728 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Tue, 17 Dec 2024 11:56:06 +0200 Subject: [PATCH 05/17] Update imports --- .../PendingTransactionsStateManagement.ts | 4 ++-- src/core/managers/PendingTransactionsStateManager/index.ts | 2 ++ .../managers/PendingTransactionsStateManager/types/index.ts | 1 + .../types}/pendingTransactions.types.ts | 0 src/core/managers/index.ts | 1 + .../CrossWindowProviderStrategy.ts | 6 ++++-- .../strategies/CrossWindowProviderStrategy/index.ts | 1 + .../ExtensionProviderStrategy/ExtensionProviderStrategy.ts | 6 ++++-- .../IFrameProviderStrategy/IFrameProviderStrategy.ts | 6 ++++-- .../providers/strategies/IFrameProviderStrategy/index.ts | 1 + .../providers/strategies/LedgerProviderStrategy/index.ts | 1 + .../WalletConnectProviderStrategy.ts | 6 ++++-- .../strategies/WalletConnectProviderStrategy/index.ts | 1 + 13 files changed, 26 insertions(+), 10 deletions(-) rename src/core/{providers/helpers/pendingTransactions => managers/PendingTransactionsStateManager}/PendingTransactionsStateManagement.ts (95%) create mode 100644 src/core/managers/PendingTransactionsStateManager/index.ts create mode 100644 src/core/managers/PendingTransactionsStateManager/types/index.ts rename src/core/{providers/helpers/pendingTransactions => managers/PendingTransactionsStateManager/types}/pendingTransactions.types.ts (100%) diff --git a/src/core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement.ts b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts similarity index 95% rename from src/core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement.ts rename to src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts index 24de731..64b6a8d 100644 --- a/src/core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement.ts +++ b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts @@ -2,9 +2,9 @@ import { ProviderTypeEnum } from 'core/providers/types/providerFactory.types'; import { IPendingTransactionsModalData, PendingTransactionsEventsEnum -} from './pendingTransactions.types'; +} from './types'; -export interface IEventBus { +interface IEventBus { publish(event: string, data: any): void; } diff --git a/src/core/managers/PendingTransactionsStateManager/index.ts b/src/core/managers/PendingTransactionsStateManager/index.ts new file mode 100644 index 0000000..d941f9d --- /dev/null +++ b/src/core/managers/PendingTransactionsStateManager/index.ts @@ -0,0 +1,2 @@ +export * from './PendingTransactionsStateManagement'; +export * from './types'; diff --git a/src/core/managers/PendingTransactionsStateManager/types/index.ts b/src/core/managers/PendingTransactionsStateManager/types/index.ts new file mode 100644 index 0000000..4f9a4f3 --- /dev/null +++ b/src/core/managers/PendingTransactionsStateManager/types/index.ts @@ -0,0 +1 @@ +export * from './pendingTransactions.types'; diff --git a/src/core/providers/helpers/pendingTransactions/pendingTransactions.types.ts b/src/core/managers/PendingTransactionsStateManager/types/pendingTransactions.types.ts similarity index 100% rename from src/core/providers/helpers/pendingTransactions/pendingTransactions.types.ts rename to src/core/managers/PendingTransactionsStateManager/types/pendingTransactions.types.ts diff --git a/src/core/managers/index.ts b/src/core/managers/index.ts index b561b76..952f086 100644 --- a/src/core/managers/index.ts +++ b/src/core/managers/index.ts @@ -2,3 +2,4 @@ export * from './LedgerConnectStateManager'; export * from './SignTransactionsStateManager'; export * from './TransactionManager'; export * from './WalletConnectStateManager'; +export * from './PendingTransactionsStateManager'; diff --git a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts index dfc3dfd..51ebab0 100644 --- a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts +++ b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts @@ -1,9 +1,11 @@ import { Message, Transaction } from '@multiversx/sdk-core/out'; import { isBrowserWithPopupConfirmation } from 'constants/browser.constants'; +import { + PendingTransactionsStateManager, + PendingTransactionsEventsEnum +} from 'core/managers'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; -import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; import { IProvider, ProviderTypeEnum diff --git a/src/core/providers/strategies/CrossWindowProviderStrategy/index.ts b/src/core/providers/strategies/CrossWindowProviderStrategy/index.ts index abcd7d7..bdf237e 100644 --- a/src/core/providers/strategies/CrossWindowProviderStrategy/index.ts +++ b/src/core/providers/strategies/CrossWindowProviderStrategy/index.ts @@ -1 +1,2 @@ export * from './CrossWindowProviderStrategy'; +export * from './types'; diff --git a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts index 6d2204d..e1cbc8a 100644 --- a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts +++ b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts @@ -1,9 +1,11 @@ import { Message, Transaction } from '@multiversx/sdk-core/out'; import { ExtensionProvider } from '@multiversx/sdk-extension-provider/out/extensionProvider'; +import { + PendingTransactionsStateManager, + PendingTransactionsEventsEnum +} from 'core/managers'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; -import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; import { IProvider, ProviderTypeEnum diff --git a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts index 4be3712..d4eadf6 100644 --- a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts +++ b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts @@ -1,10 +1,12 @@ import { Message, Transaction } from '@multiversx/sdk-core/out'; import { IframeProvider } from '@multiversx/sdk-web-wallet-iframe-provider/out'; import { IframeLoginTypes } from '@multiversx/sdk-web-wallet-iframe-provider/out/constants'; +import { + PendingTransactionsStateManager, + PendingTransactionsEventsEnum +} from 'core/managers'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; -import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; import { IProvider, ProviderTypeEnum diff --git a/src/core/providers/strategies/IFrameProviderStrategy/index.ts b/src/core/providers/strategies/IFrameProviderStrategy/index.ts index 8d565bb..e805579 100644 --- a/src/core/providers/strategies/IFrameProviderStrategy/index.ts +++ b/src/core/providers/strategies/IFrameProviderStrategy/index.ts @@ -1 +1,2 @@ export * from './IFrameProviderStrategy'; +export * from './types'; diff --git a/src/core/providers/strategies/LedgerProviderStrategy/index.ts b/src/core/providers/strategies/LedgerProviderStrategy/index.ts index e385951..5840241 100644 --- a/src/core/providers/strategies/LedgerProviderStrategy/index.ts +++ b/src/core/providers/strategies/LedgerProviderStrategy/index.ts @@ -1 +1,2 @@ export * from './LedgerProviderStrategy'; +export * from './types'; diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts index b2b60a4..9c48e5c 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts @@ -6,6 +6,10 @@ import { OptionalOperation } from '@multiversx/sdk-wallet-connect-provider/out'; import { safeWindow } from 'constants/window.constants'; +import { + PendingTransactionsStateManager, + PendingTransactionsEventsEnum +} from 'core/managers'; import { WalletConnectStateManager } from 'core/managers/WalletConnectStateManager/WalletConnectStateManager'; import { getIsLoggedIn } from 'core/methods/account/getIsLoggedIn'; import { getAccountProvider } from 'core/providers/helpers/accountProvider'; @@ -37,8 +41,6 @@ import { WalletConnectV2Error, WalletConnectConfig } from './types'; -import { PendingTransactionsEventsEnum } from 'core/providers/helpers/pendingTransactions/pendingTransactions.types'; -import { PendingTransactionsStateManager } from 'core/providers/helpers/pendingTransactions/PendingTransactionsStateManagement'; const dappMethods: string[] = [ WalletConnectOptionalMethodsEnum.CANCEL_ACTION, diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/index.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/index.ts index 8cd6870..ea53f38 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/index.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/index.ts @@ -1 +1,2 @@ export * from './WalletConnectProviderStrategy'; +export * from './types'; From 0fb06ecc6fae1ee06300aaabfc8ddb3a2382dcfe Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Wed, 18 Dec 2024 16:23:55 +0200 Subject: [PATCH 06/17] Update crossWindow to 2.0.4 --- package.json | 8 ++--- .../PendingTransactionsStateManagement.ts | 4 +-- yarn.lock | 35 ++++++++++++++----- 3 files changed, 33 insertions(+), 14 deletions(-) diff --git a/package.json b/package.json index 1f970d7..aeea8cb 100644 --- a/package.json +++ b/package.json @@ -35,7 +35,7 @@ "@lifeomic/axios-fetch": "3.0.1", "@multiversx/sdk-extension-provider": "4.0.0", "@multiversx/sdk-hw-provider": "7.0.0", - "@multiversx/sdk-metamask-provider": "0.0.7", + "@multiversx/sdk-metamask-provider": "1.0.0", "@multiversx/sdk-native-auth-client": "^1.0.8", "@multiversx/sdk-opera-provider": "1.0.0-alpha.1", "@multiversx/sdk-wallet": "4.5.1", @@ -51,13 +51,13 @@ "peerDependencies": { "@multiversx/sdk-core": ">= 13.5.0", "@multiversx/sdk-dapp-utils": ">= 1.0.0", - "@multiversx/sdk-web-wallet-cross-window-provider": ">= 2.0.1", + "@multiversx/sdk-web-wallet-cross-window-provider": ">= 2.0.4", "axios": ">=1.6.5", "bignumber.js": "9.x", "immer": "10.x" }, "optionalDependencies": { - "@multiversx/sdk-dapp-core-ui": "0.0.0" + "@multiversx/sdk-dapp-core-ui": "file:../mx-sdk-dapp-core-ui" }, "resolutions": { "string-width": "4.1.0" @@ -66,7 +66,7 @@ "@eslint/js": "9.15.0", "@multiversx/sdk-core": ">= 13.5.0", "@multiversx/sdk-dapp-utils": "1.0.0", - "@multiversx/sdk-web-wallet-cross-window-provider": ">= 2.0.1", + "@multiversx/sdk-web-wallet-cross-window-provider": ">= 2.0.4", "@swc/core": "^1.4.17", "@swc/jest": "^0.2.36", "@types/jest": "29.5.13", diff --git a/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts index 64b6a8d..3658d47 100644 --- a/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts +++ b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts @@ -47,8 +47,8 @@ export class PendingTransactionsStateManager { this.data = { ...this.initialData }; } - public updateData(data: IPendingTransactionsModalData): void { - this.data = { ...this.data, ...data }; + public updateData(newData: IPendingTransactionsModalData): void { + this.data = { ...this.data, ...newData }; this.notifyDataUpdate(); } diff --git a/yarn.lock b/yarn.lock index a81f001..8066a7b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1031,12 +1031,13 @@ buffer "6.0.3" platform "1.3.6" -"@multiversx/sdk-metamask-provider@0.0.7": - version "0.0.7" - resolved "https://registry.yarnpkg.com/@multiversx/sdk-metamask-provider/-/sdk-metamask-provider-0.0.7.tgz#d53e15493a94d44490c47ea8e9a3eafa9b63591b" - integrity sha512-eqA1z/QIflauv5lqetKw2J5E7UooSTcHbZsxwkquWFnO6j1hj35/odS4P8AcbCOVssenZ+THkLOR7kxx5l7e5g== +"@multiversx/sdk-metamask-provider@1.0.0": + version "1.0.0" + resolved "https://registry.yarnpkg.com/@multiversx/sdk-metamask-provider/-/sdk-metamask-provider-1.0.0.tgz#ba3f373d498688209c4dff81732e3c5cc2d219fa" + integrity sha512-5AsaeAQlhgH/nH0fxGlUOzKcjxAlsqZ8JTwKev3mZWKrbugOOukp8rM3a3oUCRO4yTDI8z3VAYb8ELvnNfYM3Q== dependencies: "@metamask/providers" "16.0.0" + protobufjs "7.4.0" "@multiversx/sdk-native-auth-client@^1.0.8": version "1.0.9" @@ -1084,10 +1085,10 @@ tweetnacl "1.0.3" uuid "8.3.2" -"@multiversx/sdk-web-wallet-cross-window-provider@>= 2.0.1": - version "2.0.2" - resolved "https://registry.yarnpkg.com/@multiversx/sdk-web-wallet-cross-window-provider/-/sdk-web-wallet-cross-window-provider-2.0.2.tgz#ec9176c44b561d906d6613486bfc6e089ee8f3a1" - integrity sha512-HULqqmS09OX3cymIuC+DzCzsSdkqwAa9ZXZK7xQDwPiWiUOulrA1Tj8BeqmdxfqyOfeeBWW9oNpueCEqm4jigg== +"@multiversx/sdk-web-wallet-cross-window-provider@>= 2.0.4": + version "2.0.4" + resolved "https://registry.yarnpkg.com/@multiversx/sdk-web-wallet-cross-window-provider/-/sdk-web-wallet-cross-window-provider-2.0.4.tgz#bb605e42bd68f1806c16a9152cc2f2be4e2b304b" + integrity sha512-Oh5OvNsfGUYFc6fCl7pxaX+yqnRvn0d5rVhwEHVHhNMZVv0Q3cLaZak/wLftJNaQfAPVOw0gbD573fHCUa5bUw== dependencies: qs "6.11.2" @@ -6071,6 +6072,24 @@ protobufjs@7.3.0: "@types/node" ">=13.7.0" long "^5.0.0" +protobufjs@7.4.0: + version "7.4.0" + resolved "https://registry.yarnpkg.com/protobufjs/-/protobufjs-7.4.0.tgz#7efe324ce9b3b61c82aae5de810d287bc08a248a" + integrity sha512-mRUWCc3KUU4w1jU8sGxICXH/gNS94DvI1gxqDvBzhj1JpcsimQkYiOJfwsPUykUI5ZaspFbSgmBLER8IrQ3tqw== + dependencies: + "@protobufjs/aspromise" "^1.1.2" + "@protobufjs/base64" "^1.1.2" + "@protobufjs/codegen" "^2.0.4" + "@protobufjs/eventemitter" "^1.1.0" + "@protobufjs/fetch" "^1.1.0" + "@protobufjs/float" "^1.0.2" + "@protobufjs/inquire" "^1.1.0" + "@protobufjs/path" "^1.1.2" + "@protobufjs/pool" "^1.1.0" + "@protobufjs/utf8" "^1.1.0" + "@types/node" ">=13.7.0" + long "^5.0.0" + proxy-from-env@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz#e102f16ca355424865755d2c9e8ea4f24d58c3e2" From e794c3c9a971705fa6af1ab69c0ee83b58bd1c1f Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Wed, 18 Dec 2024 16:25:07 +0200 Subject: [PATCH 07/17] Rename to sendCustomRequest --- .../WalletConnectProviderStrategy.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts index 9c48e5c..6983620 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts @@ -319,7 +319,7 @@ export class WalletConnectProviderStrategy { const onClose = (cancelAction = true) => { if (cancelAction && this.provider) { - this.sendWcRequest({ + this.sendCustomRequest({ method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, action: OptionalOperation.CANCEL_ACTION }); @@ -342,7 +342,7 @@ export class WalletConnectProviderStrategy { return signedTransactions; } catch (error) { - this.sendWcRequest({ + this.sendCustomRequest({ method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, action: OptionalOperation.CANCEL_ACTION }); @@ -375,7 +375,7 @@ export class WalletConnectProviderStrategy { } if (cancelAction) { - await this.sendWcRequest({ + await this.sendCustomRequest({ method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, action: OptionalOperation.CANCEL_ACTION }); @@ -398,7 +398,7 @@ export class WalletConnectProviderStrategy { return signedMessage; } catch (error) { - this.sendWcRequest({ + this.sendCustomRequest({ method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, action: OptionalOperation.CANCEL_ACTION }); @@ -409,7 +409,7 @@ export class WalletConnectProviderStrategy { } }; - private sendWcRequest = async ({ + private sendCustomRequest = async ({ action, method }: { From 45ef883d0d7d212d98330dbb624b4e9c4d189672 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Wed, 18 Dec 2024 16:27:14 +0200 Subject: [PATCH 08/17] Revert sdk-dapp-core-ui version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index aeea8cb..a4035a7 100644 --- a/package.json +++ b/package.json @@ -57,7 +57,7 @@ "immer": "10.x" }, "optionalDependencies": { - "@multiversx/sdk-dapp-core-ui": "file:../mx-sdk-dapp-core-ui" + "@multiversx/sdk-dapp-core-ui": "0.0.0" }, "resolutions": { "string-width": "4.1.0" From a4cdbb4f922ab951d52e1785958973cd99a52875 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Wed, 18 Dec 2024 16:28:31 +0200 Subject: [PATCH 09/17] Remove any type --- .../ExtensionProviderStrategy/ExtensionProviderStrategy.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts index e1cbc8a..23950af 100644 --- a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts +++ b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts @@ -36,9 +36,7 @@ export class ExtensionProviderStrategy { } // Bind in order to break reference - this._signTransactions = this.provider.signTransactions.bind( - this.provider - ) as any; + this._signTransactions = this.provider.signTransactions.bind(this.provider); this._signMessage = this.provider.signMessage.bind(this.provider); return this.buildProvider(); From f536b042bebbd87f2f92c34d31de2c690d53a853 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Wed, 18 Dec 2024 16:29:58 +0200 Subject: [PATCH 10/17] Update changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1b7f4ee..6a0a025 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] +- [Added pending transactions](https://github.com/multiversx/mx-sdk-dapp-core/pull/48) - [Added transaction manager](https://github.com/multiversx/mx-sdk-dapp-core/pull/41) - [Added custom web socket url support](https://github.com/multiversx/mx-sdk-dapp-core/pull/35) - [Metamask integration](https://github.com/multiversx/mx-sdk-dapp-core/pull/27) From ccf3dd2dbae961acb16ea72c6d2d18563faacc9c Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Thu, 19 Dec 2024 09:40:25 +0200 Subject: [PATCH 11/17] Remove type from pendingTx --- .../PendingTransactionsStateManagement.ts | 4 +--- .../types/pendingTransactions.types.ts | 3 --- .../CrossWindowProviderStrategy.ts | 11 +++-------- .../ExtensionProviderStrategy.ts | 13 +++---------- .../IFrameProviderStrategy.ts | 11 +++-------- .../WalletConnectProviderStrategy.ts | 9 +++------ 6 files changed, 13 insertions(+), 38 deletions(-) diff --git a/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts index 3658d47..3d24845 100644 --- a/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts +++ b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts @@ -1,4 +1,3 @@ -import { ProviderTypeEnum } from 'core/providers/types/providerFactory.types'; import { IPendingTransactionsModalData, PendingTransactionsEventsEnum @@ -17,8 +16,7 @@ export class PendingTransactionsStateManager { isPending: false, title: '', subtitle: '', - shouldClose: false, - type: ProviderTypeEnum.none + shouldClose: false }; private data: IPendingTransactionsModalData = { ...this.initialData }; diff --git a/src/core/managers/PendingTransactionsStateManager/types/pendingTransactions.types.ts b/src/core/managers/PendingTransactionsStateManager/types/pendingTransactions.types.ts index 607172f..8133161 100644 --- a/src/core/managers/PendingTransactionsStateManager/types/pendingTransactions.types.ts +++ b/src/core/managers/PendingTransactionsStateManager/types/pendingTransactions.types.ts @@ -1,5 +1,3 @@ -import { ProviderTypeEnum } from 'core/providers/types/providerFactory.types'; - // types here need to be synced with the types in sdk-dapp-core-ui export enum PendingTransactionsEventsEnum { 'CLOSE' = 'CLOSE', @@ -8,7 +6,6 @@ export enum PendingTransactionsEventsEnum { export interface IPendingTransactionsModalData { isPending: boolean; - type: ProviderTypeEnum; title: string; subtitle?: string; shouldClose?: boolean; diff --git a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts index 51ebab0..be24fdc 100644 --- a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts +++ b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts @@ -6,10 +6,7 @@ import { } from 'core/managers'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { - IProvider, - ProviderTypeEnum -} from 'core/providers/types/providerFactory.types'; +import { IProvider } from 'core/providers/types/providerFactory.types'; import { PendingTransactionsModal } from 'lib/sdkDappCoreUi'; import { CrossWindowProvider } from 'lib/sdkWebWalletCrossWindowProvider'; import { crossWindowConfigSelector } from 'store/selectors'; @@ -116,8 +113,7 @@ export class CrossWindowProviderStrategy { manager.updateData({ isPending: true, title: 'Confirm on MultiversX Web Wallet', - subtitle: 'Check your MultiversX Web Wallet to sign the transaction', - type: ProviderTypeEnum.extension + subtitle: 'Check your MultiversX Web Wallet to sign the transaction' }); this.setPopupConsent(); @@ -170,8 +166,7 @@ export class CrossWindowProviderStrategy { manager.updateData({ isPending: true, title: 'Message Signing', - subtitle: 'Check your MultiversX Web Wallet to sign the message', - type: ProviderTypeEnum.crossWindow + subtitle: 'Check your MultiversX Web Wallet to sign the message' }); this.setPopupConsent(); diff --git a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts index 23950af..ae2a5a0 100644 --- a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts +++ b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts @@ -6,10 +6,7 @@ import { } from 'core/managers'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { - IProvider, - ProviderTypeEnum -} from 'core/providers/types/providerFactory.types'; +import { IProvider } from 'core/providers/types/providerFactory.types'; import { PendingTransactionsModal } from 'lib/sdkDappCoreUi'; import { ProviderErrorsEnum } from 'types'; @@ -35,7 +32,6 @@ export class ExtensionProviderStrategy { await this.provider.init(); } - // Bind in order to break reference this._signTransactions = this.provider.signTransactions.bind(this.provider); this._signMessage = this.provider.signMessage.bind(this.provider); @@ -100,9 +96,7 @@ export class ExtensionProviderStrategy { manager.updateData({ isPending: true, title: 'Confirm on MultiversX DeFi Wallet', - subtitle: - 'Check your MultiversX Wallet Extension to sign the transaction', - type: ProviderTypeEnum.extension + subtitle: 'Check your MultiversX Wallet Extension to sign the transaction' }); try { const signedTransactions: Transaction[] = @@ -151,8 +145,7 @@ export class ExtensionProviderStrategy { manager.updateData({ isPending: true, title: 'Message Signing', - subtitle: 'Check your MultiversX Wallet Extension to sign the message', - type: ProviderTypeEnum.extension + subtitle: 'Check your MultiversX Wallet Extension to sign the message' }); try { diff --git a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts index d4eadf6..b812462 100644 --- a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts +++ b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts @@ -7,10 +7,7 @@ import { } from 'core/managers'; import { getAccount } from 'core/methods/account/getAccount'; import { getAddress } from 'core/methods/account/getAddress'; -import { - IProvider, - ProviderTypeEnum -} from 'core/providers/types/providerFactory.types'; +import { IProvider } from 'core/providers/types/providerFactory.types'; import { PendingTransactionsModal } from 'lib/sdkDappCoreUi'; import { networkSelector } from 'store/selectors/networkSelectors'; import { getState } from 'store/store'; @@ -111,8 +108,7 @@ export class IFrameProviderStrategy { manager.updateData({ isPending: true, title: `Confirm on MultiversX ${this.type}`, - subtitle: `Check your MultiversX ${this.type} to sign the transaction`, - type: this.type as unknown as ProviderTypeEnum + subtitle: `Check your MultiversX ${this.type} to sign the transaction` }); try { const signedTransactions: Transaction[] = @@ -161,8 +157,7 @@ export class IFrameProviderStrategy { manager.updateData({ isPending: true, title: 'Message Signing', - subtitle: `Check your MultiversX ${this.type} to sign the message`, - type: this.type as unknown as ProviderTypeEnum + subtitle: `Check your MultiversX ${this.type} to sign the message` }); try { diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts index 6983620..dbb1588 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts @@ -15,8 +15,7 @@ import { getIsLoggedIn } from 'core/methods/account/getIsLoggedIn'; import { getAccountProvider } from 'core/providers/helpers/accountProvider'; import { IEventBus, - IProvider, - ProviderTypeEnum + IProvider } from 'core/providers/types/providerFactory.types'; import { defineCustomElements, @@ -333,8 +332,7 @@ export class WalletConnectProviderStrategy { manager.updateData({ isPending: true, title: 'Confirm on the xPortal App', - subtitle: 'Check your phone to sign the transaction', - type: ProviderTypeEnum.walletConnect + subtitle: 'Check your phone to sign the transaction' }); try { const signedTransactions: Transaction[] = @@ -389,8 +387,7 @@ export class WalletConnectProviderStrategy { manager.updateData({ isPending: true, title: 'Message Signing', - subtitle: 'Check your MultiversX xPortal App to sign the message', - type: ProviderTypeEnum.walletConnect + subtitle: 'Check your MultiversX xPortal App to sign the message' }); try { From a5a44e16980cbc42c7cda5b62e7cc92a274dc185 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Thu, 19 Dec 2024 09:53:17 +0200 Subject: [PATCH 12/17] Update EventBus type --- .../PendingTransactionsStateManagement.ts | 17 +++++++++-------- .../WalletConnectStateManager.ts | 18 ++++++++++-------- src/types/manager.types.ts | 3 +++ 3 files changed, 22 insertions(+), 16 deletions(-) create mode 100644 src/types/manager.types.ts diff --git a/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts index 3d24845..c6abb54 100644 --- a/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts +++ b/src/core/managers/PendingTransactionsStateManager/PendingTransactionsStateManagement.ts @@ -1,15 +1,16 @@ +import { IEventBus } from 'types/manager.types'; import { IPendingTransactionsModalData, PendingTransactionsEventsEnum } from './types'; -interface IEventBus { - publish(event: string, data: any): void; -} - -export class PendingTransactionsStateManager { - private static instance: PendingTransactionsStateManager | null = - null; +export class PendingTransactionsStateManager< + T extends + IEventBus = IEventBus +> { + private static instance: PendingTransactionsStateManager< + IEventBus + > | null = null; private eventBus: T; private initialData: IPendingTransactionsModalData = { @@ -25,7 +26,7 @@ export class PendingTransactionsStateManager { this.eventBus = eventBus; } - public static getInstance( + public static getInstance>( eventBus: U ): PendingTransactionsStateManager { if (!PendingTransactionsStateManager.instance) { diff --git a/src/core/managers/WalletConnectStateManager/WalletConnectStateManager.ts b/src/core/managers/WalletConnectStateManager/WalletConnectStateManager.ts index 6468f6e..a33d9cf 100644 --- a/src/core/managers/WalletConnectStateManager/WalletConnectStateManager.ts +++ b/src/core/managers/WalletConnectStateManager/WalletConnectStateManager.ts @@ -2,13 +2,15 @@ import { IWalletConnectModalData, WalletConnectEventsEnum } from 'core/providers/strategies/WalletConnectProviderStrategy/types'; - -interface IEventBus { - publish(event: string, data: any): void; -} - -export class WalletConnectStateManager { - private static instance: WalletConnectStateManager | null = null; +import { IEventBus } from 'types/manager.types'; + +export class WalletConnectStateManager< + T extends + IEventBus = IEventBus +> { + private static instance: WalletConnectStateManager< + IEventBus + > | null = null; private eventBus: T; private initialData: IWalletConnectModalData = { @@ -22,7 +24,7 @@ export class WalletConnectStateManager { this.eventBus = eventBus; } - public static getInstance( + public static getInstance>( eventBus: U ): WalletConnectStateManager { if (!WalletConnectStateManager.instance) { diff --git a/src/types/manager.types.ts b/src/types/manager.types.ts new file mode 100644 index 0000000..5f6cedf --- /dev/null +++ b/src/types/manager.types.ts @@ -0,0 +1,3 @@ +export interface IEventBus { + publish(event: string, data: T): void; +} From 6601d3e803af9cc6fcfcd3b5046a9d0b8779c493 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Thu, 19 Dec 2024 10:44:49 +0200 Subject: [PATCH 13/17] Update createModalElement func --- .../CrossWindowProviderStrategy.ts | 16 +++++------ .../ExtensionProviderStrategy.ts | 16 +++++------ .../IFrameProviderStrategy.ts | 16 +++++------ .../LedgerProviderStrategy.ts | 28 +++++++++---------- .../WalletConnectProviderStrategy.ts | 24 ++++++++-------- src/utils/createModalElement.ts | 28 ++++++++----------- 6 files changed, 60 insertions(+), 68 deletions(-) diff --git a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts index be24fdc..81d481f 100644 --- a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts +++ b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts @@ -89,10 +89,10 @@ export class CrossWindowProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); @@ -138,10 +138,10 @@ export class CrossWindowProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); diff --git a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts index ae2a5a0..8a7249d 100644 --- a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts +++ b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts @@ -72,10 +72,10 @@ export class ExtensionProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); @@ -117,10 +117,10 @@ export class ExtensionProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); diff --git a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts index b812462..32de2dc 100644 --- a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts +++ b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts @@ -84,10 +84,10 @@ export class IFrameProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); @@ -129,10 +129,10 @@ export class IFrameProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); diff --git a/src/core/providers/strategies/LedgerProviderStrategy/LedgerProviderStrategy.ts b/src/core/providers/strategies/LedgerProviderStrategy/LedgerProviderStrategy.ts index 53a3fbf..a264637 100644 --- a/src/core/providers/strategies/LedgerProviderStrategy/LedgerProviderStrategy.ts +++ b/src/core/providers/strategies/LedgerProviderStrategy/LedgerProviderStrategy.ts @@ -149,29 +149,27 @@ export class LedgerProviderStrategy { return; } - const { eventBus: modalEventBus } = - await createModalElement({ - name: 'ledger-connect-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'ledger-connect-modal' + ); + const eventBus = await modalElement.getEventBus(); - if (!modalEventBus) { - throw new Error('Event bus not provided for Ledger provider'); + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); } - this.eventBus = modalEventBus; - return modalEventBus; + this.eventBus = eventBus; + return eventBus; }; private signTransactions = async (transactions: Transaction[]) => { - const { modalElement: signModalElement, eventBus } = - await createModalElement({ - name: 'sign-transactions-modal', - withEventBus: true - }); + const signModalElement = await createModalElement( + 'sign-transactions-modal' + ); + const eventBus = await signModalElement.getEventBus(); if (!eventBus) { - throw new Error('Event bus not provided for Ledger provider'); + throw new Error(ProviderErrorsEnum.eventBusError); } const manager = SignTransactionsStateManager.getInstance(eventBus); diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts index dbb1588..ad98ff1 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts @@ -160,11 +160,11 @@ export class WalletConnectProviderStrategy { return; } - const { eventBus } = await createModalElement({ - name: 'wallet-connect-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'wallet-connect-modal' + ); + const eventBus = await modalElement.getEventBus(); return eventBus; }; @@ -305,10 +305,10 @@ export class WalletConnectProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); @@ -356,10 +356,10 @@ export class WalletConnectProviderStrategy { throw new Error(ProviderErrorsEnum.notInitialized); } - const { eventBus } = await createModalElement({ - name: 'pending-transactions-modal', - withEventBus: true - }); + const modalElement = await createModalElement( + 'pending-transactions-modal' + ); + const eventBus = await modalElement.getEventBus(); if (!eventBus) { throw new Error(ProviderErrorsEnum.eventBusError); diff --git a/src/utils/createModalElement.ts b/src/utils/createModalElement.ts index ae8bc7d..3beac80 100644 --- a/src/utils/createModalElement.ts +++ b/src/utils/createModalElement.ts @@ -2,18 +2,12 @@ import { IEventBus } from '@multiversx/sdk-dapp-core-ui/loader'; import { safeWindow } from 'constants/index'; import { defineCustomElements } from 'lib/sdkDappCoreUi'; -type CreateModalElementType = { - name: string; - withEventBus?: boolean; -}; - export const createModalElement = async < T extends HTMLElement & { getEventBus: () => Promise } ->({ - name, - withEventBus = false -}: CreateModalElementType) => { - let eventBus: IEventBus | undefined; +>( + name: string +) => { + // let eventBus: IEventBus | undefined; await defineCustomElements(safeWindow); @@ -21,13 +15,13 @@ export const createModalElement = async < document.body.appendChild(modalElement); await customElements.whenDefined(name); - if (withEventBus) { - eventBus = await modalElement.getEventBus(); + // if (withEventBus) { + // eventBus = await modalElement.getEventBus(); - if (!eventBus) { - throw new Error(`Event bus not provided for ${name}.`); - } - } + // if (!eventBus) { + // throw new Error(`Event bus not provided for ${name}.`); + // } + // } - return { modalElement, eventBus }; + return modalElement; }; From 2444e4a35413bf43ace6d9975e12b55c870c85fb Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Thu, 19 Dec 2024 10:46:00 +0200 Subject: [PATCH 14/17] Remove unused code --- src/utils/createModalElement.ts | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/src/utils/createModalElement.ts b/src/utils/createModalElement.ts index 3beac80..1175bd4 100644 --- a/src/utils/createModalElement.ts +++ b/src/utils/createModalElement.ts @@ -7,21 +7,11 @@ export const createModalElement = async < >( name: string ) => { - // let eventBus: IEventBus | undefined; - await defineCustomElements(safeWindow); const modalElement = document.createElement(name) as T; document.body.appendChild(modalElement); await customElements.whenDefined(name); - // if (withEventBus) { - // eventBus = await modalElement.getEventBus(); - - // if (!eventBus) { - // throw new Error(`Event bus not provided for ${name}.`); - // } - // } - return modalElement; }; From 96614a53c666976a9fbcf40c71a0423c339cfe2b Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Thu, 19 Dec 2024 10:53:14 +0200 Subject: [PATCH 15/17] Remove cast --- .../CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts | 2 +- .../ExtensionProviderStrategy/ExtensionProviderStrategy.ts | 2 +- .../strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts | 2 +- .../WalletConnectProviderStrategy.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts index 81d481f..af0f767 100644 --- a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts +++ b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts @@ -172,7 +172,7 @@ export class CrossWindowProviderStrategy { this.setPopupConsent(); try { - const signedMessage: Message = await this._signMessage(message); + const signedMessage = await this._signMessage(message); return signedMessage; } catch (error) { diff --git a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts index 8a7249d..7163f08 100644 --- a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts +++ b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts @@ -149,7 +149,7 @@ export class ExtensionProviderStrategy { }); try { - const signedMessage: Message = await this._signMessage(message); + const signedMessage = await this._signMessage(message); return signedMessage; } catch (error) { diff --git a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts index 32de2dc..4381125 100644 --- a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts +++ b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts @@ -161,7 +161,7 @@ export class IFrameProviderStrategy { }); try { - const signedMessage: Message = await this._signMessage(message); + const signedMessage = await this._signMessage(message); return signedMessage; } catch (error) { diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts index ad98ff1..c106d24 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts @@ -391,7 +391,7 @@ export class WalletConnectProviderStrategy { }); try { - const signedMessage: Message = await this._signMessage(message); + const signedMessage = await this._signMessage(message); return signedMessage; } catch (error) { From 27097b15f59714e04f7519cf72e31ee052c267e9 Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Thu, 19 Dec 2024 11:12:25 +0200 Subject: [PATCH 16/17] Refactor handlers --- .../CrossWindowProviderStrategy.ts | 61 +++++++--------- .../ExtensionProviderStrategy.ts | 61 ++++++++-------- .../IFrameProviderStrategy.ts | 62 ++++++++-------- .../WalletConnectProviderStrategy.ts | 71 ++++++++----------- 4 files changed, 114 insertions(+), 141 deletions(-) diff --git a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts index af0f767..5eaa2a5 100644 --- a/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts +++ b/src/core/providers/strategies/CrossWindowProviderStrategy/CrossWindowProviderStrategy.ts @@ -92,21 +92,8 @@ export class CrossWindowProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = (cancelAction = true) => { - if (cancelAction && this.provider) { - this.provider.cancelAction(); - } - - manager.closeAndReset(); - }; + const { eventBus, onClose, manager } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -141,25 +128,8 @@ export class CrossWindowProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = (cancelAction = true) => { - if (!this.provider) { - throw new Error(ProviderErrorsEnum.notInitialized); - } - - if (cancelAction) { - this.provider.cancelAction(); - } - - manager.closeAndReset(); - }; + const { eventBus, onClose, manager } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -242,4 +212,27 @@ export class CrossWindowProviderStrategy { Boolean(tx.getGuardianSignature().toString('hex')) ); }; + + private getModalHandlers = async (modalElement: PendingTransactionsModal) => { + const eventBus = await modalElement.getEventBus(); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + return { eventBus, manager, onClose }; + }; } diff --git a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts index 7163f08..d37c0eb 100644 --- a/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts +++ b/src/core/providers/strategies/ExtensionProviderStrategy/ExtensionProviderStrategy.ts @@ -75,21 +75,8 @@ export class ExtensionProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = (cancelAction = true) => { - if (cancelAction && this.provider) { - this.provider.cancelAction(); - } - - manager.closeAndReset(); - }; + const { eventBus, manager, onClose } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -120,25 +107,9 @@ export class ExtensionProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = (cancelAction = true) => { - if (!this.provider) { - throw new Error(ProviderErrorsEnum.notInitialized); - } - - if (cancelAction) { - this.provider.cancelAction(); - } - manager.closeAndReset(); - }; + const { eventBus, manager, onClose } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -160,4 +131,28 @@ export class ExtensionProviderStrategy { eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); } }; + + private getModalHandlers = async (modalElement: PendingTransactionsModal) => { + const eventBus = await modalElement.getEventBus(); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + + return { eventBus, manager, onClose }; + }; } diff --git a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts index 4381125..7cb4952 100644 --- a/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts +++ b/src/core/providers/strategies/IFrameProviderStrategy/IFrameProviderStrategy.ts @@ -87,21 +87,8 @@ export class IFrameProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = (cancelAction = true) => { - if (cancelAction && this.provider) { - this.provider.cancelAction(); - } - - manager.closeAndReset(); - }; + const { eventBus, manager, onClose } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -132,25 +119,8 @@ export class IFrameProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = (cancelAction = true) => { - if (!this.provider) { - throw new Error(ProviderErrorsEnum.notInitialized); - } - - if (cancelAction) { - this.provider.cancelAction(); - } - - manager.closeAndReset(); - }; + const { eventBus, manager, onClose } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -172,4 +142,28 @@ export class IFrameProviderStrategy { eventBus.unsubscribe(PendingTransactionsEventsEnum.CLOSE, onClose); } }; + + private getModalHandlers = async (modalElement: PendingTransactionsModal) => { + const eventBus = await modalElement.getEventBus(); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + this.provider.cancelAction(); + } + + manager.closeAndReset(); + }; + + return { eventBus, manager, onClose }; + }; } diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts index c106d24..2823c8a 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts @@ -308,24 +308,8 @@ export class WalletConnectProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = (cancelAction = true) => { - if (cancelAction && this.provider) { - this.sendCustomRequest({ - method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, - action: OptionalOperation.CANCEL_ACTION - }); - } - - manager.closeAndReset(); - }; + const { eventBus, manager, onClose } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -359,28 +343,8 @@ export class WalletConnectProviderStrategy { const modalElement = await createModalElement( 'pending-transactions-modal' ); - const eventBus = await modalElement.getEventBus(); - - if (!eventBus) { - throw new Error(ProviderErrorsEnum.eventBusError); - } - - const manager = PendingTransactionsStateManager.getInstance(eventBus); - - const onClose = async (cancelAction = true) => { - if (!this.provider) { - throw new Error(ProviderErrorsEnum.notInitialized); - } - - if (cancelAction) { - await this.sendCustomRequest({ - method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, - action: OptionalOperation.CANCEL_ACTION - }); - } - - manager.closeAndReset(); - }; + const { eventBus, manager, onClose } = + await this.getModalHandlers(modalElement); eventBus.subscribe(PendingTransactionsEventsEnum.CLOSE, onClose); @@ -428,4 +392,31 @@ export class WalletConnectProviderStrategy { console.error(WalletConnectV2Error.actionError, error); } }; + + private getModalHandlers = async (modalElement: PendingTransactionsModal) => { + const eventBus = await modalElement.getEventBus(); + + if (!eventBus) { + throw new Error(ProviderErrorsEnum.eventBusError); + } + + const manager = PendingTransactionsStateManager.getInstance(eventBus); + + const onClose = async (cancelAction = true) => { + if (!this.provider) { + throw new Error(ProviderErrorsEnum.notInitialized); + } + + if (cancelAction) { + await this.sendCustomRequest({ + method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, + action: OptionalOperation.CANCEL_ACTION + }); + } + + manager.closeAndReset(); + }; + + return { eventBus, manager, onClose }; + }; } From 74cd6f1c3f71fc843ee8f4250a6fe2c71315649c Mon Sep 17 00:00:00 2001 From: Gavrila Andrei Date: Thu, 19 Dec 2024 11:59:04 +0200 Subject: [PATCH 17/17] Add await for customRequest --- .../WalletConnectProviderStrategy.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts index 2823c8a..f6f29ad 100644 --- a/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts +++ b/src/core/providers/strategies/WalletConnectProviderStrategy/WalletConnectProviderStrategy.ts @@ -324,7 +324,7 @@ export class WalletConnectProviderStrategy { return signedTransactions; } catch (error) { - this.sendCustomRequest({ + await this.sendCustomRequest({ method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, action: OptionalOperation.CANCEL_ACTION }); @@ -359,7 +359,7 @@ export class WalletConnectProviderStrategy { return signedMessage; } catch (error) { - this.sendCustomRequest({ + await this.sendCustomRequest({ method: WalletConnectOptionalMethodsEnum.CANCEL_ACTION, action: OptionalOperation.CANCEL_ACTION });