diff --git a/src/components/ui/menus/AccountDisplay/MenuItemNetwork.tsx b/src/components/ui/menus/AccountDisplay/MenuItemNetwork.tsx index 3311fe8903..8df4e47ff6 100644 --- a/src/components/ui/menus/AccountDisplay/MenuItemNetwork.tsx +++ b/src/components/ui/menus/AccountDisplay/MenuItemNetwork.tsx @@ -1,13 +1,23 @@ -import { Box, Flex, Text } from '@chakra-ui/react'; +import { Box, Flex, Select, Text } from '@chakra-ui/react'; import { useTranslation } from 'react-i18next'; -import { useNetworkConfig } from '../../../../providers/NetworkConfig/NetworkConfigProvider'; +import { useSwitchNetwork } from 'wagmi'; +import { + supportedChains, + useNetworkConfig, +} from '../../../../providers/NetworkConfig/NetworkConfigProvider'; /** * Network display for menu */ export function MenuItemNetwork() { - const { name, color } = useNetworkConfig(); const { t } = useTranslation('menu'); + const { chainId } = useNetworkConfig(); + const { switchNetwork } = useSwitchNetwork(); + + if (!switchNetwork) { + return null; + } + return ( {t('network')} - { + e.preventDefault(); + switchNetwork(Number(e.target.value)); + }} + value={chainId} > - - - {name} - - + {supportedChains.map(chain => ( + + ))} + );