centralize functions
This commit is contained in:
fmtabbara
@@ -1,87 +1,191 @@
|
||||
import React, { useContext, useEffect, useState } from 'react';
|
||||
import { Alert, Box, Button, CircularProgress } from '@mui/material';
|
||||
import { useSnackbar } from 'notistack';
|
||||
import { Fee, NymCard } from '../../components';
|
||||
import { Alert, Button } from '@mui/material';
|
||||
import { FeeDetails } from '@nymproject/types';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { LoadingModal } from 'src/components/Modals/LoadingModal';
|
||||
import { AppContext, urls } from 'src/context';
|
||||
import { unbondGateway, unbondMixNode, vestingUnbondGateway, vestingUnbondMixnode } from 'src/requests';
|
||||
import { EnumNodeType } from 'src/types';
|
||||
import { NymCard } from '../../components';
|
||||
import { useCheckOwnership } from '../../hooks/useCheckOwnership';
|
||||
import { AppContext } from '../../context/main';
|
||||
import { unbond, vestingUnbond } from '../../requests';
|
||||
import { PageLayout } from '../../layouts';
|
||||
import { ConfirmationModal } from './ConfirmationModal';
|
||||
import { UnbondGateway } from './UnbondGateway';
|
||||
import { UnbondMixnode } from './UnbondMixnode';
|
||||
|
||||
export const Unbond = () => {
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const { network } = useContext(AppContext);
|
||||
const { checkOwnership, ownership } = useCheckOwnership();
|
||||
const { userBalance, getBondDetails } = useContext(AppContext);
|
||||
|
||||
const { enqueueSnackbar } = useSnackbar();
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [confirmationDetails, setConfirmationDetails] = useState<
|
||||
{ success: boolean; txUrl?: string; message?: string } | undefined
|
||||
>();
|
||||
const navigate = useNavigate();
|
||||
|
||||
useEffect(() => {
|
||||
const initialiseForm = async () => {
|
||||
await checkOwnership();
|
||||
};
|
||||
initialiseForm();
|
||||
}, [ownership.hasOwnership, checkOwnership]);
|
||||
}, [checkOwnership]);
|
||||
|
||||
const handleUnbondMixnode = async (isWithVestingTokens: boolean, fee: FeeDetails) => {
|
||||
let tx;
|
||||
setIsLoading(true);
|
||||
try {
|
||||
if (isWithVestingTokens) tx = await vestingUnbondMixnode(fee?.fee);
|
||||
if (!isWithVestingTokens) tx = await unbondMixNode(fee?.fee);
|
||||
setConfirmationDetails({
|
||||
success: true,
|
||||
txUrl: `${urls(network).blockExplorer}/transaction/${tx?.transaction_hash}`,
|
||||
});
|
||||
} catch (err) {
|
||||
setConfirmationDetails({
|
||||
success: false,
|
||||
message: err as string,
|
||||
});
|
||||
} finally {
|
||||
await checkOwnership();
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleUnbondGateway = async (isWithVestingTokens: boolean, fee: FeeDetails) => {
|
||||
let tx;
|
||||
setIsLoading(true);
|
||||
try {
|
||||
if (isWithVestingTokens) tx = await vestingUnbondGateway(fee?.fee);
|
||||
if (!isWithVestingTokens) tx = await unbondGateway(fee?.fee);
|
||||
setConfirmationDetails({
|
||||
success: true,
|
||||
txUrl: `${urls(network).blockExplorer}/transaction/${tx?.transaction_hash}`,
|
||||
});
|
||||
} catch (err) {
|
||||
setConfirmationDetails({
|
||||
success: false,
|
||||
message: err as string,
|
||||
});
|
||||
} finally {
|
||||
await checkOwnership();
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<PageLayout>
|
||||
<NymCard title="Unbond" subheader="Unbond a mixnode or gateway" noPadding>
|
||||
{ownership?.hasOwnership ? (
|
||||
<>
|
||||
<Alert
|
||||
severity="info"
|
||||
data-testid="bond-noded"
|
||||
action={
|
||||
<Button
|
||||
data-testid="un-bond"
|
||||
disabled={isLoading}
|
||||
onClick={async () => {
|
||||
setIsLoading(true);
|
||||
try {
|
||||
if (ownership.vestingPledge) {
|
||||
await vestingUnbond(ownership.nodeType!);
|
||||
} else {
|
||||
await unbond(ownership.nodeType!);
|
||||
}
|
||||
} catch (e) {
|
||||
enqueueSnackbar(`Failed to unbond ${ownership.nodeType}}`, { variant: 'error' });
|
||||
} finally {
|
||||
await getBondDetails();
|
||||
await checkOwnership();
|
||||
await userBalance.fetchBalance();
|
||||
setIsLoading(false);
|
||||
}
|
||||
}}
|
||||
color="inherit"
|
||||
>
|
||||
Unbond
|
||||
</Button>
|
||||
}
|
||||
sx={{ m: 2 }}
|
||||
>
|
||||
{`Looks like you already have a ${ownership.nodeType} bonded.`}
|
||||
</Alert>
|
||||
|
||||
<Box sx={{ p: 3 }}>
|
||||
<Fee feeType="UnbondMixnode" />
|
||||
</Box>
|
||||
</>
|
||||
) : (
|
||||
<Alert severity="info" sx={{ m: 3 }} data-testid="no-bond">
|
||||
You do not currently have a bonded node
|
||||
{!ownership.hasOwnership && (
|
||||
<Alert
|
||||
severity="info"
|
||||
sx={{ m: 3 }}
|
||||
data-testid="no-bond"
|
||||
action={
|
||||
<Button color="inherit" onClick={() => navigate('/bond')}>
|
||||
Bond
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
You do not currently have a bonded mixnode or gateway
|
||||
</Alert>
|
||||
)}
|
||||
{isLoading && (
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
p: 3,
|
||||
pt: 0,
|
||||
}}
|
||||
>
|
||||
<CircularProgress size={48} />
|
||||
</Box>
|
||||
{ownership.hasOwnership && ownership?.nodeType === EnumNodeType.mixnode && (
|
||||
<UnbondMixnode
|
||||
isWithVestingTokens={!!ownership.vestingPledge}
|
||||
onConfirm={handleUnbondMixnode}
|
||||
onError={(err) =>
|
||||
setConfirmationDetails({
|
||||
success: false,
|
||||
message: err as string,
|
||||
})
|
||||
}
|
||||
/>
|
||||
)}
|
||||
{ownership.hasOwnership && ownership?.nodeType === EnumNodeType.gateway && (
|
||||
<UnbondGateway
|
||||
isWithVestingTokens={!!ownership.vestingPledge}
|
||||
onConfirm={handleUnbondGateway}
|
||||
onError={(err) =>
|
||||
setConfirmationDetails({
|
||||
success: false,
|
||||
message: err as string,
|
||||
})
|
||||
}
|
||||
/>
|
||||
)}
|
||||
{isLoading && <LoadingModal />}
|
||||
{confirmationDetails && (
|
||||
<ConfirmationModal {...confirmationDetails} onClose={() => setConfirmationDetails(undefined)} />
|
||||
)}
|
||||
</NymCard>
|
||||
</PageLayout>
|
||||
);
|
||||
};
|
||||
|
||||
// {fee && <ConfirmationModal fee={fee} nodeType={ownership.nodeType} onPrev={resetFeeState} onConfirm={async () => {
|
||||
// setIsLoading(true);
|
||||
// try {
|
||||
// if (ownership.vestingPledge) {
|
||||
// await vestingUnbond(ownership.nodeType!);
|
||||
// } else {
|
||||
// await unbond(ownership.nodeType!);
|
||||
// }
|
||||
// } catch (e) {
|
||||
// enqueueSnackbar(`Failed to unbond ${ownership.nodeType}}`, { variant: 'error' });
|
||||
// } finally {
|
||||
// await getBondDetails();
|
||||
// await checkOwnership();
|
||||
// await userBalance.fetchBalance();
|
||||
// setIsLoading(false);
|
||||
// }
|
||||
// }}/>}
|
||||
// <NymCard title="Unbond" subheader="Unbond a mixnode or gateway" noPadding>
|
||||
// {ownership?.hasOwnership ? (
|
||||
// <>
|
||||
// <Alert
|
||||
// severity="info"
|
||||
// data-testid="bond-noded"
|
||||
// action={
|
||||
// <Button
|
||||
// data-testid="un-bond"
|
||||
// disabled={isLoading}
|
||||
// onClick={async () => {
|
||||
// setIsLoading(true)
|
||||
// if (ownership.vestingPledge) {
|
||||
// await getFee(simulateVestingUnbondMixnode);
|
||||
// } else {
|
||||
// await getFee(unbond, {type: ownership.nodeType})
|
||||
// }
|
||||
// }}
|
||||
// color="inherit"
|
||||
// >
|
||||
// Unbond
|
||||
// </Button>
|
||||
// }
|
||||
// sx={{ m: 2 }}
|
||||
// >
|
||||
// {`Looks like you already have a ${ownership.nodeType} bonded.`}
|
||||
// </Alert>
|
||||
|
||||
// <Box sx={{ p: 3 }}>
|
||||
// <Fee feeType="UnbondMixnode" />
|
||||
// </Box>
|
||||
// </>
|
||||
// ) : (
|
||||
// <Alert severity="info" sx={{ m: 3 }} data-testid="no-bond">
|
||||
// You do not currently have a bonded node
|
||||
// </Alert>
|
||||
// )}
|
||||
// {isLoading && (
|
||||
// <Box
|
||||
// sx={{
|
||||
// display: 'flex',
|
||||
// justifyContent: 'center',
|
||||
// p: 3,
|
||||
// pt: 0,
|
||||
// }}
|
||||
// >
|
||||
// <CircularProgress size={48} />
|
||||
// </Box>
|
||||
// )}
|
||||
// </NymCard>
|
||||
|
||||
Reference in New Issue
Block a user