feat: enhance chat functionality with markdown support and default prompts

- Added support for rendering markdown in chat messages using ReactMarkdown with custom renderers. - Integrated a default format prompt for the chat system, improving user experience by initializing with a predefined prompt. - Updated the prompt generator to handle model selection more robustly, including loading states and fallback options for model selection. - Enhanced UI components for better accessibility and user feedback during prompt generation.
2025-11-19 00:34:57 -03:00
1 parent b2a06ed994
commit 032722e21b
@@ -0,0 +1,81 @@
+import { Button } from "@/components/ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { Copy, FileJson, FileText, MoreHorizontal } from "lucide-react";
+import { useState } from "react";
+
+interface MessageActionsProps {
+  content: string;
+  role: string;
+}
+
+export function MessageActions({ content, role }: MessageActionsProps) {
+  const [copied, setCopied] = useState(false);
+
+  const handleCopy = (text: string) => {
+    navigator.clipboard.writeText(text);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2000);
+  };
+
+  const copyMarkdown = () => handleCopy(content);
+  
+  const copyText = () => {
+    // Simple strip markdown (can be improved with a library if needed)
+    const text = content
+      .replace(/#{1,6}\s/g, '') // Headers
+      .replace(/(\*\*|__)(.*?)\1/g, '$2') // Bold
+      .replace(/(\*|_)(.*?)\1/g, '$2') // Italic
+      .replace(/`{3}[\s\S]*?`{3}/g, '$&') // Keep code blocks but maybe strip fences? For now keep raw
+      .replace(/`(.+?)`/g, '$1') // Inline code
+      .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '$1 ($2)') // Links
+      .replace(/>\s/g, ''); // Blockquotes
+    handleCopy(text);
+  };
+
+  const copyJson = () => {
+    const json = JSON.stringify({ role, content }, null, 2);
+    handleCopy(json);
+  };
+
+  return (
+    <div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
+      <Button
+        variant="ghost"
+        size="icon"
+        className="h-6 w-6"
+        onClick={copyMarkdown}
+        title="Copiar Markdown"
+      >
+        {copied ? (
+          <span className="text-green-500 text-xs font-bold">✓</span>
+        ) : (
+          <Copy className="h-3.5 w-3.5 text-muted-foreground" />
+        )}
+      </Button>
+
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <Button variant="ghost" size="icon" className="h-6 w-6">
+            <MoreHorizontal className="h-3.5 w-3.5 text-muted-foreground" />
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="end">
+          <DropdownMenuItem onClick={copyText}>
+            <FileText className="mr-2 h-4 w-4" />
+            <span>Copiar Texto Puro</span>
+          </DropdownMenuItem>
+          <DropdownMenuItem onClick={copyJson}>
+            <FileJson className="mr-2 h-4 w-4" />
+            <span>Copiar JSON</span>
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+    </div>
+  );
+}
+