Update/last minute release updates (#1753)
* fix vesting update bond settings * style and text updates * show tx fee when updating node settings * allow cost param update with vesting tokens
This commit is contained in:
@@ -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',
|
||||
|
||||
@@ -130,16 +130,10 @@ const TokenTransfer = () => {
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Typography variant="subtitle2" sx={{ color: (t) => t.palette.nym.text.muted, mt: 2 }}>
|
||||
Transferable tokens
|
||||
Unlocked transferable tokens
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
data-testid="refresh-success"
|
||||
sx={{ color: 'text.primary' }}
|
||||
variant="h5"
|
||||
fontWeight="700"
|
||||
textTransform="uppercase"
|
||||
>
|
||||
<Typography data-testid="refresh-success" sx={{ color: 'text.primary' }} variant="h5" textTransform="uppercase">
|
||||
{userBalance.tokenAllocation?.spendable || 'n/a'} {clientDetails?.display_mix_denom.toUpperCase()}
|
||||
</Typography>
|
||||
</Grid>
|
||||
@@ -167,7 +161,6 @@ export const VestingCard = ({ onTransfer }: { onTransfer: () => Promise<void> })
|
||||
<NymCard
|
||||
title="Vesting Schedule"
|
||||
data-testid="check-unvested-tokens"
|
||||
Icon={<InfoOutlined />}
|
||||
Action={
|
||||
<IconButton
|
||||
onClick={async () => {
|
||||
|
||||
@@ -33,10 +33,17 @@ export const NodeUnbondPage = ({ bondedNode, onConfirm, onError }: Props) => {
|
||||
</Grid>
|
||||
<Grid item container direction={'column'} spacing={2} width={0.5} padding={3}>
|
||||
<Grid item>
|
||||
<Box sx={{ mb: 1 }}>
|
||||
<Error
|
||||
message={`Remember you should only unbond if you want to remove your ${
|
||||
isMixnode(bondedNode) ? 'node' : 'gateway'
|
||||
} from the network for good.`}
|
||||
/>
|
||||
</Box>
|
||||
<Error
|
||||
message={`Unbonding is irreversible and it won’t be possible to restore the current state of your ${
|
||||
isMixnode(bondedNode) ? 'node' : 'gateway'
|
||||
} again`}
|
||||
} again.`}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
|
||||
+37
-41
@@ -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<boolean>(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 (
|
||||
<Grid container xs item>
|
||||
{fee && (
|
||||
<ConfirmTx
|
||||
open
|
||||
header="Update node settings"
|
||||
fee={fee}
|
||||
onConfirm={handleSubmit((d) => onSubmit(d))}
|
||||
onPrev={resetFeeState}
|
||||
onClose={resetFeeState}
|
||||
/>
|
||||
)}
|
||||
{isSubmitting && <LoadingModal />}
|
||||
<Alert
|
||||
title={
|
||||
<Box sx={{ fontWeight: 600 }}>
|
||||
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
|
||||
</Box>
|
||||
}
|
||||
dismissable
|
||||
@@ -67,16 +89,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon
|
||||
<Typography variant="body1" sx={{ fontWeight: 600, mb: 1 }}>
|
||||
Port
|
||||
</Typography>
|
||||
<Typography
|
||||
variant="body1"
|
||||
sx={{
|
||||
fontSize: 14,
|
||||
mb: 2,
|
||||
color: (t) => (t.palette.mode === 'light' ? t.palette.nym.text.muted : 'text.primary'),
|
||||
}}
|
||||
>
|
||||
Change profit margin of your node
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid spacing={3} item container alignItems="center" xs={12} md={6}>
|
||||
<Grid item width={1}>
|
||||
@@ -120,16 +132,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon
|
||||
<Typography variant="body1" sx={{ fontWeight: 600, mb: 1 }}>
|
||||
Host
|
||||
</Typography>
|
||||
<Typography
|
||||
variant="body1"
|
||||
sx={{
|
||||
fontSize: 14,
|
||||
mb: 2,
|
||||
color: (t) => (t.palette.mode === 'light' ? t.palette.nym.text.muted : 'text.primary'),
|
||||
}}
|
||||
>
|
||||
Lock wallet after certain time
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid spacing={3} item container alignItems="center" xs={12} md={6}>
|
||||
<Grid item width={1}>
|
||||
@@ -151,16 +153,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon
|
||||
<Typography variant="body1" sx={{ fontWeight: 600, mb: 1 }}>
|
||||
Version
|
||||
</Typography>
|
||||
<Typography
|
||||
variant="body1"
|
||||
sx={{
|
||||
fontSize: 14,
|
||||
mb: 2,
|
||||
color: (t) => (t.palette.mode === 'light' ? t.palette.nym.text.muted : 'text.primary'),
|
||||
}}
|
||||
>
|
||||
Lock wallet after certain time
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid spacing={3} item container alignItems="center" xs={12} md={6}>
|
||||
<Grid item width={1}>
|
||||
@@ -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 && <CircularProgress size={20} />}
|
||||
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
|
||||
</Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<SimpleModal
|
||||
open={openConfirmationModal}
|
||||
header="Your changes were ONLY saved on the display"
|
||||
header="Your changes are submitted to the blockchain"
|
||||
subHeader="Remember to change the values
|
||||
on your node’s config file too."
|
||||
okLabel="close"
|
||||
@@ -216,7 +214,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon
|
||||
textAlign: 'center',
|
||||
color: theme.palette.nym.nymWallet.text.blue,
|
||||
fontSize: 16,
|
||||
textTransform: 'capitalize',
|
||||
}}
|
||||
subHeaderStyles={{
|
||||
width: '100%',
|
||||
@@ -224,7 +221,6 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon
|
||||
textAlign: 'center',
|
||||
color: 'main',
|
||||
fontSize: 14,
|
||||
textTransform: 'capitalize',
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
+42
-11
@@ -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<boolean>(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 (
|
||||
<Grid container xs item>
|
||||
{fee && (
|
||||
<ConfirmTx
|
||||
open
|
||||
header="Update cost parameters"
|
||||
fee={fee}
|
||||
onConfirm={handleSubmit((d) => onSubmit(d))}
|
||||
onPrev={resetFeeState}
|
||||
onClose={resetFeeState}
|
||||
/>
|
||||
)}
|
||||
{isSubmitting && <LoadingModal />}
|
||||
<Alert
|
||||
title={
|
||||
<>
|
||||
@@ -129,7 +157,7 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode
|
||||
/>
|
||||
<Grid container direction="column">
|
||||
<Grid item container alignItems="left" justifyContent="space-between" padding={3} spacing={1}>
|
||||
<Grid item>
|
||||
<Grid item xl={6}>
|
||||
<Typography variant="body1" sx={{ fontWeight: 600, mb: 1 }}>
|
||||
Profit Margin
|
||||
</Typography>
|
||||
@@ -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 && <CircularProgress size={20} />}
|
||||
sx={{ m: 3 }}
|
||||
>
|
||||
Save all display changes
|
||||
Submit changes to the blockchain
|
||||
</Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
@@ -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,
|
||||
|
||||
Reference in New Issue
Block a user