diff --git a/packages/frontend/src/components/common/wallet_selector/WalletSelectorGetAWallet.js b/packages/frontend/src/components/common/wallet_selector/WalletSelectorGetAWallet.js index 32fd68aa67..1b3ec4cfad 100644 --- a/packages/frontend/src/components/common/wallet_selector/WalletSelectorGetAWallet.js +++ b/packages/frontend/src/components/common/wallet_selector/WalletSelectorGetAWallet.js @@ -26,10 +26,10 @@ export function WalletSelectorGetAWallet({ showModal, setShowModal }) { - - const walletWrapperDiv = document.getElementById('near-wallet-selector-modal'); - walletWrapperDiv?.classList.add('wallet-selector-get-a-wallet-modal'); - + if (showModal === 'more-near-wallets') { + const walletWrapperDiv = document.getElementById('near-wallet-selector-modal'); + walletWrapperDiv?.classList.add('wallet-selector-get-a-wallet-modal'); + } useEffect(() => { const initSelector = async () => { diff --git a/packages/frontend/src/components/wallet-migration/modals/WalletSelectorModal/WalletSelectorContent.jsx b/packages/frontend/src/components/wallet-migration/modals/WalletSelectorModal/WalletSelectorContent.jsx index 38e51a5430..f88ac739bd 100644 --- a/packages/frontend/src/components/wallet-migration/modals/WalletSelectorModal/WalletSelectorContent.jsx +++ b/packages/frontend/src/components/wallet-migration/modals/WalletSelectorModal/WalletSelectorContent.jsx @@ -1,15 +1,23 @@ import { useEffect } from 'react'; +import { useLocation } from 'react-router-dom'; import { useExportAccountSelector } from './WalletSelectorExportContext'; export const WalletSelectorContent = () => { const { ExportModal } = useExportAccountSelector(); - + const location = useLocation(); useEffect(() => { - //TODO: this is to mute css class injected from WalletSelectorGetAWallet component - const walletWrapperDiv = document.getElementById('near-wallet-selector-modal'); - walletWrapperDiv?.classList.remove('wallet-selector-get-a-wallet-modal'); - ExportModal?.show(); - }); + if (ExportModal) { + //TODO: this is to mute css class injected from WalletSelectorGetAWallet component + const walletWrapperDiv = document.getElementById('near-wallet-selector-modal'); + walletWrapperDiv?.classList.remove('wallet-selector-get-a-wallet-modal'); + ExportModal?.show(); + } + }, [ExportModal]); + + // On location change, close the modal + useEffect(() => { + ExportModal?.hide(); + }, [location]); return null; };