feat: add copy button to AI log analysis result

Allows users to quickly copy the AI-generated log analysis to their
clipboard from the analyze-logs popover, matching the copy UX used in
the deployment and docker logs views.

Made-with: Cursor
This commit is contained in:
berkay-digital
2026-04-23 15:19:13 +02:00
parent d7af82731c
commit ad490dca3f
@@ -1,5 +1,6 @@
"use client";
import { Bot, Loader2, RotateCcw, Settings, X } from "lucide-react";
import copy from "copy-to-clipboard";
import { Bot, Check, Copy, Loader2, RotateCcw, Settings, X } from "lucide-react";
import Link from "next/link";
import { useState } from "react";
import ReactMarkdown from "react-markdown";
@@ -30,6 +31,7 @@ const MAX_LOG_LINES = 200;
export function AnalyzeLogs({ logs, context }: Props) {
const [open, setOpen] = useState(false);
const [aiId, setAiId] = useState<string>("");
const [copied, setCopied] = useState(false);
const { data: providers } = api.ai.getEnabledProviders.useQuery(undefined, {
enabled: open,
});
@@ -52,6 +54,15 @@ export function AnalyzeLogs({ logs, context }: Props) {
mutate({ aiId, logs: logsText, context });
};
const handleCopy = () => {
if (!data?.analysis) return;
const success = copy(data.analysis);
if (success) {
setCopied(true);
setTimeout(() => setCopied(false), 2000);
}
};
return (
<Popover
open={open}
@@ -168,6 +179,18 @@ export function AnalyzeLogs({ logs, context }: Props) {
)}
Re-analyze
</Button>
<Button
size="sm"
variant="outline"
onClick={handleCopy}
title="Copy analysis to clipboard"
>
{copied ? (
<Check className="h-3.5 w-3.5" />
) : (
<Copy className="h-3.5 w-3.5" />
)}
</Button>
<Button
size="sm"
variant="ghost"