update coin types in new bonding page

This commit is contained in:
fmtabbara
2022-07-18 11:35:59 +01:00
parent 777166b93d
commit df4385ab71
16 changed files with 61 additions and 108 deletions
+6 -50
View File
@@ -5,56 +5,6 @@ import { AccountBalanceWalletOutlined, ArrowBack, ArrowForward, Description, Set
import { AppContext } from '../context/main';
import { Bond, Delegate, Unbond, Bonding } from '../svg-icons';
const routesSchema = [
{
label: 'Balance',
route: '/balance',
Icon: AccountBalanceWalletOutlined,
},
{
label: 'Send',
route: '/send',
Icon: ArrowForward,
},
{
label: 'Receive',
route: '/receive',
Icon: ArrowBack,
},
{
label: 'Bond',
route: '/bond',
Icon: Bond,
},
{
label: 'Bonding',
route: '/bonding',
Icon: Bonding,
},
{
label: 'Unbond',
route: '/unbond',
Icon: Unbond,
},
{
label: 'Delegation',
route: '/delegation',
Icon: Delegate,
},
{
label: 'Docs',
route: '/docs',
Icon: Description,
mode: 'dev',
},
{
label: 'Admin',
route: '/admin',
Icon: Settings,
mode: 'admin',
},
];
export const Nav = () => {
const location = useLocation();
const navigate = useNavigate();
@@ -79,6 +29,12 @@ export const Nav = () => {
Icon: ArrowBack,
onClick: () => navigate('/receive'),
},
{
label: 'Bonding',
route: '/bonding',
Icon: Bond,
onClick: () => navigate('/bonding'),
},
{
label: 'Bond',
route: '/bond',
-1
View File
@@ -20,4 +20,3 @@ export * from './TokenPoolSelector';
export * from './TransactionDetails';
export * from './Warning';
export * from './Modals/ConfirmationModal';
export * from './SimpleDialog';
+13 -13
View File
@@ -1,4 +1,4 @@
import { FeeDetails, MajorCurrencyAmount, MixnodeStatus, TransactionExecuteResult } from '@nymproject/types';
import { FeeDetails, DecCoin, MixnodeStatus, TransactionExecuteResult } from '@nymproject/types';
import React, { createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react';
import type { Network } from 'src/types';
import { TBondGatewayArgs, TBondMixNodeArgs } from 'src/types';
@@ -35,19 +35,19 @@ import { AppContext } from './main';
const bounded: BondedMixnode = {
identityKey: 'B2Xx4haarLWMajX8w259oHjtRZsC7nHwagbWrJNiA3QC',
bond: { denom: 'NYM', amount: '1234' },
bond: { denom: 'nym', amount: '1234' },
delegators: 123,
ip: '1.2.34.5',
nodeRewards: { denom: 'NYM', amount: '123' },
operatorRewards: { denom: 'NYM', amount: '12' },
nodeRewards: { denom: 'nym', amount: '123' },
operatorRewards: { denom: 'nym', amount: '12' },
profitMargin: 10,
stake: { denom: 'NYM', amount: '99' },
stake: { denom: 'nym', amount: '99' },
stakeSaturation: 99,
status: 'active',
};
/* const bounded: BondedMixnode | BondedGateway = {
bond: { denom: 'NYM', amount: '1234' },
bond: { denom: 'nym', amount: '1234' },
identityKey: 'B2Xx4haarLWMajX8w259oHjtRZsC7nHwagbWrJNiA3QC',
ip: '1.2.34.5',
location: 'France',
@@ -57,12 +57,12 @@ const bounded: BondedMixnode = {
export interface BondedMixnode {
identityKey: string;
ip: string;
stake: MajorCurrencyAmount;
bond: MajorCurrencyAmount;
stake: DecCoin;
bond: DecCoin;
stakeSaturation: number;
profitMargin: number;
nodeRewards: MajorCurrencyAmount;
operatorRewards: MajorCurrencyAmount;
nodeRewards: DecCoin;
operatorRewards: DecCoin;
delegators: number;
status: MixnodeStatus;
}
@@ -71,7 +71,7 @@ export interface BondedMixnode {
export interface BondedGateway {
identityKey: string;
ip: string;
bond: MajorCurrencyAmount;
bond: DecCoin;
location?: string; // TODO not yet available, only available in Network Explorer API
}
@@ -103,7 +103,7 @@ export type TBondingContext = {
data: Omit<TBondGatewayArgs, 'fee'>,
tokenPool: TokenPool,
) => Promise<TransactionExecuteResult | undefined>;
bondMore: (signature: string, additionalBond: MajorCurrencyAmount) => Promise<TransactionExecuteResult | undefined>;
bondMore: (signature: string, additionalBond: DecCoin) => Promise<TransactionExecuteResult | undefined>;
unbondMixnode: () => Promise<TransactionExecuteResult | undefined>;
unbondGateway: () => Promise<TransactionExecuteResult | undefined>;
redeemRewards: () => Promise<TransactionExecuteResult[] | undefined>;
@@ -359,7 +359,7 @@ export const BondingContextProvider = ({
return tx;
};
const bondMore = async (_signature: string, _additionalBond: MajorCurrencyAmount) =>
const bondMore = async (_signature: string, _additionalBond: DecCoin) =>
// TODO to implement
undefined;
+11 -12
View File
@@ -1,4 +1,4 @@
import { FeeDetails, MajorCurrencyAmount, TransactionExecuteResult } from '@nymproject/types';
import { FeeDetails, DecCoin, TransactionExecuteResult } from '@nymproject/types';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import type { Network } from 'src/types';
import { BondedGateway, BondedMixnode, BondingContext, FeeOperation } from '../bonding';
@@ -9,12 +9,12 @@ const SLEEP_MS = 1000;
const bondedMixnodeMock: BondedMixnode = {
identityKey: '7mjM2fYbtN6kxMwp1TrmQ4VwPks3URR5pBgWPWhzT98F',
ip: '112.43.234.56',
stake: { denom: 'NYM', amount: '1234' },
bond: { denom: 'NYM', amount: '1234' },
stake: { denom: 'nym', amount: '1234' },
bond: { denom: 'nym', amount: '1234' },
stakeSaturation: 95,
profitMargin: 15,
nodeRewards: { denom: 'NYM', amount: '1234' },
operatorRewards: { denom: 'NYM', amount: '1234' },
nodeRewards: { denom: 'nym', amount: '1234' },
operatorRewards: { denom: 'nym', amount: '1234' },
delegators: 5423,
status: 'active',
};
@@ -22,7 +22,7 @@ const bondedMixnodeMock: BondedMixnode = {
const bondedGatewayMock: BondedGateway = {
identityKey: 'WayM2fYbtN6kxMwp1TrmQ4VwPks3URR5pBgWPWhzT98F',
ip: '112.43.234.57',
bond: { denom: 'NYM', amount: '1234' },
bond: { denom: 'nym', amount: '1234' },
};
const TxResultMock: TransactionExecuteResult = {
@@ -30,15 +30,14 @@ const TxResultMock: TransactionExecuteResult = {
data_json: '',
transaction_hash: '55303CD4B91FAC4C2715E40EBB52BB3B92829D9431B3A279D37B5CC58432E354',
gas_info: {
gas_wanted: BigInt(1),
gas_used: BigInt(1),
fee: { amount: '1', denom: 'NYM' },
gas_wanted: { gas_units: BigInt(1) },
gas_used: { gas_units: BigInt(1) },
},
fee: { amount: '1', denom: 'NYM' },
fee: { amount: '1', denom: 'nym' },
};
const feeMock: FeeDetails = {
amount: { denom: 'NYM', amount: '1' },
amount: { denom: 'nym', amount: '1' },
fee: { Auto: 1 },
};
@@ -145,7 +144,7 @@ export const MockBondingContextProvider = ({
return TxResultMock;
};
const bondMore = async (_signature: string, _additionalBond: MajorCurrencyAmount) => {
const bondMore = async (_signature: string, _additionalBond: DecCoin) => {
setLoading(true);
await mockSleep(SLEEP_MS);
triggerStateUpdate();
@@ -80,7 +80,7 @@ const AmountModal = ({ open, onClose, onSubmit, nodeType }: Props) => {
fullWidth
label="Amount"
name="amount"
currencyDenom={clientDetails?.denom}
currencyDenom={clientDetails?.display_mix_denom}
errorMessage={errors.amount?.amount?.message}
/>
</Stack>
@@ -3,7 +3,7 @@ import { useContext } from 'react';
import { useForm } from 'react-hook-form';
import { yupResolver } from '@hookform/resolvers/yup';
import { Box, Divider, Stack, Typography } from '@mui/material';
import { MajorCurrencyAmount } from '@nymproject/types';
import { DecCoin } from '@nymproject/types';
import { CurrencyInput, TextFieldInput } from '../../components';
import schema from './schema';
import { AppContext } from '../../../../context';
@@ -13,12 +13,12 @@ import { SimpleModal } from '../../../../components/Modals/SimpleModal';
export interface Props {
open: boolean;
onClose: () => void;
onConfirm: (bond: MajorCurrencyAmount, signature: string) => void;
currentBond: MajorCurrencyAmount;
onConfirm: (bond: DecCoin, signature: string) => void;
currentBond: DecCoin;
}
interface FormData {
amount: MajorCurrencyAmount;
amount: DecCoin;
tokenPool: string;
signature: string;
}
@@ -61,7 +61,7 @@ const BondModal = ({ open, onClose, onConfirm, currentBond }: Props) => {
fullWidth
label="Amount"
name="amount"
currencyDenom={clientDetails?.denom}
currencyDenom={clientDetails?.display_mix_denom}
errorMessage={errors.amount?.amount?.message}
/>
</Stack>
@@ -1,6 +1,6 @@
import * as React from 'react';
import { useContext, useState } from 'react';
import { MajorCurrencyAmount, TransactionExecuteResult } from '@nymproject/types';
import { DecCoin, TransactionExecuteResult } from '@nymproject/types';
import { Link } from '@nymproject/react/link/Link';
import { Typography } from '@mui/material';
import { ErrorOutline } from '@mui/icons-material';
@@ -16,7 +16,7 @@ interface Props {
}
const BondMore = ({ mixnode, show, onClose }: Props) => {
const [addBond, setAddBond] = useState<MajorCurrencyAmount>({ amount: '0', denom: 'NYM' });
const [addBond, setAddBond] = useState<DecCoin>({ amount: '0', denom: 'nym' });
const [signature, setSignature] = useState<string>();
const [step, setStep] = useState<1 | 2 | 3>(1);
const [tx, setTx] = useState<TransactionExecuteResult>();
@@ -33,7 +33,7 @@ const BondMore = ({ mixnode, show, onClose }: Props) => {
};
const reset = () => {
setAddBond({ amount: '0', denom: 'NYM' });
setAddBond({ amount: '0', denom: 'nym' });
setSignature('');
setStep(1);
onClose();
@@ -1,6 +1,6 @@
import * as React from 'react';
import { Divider, Stack, Typography } from '@mui/material';
import { MajorCurrencyAmount } from '@nymproject/types';
import { DecCoin } from '@nymproject/types';
import { useEffect } from 'react';
import { ErrorOutline } from '@mui/icons-material';
import { SimpleModal } from '../../../../components/Modals/SimpleModal';
@@ -12,8 +12,8 @@ export interface Props {
onClose: () => void;
onConfirm: () => Promise<void>;
onCancel: () => void;
currentBond: MajorCurrencyAmount;
addBond: MajorCurrencyAmount;
currentBond: DecCoin;
addBond: DecCoin;
}
const SummaryModal = ({ open, onClose, onConfirm, onCancel, currentBond, addBond }: Props) => {
@@ -1,6 +1,6 @@
import * as React from 'react';
import { Divider, Stack, Typography } from '@mui/material';
import { MajorCurrencyAmount } from '@nymproject/types';
import { DecCoin } from '@nymproject/types';
import { SimpleModal } from '../../../../components/Modals/SimpleModal';
export interface Props {
@@ -8,8 +8,8 @@ export interface Props {
onClose: () => void;
onConfirm: () => Promise<void>;
onCancel: () => void;
rewards: MajorCurrencyAmount;
fee?: MajorCurrencyAmount | null;
rewards: DecCoin;
fee?: DecCoin | null;
}
const SummaryModal = ({ open, onClose, onConfirm, onCancel, rewards, fee }: Props) => (
@@ -1,6 +1,6 @@
import * as React from 'react';
import { useContext, useEffect, useState } from 'react';
import { MajorCurrencyAmount, TransactionExecuteResult } from '@nymproject/types';
import { DecCoin, TransactionExecuteResult } from '@nymproject/types';
import { Link } from '@nymproject/react/link/Link';
import { Typography } from '@mui/material';
import { ErrorOutline } from '@mui/icons-material';
@@ -16,7 +16,7 @@ interface Props {
}
// TODO fetch real estimated operator reward for 10% PM
const MOCK_ESTIMATED_OP_REWARD: MajorCurrencyAmount = { amount: '42', denom: 'NYM' };
const MOCK_ESTIMATED_OP_REWARD: DecCoin = { amount: '42', denom: 'nym' };
const NodeSettings = ({ mixnode, show, onClose }: Props) => {
const [status, setStatus] = useState<'success' | 'error'>();
@@ -1,8 +1,8 @@
import * as React from 'react';
import { useForm } from 'react-hook-form';
import { yupResolver } from '@hookform/resolvers/yup';
import { DecCoin } from '@nymproject/types';
import { Box, Divider, Stack, Tooltip, Typography } from '@mui/material';
import { MajorCurrencyAmount } from '@nymproject/types';
import { TextFieldInput } from '../../components';
import getSchema from './schema';
import { SimpleModal } from '../../../../components/Modals/SimpleModal';
@@ -11,7 +11,7 @@ export interface Props {
open: boolean;
onClose: () => void;
onConfirm: (pm: number) => void;
estimatedOpReward: MajorCurrencyAmount;
estimatedOpReward: DecCoin;
currentPm: number;
}
@@ -1,6 +1,6 @@
import * as React from 'react';
import { Divider, Stack, Typography } from '@mui/material';
import { MajorCurrencyAmount } from '@nymproject/types';
import { DecCoin } from '@nymproject/types';
import { SimpleModal } from '../../../../components/Modals/SimpleModal';
export interface Props {
@@ -10,7 +10,7 @@ export interface Props {
onCancel: () => void;
currentPm: number;
newPm: number;
fee?: MajorCurrencyAmount | null;
fee?: DecCoin | null;
}
const SummaryModal = ({ open, onClose, onConfirm, onCancel, currentPm, newPm, fee }: Props) => (
@@ -1,15 +1,15 @@
import * as React from 'react';
import { Divider, Stack, Typography } from '@mui/material';
import { MajorCurrencyAmount } from '@nymproject/types';
import { SimpleModal } from '../../../../components/Modals/SimpleModal';
import { DecCoin } from '@nymproject/types';
export interface Props {
open: boolean;
onClose: () => void;
onConfirm: () => Promise<void>;
onCancel: () => void;
rewards: MajorCurrencyAmount;
fee?: MajorCurrencyAmount | null;
rewards: DecCoin;
fee?: DecCoin | null;
}
const SummaryModal = ({ open, onClose, onConfirm, onCancel, rewards, fee }: Props) => (
+3 -3
View File
@@ -1,4 +1,4 @@
import { MajorCurrencyAmount, TNodeType, TransactionExecuteResult } from '@nymproject/types';
import { DecCoin, TNodeType, TransactionExecuteResult } from '@nymproject/types';
export type FormStep = 1 | 2 | 3 | 4;
export type NodeType = TNodeType;
@@ -34,7 +34,7 @@ export type MixnodeData = NodeIdentity & {
};
export type MixnodeAmount = {
amount: MajorCurrencyAmount;
amount: DecCoin;
tokenPool: string;
profitMargin: number;
};
@@ -51,7 +51,7 @@ export type NodeData<N = MixnodeData | GatewayData> = {
} & N;
export interface AmountData {
amount: MajorCurrencyAmount;
amount: DecCoin;
tokenPool: string;
profitMargin?: number;
}
@@ -1,16 +1,16 @@
import * as React from 'react';
import { Divider, Stack, Typography } from '@mui/material';
import { MajorCurrencyAmount } from '@nymproject/types';
import { SimpleModal } from '../../../components/Modals/SimpleModal';
import { DecCoin } from '@nymproject/types';
export interface Props {
open: boolean;
onClose: () => void;
onConfirm: () => Promise<void>;
onCancel: () => void;
bond: MajorCurrencyAmount;
rewards?: MajorCurrencyAmount;
fee?: MajorCurrencyAmount | null;
bond: DecCoin;
rewards?: DecCoin;
fee?: DecCoin | null;
}
const SummaryModal = ({ open, onClose, onConfirm, onCancel, bond, rewards, fee }: Props) => (
@@ -1,6 +1,5 @@
import * as React from 'react';
import { useContext, useEffect, useState } from 'react';
import { MajorCurrencyAmount } from '@nymproject/types';
import { Link } from '@nymproject/react/link/Link';
import { Typography } from '@mui/material';
import { ErrorOutline } from '@mui/icons-material';