@dynamic-labs/ethereum 4.0.0-alpha.9 → 4.0.0

package/src/metaMask/MetaMaskConnector.cjs

@@ -0,0 +1,376 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../_virtual/_tslib.cjs');
+var sdk = require('@metamask/sdk');
+var viem = require('viem');
+var ethereumCore = require('@dynamic-labs/ethereum-core');
+var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
+var utils = require('@dynamic-labs/utils');
+var logger = require('../utils/logger.cjs');
+var InjectedWalletBase = require('../injected/InjectedWalletBase.cjs');
+var createMetaMaskSDKDisplayUriState = require('./utils/createMetaMaskSDKDisplayUriState.cjs');
+var waitForConnection = require('./utils/waitForConnection.cjs');
+var isPendingWalletRequestPermissionError = require('./utils/isPendingWalletRequestPermissionError.cjs');
+
+/**
+ * The MetaMask SDK must be initialized only once, so we store the instance
+ * in these variables to avoid initializing it multiple times
+ */
+let _metaMaskSDK = null;
+let _metaMaskSDKDisplayUriState = null;
+const eventTimeline = utils.createEventTimeline();
+class MetaMaskConnector extends InjectedWalletBase.InjectedWalletBase {
+    constructor(props) {
+        super(props);
+        this.name = 'MetaMask';
+        this.overrideKey = 'metamask';
+        this.canConnectViaQrCode = true;
+        this.isInAppBrowser = false;
+        this.appName = props.appName;
+        this.appLogoUrl = props.appLogoUrl;
+        /**
+         * The isInAppBrowser must be calculated before initializing the MetaMask SDK.
+         *
+         * The isInAppBrowser is calculated by checking if the window provider is installed
+         * in the browser and if it is running on a mobile device.
+         *
+         * But the MetaMask SDK will inject its own provider to the window if not provider is injected.
+         * This means the MetaMask SDK can interfere with the isInAppBrowser calculation.
+         *
+         * So we need to calculate the isInAppBrowser before initializing the MetaMask SDK
+         * to prevent a false negative
+         */
+        this.isInAppBrowser = this.getIsInAppBrowser();
+        if (!_metaMaskSDK) {
+            this.createMetaMaskSDK();
+        }
+    }
+    getSupportedNetworks() {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            return this.evmNetworks.map((network) => network.chainId.toString());
+        });
+    }
+    get metaMaskSDK() {
+        if (!_metaMaskSDK)
+            throw new Error('MetaMaskSDK not initialized');
+        return _metaMaskSDK;
+    }
+    set metaMaskSDK(metaMaskSDK) {
+        _metaMaskSDK = metaMaskSDK;
+    }
+    get metaMaskSDKDisplayUriState() {
+        if (!_metaMaskSDKDisplayUriState)
+            throw new Error('MetaMaskSDKDisplayUriState not initialized');
+        return _metaMaskSDKDisplayUriState;
+    }
+    createMetaMaskSDK() {
+        const dappMetadata = {
+            iconUrl: this.appLogoUrl,
+            name: this.appName,
+            url: utils.PlatformService.getOrigin(),
+        };
+        _metaMaskSDK = new sdk.MetaMaskSDK({
+            _source: 'dynamic-labs',
+            checkInstallationImmediately: true,
+            dappMetadata,
+            enableAnalytics: true,
+            extensionOnly: this.isInstalledOnBrowser(),
+            headless: true,
+            openDeeplink: utils.PlatformService.openURL,
+            preferDesktop: !utils.isMobile(),
+            readonlyRPCMap: getReadonlyRPCMap(this.evmNetworkRpcMap()),
+            useDeeplink: true,
+        });
+        _metaMaskSDKDisplayUriState =
+            createMetaMaskSDKDisplayUriState.createMetaMaskSDKDisplayUriState(_metaMaskSDK);
+    }
+    endSession() {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            eventTimeline.postEvent('disconnect');
+            /**
+             * The MetaMask SDK must be terminated and reinitialized on mobile
+             * to prevent deeplinks not working
+             */
+            if (utils.isMobile()) {
+                return this.metaMaskSDK.terminate().then(() => {
+                    _metaMaskSDK = null;
+                    _metaMaskSDKDisplayUriState = null;
+                    return this.createMetaMaskSDK();
+                });
+            }
+            /**
+             * Just terminate the SDK on desktop
+             */
+            return this.metaMaskSDK.terminate();
+        });
+    }
+    getAddress(opts) {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            return new Promise((resolve, reject) => {
+                // QR Code flow
+                if (!utils.isMobile() && Boolean(opts === null || opts === void 0 ? void 0 : opts.onDisplayUri)) {
+                    this.metaMaskSDKDisplayUriState
+                        .consumeDisplayUri()
+                        .then((displayUri) => {
+                        var _a;
+                        if (!displayUri) {
+                            reject(new Error('MetaMask display uri not found'));
+                            return;
+                        }
+                        (_a = opts === null || opts === void 0 ? void 0 : opts.onDisplayUri) === null || _a === void 0 ? void 0 : _a.call(opts, displayUri);
+                    });
+                }
+                // Deep link to MetaMask app in-app browser
+                if (this.shouldDeepLinkToMetaMaskInAppBrowser() &&
+                    this.metadata.inAppBrowserUrl) {
+                    // Redirect to the in-app browser and append the current url
+                    window.location.href = `${this.metadata.inAppBrowserUrl}/${window.location.href}`;
+                    resolve(undefined);
+                    return;
+                }
+                // Connect to MetaMask
+                this.getConnectedAccountsSafely().then((initialConnectedAccounts) => _tslib.__awaiter(this, void 0, void 0, function* () {
+                    if (initialConnectedAccounts.length) {
+                        resolve(initialConnectedAccounts[0]);
+                        return;
+                    }
+                    try {
+                        yield this.metaMaskSDK.connect();
+                    }
+                    catch (error) {
+                        const isRequestPendingError = isPendingWalletRequestPermissionError.isPendingWalletRequestPermissionError(error);
+                        if (!isRequestPendingError) {
+                            throw error;
+                        }
+                        else {
+                            yield waitForConnection.waitForConnection(this.getProvider());
+                        }
+                    }
+                    const accounts = yield this.getConnectedAccounts();
+                    resolve(accounts[0]);
+                }));
+            });
+        });
+    }
+    getConnectedAccountsSafely() {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            try {
+                const connectedAccounts = yield this.getConnectedAccounts();
+                return connectedAccounts;
+            }
+            catch (err) {
+                logger.logger.error(err);
+                return [];
+            }
+        });
+    }
+    getConnectedAccounts() {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            // Wait for for MetaMask SDK to initialize
+            yield this.metaMaskSDK.sdkInitPromise;
+            const provider = this.getProvider();
+            if (!provider) {
+                return [];
+            }
+            /**
+             * The eth_accounts method can hang on mobile devices when
+             * the MetaMask SDK has not connected yet. So we use a retryable
+             * to ensure the timeout will be respected
+             */
+            const accounts = yield utils.retryableFn(() => provider.request({
+                method: 'eth_accounts',
+                params: [],
+            }), {
+                fallbackValue: [],
+                timeoutMs: 1000,
+            });
+            if (!(accounts === null || accounts === void 0 ? void 0 : accounts.length)) {
+                return [];
+            }
+            return accounts;
+        });
+    }
+    signMessage(messageToSign) {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            yield this.metaMaskSDK.sdkInitPromise;
+            /**
+             * Should wait for the window to be focused on mobile
+             * to account for the user moving between the MetaMaskApp
+             * and the browser
+             */
+            const windowFocusPromiseForMobile = !this.isInAppBrowser && utils.isMobile()
+                ? waitForFocusWindowEvent()
+                : Promise.resolve();
+            const provider = this.getProvider();
+            if (!provider) {
+                return undefined;
+            }
+            const [selectedAddress] = yield this.getConnectedAccounts();
+            if (!selectedAddress) {
+                return undefined;
+            }
+            const walletClient = this.getWalletClientForAddress(selectedAddress);
+            if (!walletClient)
+                return undefined;
+            const signature = yield walletClient.signMessage({
+                message: messageToSign,
+            });
+            yield windowFocusPromiseForMobile;
+            return signature;
+        });
+    }
+    chooseAccountsToConnect() {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            return [];
+        });
+    }
+    getWalletClient(chainId) {
+        const provider = this.getProvider();
+        if (!provider) {
+            return undefined;
+        }
+        const selectedAddress = provider.getSelectedAddress();
+        return this.getWalletClientForAddress(selectedAddress || undefined, chainId);
+    }
+    get rdns() {
+        const { rdns } = this.metadata;
+        if (!rdns) {
+            throw new Error('rdns not found in metadata');
+        }
+        return rdns;
+    }
+    setupEventListeners() {
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            yield this.metaMaskSDK.sdkInitPromise;
+            const metaMaskProvider = this.getProvider();
+            if (!metaMaskProvider) {
+                return;
+            }
+            const { handleAccountChange, handleChainChange, handleDisconnect } = walletConnectorCore.eventListenerHandlers(this);
+            const handleAccountsChangedFromMetaMask = (accounts) => {
+                /**
+                 * MetaMask emits an account changed event when the wallet is disconnected
+                 * so we ignore the accountsChanged event if the disconnect event was recent
+                 */
+                if (eventTimeline.isEventRecent('disconnect', 1000)) {
+                    return;
+                }
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-ignore
+                handleAccountChange(accounts);
+            };
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            metaMaskProvider.on('accountsChanged', handleAccountsChangedFromMetaMask);
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            metaMaskProvider.on('chainChanged', handleChainChange);
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            metaMaskProvider.on('disconnect', handleDisconnect);
+            this.teardownEventListeners = () => {
+                metaMaskProvider.off('accountsChanged', handleAccountsChangedFromMetaMask);
+                metaMaskProvider.off('chainChanged', handleChainChange);
+                metaMaskProvider.off('disconnect', handleDisconnect);
+            };
+        });
+    }
+    /**
+     * This override is necessary to wait for the MetaMask SDK to initialize
+     * before calling the super method. Otherwise, the super method may fail
+     * to fetch the provider
+     */
+    getNetwork() {
+        const _super = Object.create(null, {
+            getNetwork: { get: () => super.getNetwork }
+        });
+        return _tslib.__awaiter(this, void 0, void 0, function* () {
+            yield this.metaMaskSDK.sdkInitPromise;
+            const net = yield _super.getNetwork.call(this);
+            return net;
+        });
+    }
+    // Utils
+    getProvider() {
+        var _a;
+        return ((_a = this.metaMaskSDK.getProvider()) !== null && _a !== void 0 ? _a : this.metaMaskSDK.getMobileProvider());
+    }
+    evmNetworkByChainId(chainId) {
+        return this.evmNetworks.find((network) => network.chainId === chainId);
+    }
+    getWalletClientForAddress(address, chainId) {
+        var _a, _b;
+        const provider = this.getProvider();
+        if (!provider) {
+            return undefined;
+        }
+        const effectiveChainId = (_b = (_a = this.toInt(chainId)) !== null && _a !== void 0 ? _a : this.getCurrentChainId()) !== null && _b !== void 0 ? _b : '1';
+        const network = this.evmNetworkByChainId(effectiveChainId);
+        return viem.createWalletClient({
+            account: address,
+            chain: network ? ethereumCore.getOrMapViemChain(network) : this.getActiveChain(),
+            transport: viem.custom(provider),
+        });
+    }
+    toInt(chainId) {
+        if (!chainId)
+            return undefined;
+        try {
+            return parseInt(chainId);
+        }
+        catch (err) {
+            logger.logger.debug(err);
+            return undefined;
+        }
+    }
+    getCurrentChainId() {
+        const provider = this.getProvider();
+        if (!provider) {
+            return undefined;
+        }
+        const chainId = provider.getChainId();
+        if (viem.isHex(chainId)) {
+            return parseInt(chainId);
+        }
+        return chainId;
+    }
+    /**
+     * Checks if the current environment is the MetaMask in-app browser
+     * by checking if the MetaMask provider is installed in the window object
+     * on a mobile device
+     */
+    getIsInAppBrowser() {
+        if (!utils.isMobile())
+            return false;
+        return this.isInstalledOnBrowser();
+    }
+    shouldDeepLinkToMetaMaskInAppBrowser() {
+        // Not in an in-app browser
+        if (this.isInAppBrowser)
+            return false;
+        // Not a mobile device
+        if (!utils.isMobile())
+            return false;
+        // SDK is configured to use the in-app browser
+        if (this.mobileExperience !== 'in-app-browser')
+            return false;
+        // Wallet does not have an in-app browser link
+        if (!this.metadata.inAppBrowserUrl)
+            return false;
+        return true;
+    }
+}
+// Utils
+const getReadonlyRPCMap = (evmNetworkRpcMap) => Object.keys(evmNetworkRpcMap).reduce((acc, chainId) => (Object.assign(Object.assign({}, acc), { [viem.toHex(parseInt(chainId))]: evmNetworkRpcMap[chainId] })), {});
+/**
+ * Waits for the focus page event and await for an extra second
+ * This is necessary to ensure the verify call will succeed
+ */
+const waitForFocusWindowEvent = () => new Promise((resolve) => {
+    window.addEventListener('focus', resolve);
+}).then(() => new Promise((resolve) => setTimeout(resolve, 1000)));
+
+exports.MetaMaskConnector = MetaMaskConnector;

package/src/metaMask/MetaMaskConnector.d.ts

@@ -0,0 +1,52 @@
+import { MetaMaskSDK } from '@metamask/sdk';
+import { Account, Transport, WalletClient, Chain as ViemChain } from 'viem';
+import { EthereumWalletConnectorOpts } from '@dynamic-labs/ethereum-core';
+import { GetAddressOpts, IWalletConnectConnector } from '@dynamic-labs/wallet-connector-core';
+import { InjectedWalletBase } from '../injected/InjectedWalletBase';
+import { MetaMaskSDKDisplayUriState } from './utils/createMetaMaskSDKDisplayUriState';
+export type MetaMaskConnectorProps = EthereumWalletConnectorOpts & {
+    appName: string;
+    appLogoUrl: string;
+};
+export declare const clearMetaMaskSdk: () => void;
+export declare class MetaMaskConnector extends InjectedWalletBase implements IWalletConnectConnector {
+    name: string;
+    overrideKey: string;
+    canConnectViaQrCode: boolean;
+    private appName;
+    private appLogoUrl;
+    private isInAppBrowser;
+    constructor(props: MetaMaskConnectorProps);
+    getSupportedNetworks(): Promise<string[]>;
+    get metaMaskSDK(): MetaMaskSDK;
+    set metaMaskSDK(metaMaskSDK: MetaMaskSDK);
+    get metaMaskSDKDisplayUriState(): MetaMaskSDKDisplayUriState;
+    createMetaMaskSDK(): void;
+    endSession(): Promise<void>;
+    getAddress(opts?: GetAddressOpts): Promise<string | undefined>;
+    private getConnectedAccountsSafely;
+    getConnectedAccounts(): Promise<string[]>;
+    signMessage(messageToSign: string): Promise<string | undefined>;
+    chooseAccountsToConnect(): Promise<never[]>;
+    getWalletClient(chainId?: string): WalletClient<Transport, ViemChain, Account> | undefined;
+    get rdns(): string;
+    setupEventListeners(): Promise<void>;
+    /**
+     * This override is necessary to wait for the MetaMask SDK to initialize
+     * before calling the super method. Otherwise, the super method may fail
+     * to fetch the provider
+     */
+    getNetwork(): Promise<number | undefined>;
+    private getProvider;
+    private evmNetworkByChainId;
+    private getWalletClientForAddress;
+    private toInt;
+    private getCurrentChainId;
+    /**
+     * Checks if the current environment is the MetaMask in-app browser
+     * by checking if the MetaMask provider is installed in the window object
+     * on a mobile device
+     */
+    private getIsInAppBrowser;
+    private shouldDeepLinkToMetaMaskInAppBrowser;
+}