@broxus/evm-connect 1.12.3 → 1.12.5

package/lib/cjs/components/EvmConnector/index.js

@@ -52,7 +52,8 @@ require("./index.css");
 exports.EvmConnector = (0, mobx_react_lite_1.observer)((props) => {
     const intl = (0, react_intl_1.useIntl)();
     const walletService = (0, context_1.useEvmWalletService)();
-    const [, setRecentMeta] = (0, hooks_1.useRecentConnectionMeta)();
+    const walletProviders = (0, context_1.useEvmWalletProviders)();
+    const [, setRecentMeta] = (0, hooks_1.useRecentConnectionMeta)(walletProviders.recentMetaStorageKey);
     const drop = React.useRef(null);
     const { changeWalletButtonText = intl.formatMessage(intl_1.default.EVM_CONNECT_CHANGE_WALLET_BTN_TEXT), className, connectButtonShape, connectButtonText = intl.formatMessage(intl_1.default.EVM_CONNECT_CONNECT_BTN_TEXT), connectButtonTrigger, connectButtonType, disconnectButtonText = intl.formatMessage(intl_1.default.EVM_CONNECT_DISCONNECT_BTN_TEXT), network = walletService.network, popupType, suffix, showDropMenu = true, showSubIcon = true, standalone = walletService.providers?.length === 1, warnUnsupportedNetwork = true, } = props;
     const changeWallet = () => {

package/lib/cjs/context/EvmWalletProvidersContext.js

@@ -47,9 +47,9 @@ exports.EvmWalletProvidersContext = React.createContext(null);
 function useEvmWalletProviders() {
     return (0, react_uikit_1.useContext)(exports.EvmWalletProvidersContext);
 }
-exports.EvmWalletProvidersProvider = (0, mobx_react_lite_1.observer)(({ agreementsNote, children, network, onConnect, }) => {
+exports.EvmWalletProvidersProvider = (0, mobx_react_lite_1.observer)(({ agreementsNote, children, network, recentMetaStorageKey, onConnect, }) => {
     const walletService = (0, EvmWalletServiceContext_1.useEvmWalletService)();
-    const [recentMeta, setRecentMeta] = (0, hooks_1.useRecentConnectionMeta)();
+    const [recentMeta, setRecentMeta] = (0, hooks_1.useRecentConnectionMeta)(recentMetaStorageKey);
     const [error, setError] = React.useState(null);
     const [connectingProvider, setConnectingProvider] = React.useState(null);
     const connect = React.useCallback(async (providerConfig) => {
@@ -72,13 +72,13 @@ exports.EvmWalletProvidersProvider = (0, mobx_react_lite_1.observer)(({ agreemen
                 disconnected: false,
                 providerId: providerConfig.id,
                 type: providerConfig.connector.type,
-            });
+            }, recentMetaStorageKey);
             walletService.setState('providerId', providerConfig.id);
         }
         catch (e) {
             setError(e);
         }
-    }, [network, onConnect, recentMeta, setRecentMeta, walletService]);
+    }, [network, onConnect, recentMeta, recentMetaStorageKey, setRecentMeta, walletService]);
     const reset = React.useCallback(() => {
         setError(null);
         setConnectingProvider(null);
@@ -88,8 +88,9 @@ exports.EvmWalletProvidersProvider = (0, mobx_react_lite_1.observer)(({ agreemen
         connect,
         connectingProvider,
         error,
+        recentMetaStorageKey,
         reset,
-    }), [agreementsNote, connect, connectingProvider, error, reset]);
+    }), [agreementsNote, connect, connectingProvider, error, recentMetaStorageKey, reset]);
     return React.createElement(exports.EvmWalletProvidersContext.Provider, { value: context }, children);
 });
 if (process.env.NODE_ENV !== 'production') {

package/lib/cjs/context/EvmWalletServiceContext.js

@@ -47,8 +47,8 @@ exports.EvmWalletServiceContext = React.createContext(null);
 function useEvmWalletService() {
     return (0, react_uikit_1.useContext)(exports.EvmWalletServiceContext);
 }
-function EvmWalletServiceProvider({ agreementsNote, children, params, wallet, }) {
-    const [, setRecentMeta] = (0, hooks_1.useRecentConnectionMeta)();
+function EvmWalletServiceProvider({ agreementsNote, children, params, recentMetaStorageKey, wallet, }) {
+    const [, setRecentMeta] = (0, hooks_1.useRecentConnectionMeta)(recentMetaStorageKey);
     const context = React.useMemo(() => {
         if (wallet instanceof services_1.EvmWalletService) {
             return wallet;
@@ -57,12 +57,12 @@ function EvmWalletServiceProvider({ agreementsNote, children, params, wallet, })
     }, [params, wallet]);
     React.useEffect(() => (0, mobx_1.reaction)(() => context.chainId, chainId => {
         if (chainId) {
-            const recentMeta = (0, hooks_1.getRecentConnectionMeta)();
+            const recentMeta = (0, hooks_1.getRecentConnectionMeta)(recentMetaStorageKey);
             setRecentMeta({ ...recentMeta, chainId: chainId.toString() });
         }
-    }, { delay: 10, fireImmediately: context.isReady }), [context, setRecentMeta]);
+    }, { delay: 10, fireImmediately: context.isReady }), [context, recentMetaStorageKey, setRecentMeta]);
     return (React.createElement(exports.EvmWalletServiceContext.Provider, { value: context },
-        React.createElement(EvmWalletProvidersContext_1.EvmWalletProvidersProvider, { agreementsNote: agreementsNote }, children)));
+        React.createElement(EvmWalletProvidersContext_1.EvmWalletProvidersProvider, { agreementsNote: agreementsNote, recentMetaStorageKey: recentMetaStorageKey }, children)));
 }
 if (process.env.NODE_ENV !== 'production') {
     exports.EvmWalletServiceContext.displayName = 'EvmWalletServiceContext';

package/lib/cjs/hooks/useOrderedConnections.js

@@ -35,9 +35,7 @@ var __importStar = (this && this.__importStar) || (function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useOrderedConnections = useOrderedConnections;
 const React = __importStar(require("react"));
-const useRecentConnectionMeta_1 = require("../hooks/useRecentConnectionMeta");
-function useOrderedConnections(providers) {
-    const [recentMeta] = (0, useRecentConnectionMeta_1.useRecentConnectionMeta)();
+function useOrderedConnections(providers, recentMeta) {
     return React.useMemo(() => providers.reduce((acc, provider) => {
         if (provider.id === recentMeta?.providerId) {
             acc.unshift({ ...provider, isRecent: true });

package/lib/cjs/hooks/useRecentConnectionMeta.js

@@ -44,16 +44,16 @@ function isRecentConnectionMeta(value) {
     const meta = { providerId: value.providerId, type: value.type };
     return Boolean(meta.type && types_1.EthereumConnectionType[meta.type] && !!meta.providerId);
 }
-function storeRecentConnectionMeta(meta) {
+function storeRecentConnectionMeta(meta, storageKey = constants_1.EVM_RECENT_CONNECTION) {
     if (!meta) {
-        js_utils_1.storage.remove(constants_1.EVM_RECENT_CONNECTION);
+        js_utils_1.storage.remove(storageKey);
         return;
     }
     (0, js_utils_1.debug)('Store EVM recent connection', meta);
-    js_utils_1.storage.set(constants_1.EVM_RECENT_CONNECTION, JSON.stringify(meta));
+    js_utils_1.storage.set(storageKey, JSON.stringify(meta));
 }
-function getRecentConnectionMeta() {
-    const value = js_utils_1.storage.get(constants_1.EVM_RECENT_CONNECTION);
+function getRecentConnectionMeta(storageKey = constants_1.EVM_RECENT_CONNECTION) {
+    const value = js_utils_1.storage.get(storageKey);
     if (!value) {
         return undefined;
     }
@@ -66,14 +66,14 @@ function getRecentConnectionMeta() {
     catch (e) {
         (0, js_utils_1.debug)(e);
     }
-    storeRecentConnectionMeta(undefined);
+    storeRecentConnectionMeta(undefined, storageKey);
     return undefined;
 }
-function useRecentConnectionMeta() {
-    const [meta, setMeta] = React.useState(getRecentConnectionMeta());
+function useRecentConnectionMeta(storageKey = constants_1.EVM_RECENT_CONNECTION) {
+    const [meta, setMeta] = React.useState(getRecentConnectionMeta(storageKey));
     React.useEffect(() => {
         const onStorage = (event) => {
-            if (event.key === constants_1.EVM_RECENT_CONNECTION && event.newValue) {
+            if (event.key === storageKey && event.newValue) {
                 const json = JSON.parse(event.newValue);
                 if (isRecentConnectionMeta(json)) {
                     setMeta(json);
@@ -88,6 +88,6 @@ function useRecentConnectionMeta() {
                 window.removeEventListener('storage', onStorage);
             }
         };
-    }, []);
+    }, [storageKey]);
     return [meta, storeRecentConnectionMeta];
 }

package/lib/esm/components/EvmConnector/index.js

@@ -6,14 +6,15 @@ import { observer } from 'mobx-react-lite';
 import * as React from 'react';
 import { useIntl } from 'react-intl';
 import { EvmConnectButton } from '../../components/EvmConnectButton';
-import { useEvmWalletService } from '../../context';
+import { useEvmWalletProviders, useEvmWalletService } from '../../context';
 import { getRecentConnectionMeta, useRecentConnectionMeta } from '../../hooks';
 import messages from '../../intl';
 import './index.css';
 export const EvmConnector = observer((props) => {
     const intl = useIntl();
     const walletService = useEvmWalletService();
-    const [, setRecentMeta] = useRecentConnectionMeta();
+    const walletProviders = useEvmWalletProviders();
+    const [, setRecentMeta] = useRecentConnectionMeta(walletProviders.recentMetaStorageKey);
     const drop = React.useRef(null);
     const { changeWalletButtonText = intl.formatMessage(messages.EVM_CONNECT_CHANGE_WALLET_BTN_TEXT), className, connectButtonShape, connectButtonText = intl.formatMessage(messages.EVM_CONNECT_CONNECT_BTN_TEXT), connectButtonTrigger, connectButtonType, disconnectButtonText = intl.formatMessage(messages.EVM_CONNECT_DISCONNECT_BTN_TEXT), network = walletService.network, popupType, suffix, showDropMenu = true, showSubIcon = true, standalone = walletService.providers?.length === 1, warnUnsupportedNetwork = true, } = props;
     const changeWallet = () => {

package/lib/esm/context/EvmWalletProvidersContext.d.ts

@@ -6,6 +6,7 @@ export interface EvmWalletProvidersContextConsumer {
     connect: (providerConfig: EvmWalletProviderConfig) => Promise<void>;
     connectingProvider?: EvmWalletProviderConfig | null;
     error?: Error | null;
+    recentMetaStorageKey?: string;
     reset: VoidFunction;
 }
 export declare const EvmWalletProvidersContext: React.Context<EvmWalletProvidersContextConsumer | null>;
@@ -13,8 +14,9 @@ export declare function useEvmWalletProviders(): EvmWalletProvidersContextConsum
 export type EvmWalletProvidersProviderProps = React.PropsWithChildren<{
     agreementsNote?: React.ReactNode;
     network?: EvmNetworkConfig;
+    recentMetaStorageKey?: string;
     onConnect?: (connector?: EthereumConnector) => Promise<void> | void;
 }>;
-export declare const EvmWalletProvidersProvider: (({ agreementsNote, children, network, onConnect, }: EvmWalletProvidersProviderProps) => React.JSX.Element) & {
+export declare const EvmWalletProvidersProvider: (({ agreementsNote, children, network, recentMetaStorageKey, onConnect, }: EvmWalletProvidersProviderProps) => React.JSX.Element) & {
     displayName: string;
 };

package/lib/esm/context/EvmWalletProvidersContext.js

@@ -10,9 +10,9 @@ export const EvmWalletProvidersContext = React.createContext(null);
 export function useEvmWalletProviders() {
     return useContext(EvmWalletProvidersContext);
 }
-export const EvmWalletProvidersProvider = observer(({ agreementsNote, children, network, onConnect, }) => {
+export const EvmWalletProvidersProvider = observer(({ agreementsNote, children, network, recentMetaStorageKey, onConnect, }) => {
     const walletService = useEvmWalletService();
-    const [recentMeta, setRecentMeta] = useRecentConnectionMeta();
+    const [recentMeta, setRecentMeta] = useRecentConnectionMeta(recentMetaStorageKey);
     const [error, setError] = React.useState(null);
     const [connectingProvider, setConnectingProvider] = React.useState(null);
     const connect = React.useCallback(async (providerConfig) => {
@@ -35,13 +35,13 @@ export const EvmWalletProvidersProvider = observer(({ agreementsNote, children,
                 disconnected: false,
                 providerId: providerConfig.id,
                 type: providerConfig.connector.type,
-            });
+            }, recentMetaStorageKey);
             walletService.setState('providerId', providerConfig.id);
         }
         catch (e) {
             setError(e);
         }
-    }, [network, onConnect, recentMeta, setRecentMeta, walletService]);
+    }, [network, onConnect, recentMeta, recentMetaStorageKey, setRecentMeta, walletService]);
     const reset = React.useCallback(() => {
         setError(null);
         setConnectingProvider(null);
@@ -51,8 +51,9 @@ export const EvmWalletProvidersProvider = observer(({ agreementsNote, children,
         connect,
         connectingProvider,
         error,
+        recentMetaStorageKey,
         reset,
-    }), [agreementsNote, connect, connectingProvider, error, reset]);
+    }), [agreementsNote, connect, connectingProvider, error, recentMetaStorageKey, reset]);
     return React.createElement(EvmWalletProvidersContext.Provider, { value: context }, children);
 });
 if (process.env.NODE_ENV !== 'production') {

package/lib/esm/context/EvmWalletServiceContext.d.ts

@@ -5,7 +5,8 @@ export declare function useEvmWalletService(): EvmWalletService;
 interface EvmWalletProviderProps {
     agreementsNote?: React.ReactNode;
     params?: EvmWalletServiceCtorParams;
+    recentMetaStorageKey?: string;
     wallet?: EvmWalletService;
 }
-export declare function EvmWalletServiceProvider({ agreementsNote, children, params, wallet, }: React.PropsWithChildren<EvmWalletProviderProps>): React.JSX.Element;
+export declare function EvmWalletServiceProvider({ agreementsNote, children, params, recentMetaStorageKey, wallet, }: React.PropsWithChildren<EvmWalletProviderProps>): React.JSX.Element;
 export {};

package/lib/esm/context/EvmWalletServiceContext.js

@@ -9,8 +9,8 @@ export const EvmWalletServiceContext = React.createContext(null);
 export function useEvmWalletService() {
     return useContext(EvmWalletServiceContext);
 }
-export function EvmWalletServiceProvider({ agreementsNote, children, params, wallet, }) {
-    const [, setRecentMeta] = useRecentConnectionMeta();
+export function EvmWalletServiceProvider({ agreementsNote, children, params, recentMetaStorageKey, wallet, }) {
+    const [, setRecentMeta] = useRecentConnectionMeta(recentMetaStorageKey);
     const context = React.useMemo(() => {
         if (wallet instanceof EvmWalletService) {
             return wallet;
@@ -19,12 +19,12 @@ export function EvmWalletServiceProvider({ agreementsNote, children, params, wal
     }, [params, wallet]);
     React.useEffect(() => reaction(() => context.chainId, chainId => {
         if (chainId) {
-            const recentMeta = getRecentConnectionMeta();
+            const recentMeta = getRecentConnectionMeta(recentMetaStorageKey);
             setRecentMeta({ ...recentMeta, chainId: chainId.toString() });
         }
-    }, { delay: 10, fireImmediately: context.isReady }), [context, setRecentMeta]);
+    }, { delay: 10, fireImmediately: context.isReady }), [context, recentMetaStorageKey, setRecentMeta]);
     return (React.createElement(EvmWalletServiceContext.Provider, { value: context },
-        React.createElement(EvmWalletProvidersProvider, { agreementsNote: agreementsNote }, children)));
+        React.createElement(EvmWalletProvidersProvider, { agreementsNote: agreementsNote, recentMetaStorageKey: recentMetaStorageKey }, children)));
 }
 if (process.env.NODE_ENV !== 'production') {
     EvmWalletServiceContext.displayName = 'EvmWalletServiceContext';

package/lib/esm/hooks/useOrderedConnections.d.ts

@@ -1,2 +1,3 @@
+import { type RecentConnectionMeta } from '../hooks/useRecentConnectionMeta';
 import { type EvmWalletProviderConfig } from '../types';
-export declare function useOrderedConnections(providers: Readonly<EvmWalletProviderConfig[]>): EvmWalletProviderConfig[];
+export declare function useOrderedConnections(providers: Readonly<EvmWalletProviderConfig[]>, recentMeta?: RecentConnectionMeta): EvmWalletProviderConfig[];

package/lib/esm/hooks/useOrderedConnections.js

@@ -1,7 +1,5 @@
 import * as React from 'react';
-import { useRecentConnectionMeta } from '../hooks/useRecentConnectionMeta';
-export function useOrderedConnections(providers) {
-    const [recentMeta] = useRecentConnectionMeta();
+export function useOrderedConnections(providers, recentMeta) {
     return React.useMemo(() => providers.reduce((acc, provider) => {
         if (provider.id === recentMeta?.providerId) {
             acc.unshift({ ...provider, isRecent: true });

package/lib/esm/hooks/useRecentConnectionMeta.d.ts

@@ -5,11 +5,11 @@ export interface RecentConnectionMeta {
     providerId: string;
     type?: EthereumConnectionType;
 }
-export declare function storeRecentConnectionMeta(meta: RecentConnectionMeta | undefined): void;
-export declare function getRecentConnectionMeta(): RecentConnectionMeta | undefined;
+export declare function storeRecentConnectionMeta(meta: RecentConnectionMeta | undefined, storageKey?: string): void;
+export declare function getRecentConnectionMeta(storageKey?: string): RecentConnectionMeta | undefined;
 type UseRecentConnectionMeta = [
     value: RecentConnectionMeta | undefined,
-    setValue: (meta: RecentConnectionMeta | undefined) => void
+    setValue: (meta: RecentConnectionMeta | undefined, storageKey?: string) => void
 ];
-export declare function useRecentConnectionMeta(): UseRecentConnectionMeta;
+export declare function useRecentConnectionMeta(storageKey?: string): UseRecentConnectionMeta;
 export {};

package/lib/esm/hooks/useRecentConnectionMeta.js

@@ -6,16 +6,16 @@ function isRecentConnectionMeta(value) {
     const meta = { providerId: value.providerId, type: value.type };
     return Boolean(meta.type && EthereumConnectionType[meta.type] && !!meta.providerId);
 }
-export function storeRecentConnectionMeta(meta) {
+export function storeRecentConnectionMeta(meta, storageKey = EVM_RECENT_CONNECTION) {
     if (!meta) {
-        storage.remove(EVM_RECENT_CONNECTION);
+        storage.remove(storageKey);
         return;
     }
     debug('Store EVM recent connection', meta);
-    storage.set(EVM_RECENT_CONNECTION, JSON.stringify(meta));
+    storage.set(storageKey, JSON.stringify(meta));
 }
-export function getRecentConnectionMeta() {
-    const value = storage.get(EVM_RECENT_CONNECTION);
+export function getRecentConnectionMeta(storageKey = EVM_RECENT_CONNECTION) {
+    const value = storage.get(storageKey);
     if (!value) {
         return undefined;
     }
@@ -28,14 +28,14 @@ export function getRecentConnectionMeta() {
     catch (e) {
         debug(e);
     }
-    storeRecentConnectionMeta(undefined);
+    storeRecentConnectionMeta(undefined, storageKey);
     return undefined;
 }
-export function useRecentConnectionMeta() {
-    const [meta, setMeta] = React.useState(getRecentConnectionMeta());
+export function useRecentConnectionMeta(storageKey = EVM_RECENT_CONNECTION) {
+    const [meta, setMeta] = React.useState(getRecentConnectionMeta(storageKey));
     React.useEffect(() => {
         const onStorage = (event) => {
-            if (event.key === EVM_RECENT_CONNECTION && event.newValue) {
+            if (event.key === storageKey && event.newValue) {
                 const json = JSON.parse(event.newValue);
                 if (isRecentConnectionMeta(json)) {
                     setMeta(json);
@@ -50,6 +50,6 @@ export function useRecentConnectionMeta() {
                 window.removeEventListener('storage', onStorage);
             }
         };
-    }, []);
+    }, [storageKey]);
     return [meta, storeRecentConnectionMeta];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@broxus/evm-connect",
-    "version": "1.12.3",
+    "version": "1.12.5",
     "description": "Ethereum wallets connector.",
     "license": "MIT",
     "keywords": [
@@ -96,5 +96,5 @@
         "web3-types": "^1.x",
         "web3-utils": "^4.x"
     },
-    "gitHead": "d6a9cf57bc7a032f8afff930e16e018b09d250b1"
+    "gitHead": "7ac22e228c35e0140f251e2103fa6d4af1ff8679"
 }