fix(web): use a time-only timestamp in the compact column entries (#1616)
At the 320px column minimum the full ISO timestamp ate most of line 1. Use an HH:MM:SS (UTC) form in the embedded HistoryEntry/NetworkEntry headers only; the full-size layouts keep the full ISO string. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
3550b64032
commit
efddd94bea
2 changed files with 25 additions and 4 deletions
|
|
@ -35,7 +35,11 @@ describe("NetworkEntry", () => {
|
|||
renderWithMantine(
|
||||
<NetworkEntry entry={baseEntry} isListExpanded={false} embedded />,
|
||||
);
|
||||
// Line 1: method, category, duration, status.
|
||||
// Line 1: compact time-only timestamp, method, category, duration, status.
|
||||
expect(screen.getByText("10:00:00")).toBeInTheDocument();
|
||||
expect(
|
||||
screen.queryByText("2026-03-17T10:00:00.000Z"),
|
||||
).not.toBeInTheDocument();
|
||||
expect(screen.getByText("POST")).toBeInTheDocument();
|
||||
expect(screen.getByText("transport")).toBeInTheDocument();
|
||||
expect(screen.getByText("45ms")).toBeInTheDocument();
|
||||
|
|
|
|||
|
|
@ -89,6 +89,12 @@ function formatTimestamp(date: Date): string {
|
|||
return date.toISOString();
|
||||
}
|
||||
|
||||
// Time-only (HH:MM:SS, UTC) for the compact column header, where the full ISO
|
||||
// string would eat most of the narrow line-1 width (#1616).
|
||||
function formatTimestampCompact(date: Date): string {
|
||||
return date.toISOString().slice(11, 19);
|
||||
}
|
||||
|
||||
function statusColor(entry: FetchRequestEntry): string {
|
||||
if (entry.error) return "red";
|
||||
const status = entry.responseStatus;
|
||||
|
|
@ -266,7 +272,7 @@ export function NetworkEntry({
|
|||
<HeaderRow>
|
||||
<HeaderCluster>
|
||||
<TimestampText>
|
||||
{formatTimestamp(entry.timestamp)}
|
||||
{formatTimestampCompact(entry.timestamp)}
|
||||
</TimestampText>
|
||||
<Badge color="dark">{entry.method}</Badge>
|
||||
<Badge color={categoryColor(entry.category)} variant="light">
|
||||
|
|
|
|||
Loading…
Reference in a new issue