common component for more readable slot numbers
This commit is contained in:
parent
c4913e3c9e
commit
1211d8118c
|
@ -17,6 +17,7 @@ import { ErrorCard } from "components/common/ErrorCard";
|
|||
import { LoadingCard } from "components/common/LoadingCard";
|
||||
import { Signature } from "components/common/Signature";
|
||||
import { Address } from "components/common/Address";
|
||||
import { Slot } from "components/common/Slot";
|
||||
import { useTransactionDetails } from "providers/transactions";
|
||||
import { useFetchTransactionDetails } from "providers/transactions/details";
|
||||
import { coerce } from "superstruct";
|
||||
|
@ -249,8 +250,8 @@ function TokenTransactionRow({
|
|||
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td className="w-1 text-monospace">
|
||||
{tx.slot.toLocaleString("en-US")}
|
||||
<td className="w-1">
|
||||
<Slot slot={tx.slot} />
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -288,7 +289,9 @@ function TokenTransactionRow({
|
|||
|
||||
return (
|
||||
<tr key={tx.signature}>
|
||||
<td className="w-1 text-monospace">{tx.slot.toLocaleString("en-US")}</td>
|
||||
<td className="w-1">
|
||||
<Slot slot={tx.slot} />
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>{statusText}</span>
|
||||
|
|
|
@ -6,6 +6,7 @@ import { useFetchAccountHistory } from "providers/accounts/history";
|
|||
import { Signature } from "components/common/Signature";
|
||||
import { ErrorCard } from "components/common/ErrorCard";
|
||||
import { LoadingCard } from "components/common/LoadingCard";
|
||||
import { Slot } from "components/common/Slot";
|
||||
|
||||
export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
|
||||
const address = pubkey.toBase58();
|
||||
|
@ -70,7 +71,9 @@ export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
|
|||
|
||||
detailsList.push(
|
||||
<tr key={signature}>
|
||||
<td className="w-1 text-monospace">{slot.toLocaleString("en-US")}</td>
|
||||
<td className="w-1">
|
||||
<Slot slot={slot} />
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>
|
||||
|
|
|
@ -0,0 +1,8 @@
|
|||
import React from "react";
|
||||
|
||||
type Props = {
|
||||
slot: number;
|
||||
};
|
||||
export function Slot({ slot }: Props) {
|
||||
return <span className="text-monospace">{slot.toLocaleString("en-US")}</span>;
|
||||
}
|
|
@ -1,6 +1,7 @@
|
|||
import React from "react";
|
||||
|
||||
import { TableCardBody } from "components/common/TableCardBody";
|
||||
import { Slot } from "components/common/Slot";
|
||||
import {
|
||||
useDashboardInfo,
|
||||
usePerformanceInfo,
|
||||
|
@ -70,18 +71,21 @@ function StatsCardBody() {
|
|||
slotsInEpoch - slotIndex,
|
||||
hourlyBlockTime
|
||||
);
|
||||
const blockHeight = epochInfo.blockHeight.toLocaleString("en-US");
|
||||
const currentSlot = epochInfo.absoluteSlot.toLocaleString("en-US");
|
||||
const { blockHeight, absoluteSlot } = epochInfo;
|
||||
|
||||
return (
|
||||
<TableCardBody>
|
||||
<tr>
|
||||
<td className="w-100">Slot</td>
|
||||
<td className="text-lg-right text-monospace">{currentSlot}</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<Slot slot={absoluteSlot} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="w-100">Block height</td>
|
||||
<td className="text-lg-right text-monospace">{blockHeight}</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<Slot slot={blockHeight} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="w-100">Block time</td>
|
||||
|
|
|
@ -20,6 +20,7 @@ import { StakeDetailsCard } from "components/instruction/stake/StakeDetailsCard"
|
|||
import { ErrorCard } from "components/common/ErrorCard";
|
||||
import { LoadingCard } from "components/common/LoadingCard";
|
||||
import { TableCardBody } from "components/common/TableCardBody";
|
||||
import { Slot } from "components/common/Slot";
|
||||
import { displayTimestamp } from "utils/date";
|
||||
import { InfoTooltip } from "components/common/InfoTooltip";
|
||||
import { Address } from "components/common/Address";
|
||||
|
@ -246,7 +247,9 @@ function StatusCard({
|
|||
|
||||
<tr>
|
||||
<td>Block</td>
|
||||
<td className="text-lg-right">{info.slot}</td>
|
||||
<td className="text-lg-right">
|
||||
<Slot slot={info.slot} />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{blockhash && (
|
||||
|
|
Loading…
Reference in New Issue