"use client";
import * as React from "react";
import { Terminal, X, Copy, Check } from "lucide-react";
export function LogViewerButton({
title,
content,
}: {
title: string;
content: string;
}) {
const [open, setOpen] = React.useState(false);
return (
<>
{open && setOpen(false)} />}
);
}
function LogViewer({
title,
content,
onClose,
}: {
title: string;
content: string;
onClose: () => void;
}) {
const scrollRef = React.useRef(null);
const [copied, setCopied] = React.useState(false);
React.useEffect(() => {
if (scrollRef.current) {
scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
}
}, []);
React.useEffect(() => {
const onKey = (e: KeyboardEvent) => {
if (e.key === "Escape") onClose();
};
document.addEventListener("keydown", onKey);
document.body.style.overflow = "hidden";
return () => {
document.removeEventListener("keydown", onKey);
document.body.style.overflow = "";
};
}, [onClose]);
const onCopy = async () => {
try {
await navigator.clipboard.writeText(content);
setCopied(true);
setTimeout(() => setCopied(false), 1500);
} catch {
/* ignore */
}
};
const cleaned = content.replace(/\x1b\[[0-9;]*[a-zA-Z]/g, "");
return (
e.stopPropagation()}
>
{title}
);
}