diff --git a/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakeCard.tsx b/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakeCard.tsx index 380dab36cd..f466000f6d 100644 --- a/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakeCard.tsx +++ b/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakeCard.tsx @@ -15,6 +15,7 @@ import { } from '@webb-tools/webb-ui-components'; import { TANGLE_RESTAKING_PARACHAIN_LOCAL_DEV_NETWORK } from '@webb-tools/webb-ui-components/constants/networks'; import { FC, useCallback, useMemo, useState } from 'react'; +import { z } from 'zod'; import { LST_PREFIX, @@ -47,6 +48,7 @@ const LiquidStakeCard: FC = () => { const searchParams = useTypedSearchParams({ amount: (value) => new BN(value), + chainId: (value) => z.nativeEnum(ParachainChainId).parse(parseInt(value)), }); // TODO: Must set the amount ONCE, if it is provided in the URL search params and parsed correctly. Setting the value once might prove difficult unless a useMemo is given to the `useTypedSearchParams` hook to maintain 'stability'. diff --git a/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakingInput.tsx b/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakingInput.tsx index 7a9344200a..ebc0814169 100644 --- a/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakingInput.tsx +++ b/apps/tangle-dapp/components/LiquidStaking/stakeAndUnstake/LiquidStakingInput.tsx @@ -14,8 +14,8 @@ import { twMerge } from 'tailwind-merge'; import { LiquidStakingToken, - LS_CHAIN_TO_NETWORK_NAME, LST_PREFIX, + PARACHAIN_CHAIN_MAP, ParachainChainId, } from '../../../constants/liquidStaking'; import { ERROR_NOT_ENOUGH_BALANCE } from '../../../containers/ManageProfileModalContainer/Independent/IndependentAllocationInput'; @@ -160,6 +160,7 @@ const ChainSelector: FC = ({ setChain, }) => { const isReadOnly = setChain === undefined; + const networkName = PARACHAIN_CHAIN_MAP[selectedChainId].networkName; const base = (
@@ -167,7 +168,7 @@ const ChainSelector: FC = ({ - {LS_CHAIN_TO_NETWORK_NAME[selectedChainId]} + {networkName}
@@ -192,7 +193,7 @@ const ChainSelector: FC = ({ onSelect={() => setChain(chainId)} className="px-3 normal-case" > - {LS_CHAIN_TO_NETWORK_NAME[chainId]} + {networkName} ); diff --git a/apps/tangle-dapp/constants/liquidStaking.ts b/apps/tangle-dapp/constants/liquidStaking.ts index 5d6b48b25a..5d54a67d2c 100644 --- a/apps/tangle-dapp/constants/liquidStaking.ts +++ b/apps/tangle-dapp/constants/liquidStaking.ts @@ -8,12 +8,12 @@ import { TANGLE_RESTAKING_PARACHAIN_LOCAL_DEV_NETWORK } from '@webb-tools/webb-u import { StaticAssetPath } from '.'; export enum ParachainChainId { - POLKADOT = 'Polkadot', - PHALA = 'Phala', - MOONBEAM = 'Moonbeam', - ASTAR = 'Astar', - MANTA = 'Manta', - TANGLE_RESTAKING_PARACHAIN = 'Tangle Parachain', + POLKADOT, + PHALA, + MOONBEAM, + ASTAR, + MANTA, + TANGLE_RESTAKING_PARACHAIN, } export enum LiquidStakingToken { @@ -136,16 +136,6 @@ export const PARACHAIN_CHAIN_MAP: Record = export const LIQUID_STAKING_CHAINS: ParachainChainDef[] = Object.values(PARACHAIN_CHAIN_MAP); -// TODO: Instead of mapping to names, map to network/chain definitions themselves. This avoids redundancy and relies on a centralized definition for the network/chain which is better, since it simplifies future refactoring. -export const LS_CHAIN_TO_NETWORK_NAME: Record = { - [ParachainChainId.POLKADOT]: 'Polkadot Mainnet', - [ParachainChainId.PHALA]: 'Phala', - [ParachainChainId.MOONBEAM]: 'Moonbeam', - [ParachainChainId.ASTAR]: 'Astar', - [ParachainChainId.MANTA]: 'Manta', - [ParachainChainId.TANGLE_RESTAKING_PARACHAIN]: 'Tangle Parachain', -}; - export const TVS_TOOLTIP = "Total Value Staked (TVS) refers to the total value of assets that are currently staked for this network in fiat currency. Generally used as an indicator of a network's security and trustworthiness.";