diff --git a/nym-wallet/src/components/Bonding/BondedMixnode.tsx b/nym-wallet/src/components/Bonding/BondedMixnode.tsx index a30e5557cb9..00b3ea7196f 100644 --- a/nym-wallet/src/components/Bonding/BondedMixnode.tsx +++ b/nym-wallet/src/components/Bonding/BondedMixnode.tsx @@ -42,7 +42,7 @@ const headers: Header[] = [ header: 'Operator rewards', id: 'operator-rewards', tooltipText: - 'This is your (operator) new rewards including the PM and cost. You can compound your rewards manually every epoch or unbond your node to redeem them.', + 'This is your (operator) rewards including the PM and cost. Rewards are automatically compounded every epoch. You can redeem your rewards at any time.', }, { header: 'No. delegators', diff --git a/nym-wallet/src/pages/balance/vesting.tsx b/nym-wallet/src/pages/balance/vesting.tsx index a3a52a44b16..c58c1454dde 100644 --- a/nym-wallet/src/pages/balance/vesting.tsx +++ b/nym-wallet/src/pages/balance/vesting.tsx @@ -130,16 +130,10 @@ const TokenTransfer = () => { t.palette.nym.text.muted, mt: 2 }}> - Transferable tokens + Unlocked transferable tokens - + {userBalance.tokenAllocation?.spendable || 'n/a'} {clientDetails?.display_mix_denom.toUpperCase()} @@ -167,7 +161,6 @@ export const VestingCard = ({ onTransfer }: { onTransfer: () => Promise }) } Action={ { diff --git a/nym-wallet/src/pages/bonding/node-settings/settings-pages/NodeUnbondPage.tsx b/nym-wallet/src/pages/bonding/node-settings/settings-pages/NodeUnbondPage.tsx index 4a6097b8dae..f576afccd96 100644 --- a/nym-wallet/src/pages/bonding/node-settings/settings-pages/NodeUnbondPage.tsx +++ b/nym-wallet/src/pages/bonding/node-settings/settings-pages/NodeUnbondPage.tsx @@ -33,10 +33,17 @@ export const NodeUnbondPage = ({ bondedNode, onConfirm, onError }: Props) => { + + + diff --git a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx index 7b85f1c0c29..31e88a0f314 100644 --- a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx +++ b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx @@ -4,15 +4,20 @@ import { yupResolver } from '@hookform/resolvers/yup'; import { Button, Divider, Typography, TextField, Grid, CircularProgress, Box } from '@mui/material'; import { useTheme } from '@mui/material/styles'; import { isMixnode } from 'src/types'; -import { updateMixnodeConfig } from 'src/requests'; +import { simulateUpdateMixnodeConfig, simulateVestingUpdateMixnodeConfig, updateMixnodeConfig } from 'src/requests'; import { TBondedMixnode, TBondedGateway } from 'src/context/bonding'; import { SimpleModal } from 'src/components/Modals/SimpleModal'; import { bondedInfoParametersValidationSchema } from 'src/components/Bonding/forms/mixnodeValidationSchema'; import { Console } from 'src/utils/console'; import { Alert } from 'src/components/Alert'; +import { vestingUpdateMixnodeConfig } from 'src/requests/vesting'; +import { ConfirmTx } from 'src/components/ConfirmTX'; +import { useGetFee } from 'src/hooks/useGetFee'; +import { LoadingModal } from 'src/components/Modals/LoadingModal'; export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBondedGateway }) => { const [openConfirmationModal, setOpenConfirmationModal] = useState(false); + const { getFee, fee, resetFeeState } = useGetFee(); const theme = useTheme(); @@ -33,6 +38,7 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon verlocPort?: number; httpApiPort?: number; }) => { + resetFeeState(); const { host, version, mixPort, verlocPort, httpApiPort } = data; if (host && version && mixPort && verlocPort && httpApiPort) { const MixNodeConfigParams = { @@ -43,7 +49,11 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon version, }; try { - await updateMixnodeConfig(MixNodeConfigParams); + if (bondedNode.proxy) { + await vestingUpdateMixnodeConfig(MixNodeConfigParams); + } else { + await updateMixnodeConfig(MixNodeConfigParams); + } setOpenConfirmationModal(true); } catch (error) { Console.error(error); @@ -53,10 +63,22 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon return ( + {fee && ( + onSubmit(d))} + onPrev={resetFeeState} + onClose={resetFeeState} + /> + )} + {isSubmitting && } - Your changes will be ONLY saved on the display. Remember to change the values on your node’s config file too + Changing these values will ONLY change the data about your node on the blockchain. Remember to change your + node’s config file with the same values too } dismissable @@ -67,16 +89,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon Port - (t.palette.mode === 'light' ? t.palette.nym.text.muted : 'text.primary'), - }} - > - Change profit margin of your node - @@ -120,16 +132,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon Host - (t.palette.mode === 'light' ? t.palette.nym.text.muted : 'text.primary'), - }} - > - Lock wallet after certain time - @@ -151,16 +153,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon Version - (t.palette.mode === 'light' ? t.palette.nym.text.muted : 'text.primary'), - }} - > - Lock wallet after certain time - @@ -182,18 +174,24 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon size="large" variant="contained" disabled={isSubmitting || !isDirty || !isValid} - onClick={handleSubmit((d) => onSubmit(d))} - type="submit" - sx={{ m: 3, width: '320px' }} - endIcon={isSubmitting && } + onClick={handleSubmit((data) => + getFee(bondedNode.proxy ? simulateVestingUpdateMixnodeConfig : simulateUpdateMixnodeConfig, { + host: data.host, + mix_port: data.mixPort, + verloc_port: data.verlocPort, + http_api_port: data.httpApiPort, + version: data.version, + }), + )} + sx={{ m: 3 }} > - Save all display changes + Submit changes to the blockchain diff --git a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx index ad9b3d03af8..aebb21c8c11 100644 --- a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx +++ b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx @@ -14,17 +14,27 @@ import { } from '@mui/material'; import { useTheme } from '@mui/material/styles'; import { CurrencyDenom, MixNodeCostParams } from '@nymproject/types'; +import { CurrencyFormField } from '@nymproject/react/currency/CurrencyFormField'; import { add, format, fromUnixTime } from 'date-fns'; import { isMixnode } from 'src/types'; -import { getCurrentInterval, getPendingIntervalEvents, updateMixnodeCostParams } from 'src/requests'; -import { TBondedMixnode, TBondedGateway } from 'src/context/bonding'; +import { + getCurrentInterval, + getPendingIntervalEvents, + simulateUpdateMixnodeCostParams, + simulateVestingUpdateMixnodeCostParams, + updateMixnodeCostParams, + vestingUpdateMixnodeCostParams, +} from 'src/requests'; +import { TBondedMixnode } from 'src/context/bonding'; import { SimpleModal } from 'src/components/Modals/SimpleModal'; import { bondedNodeParametersValidationSchema } from 'src/components/Bonding/forms/mixnodeValidationSchema'; import { Console } from 'src/utils/console'; import { Alert } from 'src/components/Alert'; import { ChangeMixCostParams } from 'src/pages/bonding/types'; import { AppContext } from 'src/context'; -import { CurrencyFormField } from '@nymproject/react/currency/CurrencyFormField'; +import { useGetFee } from 'src/hooks/useGetFee'; +import { ConfirmTx } from 'src/components/ConfirmTX'; +import { LoadingModal } from 'src/components/Modals/LoadingModal'; export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode }): JSX.Element => { const [openConfirmationModal, setOpenConfirmationModal] = useState(false); @@ -34,6 +44,8 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode const { clientDetails } = useContext(AppContext); const theme = useTheme(); + const { fee, getFee, resetFeeState } = useGetFee(); + const defaultValues = { operatorCost: bondedNode.operatorCost, profitMargin: bondedNode.profitMargin, @@ -96,6 +108,7 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode }, []); const onSubmit = async (data: { operatorCost: { amount: string; denom: CurrencyDenom }; profitMargin: string }) => { + resetFeeState(); if (data.operatorCost && data.profitMargin) { const MixNodeCostParams = { profit_margin_percent: (+data.profitMargin / 100).toString(), @@ -105,7 +118,11 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode }, }; try { - await updateMixnodeCostParams(MixNodeCostParams); + if (bondedNode.proxy) { + await vestingUpdateMixnodeCostParams(MixNodeCostParams); + } else { + await updateMixnodeCostParams(MixNodeCostParams); + } await getPendingEvents(); reset(); setOpenConfirmationModal(true); @@ -117,6 +134,17 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode return ( + {fee && ( + onSubmit(d))} + onPrev={resetFeeState} + onClose={resetFeeState} + /> + )} + {isSubmitting && } @@ -129,7 +157,7 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode /> - + Profit Margin @@ -223,12 +251,16 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode size="large" variant="contained" disabled={isSubmitting || !isDirty || !isValid} - onClick={handleSubmit(onSubmit)} + onClick={handleSubmit((data) => { + getFee(bondedNode.proxy ? simulateVestingUpdateMixnodeCostParams : simulateUpdateMixnodeCostParams, { + profit_margin_percent: (+data.profitMargin / 100).toString(), + interval_operating_cost: data.operatorCost, + }); + })} type="submit" - sx={{ m: 3, width: '320px' }} - endIcon={isSubmitting && } + sx={{ m: 3 }} > - Save all display changes + Submit changes to the blockchain @@ -236,7 +268,7 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode open={openConfirmationModal} header="Your changes will take place in the next interval" - okLabel="close" + okLabel="Close" hideCloseIcon displayInfoIcon onOk={async () => { @@ -256,7 +288,6 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode textAlign: 'center', color: theme.palette.nym.nymWallet.text.blue, fontSize: 16, - textTransform: 'capitalize', }} subHeaderStyles={{ m: 0,