diff --git a/public/locales/en/staking.json b/public/locales/en/staking.json index 0a6795cc..2030bf54 100644 --- a/public/locales/en/staking.json +++ b/public/locales/en/staking.json @@ -92,7 +92,7 @@ "available": "Available", "memo": "Memo", "memoError": { - "tooLong": "" + "tooLongMemo": "Please enter a smaller memo" }, "success": "Your amount has been staked", "title": "Stake with Forbole", diff --git a/public/locales/zh-CN/staking.json b/public/locales/zh-CN/staking.json index 7ac455fe..fbbca34b 100644 --- a/public/locales/zh-CN/staking.json +++ b/public/locales/zh-CN/staking.json @@ -92,7 +92,7 @@ "available": "Available", "memo": "Memo", "memoError": { - "tooLong": "" + "tooLongMemo": "Please enter a smaller memo" }, "success": "Your amount has been staked", "title": "Stake with forbole", diff --git a/public/locales/zh-HK/staking.json b/public/locales/zh-HK/staking.json index 6caa383e..b322bcf5 100644 --- a/public/locales/zh-HK/staking.json +++ b/public/locales/zh-HK/staking.json @@ -92,7 +92,7 @@ "available": "Available", "memo": "Memo", "memoError": { - "tooLong": "" + "tooLongMemo": "Please enter a smaller memo" }, "success": "Your amount has been staked", "title": "Stake with forbole", diff --git a/src/screens/staking/components/staking_section/claim_rewards_modal.tsx b/src/screens/staking/components/staking_section/claim_rewards_modal.tsx index dd71a544..e6409033 100644 --- a/src/screens/staking/components/staking_section/claim_rewards_modal.tsx +++ b/src/screens/staking/components/staking_section/claim_rewards_modal.tsx @@ -1,6 +1,6 @@ /* eslint-disable no-console */ import useTranslation from "next-translate/useTranslation"; -import { useContext, useState } from "react"; +import { useContext } from "react"; import HighlightButton from "@src/components/highlight-button"; import { toastSuccess } from "@src/components/notification"; @@ -9,7 +9,6 @@ import { setSelectedAccount, } from "@src/screens/staking/lib/context"; import { claimRewards } from "@src/screens/staking/lib/context/operations"; -import { ChainId } from "@src/screens/staking/lib/context/types"; import ModalBase from "./modal_base"; import NetworksSelect from "./networks_select"; @@ -18,10 +17,6 @@ const ClaimRewardsModal = () => { const { setState: setStakingState, state: stakingState } = useContext(StakingContext); - const [selectedNetwork, setSelectedNetwork] = useState( - ChainId.CosmosHubTestnet, - ); - const { t } = useTranslation("staking"); const { selectedAccount, selectedAction } = stakingState; @@ -34,7 +29,7 @@ const ClaimRewardsModal = () => { open={isOpen} title={t("claimRewards.title")} > - +
Gas Fee
0.002 ATOM
diff --git a/src/screens/staking/components/staking_section/modal_base.module.scss b/src/screens/staking/components/staking_section/modal_base.module.scss index 0ff915d7..8aa8ef3f 100644 --- a/src/screens/staking/components/staking_section/modal_base.module.scss +++ b/src/screens/staking/components/staking_section/modal_base.module.scss @@ -49,6 +49,7 @@ } .modal { + min-height: 100vh; overflow: auto; } diff --git a/src/screens/staking/components/staking_section/networks_select.tsx b/src/screens/staking/components/staking_section/networks_select.tsx index 712cb9c1..e136b4b6 100644 --- a/src/screens/staking/components/staking_section/networks_select.tsx +++ b/src/screens/staking/components/staking_section/networks_select.tsx @@ -1,12 +1,17 @@ import MenuItem from "@mui/material/MenuItem"; import Select from "@mui/material/Select"; +import { useContext } from "react"; -import { - ChainId, - chainIdToNetworkKey, -} from "@src/screens/staking/lib/context/types"; +import type { Account, ChainId } from "@src/screens/staking/lib/context/types"; +import { chainIdToNetworkKey } from "@src/screens/staking/lib/context/types"; import { getNetworkInfo } from "@src/utils/network_info"; +import { + StakingContext, + getSelectedAccount, + setSelectedAccount, +} from "../../lib/context"; +import { sortAccounts } from "../../lib/context/formatters"; import * as styles from "./networks_select.module.scss"; const ITEM_HEIGHT = 48; @@ -23,13 +28,12 @@ const MenuProps = { }, }; -// @TODO: Get this from context (so testnets are filtered out) -const networks = Object.values(ChainId).sort(); - type NetworkItemProps = { value: ChainId; }; +const SEPARATOR = "____"; + const NetworkItem = ({ value }: NetworkItemProps) => { const networkName = chainIdToNetworkKey[value]; const networkInfo = networkName ? getNetworkInfo(networkName) : ""; @@ -46,15 +50,43 @@ const NetworkItem = ({ value }: NetworkItemProps) => { }; type Props = { - setValue: (value: ChainId) => void; - value: ChainId; + variant: "accounts"; }; -const NetworksSelect = ({ setValue, value }: Props) => { +const NetworksSelect = ({ variant }: Props) => { + const { setState: setStakingState, state: stakingState } = + useContext(StakingContext); + + const selectedAccount = getSelectedAccount(stakingState); + + if (!variant || !selectedAccount) return null; + + const wallet = stakingState.wallets[selectedAccount.wallet]; + + if (!wallet) return null; + + const allAccounts = Object.values(wallet) + .reduce((acc, chain) => { + acc.push(...chain.accounts); + + return acc; + }, [] as Account[]) + .sort(sortAccounts); + const handleChange = (event: any) => { - setValue(event.target.value); + const [address, chainId] = event.target.value.split(SEPARATOR); + + setSelectedAccount(setStakingState, { + address, + chainId, + wallet: selectedAccount.wallet, + }); }; + const selectedItem = [selectedAccount.address, selectedAccount.chainId].join( + SEPARATOR, + ); + return (
); diff --git a/src/screens/staking/components/staking_section/staking_modal.tsx b/src/screens/staking/components/staking_section/staking_modal.tsx index 62ddecd3..08db0f1b 100644 --- a/src/screens/staking/components/staking_section/staking_modal.tsx +++ b/src/screens/staking/components/staking_section/staking_modal.tsx @@ -24,7 +24,6 @@ import type { NetworkInfo, TStakingContext, } from "@src/screens/staking/lib/context/types"; -import { ChainId } from "@src/screens/staking/lib/context/types"; import Label from "./label"; import ModalBase, { ModalError } from "./modal_base"; @@ -40,10 +39,6 @@ const StakingModal = () => { const [isLoading, setIsLoading] = useState(false); const { selectedAccount, selectedAction } = stakingState; - const [selectedNetwork, setSelectedNetwork] = useState( - ChainId.CosmosHubTestnet, - ); - const [networkInfo, setNetworkInfo] = useState(null); const [amount, setAmount] = useState(""); const [amountError, setAmountError] = useState(""); @@ -98,12 +93,7 @@ const StakingModal = () => { title={t("stakingModal.title")} >
-
- -
+
{selectedAccount && }
{networkInfo?.apy && (