81 lines
2.4 KiB
TypeScript
81 lines
2.4 KiB
TypeScript
import React, { useState } from 'react';
|
|
import { contracts } from '@nymproject/contract-clients';
|
|
import { SigningCosmWasmClient } from '@cosmjs/cosmwasm-stargate';
|
|
import Box from '@mui/material/Box';
|
|
import CircularProgress from '@mui/material/CircularProgress';
|
|
import Button from '@mui/material/Button';
|
|
import Typography from '@mui/material/Typography';
|
|
import Stack from '@mui/material/Stack';
|
|
import Table from '@mui/material/Table';
|
|
import { TableBody, TableCell, TableHead, TableRow } from '@mui/material';
|
|
import { settings } from './client';
|
|
|
|
const getClient = async () => {
|
|
const cosmWasmClient = await SigningCosmWasmClient.connect(settings.url);
|
|
|
|
const client = new contracts.Mixnet.MixnetQueryClient(cosmWasmClient, settings.mixnetContractAddress);
|
|
return client;
|
|
};
|
|
|
|
export const Mixnodes = () => {
|
|
const [mixnodes, setMixnodes] = useState<any>();
|
|
const [busy, setBusy] = useState<boolean>(false);
|
|
|
|
const getMixnodes = async () => {
|
|
setBusy(true);
|
|
const client = await getClient();
|
|
const { nodes } = await client.getMixNodesDetailed({});
|
|
|
|
setMixnodes(nodes);
|
|
setBusy(false);
|
|
};
|
|
|
|
if (busy) {
|
|
return (
|
|
<Box pt={4}>
|
|
<Stack direction="row" spacing={2} alignItems="center">
|
|
<CircularProgress />
|
|
<Typography>Loading...</Typography>
|
|
</Stack>
|
|
</Box>
|
|
);
|
|
}
|
|
|
|
if (!mixnodes) {
|
|
return (
|
|
<Box pt={4}>
|
|
<Button variant="outlined" onClick={getMixnodes}>
|
|
Query for mixnodes
|
|
</Button>
|
|
</Box>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Box pt={4}>
|
|
{mixnodes?.length && (
|
|
<Table size="small">
|
|
<TableHead>
|
|
<TableRow>
|
|
<TableCell>MixId</TableCell>
|
|
<TableCell>Owner Account</TableCell>
|
|
<TableCell>Layer</TableCell>
|
|
<TableCell>Bonded at Block Height</TableCell>
|
|
</TableRow>
|
|
</TableHead>
|
|
<TableBody>
|
|
{mixnodes.map((mixnode: any) => (
|
|
<TableRow key={mixnode.bond_information.mix_id}>
|
|
<TableCell>{mixnode.bond_information.mix_id}</TableCell>
|
|
<TableCell>{mixnode.bond_information.owner}</TableCell>
|
|
<TableCell>{mixnode.bond_information.layer}</TableCell>
|
|
<TableCell>{mixnode.bond_information.bonding_height}</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
)}
|
|
</Box>
|
|
);
|
|
};
|