Display age column

This commit is contained in:
Willian Mitsuda 2021-07-29 23:32:29 -03:00
parent 94faa79ede
commit 5bab1f383b
3 changed files with 13 additions and 2 deletions

View File

@ -1,11 +1,14 @@
import React from "react";
type TimestampAgeProps = {
now?: number | undefined;
timestamp: number;
};
const TimestampAge: React.FC<TimestampAgeProps> = ({ timestamp }) => {
const now = Date.now() / 1000;
const TimestampAge: React.FC<TimestampAgeProps> = ({ now, timestamp }) => {
if (now === undefined) {
now = Date.now() / 1000;
}
let diff = now - timestamp;
let desc = "";

View File

@ -1,6 +1,7 @@
import { ethers } from "ethers";
import React from "react";
import BlockLink from "../components/BlockLink";
import TimestampAge from "../components/TimestampAge";
import { ExtendedBlock } from "../useErigonHooks";
const ELASTICITY_MULTIPLIER = 2;
@ -48,6 +49,9 @@ const BlockRecord: React.FC<BlockRecordProps> = ({ block }) => {
)}{" "}
Gwei
</div>
<div className="text-right">
<TimestampAge timestamp={block.timestamp} />
</div>
</div>
);
};

View File

@ -69,6 +69,7 @@ const Blocks: React.FC<BlocksProps> = ({ latestBlock }) => {
</span>
<span>Burnt fees</span>
</div>
<div className="text-right">Age</div>
</div>
<div className="grid grid-cols-8 px-3 py-3 animate-pulse items-center">
<div>
@ -89,6 +90,9 @@ const Blocks: React.FC<BlocksProps> = ({ latestBlock }) => {
<div className="justify-self-end">
<div className="w-36 h-4 bg-gray-200 rounded-md"></div>
</div>
<div className="justify-self-end">
<div className="w-36 h-4 bg-gray-200 rounded-md"></div>
</div>
</div>
{blocks.map((b, i) => (
<Transition