Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mezoification: Add base state and UI elements #3785

Open
wants to merge 17 commits into
base: main
Choose a base branch
from
Open

Mezoification: Add base state and UI elements #3785

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
5bb9810
Add active campaigns to UI state
hyphenized Feb 20, 2025
0f25b31
Add onDismiss option to notifications dispatcher
hyphenized Feb 20, 2025
0a7d996
Added campaign eligibility checks and notifications
hyphenized Feb 20, 2025
0ac12cf
Watch for borrowing transactions
hyphenized Feb 20, 2025
141f7de
Expose analytics uuid
hyphenized Feb 20, 2025
9c2ac79
Add campaign banner
hyphenized Feb 20, 2025
52bd1e9
Fix broken notifications handlers
hyphenized Feb 21, 2025
ee66fe0
Update notifications text
hyphenized Feb 28, 2025
6422370
Add campaign banners
hyphenized Feb 28, 2025
789b942
Fix flaky test
hyphenized Feb 28, 2025
ef04377
Add new protocol ui badge
hyphenized Mar 3, 2025
ae1f3c5
Update banners
hyphenized Mar 3, 2025
09361e2
Update display hierarchy
hyphenized Mar 3, 2025
77f3ba0
Remove stale comment
hyphenized Mar 3, 2025
4a9f079
Default to show test network visibility
hyphenized Mar 3, 2025
e56f90d
Do not allow hidden testnet to remain as current network
hyphenized Mar 4, 2025
4671a6e
Force-toggle testnets visibility in network switcher (#3793)
Shadowfiend Mar 6, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions background/constants/networks.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ export const ZK_SYNC: EVMNetwork = {
}

export const MEZO_TESTNET: EVMNetwork = {
name: "Mezo Testnet",
name: "Mezo matsnet",
baseAsset: MEZO_BTC,
chainID: "31611",
family: "EVM",
Expand Down Expand Up @@ -169,7 +169,7 @@ export const NETWORK_BY_CHAIN_ID = {
}

export const TEST_NETWORK_BY_CHAIN_ID = new Set(
[SEPOLIA, ARBITRUM_SEPOLIA].map((network) => network.chainID),
[MEZO_TESTNET, SEPOLIA, ARBITRUM_SEPOLIA].map((network) => network.chainID),
)

// Networks that are not added to this struct will
Expand Down
8 changes: 8 additions & 0 deletions background/redux-slices/selectors/networks.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,3 +28,11 @@ export const selectCustomNetworks = createSelector(
(network) => !DEFAULT_NETWORKS_BY_CHAIN_ID.has(network.chainID),
),
)

export const selectTestnetNetworks = createSelector(
selectEVMNetworks,
(evmNetworks) =>
evmNetworks.filter((network) =>
TEST_NETWORK_BY_CHAIN_ID.has(network.chainID),
),
)
49 changes: 21 additions & 28 deletions ui/components/TopMenu/TopMenuProtocolList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,10 @@ import {
import { EVMNetwork, sameNetwork } from "@tallyho/tally-background/networks"
import { selectCurrentNetwork } from "@tallyho/tally-background/redux-slices/selectors"
import { selectShowTestNetworks } from "@tallyho/tally-background/redux-slices/ui"
import { selectProductionEVMNetworks } from "@tallyho/tally-background/redux-slices/selectors/networks"
import {
selectProductionEVMNetworks,
selectTestnetNetworks,
} from "@tallyho/tally-background/redux-slices/selectors/networks"
import { useTranslation } from "react-i18next"
import { useBackgroundSelector } from "../../hooks"
import TopMenuProtocolListItem from "./TopMenuProtocolListItem"
Expand All @@ -25,7 +28,6 @@ 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"),
Expand All @@ -37,35 +39,26 @@ export const productionNetworkInfo = {

const disabledChainIDs = [ARBITRUM_NOVA.chainID]

const testNetworks = [
{
network: SEPOLIA,
info: i18n.t("protocol.testnet"),
isDisabled: false,
},
{
network: ARBITRUM_SEPOLIA,
info: i18n.t("protocol.testnet"),
isDisabled: false,
},
]
const testNetworkInfo = {
[MEZO_TESTNET.chainID]: i18n.t("protocol.mezoTestnet"),
[SEPOLIA.chainID]: i18n.t("protocol.testnet"),
[ARBITRUM_SEPOLIA.chainID]: i18n.t("protocol.testnet"),
}

type TopMenuProtocolListProps = {
onProtocolChange: (network: EVMNetwork) => void
}

/**
* Places Ethereum and Mezo network above other networks
* Places Mezo network above other networks
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ngl I would love to kill this sort function. Its main purpose is to boost matsnet in the list if people have previously added it, is that right?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yup that's pretty much all it does. Currently testnets are hardcoded so we could remove it and use the hardcoded order but that seems a bit dirty 👀

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does it work even if the user had previously added it as a custom network? If so, then let's rely on the hardcoded order for now.

*/
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
return 0
default:
return 2
return 1
}
}
return getPriority(a) - getPriority(b)
Expand All @@ -78,15 +71,16 @@ export default function TopMenuProtocolList({
const currentNetwork = useBackgroundSelector(selectCurrentNetwork)
const showTestNetworks = useBackgroundSelector(selectShowTestNetworks)
const productionNetworks = useBackgroundSelector(selectProductionEVMNetworks)
const testnetNetworks = useBackgroundSelector(selectTestnetNetworks)

const builtinNetworks = productionNetworks
.filter(isBuiltInNetwork)
.sort(sortByNetworkPriority)
const builtinNetworks = productionNetworks.filter(isBuiltInNetwork)

const customNetworks = productionNetworks.filter(
(network) => !isBuiltInNetwork(network),
)

const testNetworks = testnetNetworks.sort(sortByNetworkPriority)

return (
<div className="container">
<div className="networks_list">
Expand Down Expand Up @@ -131,14 +125,13 @@ export default function TopMenuProtocolList({
</div>
<div className="divider_line" />
</li>
{testNetworks.map((info) => (
{testNetworks.map((network) => (
<TopMenuProtocolListItem
isSelected={sameNetwork(currentNetwork, info.network)}
key={info.network.name}
network={info.network}
info={info.info}
isSelected={sameNetwork(currentNetwork, network)}
key={network.name}
network={network}
info={testNetworkInfo[network.chainID]}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know this is descriptively named info lol—is this the description that lives under the network name? If so maybe let's rename to description (not a blocker).

onSelect={onProtocolChange}
isDisabled={info.isDisabled ?? false}
/>
))}
</>
Expand Down
0 ...images/networks/[email protected] → ...images/networks/[email protected]
View file
Open in desktop
File renamed without changes
0 ui/public/images/networks/[email protected] → ui/public/images/networks/[email protected]
View file
Open in desktop
File renamed without changes