refactor(wallet): fix wallet module relations with app

apps/cowswap-frontend/src/common/hooks/useOnSelectNetwork.ts

@@ -8,7 +8,7 @@ import { ApplicationModal } from 'legacy/state/application/reducer'
 import { updateConnectionError } from 'legacy/state/connection/reducer'
 import { useAppDispatch } from 'legacy/state/hooks'
 
-import { getWeb3ReactConnection } from 'modules/wallet/web3-react/connection'
+import { getWeb3ReactConnection } from 'modules/wallet'
 import { switchChain } from 'modules/wallet/web3-react/hooks/switchChain'
 
 import { useLegacySetChainIdToUrl } from './useLegacySetChainIdToUrl'

apps/cowswap-frontend/src/legacy/components/TransactionConfirmationModal/LegacyConfirmationPendingContent.tsx

@@ -14,9 +14,8 @@ import { shortenAddress } from 'legacy/utils'
 import { getChainCurrencySymbols } from 'legacy/utils/gnosis_chain/hack'
 
 import { getStatusIcon } from 'modules/account/containers/AccountDetails'
-import { useGnosisSafeInfo, useWalletDetails, useWalletInfo } from 'modules/wallet'
+import { getWeb3ReactConnection, useGnosisSafeInfo, useWalletDetails, useWalletInfo } from 'modules/wallet'
 import { getIsMetaMask } from 'modules/wallet/api/utils/connection'
-import { getWeb3ReactConnection } from 'modules/wallet/web3-react/connection'
 import { injectedConnection } from 'modules/wallet/web3-react/connection/injected'
 
 import {

apps/cowswap-frontend/src/legacy/components/analytics/hooks/useAnalyticsReporter.ts

@@ -9,9 +9,8 @@ import { getCLS, getFCP, getFID, getLCP, Metric } from 'web-vitals'
 // Mod imports
 import usePrevious from 'legacy/hooks/usePrevious'
 
-import { useWalletDetails, useWalletInfo } from 'modules/wallet'
+import { getWeb3ReactConnection, useWalletDetails, useWalletInfo } from 'modules/wallet'
 import { getConnectionName, getIsMetaMask } from 'modules/wallet/api/utils/connection'
-import { getWeb3ReactConnection } from 'modules/wallet/web3-react/connection'
 
 import { useGetMarketDimension } from './useGetMarketDimension'
 

apps/cowswap-frontend/src/lib/hooks/useCurrency.ts

@@ -9,8 +9,7 @@ import { TOKEN_SHORTHANDS } from 'legacy/constants/tokens'
 import { useBytes32TokenContract, useTokenContract } from 'legacy/hooks/useContract'
 import { isAddress } from 'legacy/utils'
 
-import { useWalletInfo } from 'modules/wallet'
-import { isChainAllowed } from 'modules/wallet/web3-react/connection'
+import { isChainAllowed, useWalletInfo } from 'modules/wallet'
 
 import { NEVER_RELOAD, useSingleCallResult } from 'lib/hooks/multicall'
 import useNativeCurrency from 'lib/hooks/useNativeCurrency'

apps/cowswap-frontend/src/modules/account/containers/AccountDetails/index.tsx

@@ -19,17 +19,21 @@ import { getExplorerAddressLink } from 'legacy/utils/explorer'
 import { isMobile } from 'legacy/utils/userAgent'
 
 import Activity from 'modules/account/containers/Transaction'
-import { ConnectionType, useDisconnectWallet, useWalletInfo, WalletDetails } from 'modules/wallet'
-import { Identicon } from 'modules/wallet/api/container/Identicon'
-import { useWalletDetails } from 'modules/wallet/api/hooks'
-import { useIsWalletConnect } from 'modules/wallet/web3-react/hooks/useIsWalletConnect'
 import {
+  ConnectionType,
+  useDisconnectWallet,
+  useWalletInfo,
+  WalletDetails,
   getConnectionIcon,
   getConnectionName,
   getIsCoinbaseWallet,
   getIsMetaMask,
-} from 'modules/wallet/api/utils/connection'
-import { getIsHardWareWallet, getWeb3ReactConnection } from 'modules/wallet/web3-react/connection'
+  Identicon,
+  useWalletDetails,
+  useIsWalletConnect,
+  getWeb3ReactConnection,
+  getIsHardWareWallet,
+} from 'modules/wallet'
 
 import { UNSUPPORTED_WALLET_TEXT } from 'common/containers/WalletUnsupportedNetworkBanner'
 import { useIsProviderNetworkUnsupported } from 'common/hooks/useIsProviderNetworkUnsupported'
@@ -194,9 +198,7 @@ export function AccountDetails({
                 )}
               </WalletSelector>
 
-              {(ENSName || account) && (
-                <Copy toCopy={ENSName ? ENSName : account ? account : ''} />
-              )}
+              {(ENSName || account) && <Copy toCopy={ENSName ? ENSName : account ? account : ''} />}
             </WalletWrapper>
 
             <WalletActions>

apps/cowswap-frontend/src/modules/wallet/api/updaters/HwAccountIndexUpdater.tsx

@@ -5,7 +5,8 @@ import { useWeb3React } from '@web3-react/core'
 
 import { useAppSelector } from 'legacy/state/hooks'
 
-import { getIsHardWareWallet, getWeb3ReactConnection } from '../../web3-react/connection'
+import { getIsHardWareWallet } from '../../web3-react/utils/getIsHardWareWallet'
+import { getWeb3ReactConnection } from '../../web3-react/utils/getWeb3ReactConnection'
 import { useWalletInfo } from '../hooks'
 import { hwAccountIndexAtom } from '../state'
 

apps/cowswap-frontend/src/modules/wallet/index.ts

@@ -6,6 +6,7 @@ export * from './web3-react/hooks/useDisconnectWallet'
 export * from './web3-react/hooks/useWalletMetadata'
 export * from './web3-react/hooks/useEagerlyConnect'
 export * from './web3-react/hooks/useOrderedConnections'
+export * from './web3-react//hooks/useIsWalletConnect'
 
 // Updater
 export * from './web3-react/updater'
@@ -18,3 +19,9 @@ export * from './web3-react/containers/AccountSelectorModal/state'
 export * from './web3-react/containers/WalletModal'
 export * from './api/container/Identicon'
 export * from './web3-react/containers/AddToMetamask'
+
+// Utils
+export * from './api/utils/connection'
+export { getIsHardWareWallet } from './web3-react/utils/getIsHardWareWallet'
+export { isChainAllowed } from './web3-react/utils/isChainAllowed'
+export { getWeb3ReactConnection } from './web3-react/utils/getWeb3ReactConnection'

apps/cowswap-frontend/src/modules/wallet/web3-react/connection/index.tsx

@@ -1,102 +1,21 @@
-import { SupportedChainId } from '@cowprotocol/cow-sdk'
 import { Connector } from '@web3-react/types'
 
-import { ALL_SUPPORTED_CHAIN_IDS } from 'legacy/constants/chains'
 import { isMobile } from 'legacy/utils/userAgent'
 
 import { FeatureGuard } from 'common/containers/FeatureGuard'
 
 import { AlphaOption } from './alpha'
 import { AmbireOption } from './ambire'
-import { coinbaseWalletConnection, CoinbaseWalletOption } from './coinbase'
-import { fortmaticConnection } from './formatic'
-import {
-  injectedConnection,
-  InjectedOption,
-  InstallMetaMaskOption,
-  MetaMaskOption,
-  OpenMetaMaskMobileOption,
-} from './injected'
-import { injectedWidgetConnection } from './injectedWidget'
-import { InstallKeystoneOption, keystoneConnection, KeystoneOption } from './keystone'
-import { ledgerConnection, LedgerOption } from './ledger'
-import { networkConnection } from './network'
-import { gnosisSafeConnection } from './safe'
-import { tallyWalletConnection } from './tally'
-import { trezorConnection, TrezorOption } from './trezor'
-import { trustWalletConnection, TrustWalletOption } from './trust'
-import { walletConnectConnection, WalletConnectOption } from './walletConnect'
-import { walletConnectConnectionV2, WalletConnectV2Option } from './walletConnectV2'
-
-import { ConnectionType } from '../../api/types'
-import { getIsCoinbaseWallet, getIsInjected, getIsMetaMask } from '../../api/utils/connection'
-import { Web3ReactConnection } from '../types'
-
-const allowedChainsByWallet: Record<ConnectionType, SupportedChainId[]> = {
-  [ConnectionType.FORTMATIC]: [SupportedChainId.MAINNET],
-  [ConnectionType.INJECTED]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.INJECTED_WIDGET]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.COINBASE_WALLET]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.WALLET_CONNECT]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.WALLET_CONNECT_V2]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.NETWORK]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.GNOSIS_SAFE]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.TALLY]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.TRUST]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.LEDGER]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.TREZOR]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.KEYSTONE]: ALL_SUPPORTED_CHAIN_IDS,
-  [ConnectionType.ALPHA]: [],
-  [ConnectionType.AMBIRE]: [],
-  [ConnectionType.ZENGO]: [],
-}
-
-export function isChainAllowed(connector: Connector, chainId: number): boolean {
-  const connection = getWeb3ReactConnection(connector)
-
-  return allowedChainsByWallet[connection.type].includes(chainId)
-}
-
-const connectionTypeToConnection: Record<ConnectionType, Web3ReactConnection> = {
-  [ConnectionType.INJECTED]: injectedConnection,
-  [ConnectionType.COINBASE_WALLET]: coinbaseWalletConnection,
-  [ConnectionType.WALLET_CONNECT]: walletConnectConnection,
-  [ConnectionType.WALLET_CONNECT_V2]: walletConnectConnectionV2,
-  [ConnectionType.ZENGO]: walletConnectConnection,
-  [ConnectionType.FORTMATIC]: fortmaticConnection,
-  [ConnectionType.NETWORK]: networkConnection,
-  [ConnectionType.GNOSIS_SAFE]: gnosisSafeConnection,
-  [ConnectionType.AMBIRE]: walletConnectConnection,
-  [ConnectionType.ALPHA]: walletConnectConnection,
-  [ConnectionType.TALLY]: tallyWalletConnection,
-  [ConnectionType.TRUST]: trustWalletConnection,
-  [ConnectionType.LEDGER]: ledgerConnection,
-  [ConnectionType.KEYSTONE]: keystoneConnection,
-  [ConnectionType.INJECTED_WIDGET]: injectedWidgetConnection,
-  [ConnectionType.TREZOR]: trezorConnection,
-}
-
-const CONNECTIONS: Web3ReactConnection[] = Object.values(connectionTypeToConnection)
+import { CoinbaseWalletOption } from './coinbase'
+import { InjectedOption, InstallMetaMaskOption, MetaMaskOption, OpenMetaMaskMobileOption } from './injected'
+import { InstallKeystoneOption, KeystoneOption } from './keystone'
+import { LedgerOption } from './ledger'
+import { TrezorOption } from './trezor'
+import { TrustWalletOption } from './trust'
+import { WalletConnectOption } from './walletConnect'
+import { WalletConnectV2Option } from './walletConnectV2'
 
-// TODO: add others
-export const HARDWARE_WALLETS = [ConnectionType.TREZOR] as const
-
-export type HardWareWallet = (typeof HARDWARE_WALLETS)[number]
-
-export const getIsHardWareWallet = (connectionType: ConnectionType) =>
-  HARDWARE_WALLETS.includes(connectionType as HardWareWallet)
-
-export function getWeb3ReactConnection(c: Connector | ConnectionType): Web3ReactConnection {
-  if (c instanceof Connector) {
-    const connection = CONNECTIONS.find((connection) => connection.connector === c)
-    if (!connection) {
-      throw Error('unsupported connector')
-    }
-    return connection
-  }
-
-  return connectionTypeToConnection[c]
-}
+import { getIsCoinbaseWallet, getIsInjected, getIsMetaMask } from '../../api/utils/connection'
 
 export type TryActivation = (connector: Connector) => void
 

apps/cowswap-frontend/src/modules/wallet/web3-react/containers/AccountSelectorModal/accountsLoaders.ts

@@ -1,6 +1,6 @@
 import { ConnectionType } from '../../../api/types'
-import { HardWareWallet } from '../../connection'
 import { trezorConnection } from '../../connection/trezor'
+import { HardWareWallet } from '../../utils/getIsHardWareWallet'
 
 interface WalletAccountsLoader {
   getAccounts(): string[] | null

apps/cowswap-frontend/src/modules/wallet/web3-react/containers/AccountSelectorModal/index.tsx

@@ -16,8 +16,9 @@ import * as styledEl from './styled'
 
 import { hwAccountIndexAtom } from '../../../api/state'
 import { getConnectionIcon, getConnectionName } from '../../../api/utils/connection'
-import { getWeb3ReactConnection, HardWareWallet } from '../../connection'
 import { AccountIndexSelect } from '../../pure/AccountIndexSelect'
+import { HardWareWallet } from '../../utils/getIsHardWareWallet'
+import { getWeb3ReactConnection } from '../../utils/getWeb3ReactConnection'
 
 export function AccountSelectorModal() {
   const { isOpen } = useAtomValue(accountSelectorModalAtom)

apps/cowswap-frontend/src/modules/wallet/web3-react/containers/WalletModal/index.tsx

@@ -17,7 +17,8 @@ import { getCurrentChainIdFromUrl } from 'utils/getCurrentChainIdFromUrl'
 import { useWalletInfo } from '../../../api/hooks'
 import { WalletModal as WalletModalPure, WalletModalView } from '../../../api/pure/WalletModal'
 import { ConnectionType } from '../../../api/types'
-import { getIsHardWareWallet, getWeb3ReactConnection } from '../../connection'
+import { getIsHardWareWallet } from '../../utils/getIsHardWareWallet'
+import { getWeb3ReactConnection } from '../../utils/getWeb3ReactConnection'
 import { toggleAccountSelectorModalAtom } from '../AccountSelectorModal/state'
 
 export function WalletModal() {

apps/cowswap-frontend/src/modules/wallet/web3-react/containers/Web3Status/index.tsx

@@ -10,7 +10,7 @@ import { useCategorizeRecentActivity } from 'common/hooks/useCategorizeRecentAct
 import { useWalletDetails, useWalletInfo } from '../../../api/hooks'
 import { Web3StatusInner } from '../../../api/pure/Web3StatusInner'
 import { Wrapper } from '../../../api/pure/Web3StatusInner/styled'
-import { getWeb3ReactConnection } from '../../connection'
+import { getWeb3ReactConnection } from '../../utils/getWeb3ReactConnection'
 import { AccountSelectorModal } from '../AccountSelectorModal'
 import { WalletModal } from '../WalletModal'
 

apps/cowswap-frontend/src/modules/wallet/web3-react/hooks/switchChain.ts

@@ -7,7 +7,8 @@ import { RPC_URLS } from 'legacy/constants/networks'
 import { getIsWalletConnect } from './useIsWalletConnect'
 
 import { ConnectionType } from '../../api/types'
-import { getWeb3ReactConnection, isChainAllowed } from '../connection'
+import { getWeb3ReactConnection } from '../utils/getWeb3ReactConnection'
+import { isChainAllowed } from '../utils/isChainAllowed'
 
 function getRpcUrls(chainId: SupportedChainId): [string] {
   switch (chainId) {

apps/cowswap-frontend/src/modules/wallet/web3-react/hooks/useEagerlyConnect.ts

@@ -8,10 +8,10 @@ import { isInjectedWidget } from 'common/utils/isInjectedWidget'
 import { getCurrentChainIdFromUrl } from 'utils/getCurrentChainIdFromUrl'
 
 import { BACKFILLABLE_WALLETS } from '../../api/types'
-import { getWeb3ReactConnection } from '../connection'
 import { injectedWidgetConnection } from '../connection/injectedWidget'
 import { networkConnection } from '../connection/network'
 import { gnosisSafeConnection } from '../connection/safe'
+import { getWeb3ReactConnection } from '../utils/getWeb3ReactConnection'
 
 async function connect(connector: Connector) {
   const chainId = getCurrentChainIdFromUrl()

apps/cowswap-frontend/src/modules/wallet/web3-react/hooks/useIsWalletConnect.ts

@@ -4,7 +4,7 @@ import { useWeb3React } from '@web3-react/core'
 import { Connector } from '@web3-react/types'
 
 import { ConnectionType } from '../../api/types'
-import { getWeb3ReactConnection } from '../connection'
+import { getWeb3ReactConnection } from '../utils/getWeb3ReactConnection'
 
 export function useIsWalletConnect(): boolean {
   const { connector } = useWeb3React()

apps/cowswap-frontend/src/modules/wallet/web3-react/hooks/useOrderedConnections.ts

@@ -5,7 +5,7 @@ import { useAppSelector } from 'legacy/state/hooks'
 import { isInjectedWidget } from 'common/utils/isInjectedWidget'
 
 import { BACKFILLABLE_WALLETS, ConnectionType } from '../../api/types'
-import { getWeb3ReactConnection } from '../connection'
+import { getWeb3ReactConnection } from '../utils/getWeb3ReactConnection'
 
 const SELECTABLE_WALLETS = [...BACKFILLABLE_WALLETS, ConnectionType.FORTMATIC]
 

apps/cowswap-frontend/src/modules/wallet/web3-react/hooks/useWalletMetadata.ts

@@ -5,7 +5,7 @@ import { useWeb3React } from '@web3-react/core'
 import { default as AlphaImage } from '../../api/assets/alpha.svg'
 import { ConnectionType } from '../../api/types'
 import { getIsAlphaWallet } from '../../api/utils/connection'
-import { getWeb3ReactConnection } from '../connection'
+import { getWeb3ReactConnection } from '../utils/getWeb3ReactConnection'
 
 const WC_DESKTOP_GNOSIS_SAFE_APP_NAME = 'WalletConnect Safe App'
 const WC_MOBILE_GNOSIS_SAFE_APP_NAME = 'Safe'

apps/cowswap-frontend/src/modules/wallet/web3-react/utils/getIsHardWareWallet.ts

@@ -0,0 +1,9 @@
+import { ConnectionType } from '../../api/types'
+
+// TODO: add others
+export const HARDWARE_WALLETS = [ConnectionType.TREZOR] as const
+
+export type HardWareWallet = (typeof HARDWARE_WALLETS)[number]
+
+export const getIsHardWareWallet = (connectionType: ConnectionType) =>
+  HARDWARE_WALLETS.includes(connectionType as HardWareWallet)

apps/cowswap-frontend/src/modules/wallet/web3-react/utils/getWeb3ReactConnection.ts

@@ -0,0 +1,49 @@
+import { Connector } from '@web3-react/types'
+
+import { ConnectionType } from '../../api/types'
+import { coinbaseWalletConnection } from '../connection/coinbase'
+import { fortmaticConnection } from '../connection/formatic'
+import { injectedConnection } from '../connection/injected'
+import { injectedWidgetConnection } from '../connection/injectedWidget'
+import { keystoneConnection } from '../connection/keystone'
+import { ledgerConnection } from '../connection/ledger'
+import { networkConnection } from '../connection/network'
+import { gnosisSafeConnection } from '../connection/safe'
+import { tallyWalletConnection } from '../connection/tally'
+import { trezorConnection } from '../connection/trezor'
+import { trustWalletConnection } from '../connection/trust'
+import { walletConnectConnection } from '../connection/walletConnect'
+import { walletConnectConnectionV2 } from '../connection/walletConnectV2'
+import { Web3ReactConnection } from '../types'
+
+const connectionTypeToConnection: Record<ConnectionType, Web3ReactConnection> = {
+  [ConnectionType.INJECTED]: injectedConnection,
+  [ConnectionType.COINBASE_WALLET]: coinbaseWalletConnection,
+  [ConnectionType.WALLET_CONNECT]: walletConnectConnection,
+  [ConnectionType.WALLET_CONNECT_V2]: walletConnectConnectionV2,
+  [ConnectionType.ZENGO]: walletConnectConnection,
+  [ConnectionType.FORTMATIC]: fortmaticConnection,
+  [ConnectionType.NETWORK]: networkConnection,
+  [ConnectionType.GNOSIS_SAFE]: gnosisSafeConnection,
+  [ConnectionType.AMBIRE]: walletConnectConnection,
+  [ConnectionType.ALPHA]: walletConnectConnection,
+  [ConnectionType.TALLY]: tallyWalletConnection,
+  [ConnectionType.TRUST]: trustWalletConnection,
+  [ConnectionType.LEDGER]: ledgerConnection,
+  [ConnectionType.KEYSTONE]: keystoneConnection,
+  [ConnectionType.INJECTED_WIDGET]: injectedWidgetConnection,
+  [ConnectionType.TREZOR]: trezorConnection,
+}
+const CONNECTIONS: Web3ReactConnection[] = Object.values(connectionTypeToConnection)
+
+export function getWeb3ReactConnection(c: Connector | ConnectionType): Web3ReactConnection {
+  if (c instanceof Connector) {
+    const connection = CONNECTIONS.find((connection) => connection.connector === c)
+    if (!connection) {
+      throw Error('unsupported connector')
+    }
+    return connection
+  }
+
+  return connectionTypeToConnection[c]
+}