From d84e7e635e1ece6e95246d03a9ddb9366bcd628c Mon Sep 17 00:00:00 2001
From: techgirly77 <techgirly202@gmail.com>
Date: Fri, 28 Aug 2026 12:42:25 +0000
Subject: [PATCH] added

---
 dashboard/src/components/EventExplorerCard.tsx       | 7 +++----
 dashboard/src/components/EventExplorerTable.test.tsx | 9 ++++++++-
 dashboard/src/components/EventExplorerTable.tsx      | 4 ----
 3 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/dashboard/src/components/EventExplorerCard.tsx b/dashboard/src/components/EventExplorerCard.tsx
index 7c59cfaa..847179ab 100644
--- a/dashboard/src/components/EventExplorerCard.tsx
+++ b/dashboard/src/components/EventExplorerCard.tsx
@@ -1,6 +1,6 @@
 import type { BlockchainEvent } from '../types/event';
 import type { ContractStatus } from '../services/eventsApi';
-import { formatTimestamp } from '../utils/formatTime';
+import { formatTimestamp, parseToDate } from '../utils/formatTime';
 import { CopyButton } from './CopyButton';
 
 const EVENT_KIND_STYLES: Record<string, string> = {
@@ -37,7 +37,6 @@ interface EventExplorerCardProps {
   isCopied: boolean;
   onSelect?: (event: BlockchainEvent) => void;
   contractStatuses: ContractStatus[];
-  contractStatuses?: ContractStatus[];
 }
 
 export function EventExplorerCard({
@@ -45,7 +44,6 @@ export function EventExplorerCard({
   onCopyContract,
   isCopied,
   onSelect,
-  contractStatuses,
   contractStatuses = [],
 }: EventExplorerCardProps) {
   const contractStatus = contractStatuses.find((c) => c.address === event.contractAddress);
@@ -53,6 +51,7 @@ export function EventExplorerCard({
   const label = event.eventName ?? event.type;
   const badgeClass = getEventKindClass(event.type);
   const kindLabel = getEventKindLabel(event.type);
+  const receivedAt = parseToDate(event.receivedAt);
 
   return (
     <article
@@ -106,7 +105,7 @@ export function EventExplorerCard({
       </div>
 
       <div className="event-explorer__cell" data-label="Received" role="cell">
-        <time dateTime={new Date(event.receivedAt).toISOString()}>
+        <time dateTime={receivedAt?.toISOString()}>
           {formatTimestamp(event.receivedAt)}
         </time>
       </div>
diff --git a/dashboard/src/components/EventExplorerTable.test.tsx b/dashboard/src/components/EventExplorerTable.test.tsx
index e60c6517..261277aa 100644
--- a/dashboard/src/components/EventExplorerTable.test.tsx
+++ b/dashboard/src/components/EventExplorerTable.test.tsx
@@ -6,7 +6,7 @@ import {
   MIN_COLUMN_WIDTH,
   EventExplorerTable,
 } from './EventExplorerTable';
-import { render, fireEvent } from '@testing-library/react';
+import { render, fireEvent, screen } from '@testing-library/react';
 import type { BlockchainEvent } from '../types/event';
 
 const STORAGE_KEY = 'notify-chain-event-table-widths';
@@ -87,4 +87,11 @@ describe('EventExplorerTable resizing UI', () => {
     expect(after.split(' ').length).toBe(DEFAULT_COLUMN_WIDTHS.length);
     expect(localStorage.getItem(STORAGE_KEY)).toBeTruthy();
   });
+
+  it('renders invalid event timestamps without throwing', () => {
+    render(<EventExplorerTable events={[{ ...sampleEvent, receivedAt: NaN }]} />);
+
+    expect(screen.getByText('Unknown time')).toBeInTheDocument();
+    expect(screen.getByText('Unknown time').closest('time')).not.toHaveAttribute('dateTime');
+  });
 });
diff --git a/dashboard/src/components/EventExplorerTable.tsx b/dashboard/src/components/EventExplorerTable.tsx
index 8a06cc14..1ea0803d 100644
--- a/dashboard/src/components/EventExplorerTable.tsx
+++ b/dashboard/src/components/EventExplorerTable.tsx
@@ -16,10 +16,6 @@ interface EventExplorerTableProps {
   contractStatuses: ContractStatus[];
 }
 
-export function EventExplorerTable({ events, onSelectEvent, contractStatuses }: EventExplorerTableProps) {
-  contractStatuses?: ContractStatus[];
-}
-
 export function loadColumnWidths(): number[] {
   try {
     const raw = localStorage.getItem(STORAGE_KEY);