diff --git a/src/components/Header/web3/WalletModal/index.tsx b/src/components/Header/web3/WalletModal/index.tsx index b2597d2a5e..e0122f3090 100644 --- a/src/components/Header/web3/WalletModal/index.tsx +++ b/src/components/Header/web3/WalletModal/index.tsx @@ -254,12 +254,17 @@ export default function WalletModal() { } }) - const sortWallets = (walletA: WalletInfoExtended, walletB: WalletInfoExtended): -1 | 0 | 1 => { - if (!walletA.installLink && !walletA.isOverridden && !walletB.installLink && !walletB.isOverridden) { - return walletA.name < walletB.name ? -1 : 1 - } - if (walletA.installLink || walletA.isOverridden) return 1 - return -1 + const sortPoint: { [readyState in WalletReadyState]: number } = { + [WalletReadyState.Installed]: 1000, + [WalletReadyState.Loadable]: 100, + [WalletReadyState.NotDetected]: 10, + [WalletReadyState.Unsupported]: 1, + } + const sortWallets = (walletA: WalletInfoExtended, walletB: WalletInfoExtended): number => { + return ( + sortPoint[walletB.readyState || WalletReadyState.Unsupported] - + sortPoint[walletA.readyState || WalletReadyState.Unsupported] + ) } return ( parsedWalletList diff --git a/src/constants/wallets.ts b/src/constants/wallets.ts index 539017d106..89a9d8bc1b 100644 --- a/src/constants/wallets.ts +++ b/src/constants/wallets.ts @@ -167,7 +167,6 @@ export const SUPPORTED_WALLETS = { name: 'Browser Wallet', icon: INJECTED_DARK_ICON, iconLight: INJECTED_LIGHT_ICON, - installLink: 'https://metamask.io/download', readyState: detectInjected, } as EVMWalletInfo, METAMASK: { @@ -179,32 +178,14 @@ export const SUPPORTED_WALLETS = { installLink: 'https://metamask.io/download', readyState: detectMetamask, } as EVMWalletInfo, - BLOCTO: { - connector: blocto, - hooks: bloctoHooks, - name: 'Blocto', - icon: BLOCTO, - iconLight: BLOCTO, - installLink: 'https://www.blocto.io/download', - readyState: detectBlocto, - } as EVMWalletInfo, - BLOCTO_INJECTED: { - connector: bloctoInject, - hooks: bloctoInjectHooks, - name: 'Blocto', - icon: BLOCTO, - iconLight: BLOCTO, - installLink: 'https://www.blocto.io/download', - readyState: detectBloctoInjected, - } as EVMWalletInfo, - SAFE: { - connector: gnosisSafe, - hooks: gnosisSafeHooks, - name: 'Safe', - icon: SAFE, - iconLight: SAFE, - installLink: 'https://safe.global/wallet', - readyState: detectSafe, + KRYSTAL: { + connector: krystal, + hooks: krystalHooks, + name: 'Krystal', + icon: KRYSTAL, + iconLight: KRYSTAL, + installLink: 'https://wallet.krystal.app', + readyState: detectKrystal, } as EVMWalletInfo, RABBY: { connector: rabby, @@ -215,14 +196,14 @@ export const SUPPORTED_WALLETS = { installLink: 'https://rabby.io', readyState: detectRabby, } as EVMWalletInfo, - KRYSTAL: { - connector: krystal, - hooks: krystalHooks, - name: 'Krystal', - icon: KRYSTAL, - iconLight: KRYSTAL, - installLink: 'https://wallet.krystal.app', - readyState: detectKrystal, + TRUST_WALLET: { + connector: trust, + hooks: trustHooks, + name: 'Trust Wallet', + icon: TRUSTWALLET, + iconLight: TRUSTWALLET, + installLink: 'https://trustwallet.com/vi/deeplink', + readyState: detectTrustWallet, } as EVMWalletInfo, BRAVE: { connector: brave, @@ -264,9 +245,34 @@ export const SUPPORTED_WALLETS = { name: 'WalletConnect', icon: WALLETCONNECT, iconLight: WALLETCONNECT, - installLink: 'https://walletconnect.com/', readyState: () => WalletReadyState.Installed, } as EVMWalletInfo, + SAFE: { + connector: gnosisSafe, + hooks: gnosisSafeHooks, + name: 'Safe', + icon: SAFE, + iconLight: SAFE, + installLink: 'https://safe.global/wallet', + readyState: detectSafe, + } as EVMWalletInfo, + BLOCTO: { + connector: blocto, + hooks: bloctoHooks, + name: 'Blocto', + icon: BLOCTO, + iconLight: BLOCTO, + installLink: 'https://www.blocto.io/download', + readyState: detectBlocto, + } as EVMWalletInfo, + BLOCTO_INJECTED: { + connector: bloctoInject, + hooks: bloctoInjectHooks, + name: 'Blocto', + icon: BLOCTO, + iconLight: BLOCTO, + readyState: detectBloctoInjected, + } as EVMWalletInfo, SOLFLARE: { adapter: solflareAdapter, name: 'Solflare', @@ -291,15 +297,6 @@ export const SUPPORTED_WALLETS = { installLink: slopeAdapter.url, readyStateSolana: () => (isMobile ? WalletReadyState.Unsupported : slopeAdapter.readyState), } as SolanaWalletInfo, - TRUST_WALLET: { - connector: trust, - hooks: trustHooks, - name: 'Trust Wallet', - icon: TRUSTWALLET, - iconLight: TRUSTWALLET, - installLink: 'https://trustwallet.com/vi/deeplink', - readyState: detectTrustWallet, - } as EVMWalletInfo, } as const export type SUPPORTED_WALLET = keyof typeof SUPPORTED_WALLETS