feat: Add copy-to-clipboard functionality for trace IDs and refine task list layouts.

This commit is contained in:
viettranx committed 2026-02-28 23:37:13 +07:00
1 parent 56827aee11
commit 857262c641
3 files changed
+16 -4

No files matched your search

@@ -43,7 +43,7 @@ export function TaskList({ tasks, loading }: TaskListProps) {
className="grid grid-cols-[1fr_90px_100px_60px] items-center gap-2 border-b px-4 py-3 last:border-0"
>
<div className="min-w-0">
<span className="truncate text-sm font-medium">{task.subject}</span>
<p className="truncate text-sm font-medium">{task.subject}</p>
{task.description && (
<p className="truncate text-xs text-muted-foreground/70">
{task.description}
+1 -1
View File
@@ -28,7 +28,7 @@ export function TeamTasksTab({ teamId, getTeamTasks }: TeamTasksTabProps) {
}, [teamId, getTeamTasks]);
return (
<div className="max-w-2xl space-y-6">
<div className="space-y-6">
<TaskList tasks={tasks} loading={loading} />
</div>
);
@@ -6,7 +6,8 @@ import {
DialogTitle,
} from "@/components/ui/dialog";
import { Badge } from "@/components/ui/badge";
import { ChevronRight, ChevronDown } from "lucide-react";
import { ChevronRight, ChevronDown, Copy, Check } from "lucide-react";
import { useClipboard } from "@/hooks/use-clipboard";
import { formatDate, formatDuration, formatTokens, computeDurationMs } from "@/lib/format";
import type { TraceData, SpanData } from "./hooks/use-traces";
@@ -48,6 +49,7 @@ export function TraceDetailDialog({ traceId, onClose, getTrace, onNavigateTrace
const [trace, setTrace] = useState<TraceData | null>(null);
const [spans, setSpans] = useState<SpanData[]>([]);
const [loading, setLoading] = useState(true);
const { copied, copy } = useClipboard();
useEffect(() => {
setLoading(true);
@@ -67,7 +69,17 @@ export function TraceDetailDialog({ traceId, onClose, getTrace, onNavigateTrace
<Dialog open onOpenChange={() => onClose()}>
<DialogContent className="max-h-[85vh] w-[95vw] overflow-y-auto sm:max-w-6xl">
<DialogHeader>
<DialogTitle>Trace Detail</DialogTitle>
<DialogTitle className="flex items-center gap-2">
Trace Detail
<button
type="button"
onClick={() => copy(traceId)}
className="rounded p-1 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
title="Copy trace ID"
>
{copied ? <Check className="h-3.5 w-3.5 text-green-500" /> : <Copy className="h-3.5 w-3.5" />}
</button>
</DialogTitle>
</DialogHeader>
{loading && !trace ? (