Merge branch 'feat/add-block-status-to-table' of github.com:aztec-scan/chicmoz into bug/ethereum-genesis-catchup

Author: FilipHarald

services/explorer-ui/src/components/blocks/block-table-columns.tsx

@@ -5,13 +5,14 @@ import { formatTimeSince } from "~/lib/utils";
 import { routes } from "~/routes/__root";
 import type { BlockTableSchema } from "./blocks-schema";
 import { truncateHashString } from "~/lib/create-hash-string";
+import { BlockStatusBadge } from "../block-status-badge";
 
 const text = {
   height: "HEIGHT",
   blockHash: "BLOCK HASH",
   txEffectsLength: "NBR OF TXS",
-  totalFees: "FEES (FPA)",
   timeSince: "AGE",
+  blockStatus: "BLOCK STATUS"
 };
 
 export const BlockTableColumns: ColumnDef<BlockTableSchema>[] = [
@@ -48,7 +49,7 @@ export const BlockTableColumns: ColumnDef<BlockTableSchema>[] = [
     ),
     cell: ({ row }) => {
       const blockHash = row.getValue("blockHash");
-      if (typeof blockHash !== "string") return null;
+      if (typeof blockHash !== "string") { return null; }
       const r = `${routes.blocks.route}/${blockHash}`;
       return (
         <div className="text-purple-light font-mono">
@@ -94,18 +95,18 @@ export const BlockTableColumns: ColumnDef<BlockTableSchema>[] = [
     enableHiding: false,
   },
   {
-    accessorKey: "totalFees",
+    accessorKey: "blockStatus",
     header: ({ column }) => (
       <DataTableColumnHeader
         className="text-purple-dark text-sm"
         column={column}
-        title={text.totalFees}
+        title={text.blockStatus}
       />
     ),
     cell: ({ row }) => (
-      <div className="font-mono">{row.getValue("totalFees")}</div>
+      <BlockStatusBadge className="font-mono" status={row.getValue("blockStatus")} />
     ),
-    enableSorting: true,
+    enableSorting: false,
     enableHiding: false,
   },
 ];

services/explorer-ui/src/components/blocks/blocks-schema.ts

@@ -1,3 +1,4 @@
+import { chicmozL2BlockFinalizationStatusSchema } from "@chicmoz-pkg/types";
 import { z } from "zod";
 
 export type BlockTableSchema = z.infer<typeof blockSchema>;
@@ -6,7 +7,7 @@ export const blockSchema = z.object({
   height: z.coerce.number(),
   blockHash: z.string(),
   txEffectsLength: z.number(),
-  totalFees: z.coerce.string(),
   totalManaUsed: z.coerce.string(),
+  blockStatus: chicmozL2BlockFinalizationStatusSchema,
   timestamp: z.number(),
 });

services/explorer-ui/src/pages/landing/util.ts

@@ -17,8 +17,8 @@ export const mapLatestBlocks = (latestBlocks?: ChicmozL2BlockLight[]) => {
       height: block.height,
       blockHash: block.hash,
       txEffectsLength: block.body.txEffects.length,
-      totalFees: block.header.totalFees,
       timestamp: block.header.globalVariables.timestamp,
+      blockStatus: block.finalizationStatus,
     });
   });
 };