diff --git a/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.tsx b/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.tsx index ee21a8c51..99a7e1fd1 100644 --- a/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.tsx +++ b/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.tsx @@ -19,7 +19,7 @@ function ConnectWallet(props: ConnectWalletProps) { walletConnectUri, metamaskConnectUri, walletRegistry, - allExternalButtons, + allRegistryButtons, customConnectorButtons, connectorVisibilityMap, deviceDetails, @@ -62,21 +62,21 @@ function ConnectWallet(props: ConnectWalletProps) { const allUniqueButtons = useMemo(() => { const uniqueButtonSet = new Set(); - return customConnectorButtons.concat(allExternalButtons).filter((button) => { + return customConnectorButtons.concat(allRegistryButtons).filter((button) => { if (uniqueButtonSet.has(button.name)) return false; uniqueButtonSet.add(button.name); return true; }); - }, [allExternalButtons, customConnectorButtons]); + }, [allRegistryButtons, customConnectorButtons]); const defaultButtonKeys = useMemo(() => new Set(Object.keys(walletRegistry.default)), [walletRegistry]); const defaultButtons = useMemo(() => { // display order: default injected buttons > custom adapter buttons > default non-injected buttons const buttons = [ - ...allExternalButtons.filter((button) => button.hasInjectedWallet && defaultButtonKeys.has(button.name)), + ...allRegistryButtons.filter((button) => button.hasInjectedWallet && defaultButtonKeys.has(button.name)), ...customConnectorButtons, - ...allExternalButtons.filter((button) => !button.hasInjectedWallet && defaultButtonKeys.has(button.name)), + ...allRegistryButtons.filter((button) => !button.hasInjectedWallet && defaultButtonKeys.has(button.name)), ].sort((a, b) => { // favor MetaMask over other wallets if (a.name === WALLET_CONNECTORS.METAMASK && b.name === WALLET_CONNECTORS.METAMASK) { @@ -101,7 +101,7 @@ function ConnectWallet(props: ConnectWalletProps) { return true; }) .filter((button) => selectedChain === "all" || button.chainNamespaces?.includes(selectedChain as ChainNamespaceType)); - }, [allExternalButtons, customConnectorButtons, defaultButtonKeys, selectedChain]); + }, [allRegistryButtons, customConnectorButtons, defaultButtonKeys, selectedChain]); const installedWalletButtons = useMemo(() => { const visibilityMap = connectorVisibilityMap; diff --git a/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.type.ts b/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.type.ts index e1f2f7474..108d72215 100644 --- a/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.type.ts +++ b/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.type.ts @@ -8,7 +8,7 @@ export interface ConnectWalletProps { walletConnectUri: string | undefined; metamaskConnectUri: string | undefined; walletRegistry?: WalletRegistry; - allExternalButtons: ExternalButton[]; + allRegistryButtons: ExternalButton[]; customConnectorButtons: ExternalButton[]; connectorVisibilityMap: Record; deviceDetails: { platform: platform; browser: browser; os: os }; diff --git a/packages/modal/src/ui/components/Login/Login.tsx b/packages/modal/src/ui/components/Login/Login.tsx index 3728df3fb..8a442ce41 100644 --- a/packages/modal/src/ui/components/Login/Login.tsx +++ b/packages/modal/src/ui/components/Login/Login.tsx @@ -50,6 +50,7 @@ function Login(props: LoginProps) { isDark, handleSocialLoginClick, totalExternalWallets, + remainingUndisplayedWallets, isEmailPasswordLessLoginVisible, isSmsPasswordLessLoginVisible, handleExternalWalletBtnClick, @@ -509,7 +510,7 @@ function Login(props: LoginProps) { ))} {/* EXTERNAL WALLETS DISCOVERY */} - {totalExternalWallets > 3 && ( + {remainingUndisplayedWallets > 0 && (