Refactor prompt editing modal

src/components/prompts/EditPromptDialog.tsx

@@ -17,7 +17,6 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@/components/ui/select";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Wand2, GitBranch } from "lucide-react";
 
 interface EditPromptDialogProps {
@@ -36,58 +35,25 @@ export function EditPromptDialog({ open, onOpenChange, prompt }: EditPromptDialo
   const [systemPrompt, setSystemPrompt] = useState("");
   const [versionType, setVersionType] = useState<"major" | "minor" | "patch">("minor");
   const [changeDescription, setChangeDescription] = useState("");
-  
+  const [assistantInstructions, setAssistantInstructions] = useState("");
-  // Assistente fields
-  const [agentName, setAgentName] = useState("");
-  const [agentRole, setAgentRole] = useState("");
-  const [targetAudience, setTargetAudience] = useState("");
-  const [mainObjective, setMainObjective] = useState("");
-  const [toneOfVoice, setToneOfVoice] = useState("");
-  const [forbiddenPatterns, setForbiddenPatterns] = useState("");
-  const [refinementInstructions, setRefinementInstructions] = useState("");
-  const [isGenerated, setIsGenerated] = useState(false);
 
-  // Carregar dados do prompt quando o dialog abrir
   useEffect(() => {
     if (prompt && open) {
       setTitle(prompt.title);
       setSystemPrompt(prompt.systemPrompt || "");
       setChangeDescription("");
       setVersionType("minor");
+      setAssistantInstructions("");
     }
   }, [prompt, open]);
 
-  const handleGeneratePrompt = () => {
+  const handleApplyAssistant = () => {
-    let generatedPrompt = `Você é ${agentName}, ${agentRole}.
+    // Aqui você implementaria a lógica de IA para modificar o prompt
-
+    // Por enquanto, vamos apenas adicionar as instruções ao final do prompt
-Público-alvo: ${targetAudience}
+    const updatedPrompt = `${systemPrompt}\n\n[Aplicar mudanças: ${assistantInstructions}]`;
-
+    setSystemPrompt(updatedPrompt);
-Objetivo principal: ${mainObjective}
+    setAssistantInstructions("");
-
+    console.log("Aplicando instruções do assistente:", assistantInstructions);
-Tom de voz: ${toneOfVoice}
-
-${forbiddenPatterns ? `Padrões proibidos:\n${forbiddenPatterns}` : ''}
-
-Siga estas diretrizes em todas as suas interações.`;
-
-    if (refinementInstructions && isGenerated) {
-      generatedPrompt += `\n\nInstruções adicionais:\n${refinementInstructions}`;
-    }
-
-    setSystemPrompt(generatedPrompt);
-    setIsGenerated(true);
-  };
-
-  const handleStartOver = () => {
-    setAgentName("");
-    setAgentRole("");
-    setTargetAudience("");
-    setMainObjective("");
-    setToneOfVoice("");
-    setForbiddenPatterns("");
-    setRefinementInstructions("");
-    setSystemPrompt("");
-    setIsGenerated(false);
   };
 
   const handleSave = () => {
@@ -121,7 +87,7 @@ Siga estas diretrizes em todas as suas interações.`;
         <DialogHeader>
           <DialogTitle>Editar Prompt</DialogTitle>
           <DialogDescription>
-            Edite o prompt manualmente ou use o assistente. Uma nova versão será criada preservando o histórico.
+            Edite o prompt e descreva as mudanças. Uma nova versão será criada preservando o histórico.
           </DialogDescription>
         </DialogHeader>
 
@@ -143,157 +109,45 @@ Siga estas diretrizes em todas as suas interações.`;
             />
           </div>
 
-          <Tabs defaultValue="manual" className="w-full">
+          <div className="space-y-2">
-            <TabsList className="grid w-full grid-cols-2">
+            <Label htmlFor="systemPrompt">System Prompt</Label>
-              <TabsTrigger value="manual">Manual</TabsTrigger>
+            <Textarea
-              <TabsTrigger value="assistant">
+              id="systemPrompt"
-                <Wand2 className="w-4 h-4 mr-2" />
+              placeholder="Digite o system prompt..."
-                Assistente
+              value={systemPrompt}
-              </TabsTrigger>
+              onChange={(e) => setSystemPrompt(e.target.value)}
-            </TabsList>
+              className="min-h-[300px] font-mono text-sm"
+            />
+          </div>
 
-            <TabsContent value="manual" className="space-y-4 mt-4">
+          <div className="space-y-3 p-4 border rounded-lg bg-muted/30">
-              <div className="space-y-2">
+            <div className="flex items-center gap-2">
-                <Label htmlFor="systemPrompt">System Prompt</Label>
+              <Wand2 className="h-4 w-4 text-primary" />
-                <Textarea
+              <Label htmlFor="assistantInstructions" className="text-base font-medium">
-                  id="systemPrompt"
+                Assistente de Prompt
-                  placeholder="Digite o system prompt..."
+              </Label>
-                  value={systemPrompt}
+            </div>
-                  onChange={(e) => setSystemPrompt(e.target.value)}
+            <p className="text-sm text-muted-foreground">
-                  className="min-h-[400px] font-mono text-sm"
+              Descreva o que deseja incluir ou modificar no prompt acima
-                />
+            </p>
-              </div>
+            <Textarea
-            </TabsContent>
+              id="assistantInstructions"
-
+              placeholder="Ex: Adicione mais empatia nas respostas, seja mais técnico ao explicar produtos, inclua exemplos práticos..."
-            <TabsContent value="assistant" className="space-y-4 mt-4">
+              value={assistantInstructions}
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+              onChange={(e) => setAssistantInstructions(e.target.value)}
-                <div className="space-y-2">
+              className="min-h-[100px]"
-                  <Label htmlFor="agentName">Nome do Agente</Label>
+            />
-                  <Input
+            <Button
-                    id="agentName"
+              onClick={handleApplyAssistant}
-                    placeholder="Ex: Clara"
+              size="sm"
-                    value={agentName}
+              variant="secondary"
-                    onChange={(e) => setAgentName(e.target.value)}
+              disabled={!assistantInstructions}
-                  />
+              className="w-full"
-                </div>
+            >
-
+              <Wand2 className="w-4 h-4 mr-2" />
-                <div className="space-y-2">
+              Aplicar Mudanças com Assistente
-                  <Label htmlFor="agentRole">Função / Papel do Agente</Label>
+            </Button>
-                  <Input
+          </div>
-                    id="agentRole"
-                    placeholder="Ex: assistente de atendimento ao cliente"
-                    value={agentRole}
-                    onChange={(e) => setAgentRole(e.target.value)}
-                  />
-                </div>
-              </div>
-
-              <div className="space-y-2">
-                <Label htmlFor="targetAudience">Público-alvo</Label>
-                <Input
-                  id="targetAudience"
-                  placeholder="Ex: Clientes da loja online de eletrônicos"
-                  value={targetAudience}
-                  onChange={(e) => setTargetAudience(e.target.value)}
-                />
-              </div>
-
-              <div className="space-y-2">
-                <Label htmlFor="mainObjective">Objetivo Principal</Label>
-                <Textarea
-                  id="mainObjective"
-                  placeholder="Ex: Ajudar clientes com dúvidas sobre produtos e pedidos"
-                  value={mainObjective}
-                  onChange={(e) => setMainObjective(e.target.value)}
-                  className="min-h-[80px]"
-                />
-              </div>
-
-              <div className="space-y-2">
-                <Label htmlFor="toneOfVoice">Tom de Voz</Label>
-                <Select value={toneOfVoice} onValueChange={setToneOfVoice}>
-                  <SelectTrigger id="toneOfVoice">
-                    <SelectValue placeholder="Selecione o tom de voz" />
-                  </SelectTrigger>
-                  <SelectContent>
-                    <SelectItem value="amigavel">Amigável</SelectItem>
-                    <SelectItem value="formal">Formal</SelectItem>
-                    <SelectItem value="tecnico">Técnico</SelectItem>
-                    <SelectItem value="educado">Educado</SelectItem>
-                    <SelectItem value="institucional">Institucional</SelectItem>
-                    <SelectItem value="neutro">Neutro</SelectItem>
-                    <SelectItem value="engracado">Engraçado</SelectItem>
-                  </SelectContent>
-                </Select>
-              </div>
-
-              <div className="space-y-2">
-                <Label htmlFor="forbiddenPatterns">Padrões Proibidos</Label>
-                <Textarea
-                  id="forbiddenPatterns"
-                  placeholder="Ex: Não usar gírias, não dar opiniões pessoais, evitar emojis"
-                  value={forbiddenPatterns}
-                  onChange={(e) => setForbiddenPatterns(e.target.value)}
-                  className="min-h-[100px]"
-                />
-              </div>
-
-              <div className="flex gap-2">
-                <Button
-                  onClick={handleGeneratePrompt}
-                  className="flex-1"
-                  variant="secondary"
-                  disabled={!agentName || !agentRole}
-                >
-                  <Wand2 className="w-4 h-4 mr-2" />
-                  {isGenerated ? "Regenerar Prompt" : "Gerar System Prompt"}
-                </Button>
-                {isGenerated && (
-                  <Button
-                    onClick={handleStartOver}
-                    variant="outline"
-                  >
-                    Começar do Zero
-                  </Button>
-                )}
-              </div>
-
-              {systemPrompt && (
-                <div className="space-y-4 p-4 border rounded-lg bg-muted/50">
-                  <div className="space-y-2">
-                    <Label>Prompt Gerado</Label>
-                    <Textarea
-                      value={systemPrompt}
-                      onChange={(e) => setSystemPrompt(e.target.value)}
-                      className="min-h-[400px] font-mono text-sm"
-                    />
-                  </div>
-
-                  <div className="space-y-2">
-                    <Label htmlFor="refinement">
-                      Instruções Adicionais (opcional)
-                    </Label>
-                    <Textarea
-                      id="refinement"
-                      placeholder="Ex: Adicione mais empatia nas respostas, seja mais direto, inclua exemplos práticos..."
-                      value={refinementInstructions}
-                      onChange={(e) => setRefinementInstructions(e.target.value)}
-                      className="min-h-[100px]"
-                    />
-                    <Button
-                      onClick={handleGeneratePrompt}
-                      size="sm"
-                      variant="secondary"
-                      disabled={!refinementInstructions}
-                    >
-                      <Wand2 className="w-4 h-4 mr-2" />
-                      Aplicar Refinamento
-                    </Button>
-                  </div>
-                </div>
-              )}
-            </TabsContent>
-          </Tabs>
 
           <div className="space-y-4 p-4 border rounded-lg bg-muted/30">
             <div className="space-y-2">