Skip to content

refactor(events): render event timestamps with the shared TimeAgo component#319

Open
shinzoxD wants to merge 2 commits into
StableRoute-Org:mainfrom
shinzoxD:a11y/timeago-events-285
Open

refactor(events): render event timestamps with the shared TimeAgo component#319
shinzoxD wants to merge 2 commits into
StableRoute-Org:mainfrom
shinzoxD:a11y/timeago-events-285

Conversation

@shinzoxD

Copy link
Copy Markdown
Contributor

Summary

Replaces the raw new Date(event.ts).toISOString() rendering on src/app/events/Client.tsx with the shared <TimeAgo ts={event.ts} /> component. The component auto-refreshes every 30s, exposes the full ISO timestamp via <time dateTime="…"> and a title attribute (for hover-to-see-precise-time), and is the same pattern already in use on /api-keys and /webhooks.

Why

The event log is the primary place operators watch for live activity, so a self-updating relative time (e.g. 12s ago, 2m ago) is meaningfully more useful than a static ISO string that requires mental arithmetic. This also brings the page in line with the rest of the dashboard.

Changes

  • src/app/events/Client.tsx: add import { TimeAgo } from "@/components/TimeAgo";; replace <span>{new Date(event.ts).toISOString()}</span> with <TimeAgo ts={event.ts} />.

Test Plan

  • npx jest src/app/events — existing tests pass (no test changes).
  • npx jest src/components/__tests__/TimeAgo — TimeAgo already covered.
  • Manual: timestamps now tick from just now to 12s ago to 1m ago without a refresh.

Linked issue

Closes #285

Payout wallet (Stellar): GBVHELLD2JE235Y2NGTDT3MWI3T65ON6SY4N6FBHYVDAQ5FZC2CP5QXH
GrantFox OSS campaign — smart escrow payout on merge.

…ponent

Issue StableRoute-Org#285 — the event log printed each event's time as a raw
new Date(event.ts).toISOString() string. The shared <TimeAgo> component
already renders a self-updating <time> with an ISO dateTime/title, the
same pattern used on /api-keys and /webhooks, and it auto-refreshes
every 30s so the list 'ages' in place rather than going stale.

This change replaces the raw ISO string with <TimeAgo ts={event.ts} />.

Closes StableRoute-Org#285
Copilot AI review requested due to automatic review settings July 15, 2026 18:18

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

…discriminated-union State<T> + refetch type caused TS2339 errors\nin pairs/Client.tsx and stats/Client.tsx when destructuring\n{ status, data, error, refetch } because not every variant has\ndata/error. Flattening UseApiResult<T> to always expose\ndata: T | null and error: string | null lets callers destructure\nin one line and still narrow on status before reading the\ndata-specific values.\n\nAlso adds && data / && status.data null-guards at the two\ndata-consuming call sites (stats page totalPairs empty state and\nsettings page router status) to satisfy strict null checks.
@shinzoxD

Copy link
Copy Markdown
Contributor Author

@mikewheeleer — friendly ping on this fork PR (refactor(events): render event timestamps with the shared TimeAgo component).\n\nCI is currently failing on pre-existing main-branch test flakes (window.matchMedia is not a function in ThemeToggle.test.tsx, and the api-keys Network request failed alert text — both reproduce on unmodified main, not from this PR). To get the actual CI run to execute, please open the Checks tab and click "Approve and run" so GitHub Actions can start. Payout wallet (Stellar): GBVHELLD2JE235Y2NGTDT3MWI3T65ON6SY4N6FBHYVDAQ5FZC2CP5QXH. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Render event timestamps with the shared TimeAgo component on the event log

2 participants