diff --git a/explorer/src/components/account/TransactionHistoryCard.tsx b/explorer/src/components/account/TransactionHistoryCard.tsx
index 0973cadc24..6c166fa6db 100644
--- a/explorer/src/components/account/TransactionHistoryCard.tsx
+++ b/explorer/src/components/account/TransactionHistoryCard.tsx
@@ -7,6 +7,7 @@ import { Signature } from "components/common/Signature";
import { ErrorCard } from "components/common/ErrorCard";
import { LoadingCard } from "components/common/LoadingCard";
import { Slot } from "components/common/Slot";
+import { displayTimestamp } from "utils/date";
export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
const address = pubkey.toBase58();
@@ -48,6 +49,7 @@ export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
);
}
+ const hasTimestamps = !!transactions.find((element) => !!element.blockTime);
const detailsList: React.ReactNode[] = [];
for (var i = 0; i < transactions.length; i++) {
const slot = transactions[i].slot;
@@ -58,7 +60,7 @@ export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
slotTransactions.push(transactions[++i]);
}
- slotTransactions.forEach(({ signature, err }) => {
+ slotTransactions.forEach(({ signature, err, blockTime }) => {
let statusText;
let statusClass;
if (err) {
@@ -75,6 +77,12 @@ export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
+ {hasTimestamps && (
+
+ {blockTime ? displayTimestamp(blockTime * 1000, true) : "---"}
+ |
+ )}
+
{statusText}
@@ -118,6 +126,7 @@ export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
Slot |
+ {hasTimestamps && Timestamp | }
Result |
Transaction Signature |
diff --git a/explorer/src/utils/date.ts b/explorer/src/utils/date.ts
index 0f1cc999bb..b06dffb8d9 100644
--- a/explorer/src/utils/date.ts
+++ b/explorer/src/utils/date.ts
@@ -1,4 +1,7 @@
-export function displayTimestamp(unixTimestamp: number): string {
+export function displayTimestamp(
+ unixTimestamp: number,
+ shortTimeZoneName = false
+): string {
const expireDate = new Date(unixTimestamp);
const dateString = new Intl.DateTimeFormat("en-US", {
year: "numeric",
@@ -10,12 +13,15 @@ export function displayTimestamp(unixTimestamp: number): string {
minute: "numeric",
second: "numeric",
hour12: false,
- timeZoneName: "long",
+ timeZoneName: shortTimeZoneName ? "short" : "long",
}).format(expireDate);
return `${dateString} at ${timeString}`;
}
-export function displayTimestampUtc(unixTimestamp: number): string {
+export function displayTimestampUtc(
+ unixTimestamp: number,
+ shortTimeZoneName = false
+): string {
const expireDate = new Date(unixTimestamp);
const dateString = new Intl.DateTimeFormat("en-US", {
year: "numeric",
@@ -29,6 +35,7 @@ export function displayTimestampUtc(unixTimestamp: number): string {
second: "numeric",
hour12: false,
timeZone: "UTC",
+ timeZoneName: shortTimeZoneName ? "short" : "long",
}).format(expireDate);
return `${dateString} at ${timeString}`;
}
|