|
@@ -36,6 +36,10 @@ const useStyles = makeStyles((theme: Theme) =>
|
|
|
flexGrow: 1,
|
|
|
backgroundColor: "#ffffff",
|
|
|
},
|
|
|
+ tableWrapper: {
|
|
|
+ height: 400,
|
|
|
+ position: "relative",
|
|
|
+ },
|
|
|
backdrop: {
|
|
|
zIndex: theme.zIndex.drawer + 1,
|
|
|
color: "#fff",
|
|
@@ -56,8 +60,8 @@ const ValidatorReport = () => {
|
|
|
moment().subtract(14, "d").format(dateFormat)
|
|
|
);
|
|
|
const [dateTo, setDateTo] = useState(moment().format(dateFormat));
|
|
|
- const [startBlock, setStartBlock] = useState(("" as unknown) as number);
|
|
|
- const [endBlock, setEndBlock] = useState(("" as unknown) as number);
|
|
|
+ const [startBlock, setStartBlock] = useState("" as unknown as number);
|
|
|
+ const [endBlock, setEndBlock] = useState("" as unknown as number);
|
|
|
const [isLoading, setIsLoading] = useState(false);
|
|
|
const [error, setError] = useState(undefined);
|
|
|
const [backendUrl] = useState(alternativeBackendApis);
|
|
@@ -77,7 +81,7 @@ const ValidatorReport = () => {
|
|
|
{
|
|
|
field: "commission",
|
|
|
headerName: "Commission",
|
|
|
- width: 150,
|
|
|
+ width: 200,
|
|
|
sortable: true,
|
|
|
valueFormatter: (params: { value: number }) => {
|
|
|
if (isNaN(params.value)) {
|
|
@@ -89,11 +93,11 @@ const ValidatorReport = () => {
|
|
|
{
|
|
|
field: "blocksCount",
|
|
|
headerName: "Blocks Produced",
|
|
|
- width: 150,
|
|
|
+ width: 200,
|
|
|
sortable: true,
|
|
|
},
|
|
|
]);
|
|
|
- const [report, setReport] = useState(({
|
|
|
+ const [report, setReport] = useState({
|
|
|
pageSize: 0,
|
|
|
totalCount: 0,
|
|
|
totalBlocks: 0,
|
|
@@ -103,8 +107,8 @@ const ValidatorReport = () => {
|
|
|
endBlock: -1,
|
|
|
startTime: -1,
|
|
|
endTime: -1,
|
|
|
- report: ([] as unknown) as Report[],
|
|
|
- } as unknown) as Reports);
|
|
|
+ report: [] as unknown as Report[],
|
|
|
+ } as unknown as Reports);
|
|
|
|
|
|
const isDateRange = filterTab === 0;
|
|
|
const isBlockRange = filterTab === 1;
|
|
@@ -170,13 +174,13 @@ const ValidatorReport = () => {
|
|
|
const startOrStopLoading = () =>
|
|
|
isLoading ? stopLoadingReport() : loadReport(1);
|
|
|
const updateStartBlock = (e: { target: { value: unknown } }) =>
|
|
|
- setStartBlock((e.target.value as unknown) as number);
|
|
|
+ setStartBlock(e.target.value as unknown as number);
|
|
|
const updateEndBlock = (e: { target: { value: unknown } }) =>
|
|
|
- setEndBlock((e.target.value as unknown) as number);
|
|
|
+ setEndBlock(e.target.value as unknown as number);
|
|
|
const updateDateFrom = (e: { target: { value: unknown } }) =>
|
|
|
- setDateFrom((e.target.value as unknown) as string);
|
|
|
+ setDateFrom(e.target.value as unknown as string);
|
|
|
const updateDateTo = (e: { target: { value: unknown } }) =>
|
|
|
- setDateTo((e.target.value as unknown) as string);
|
|
|
+ setDateTo(e.target.value as unknown as string);
|
|
|
|
|
|
const setCurrentPeriodStartBlock = () => {
|
|
|
const blocksToEndOfDay = moment().endOf("d").diff(moment(), "seconds") / 6;
|
|
@@ -381,13 +385,13 @@ const ValidatorReport = () => {
|
|
|
<ValidatorReportCard stash={stash} report={report} />
|
|
|
</Grid>
|
|
|
<Grid item xs={12} lg={12}>
|
|
|
- <div style={{ height: 400 }}>
|
|
|
+ <div className={classes.tableWrapper}>
|
|
|
<Backdrop className={classes.backdrop} open={isLoading}>
|
|
|
<CircularProgress color="inherit" />
|
|
|
</Backdrop>
|
|
|
<DataGrid
|
|
|
rows={report.report}
|
|
|
- columns={(columns as unknown) as GridColumns}
|
|
|
+ columns={columns as unknown as GridColumns}
|
|
|
rowCount={report.totalCount}
|
|
|
pagination
|
|
|
paginationMode="server"
|