Display both slot and block height in explorer (#11447)
This commit is contained in:
@ -5,7 +5,6 @@ import TableCardBody from "./common/TableCardBody";
|
|||||||
import {
|
import {
|
||||||
useDashboardInfo,
|
useDashboardInfo,
|
||||||
usePerformanceInfo,
|
usePerformanceInfo,
|
||||||
useRootSlot,
|
|
||||||
PERF_UPDATE_SEC,
|
PERF_UPDATE_SEC,
|
||||||
useSetActive,
|
useSetActive,
|
||||||
PerformanceInfo,
|
PerformanceInfo,
|
||||||
@ -29,7 +28,6 @@ export default function StatsCard() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function StatsCardBody() {
|
function StatsCardBody() {
|
||||||
const rootSlot = useRootSlot();
|
|
||||||
const dashboardInfo = useDashboardInfo();
|
const dashboardInfo = useDashboardInfo();
|
||||||
const performanceInfo = usePerformanceInfo();
|
const performanceInfo = usePerformanceInfo();
|
||||||
const setSocketActive = useSetActive();
|
const setSocketActive = useSetActive();
|
||||||
@ -52,7 +50,7 @@ function StatsCardBody() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (rootSlot === undefined || !dashboardInfo || !performanceInfo) {
|
if (!dashboardInfo || !performanceInfo) {
|
||||||
return (
|
return (
|
||||||
<div className="card-body text-center">
|
<div className="card-body text-center">
|
||||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||||
@ -61,7 +59,6 @@ function StatsCardBody() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const currentBlock = rootSlot.toLocaleString("en-US");
|
|
||||||
const { avgBlockTime_1h, avgBlockTime_1min, epochInfo } = dashboardInfo;
|
const { avgBlockTime_1h, avgBlockTime_1min, epochInfo } = dashboardInfo;
|
||||||
const hourlyBlockTime = Math.round(1000 * avgBlockTime_1h);
|
const hourlyBlockTime = Math.round(1000 * avgBlockTime_1h);
|
||||||
const averageBlockTime = Math.round(1000 * avgBlockTime_1min) + "ms";
|
const averageBlockTime = Math.round(1000 * avgBlockTime_1min) + "ms";
|
||||||
@ -74,12 +71,18 @@ function StatsCardBody() {
|
|||||||
);
|
);
|
||||||
const averageTps = Math.round(performanceInfo.avgTPS);
|
const averageTps = Math.round(performanceInfo.avgTPS);
|
||||||
const transactionCount = <AnimatedTransactionCount info={performanceInfo} />;
|
const transactionCount = <AnimatedTransactionCount info={performanceInfo} />;
|
||||||
|
const blockHeight = epochInfo.blockHeight.toLocaleString("en-US");
|
||||||
|
const currentSlot = epochInfo.absoluteSlot.toLocaleString("en-US");
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<TableCardBody>
|
<TableCardBody>
|
||||||
<tr>
|
<tr>
|
||||||
<td className="w-100">Block</td>
|
<td className="w-100">Slot</td>
|
||||||
<td className="text-lg-right text-monospace">{currentBlock}</td>
|
<td className="text-lg-right text-monospace">{currentSlot}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td className="w-100">Block height</td>
|
||||||
|
<td className="text-lg-right text-monospace">{blockHeight}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td className="w-100">Block time</td>
|
<td className="w-100">Block time</td>
|
||||||
|
Reference in New Issue
Block a user