- Added new Radix UI components including checkbox, label, popover, slider, switch, and tooltip to improve UI interactions. - Integrated react-syntax-highlighter for better code rendering in chat messages. - Updated package.json and pnpm-lock.yaml to include new dependencies and ensure compatibility. - Enhanced chat input to support web search toggling, improving user experience during message composition. - Implemented auto-saving of chat sessions and improved session management features. - Refactored chat message rendering to clean up metadata and improve display quality.
48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
import { Check, Copy } from "lucide-react";
|
|
import { useState } from "react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
interface CodeBlockProps {
|
|
language: string;
|
|
children: string;
|
|
}
|
|
|
|
export function CodeBlock({ language, children }: CodeBlockProps) {
|
|
const [copied, setCopied] = useState(false);
|
|
|
|
const handleCopy = () => {
|
|
navigator.clipboard.writeText(children);
|
|
setCopied(true);
|
|
setTimeout(() => setCopied(false), 2000);
|
|
};
|
|
|
|
return (
|
|
<div className="my-4 rounded-lg border bg-muted/50 overflow-hidden">
|
|
<div className="flex items-center justify-between px-4 py-2 bg-muted/80 border-b">
|
|
<span className="text-xs font-medium text-muted-foreground uppercase">
|
|
{language || "text"}
|
|
</span>
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-6 w-6 hover:bg-background/50"
|
|
onClick={handleCopy}
|
|
title="Copiar código"
|
|
>
|
|
{copied ? (
|
|
<Check className="h-3.5 w-3.5 text-green-500" />
|
|
) : (
|
|
<Copy className="h-3.5 w-3.5 text-muted-foreground" />
|
|
)}
|
|
</Button>
|
|
</div>
|
|
<div className="p-4 overflow-x-auto">
|
|
<code className="text-sm font-mono whitespace-pre">{children}</code>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
|
|
|