fix: improve duration formatting (Xm Ys) and truncate exchange IDs

- formatDuration and formatDurationShort now show Xm Ys for durations >= 60s (e.g. "5m 21s" instead of "321s") and 1 decimal for 1-60s range ("6.7s" instead of "6.70s")
- Exchange ID column shows last 8 chars with ellipsis prefix; full ID on hover, copies to clipboard on click

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-04-09 18:34:04 +02:00
parent ba0a1850a9
commit eadcd160a3
14 changed files with 293 additions and 269 deletions

View File

@@ -1,4 +1,4 @@
import { useState, useMemo, useCallback, useEffect } from 'react'
import React, { useState, useMemo, useCallback, useEffect } from 'react'
import { useParams, useNavigate, useSearchParams } from 'react-router'
import { AlertTriangle, X, Search, Footprints, RotateCcw } from 'lucide-react'
import {
@@ -113,7 +113,17 @@ function buildBaseColumns(): Column<Row>[] {
header: 'Exchange ID',
sortable: true,
render: (_: unknown, row: Row) => (
<MonoText size="xs">{row.executionId}</MonoText>
<MonoText
size="xs"
title={row.executionId}
style={{ cursor: 'pointer' }}
onClick={(e: React.MouseEvent) => {
e.stopPropagation();
navigator.clipboard.writeText(row.executionId);
}}
>
...{row.executionId.slice(-8)}
</MonoText>
),
},
{