diff --git a/ui/_locales/en/messages.json b/ui/_locales/en/messages.json index 028224334..986729087 100644 --- a/ui/_locales/en/messages.json +++ b/ui/_locales/en/messages.json @@ -544,6 +544,7 @@ "popupEdition": "Community Edition", "protocol": { "mainnet": "Mainnet", + "mezoTestnet": "Mezo (Testnet)", "beta": "Mainnet (beta)", "testnet": "Test Network", "l2": "L2 scaling solution", diff --git a/ui/components/TopMenu/TopMenuProtocolList.tsx b/ui/components/TopMenu/TopMenuProtocolList.tsx index c4caeefd9..93ef7e92b 100644 --- a/ui/components/TopMenu/TopMenuProtocolList.tsx +++ b/ui/components/TopMenu/TopMenuProtocolList.tsx @@ -11,6 +11,7 @@ import { OPTIMISM, POLYGON, ROOTSTOCK, + MEZO_TESTNET, } from "@tallyho/tally-background/constants" import { EVMNetwork, sameNetwork } from "@tallyho/tally-background/networks" import { selectCurrentNetwork } from "@tallyho/tally-background/redux-slices/selectors" @@ -24,6 +25,7 @@ import { i18n } from "../../_locales/i18n" export const productionNetworkInfo = { [ETHEREUM.chainID]: i18n.t("protocol.mainnet"), + [MEZO_TESTNET.chainID]: i18n.t("protocol.mezoTestnet"), [POLYGON.chainID]: i18n.t("protocol.l2"), [OPTIMISM.chainID]: i18n.t("protocol.l2"), [ARBITRUM_ONE.chainID]: i18n.t("protocol.l2"), @@ -52,6 +54,23 @@ type TopMenuProtocolListProps = { onProtocolChange: (network: EVMNetwork) => void } +/** + * Places Ethereum and Mezo network above other networks + */ +const sortByNetworkPriority = (a: EVMNetwork, b: EVMNetwork) => { + const getPriority = (network: EVMNetwork) => { + switch (true) { + case sameNetwork(ETHEREUM, network): + return 0 + case sameNetwork(MEZO_TESTNET, network): + return 1 + default: + return 2 + } + } + return getPriority(a) - getPriority(b) +} + export default function TopMenuProtocolList({ onProtocolChange, }: TopMenuProtocolListProps): ReactElement { @@ -60,7 +79,10 @@ export default function TopMenuProtocolList({ const showTestNetworks = useBackgroundSelector(selectShowTestNetworks) const productionNetworks = useBackgroundSelector(selectProductionEVMNetworks) - const builtinNetworks = productionNetworks.filter(isBuiltInNetwork) + const builtinNetworks = productionNetworks + .filter(isBuiltInNetwork) + .sort(sortByNetworkPriority) + const customNetworks = productionNetworks.filter( (network) => !isBuiltInNetwork(network), )