@greatapps/greatagents-ui 0.3.13 → 0.3.15

package/dist/index.js

@@ -1975,29 +1975,55 @@ function computeDiff(oldText, newText) {
 function buildPreview(promptText, objectives, agentTools, allTools) {
   let preview = promptText;
   const activeObjectives = objectives.filter((o) => o.active);
-  if (activeObjectives.length > 0) {
-    preview += "\n\n[SKILLS DISPON\xCDVEIS]\n";
-    for (const obj of activeObjectives) {
-      preview += `- ${obj.title}`;
-      if (obj.prompt) preview += `: ${obj.prompt}`;
-      preview += "\n";
+  const enabledAgentTools = agentTools.filter((at) => at.enabled);
+  const toolMap = new Map(allTools.map((t) => [t.id, t]));
+  const capabilityTools = [];
+  const integrationTools = [];
+  for (const at of enabledAgentTools) {
+    const tool = toolMap.get(at.id_tool);
+    if (!tool) continue;
+    if (tool.type === "integration") {
+      integrationTools.push({ at, tool });
+    } else {
+      capabilityTools.push({ at, tool });
     }
   }
-  const enabledAgentTools = agentTools.filter((at) => at.enabled);
-  if (enabledAgentTools.length > 0) {
-    const toolMap = new Map(allTools.map((t) => [t.id, t]));
-    preview += "\n[TOOLS DISPON\xCDVEIS]\n";
-    for (const at of enabledAgentTools) {
-      const tool = toolMap.get(at.id_tool);
-      const name = tool?.name || `Tool #${at.id_tool}`;
-      const desc = tool?.description ? `: ${tool.description}` : "";
-      preview += `- ${name}${desc}`;
-      if (at.custom_instructions) {
+  const hasContent = activeObjectives.length > 0 || capabilityTools.length > 0 || integrationTools.length > 0;
+  if (hasContent) {
+    preview += "\n\n[CAPACIDADES E INTEGRA\xC7\xD5ES]";
+    if (activeObjectives.length > 0 || capabilityTools.length > 0) {
+      preview += "\n\n## Capacidades Internas (GClinic)";
+      for (const obj of activeObjectives) {
+        preview += `
+
+### ${obj.title} (${obj.slug})`;
+        if (obj.prompt) preview += `
+${obj.prompt}`;
+      }
+      for (const { at, tool } of capabilityTools) {
         preview += `
-  Instru\xE7\xF5es: ${at.custom_instructions}`;
+
+### ${tool.name} (${tool.slug})`;
+        if (tool.description) preview += `
+${tool.description}`;
+        if (at.custom_instructions) preview += `
+${at.custom_instructions}`;
       }
-      preview += "\n";
     }
+    if (integrationTools.length > 0) {
+      preview += "\n\n## Integra\xE7\xF5es Externas";
+      for (const { at, tool } of integrationTools) {
+        preview += `
+
+### ${tool.name} (${tool.slug})`;
+        if (at.custom_instructions) preview += `
+${at.custom_instructions}`;
+      }
+    }
+    preview += "\n\n## Regras";
+    preview += "\n- Sempre confirme com o usu\xE1rio antes de criar ou alterar registros.";
+    preview += "\n- Nunca invente dados \u2014 sempre consulte primeiro.";
+    preview += "\n- Use EXATAMENTE os nomes de fun\xE7\xE3o listados acima.";
   }
   return preview;
 }
@@ -2160,11 +2186,14 @@ function AgentPromptEditor({ config, agent }) {
           }
         ),
         showPreview && /* @__PURE__ */ jsx6("div", { className: "border-t px-4 py-3", children: /* @__PURE__ */ jsx6("pre", { className: "max-h-96 overflow-auto whitespace-pre-wrap font-mono text-sm leading-relaxed", children: previewText.split("\n").map((line, i) => {
-          const isSection = line.startsWith("[SKILLS DISPON\xCDVEIS]") || line.startsWith("[TOOLS DISPON\xCDVEIS]");
+          const isTopSection = line.startsWith("[CAPACIDADES E INTEGRA\xC7\xD5ES]");
+          const isH2 = line.startsWith("## ");
+          const isH3 = line.startsWith("### ");
+          const cls = isTopSection ? "font-bold text-foreground" : isH2 ? "font-semibold text-muted-foreground" : isH3 ? "font-medium text-muted-foreground" : "";
           return /* @__PURE__ */ jsxs5(
             "span",
             {
-              className: isSection ? "font-semibold text-muted-foreground" : "",
+              className: cls,
               children: [
                 line,
                 "\n"
@@ -2511,7 +2540,7 @@ import {
   Skeleton as Skeleton5
 } from "@greatapps/greatauth-ui/ui";
 import {
-  Calendar,
+  CalendarCheck,
   Users,
   Settings,
   HeartHandshake,
@@ -2531,7 +2560,7 @@ function getOperationLabel(slug) {
   return OPERATION_LABELS[slug] ?? slug;
 }
 var CATEGORY_ICONS = {
-  agenda: Calendar,
+  agenda: CalendarCheck,
   cadastros: Users,
   infraestrutura: Settings,
   relacionamentos: HeartHandshake
@@ -2829,37 +2858,81 @@ var ICON_MAP = {
 function resolveIcon(name) {
   return ICON_MAP[name] ?? Plug;
 }
+var INTEGRATION_INSTRUCTIONS = {
+  "google-calendar": `Voc\xEA tem acesso ao Google Calendar atrav\xE9s da integra\xE7\xE3o google-calendar.
+Fun\xE7\xF5es dispon\xEDveis:
+- google_calendar_setup_oauth: Configurar conex\xE3o OAuth
+- google_calendar_check_status: Verificar status da conex\xE3o
+- google_calendar_list_events: Listar eventos do calend\xE1rio
+- google_calendar_create_event: Criar novo evento
+- google_calendar_update_event: Atualizar evento existente
+- google_calendar_delete_event: Cancelar/remover evento
+
+Use EXATAMENTE os nomes de fun\xE7\xE3o listados acima.`
+};
 function IntegrationsTab({
   config,
   agentId
 }) {
-  const { cards, isLoading } = useIntegrationState(config, null);
-  const { data: toolsData } = useTools(config);
+  const { cards, isLoading } = useIntegrationState(config, agentId);
   const { data: agentToolsData, isLoading: agentToolsLoading } = useAgentTools(config, agentId);
+  const { data: toolsData } = useTools(config);
   const addAgentTool = useAddAgentTool(config);
   const removeAgentTool = useRemoveAgentTool(config);
-  const tools = toolsData?.data ?? [];
+  const createTool = useCreateTool(config);
   const agentTools = agentToolsData?.data ?? [];
+  const allTools = toolsData?.data ?? [];
   const connectedCards = cards.filter(
     (c) => !c.isAddNew && (c.state === "connected" || c.state === "expired")
   );
   const handleToggle = useCallback5(
-    (credentialId, toolSlug, checked) => {
-      const tool = tools.find((t) => t.slug === toolSlug);
-      if (!tool) return;
+    async (card, checked) => {
       if (checked) {
+        let toolId = card.tool?.id;
+        if (!toolId) {
+          const existingTool = allTools.find((t) => t.slug === card.definition.slug);
+          if (existingTool) {
+            toolId = existingTool.id;
+          } else {
+            try {
+              const result = await createTool.mutateAsync({
+                name: card.definition.name,
+                slug: card.definition.slug,
+                type: "integration",
+                description: card.definition.description
+              });
+              const d = result?.data;
+              toolId = (Array.isArray(d) ? d[0]?.id : d?.id) ?? void 0;
+              if (!toolId) {
+                console.error("[IntegrationsTab] Failed to create tool \u2014 no ID returned");
+                return;
+              }
+            } catch (err) {
+              console.error("[IntegrationsTab] Error creating tool:", err);
+              return;
+            }
+          }
+        }
+        const customInstructions = INTEGRATION_INSTRUCTIONS[card.definition.slug];
         addAgentTool.mutate({
           idAgent: agentId,
-          body: { id_tool: tool.id, enabled: true }
+          body: {
+            id_tool: toolId,
+            enabled: true,
+            ...customInstructions ? { custom_instructions: customInstructions } : {}
+          }
         });
       } else {
-        const agentTool = agentTools.find((at) => at.id_tool === tool.id);
-        if (agentTool) {
-          removeAgentTool.mutate({ idAgent: agentId, id: agentTool.id });
+        const toolId = card.tool?.id;
+        if (toolId) {
+          const agentTool = agentTools.find((at) => at.id_tool === toolId);
+          if (agentTool) {
+            removeAgentTool.mutate({ idAgent: agentId, id: agentTool.id });
+          }
         }
       }
     },
-    [tools, agentTools, agentId, addAgentTool, removeAgentTool]
+    [agentTools, allTools, agentId, addAgentTool, removeAgentTool, createTool]
   );
   if (isLoading || agentToolsLoading) {
     return /* @__PURE__ */ jsx11("div", { className: "flex items-center justify-center py-16", children: /* @__PURE__ */ jsx11(Loader25, { className: "h-6 w-6 animate-spin text-muted-foreground" }) });
@@ -2875,9 +2948,8 @@ function IntegrationsTab({
     /* @__PURE__ */ jsx11("p", { className: "text-xs text-muted-foreground", children: "Ative ou desative as integra\xE7\xF5es conectadas na conta para este agente." }),
     /* @__PURE__ */ jsx11("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3", children: connectedCards.map((card) => {
       const Icon = resolveIcon(card.definition.icon);
-      const tool = tools.find((t) => t.slug === card.definition.slug);
-      const isLinked = tool ? agentTools.some((at) => at.id_tool === tool.id) : false;
-      const isMutating = addAgentTool.isPending || removeAgentTool.isPending;
+      const isLinked = card.linkedToAgent;
+      const isMutating = addAgentTool.isPending || removeAgentTool.isPending || createTool.isPending;
       return /* @__PURE__ */ jsxs9(
         "div",
         {
@@ -2900,7 +2972,7 @@ function IntegrationsTab({
               {
                 checked: isLinked,
                 disabled: isMutating,
-                onCheckedChange: (checked) => card.credentialId && handleToggle(card.credentialId, card.definition.slug, checked),
+                onCheckedChange: (checked) => handleToggle(card, checked),
                 "aria-label": `${isLinked ? "Desativar" : "Ativar"} ${card.definition.name} para este agente`
               }
             )
@@ -3767,11 +3839,6 @@ import {
   Tooltip as Tooltip4,
   TooltipTrigger as TooltipTrigger4,
   TooltipContent as TooltipContent4,
-  Dialog as Dialog6,
-  DialogContent as DialogContent6,
-  DialogHeader as DialogHeader6,
-  DialogTitle as DialogTitle6,
-  DialogFooter as DialogFooter6,
   AlertDialog as AlertDialog5,
   AlertDialogAction as AlertDialogAction5,
   AlertDialogCancel as AlertDialogCancel5,
@@ -3779,14 +3846,9 @@ import {
   AlertDialogDescription as AlertDialogDescription5,
   AlertDialogFooter as AlertDialogFooter5,
   AlertDialogHeader as AlertDialogHeader5,
-  AlertDialogTitle as AlertDialogTitle5,
-  Select as Select3,
-  SelectContent as SelectContent3,
-  SelectItem as SelectItem3,
-  SelectTrigger as SelectTrigger3,
-  SelectValue as SelectValue3
+  AlertDialogTitle as AlertDialogTitle5
 } from "@greatapps/greatauth-ui/ui";
-import { Trash2 as Trash25, Pencil as Pencil4, Link, Search as Search3 } from "lucide-react";
+import { Trash2 as Trash25, Search as Search3 } from "lucide-react";
 import { format as format3 } from "date-fns";
 import { ptBR as ptBR3 } from "date-fns/locale";
 import { toast as toast10 } from "sonner";
@@ -3795,17 +3857,12 @@ function formatDate2(dateStr) {
   if (!dateStr) return "Sem expira\xE7\xE3o";
   return format3(new Date(dateStr), "dd/MM/yyyy", { locale: ptBR3 });
 }
-function useColumns3(tools, onEdit, onConnect, onRemove) {
+function useColumns3(tools, onRemove) {
   function getToolName(idTool) {
     if (!idTool) return "\u2014";
     const tool = tools.find((t) => t.id === idTool);
     return tool?.name || `Ferramenta #${idTool}`;
   }
-  function getToolType(idTool) {
-    if (!idTool) return null;
-    const tool = tools.find((t) => t.id === idTool);
-    return tool?.type || null;
-  }
   return [
     {
       accessorKey: "label",
@@ -3843,50 +3900,20 @@ function useColumns3(tools, onEdit, onConnect, onRemove) {
       header: "A\xE7\xF5es",
       size: 100,
       enableSorting: false,
-      cell: ({ row }) => /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-1", children: [
-        getToolType(row.original.id_tool) === "oauth2" && /* @__PURE__ */ jsxs14(Tooltip4, { children: [
-          /* @__PURE__ */ jsx16(TooltipTrigger4, { asChild: true, children: /* @__PURE__ */ jsx16(
-            Button11,
-            {
-              variant: "ghost",
-              size: "icon",
-              className: "h-8 w-8",
-              "aria-label": "Vincular",
-              disabled: true,
-              children: /* @__PURE__ */ jsx16(Link, { className: "h-4 w-4" })
-            }
-          ) }),
-          /* @__PURE__ */ jsx16(TooltipContent4, { children: "Em breve" })
-        ] }),
-        /* @__PURE__ */ jsxs14(Tooltip4, { children: [
-          /* @__PURE__ */ jsx16(TooltipTrigger4, { asChild: true, children: /* @__PURE__ */ jsx16(
-            Button11,
-            {
-              variant: "ghost",
-              size: "icon",
-              className: "h-8 w-8",
-              "aria-label": "Editar",
-              onClick: () => onEdit(row.original),
-              children: /* @__PURE__ */ jsx16(Pencil4, { className: "h-4 w-4" })
-            }
-          ) }),
-          /* @__PURE__ */ jsx16(TooltipContent4, { children: "Editar" })
-        ] }),
-        /* @__PURE__ */ jsxs14(Tooltip4, { children: [
-          /* @__PURE__ */ jsx16(TooltipTrigger4, { asChild: true, children: /* @__PURE__ */ jsx16(
-            Button11,
-            {
-              variant: "ghost",
-              size: "icon",
-              className: "h-8 w-8 text-destructive hover:text-destructive",
-              "aria-label": "Excluir",
-              onClick: () => onRemove(row.original),
-              children: /* @__PURE__ */ jsx16(Trash25, { className: "h-4 w-4" })
-            }
-          ) }),
-          /* @__PURE__ */ jsx16(TooltipContent4, { children: "Remover" })
-        ] })
-      ] })
+      cell: ({ row }) => /* @__PURE__ */ jsx16("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsxs14(Tooltip4, { children: [
+        /* @__PURE__ */ jsx16(TooltipTrigger4, { asChild: true, children: /* @__PURE__ */ jsx16(
+          Button11,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "h-8 w-8 text-destructive hover:text-destructive",
+            "aria-label": "Excluir",
+            onClick: () => onRemove(row.original),
+            children: /* @__PURE__ */ jsx16(Trash25, { className: "h-4 w-4" })
+          }
+        ) }),
+        /* @__PURE__ */ jsx16(TooltipContent4, { children: "Remover" })
+      ] }) })
     }
   ];
 }
@@ -3894,33 +3921,12 @@ function ToolCredentialsForm({
   credentials,
   isLoading,
   config,
-  gagentsApiUrl,
-  createOpen: externalCreateOpen,
-  onCreateOpenChange
+  gagentsApiUrl
 }) {
-  const createMutation = useCreateToolCredential(config);
-  const updateMutation = useUpdateToolCredential(config);
   const deleteMutation = useDeleteToolCredential(config);
   const { data: toolsData } = useTools(config);
   const tools = (toolsData?.data || []).filter((t) => !t.slug?.startsWith("gclinic_"));
   const [search, setSearch] = useState12("");
-  const [internalCreateOpen, setInternalCreateOpen] = useState12(false);
-  const showCreateDialog = externalCreateOpen ?? internalCreateOpen;
-  const setShowCreateDialog = onCreateOpenChange ?? setInternalCreateOpen;
-  const [createForm, setCreateForm] = useState12({
-    id_tool: "",
-    label: "",
-    credentials_encrypted: "",
-    expires_at: ""
-  });
-  const [editTarget, setEditTarget] = useState12(null);
-  const [editForm, setEditForm] = useState12({
-    id_tool: "",
-    label: "",
-    credentials_encrypted: "",
-    expires_at: "",
-    status: ""
-  });
   const [removeTarget, setRemoveTarget] = useState12(null);
   const internalToolIds = useMemo7(() => {
     const allRawTools = toolsData?.data || [];
@@ -3941,79 +3947,8 @@ function ToolCredentialsForm({
   }, [credentials, search, tools, internalToolIds]);
   const columns = useColumns3(
     tools,
-    (cred) => startEdit(cred),
-    (cred) => handleConnect(cred),
     (cred) => setRemoveTarget(cred)
   );
-  async function handleCreate() {
-    const idTool = parseInt(createForm.id_tool, 10);
-    if (!idTool || !createForm.label.trim() || !createForm.credentials_encrypted.trim()) return;
-    try {
-      const result = await createMutation.mutateAsync({
-        id_tool: idTool,
-        label: createForm.label.trim(),
-        credentials_encrypted: createForm.credentials_encrypted.trim(),
-        ...createForm.expires_at ? { expires_at: createForm.expires_at } : {}
-      });
-      if (result.status === 1) {
-        toast10.success("Credencial criada");
-        setShowCreateDialog(false);
-        setCreateForm({ id_tool: "", label: "", credentials_encrypted: "", expires_at: "" });
-      } else {
-        toast10.error(result.message || "Erro ao criar credencial");
-      }
-    } catch {
-      toast10.error("Erro ao criar credencial");
-    }
-  }
-  function startEdit(cred) {
-    setEditTarget(cred);
-    setEditForm({
-      id_tool: cred.id_tool ? String(cred.id_tool) : "",
-      label: cred.label || "",
-      credentials_encrypted: "",
-      expires_at: cred.expires_at || "",
-      status: cred.status
-    });
-  }
-  async function handleSaveEdit() {
-    if (!editTarget) return;
-    const body = {};
-    const newIdTool = editForm.id_tool ? parseInt(editForm.id_tool, 10) : null;
-    if (newIdTool && newIdTool !== editTarget.id_tool) {
-      body.id_tool = newIdTool;
-    }
-    if (editForm.label.trim() && editForm.label.trim() !== (editTarget.label || "")) {
-      body.label = editForm.label.trim();
-    }
-    if (editForm.credentials_encrypted.trim()) {
-      body.credentials_encrypted = editForm.credentials_encrypted.trim();
-    }
-    if (editForm.expires_at !== (editTarget.expires_at || "")) {
-      body.expires_at = editForm.expires_at || null;
-    }
-    if (editForm.status && editForm.status !== editTarget.status) {
-      body.status = editForm.status;
-    }
-    if (Object.keys(body).length === 0) {
-      setEditTarget(null);
-      return;
-    }
-    try {
-      const result = await updateMutation.mutateAsync({
-        id: editTarget.id,
-        body
-      });
-      if (result.status === 1) {
-        toast10.success("Credencial atualizada");
-        setEditTarget(null);
-      } else {
-        toast10.error(result.message || "Erro ao atualizar credencial");
-      }
-    } catch {
-      toast10.error("Erro ao atualizar credencial");
-    }
-  }
   async function handleRemove() {
     if (!removeTarget) return;
     try {
@@ -4029,13 +3964,6 @@ function ToolCredentialsForm({
       setRemoveTarget(null);
     }
   }
-  function handleConnect(cred) {
-    if (!config.accountId || !config.token) return;
-    const language = config.language ?? "pt-br";
-    const idWl = config.idWl ?? 1;
-    const url = `${gagentsApiUrl}/v1/${language}/${idWl}/accounts/${config.accountId}/oauth/connect?id_tool=${cred.id_tool}`;
-    window.open(url, "_blank");
-  }
   return /* @__PURE__ */ jsxs14("div", { className: "space-y-4", children: [
     /* @__PURE__ */ jsx16("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsxs14("div", { className: "relative flex-1 max-w-md", children: [
       /* @__PURE__ */ jsx16(Search3, { "aria-hidden": "true", className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
@@ -4061,188 +3989,6 @@ function ToolCredentialsForm({
         emptyMessage: "Nenhuma credencial encontrada"
       }
     ),
-    /* @__PURE__ */ jsx16(Dialog6, { open: showCreateDialog, onOpenChange: setShowCreateDialog, children: /* @__PURE__ */ jsxs14(DialogContent6, { children: [
-      /* @__PURE__ */ jsx16(DialogHeader6, { children: /* @__PURE__ */ jsx16(DialogTitle6, { children: "Nova Credencial" }) }),
-      /* @__PURE__ */ jsxs14("div", { className: "space-y-4", children: [
-        /* @__PURE__ */ jsxs14("div", { children: [
-          /* @__PURE__ */ jsx16("label", { htmlFor: "cred-tool", className: "mb-1 block text-sm font-medium", children: "Ferramenta *" }),
-          /* @__PURE__ */ jsxs14(
-            Select3,
-            {
-              value: createForm.id_tool,
-              onValueChange: (val) => setCreateForm((f) => ({ ...f, id_tool: val })),
-              children: [
-                /* @__PURE__ */ jsx16(SelectTrigger3, { id: "cred-tool", children: /* @__PURE__ */ jsx16(SelectValue3, { placeholder: "Selecione a ferramenta" }) }),
-                /* @__PURE__ */ jsx16(SelectContent3, { children: tools.map((tool) => /* @__PURE__ */ jsx16(SelectItem3, { value: String(tool.id), children: tool.name }, tool.id)) })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs14("div", { children: [
-          /* @__PURE__ */ jsx16("label", { htmlFor: "cred-label", className: "mb-1 block text-sm font-medium", children: "Label *" }),
-          /* @__PURE__ */ jsx16(
-            Input9,
-            {
-              id: "cred-label",
-              name: "label",
-              value: createForm.label,
-              onChange: (e) => setCreateForm((f) => ({ ...f, label: e.target.value })),
-              placeholder: "Ex: Google Calendar - Cl\xEDnica S\xE3o Paulo"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs14("div", { children: [
-          /* @__PURE__ */ jsx16("label", { htmlFor: "cred-credential", className: "mb-1 block text-sm font-medium", children: "Credencial *" }),
-          /* @__PURE__ */ jsx16(
-            Input9,
-            {
-              id: "cred-credential",
-              name: "credential",
-              autoComplete: "off",
-              type: "password",
-              value: createForm.credentials_encrypted,
-              onChange: (e) => setCreateForm((f) => ({
-                ...f,
-                credentials_encrypted: e.target.value
-              })),
-              placeholder: "Credencial encriptada"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs14("div", { children: [
-          /* @__PURE__ */ jsx16("label", { htmlFor: "cred-expires", className: "mb-1 block text-sm font-medium", children: "Data de Expira\xE7\xE3o (opcional)" }),
-          /* @__PURE__ */ jsx16(
-            Input9,
-            {
-              id: "cred-expires",
-              name: "expires",
-              type: "date",
-              value: createForm.expires_at,
-              onChange: (e) => setCreateForm((f) => ({ ...f, expires_at: e.target.value }))
-            }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs14(DialogFooter6, { children: [
-        /* @__PURE__ */ jsx16(
-          Button11,
-          {
-            variant: "outline",
-            onClick: () => setShowCreateDialog(false),
-            children: "Cancelar"
-          }
-        ),
-        /* @__PURE__ */ jsx16(
-          Button11,
-          {
-            onClick: handleCreate,
-            disabled: !createForm.id_tool || !createForm.label.trim() || !createForm.credentials_encrypted.trim() || createMutation.isPending,
-            children: "Criar"
-          }
-        )
-      ] })
-    ] }) }),
-    /* @__PURE__ */ jsx16(
-      Dialog6,
-      {
-        open: !!editTarget,
-        onOpenChange: (open) => !open && setEditTarget(null),
-        children: /* @__PURE__ */ jsxs14(DialogContent6, { children: [
-          /* @__PURE__ */ jsx16(DialogHeader6, { children: /* @__PURE__ */ jsx16(DialogTitle6, { children: "Editar Credencial" }) }),
-          /* @__PURE__ */ jsxs14("div", { className: "space-y-4", children: [
-            /* @__PURE__ */ jsxs14("div", { children: [
-              /* @__PURE__ */ jsx16("label", { htmlFor: "edit-cred-tool", className: "mb-1 block text-sm font-medium", children: "Ferramenta *" }),
-              /* @__PURE__ */ jsxs14(
-                Select3,
-                {
-                  value: editForm.id_tool,
-                  onValueChange: (val) => setEditForm((f) => ({ ...f, id_tool: val })),
-                  children: [
-                    /* @__PURE__ */ jsx16(SelectTrigger3, { id: "edit-cred-tool", children: /* @__PURE__ */ jsx16(SelectValue3, { placeholder: "Selecione a ferramenta" }) }),
-                    /* @__PURE__ */ jsx16(SelectContent3, { children: tools.map((tool) => /* @__PURE__ */ jsx16(SelectItem3, { value: String(tool.id), children: tool.name }, tool.id)) })
-                  ]
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs14("div", { children: [
-              /* @__PURE__ */ jsx16("label", { htmlFor: "edit-cred-label", className: "mb-1 block text-sm font-medium", children: "Label" }),
-              /* @__PURE__ */ jsx16(
-                Input9,
-                {
-                  id: "edit-cred-label",
-                  name: "label",
-                  value: editForm.label,
-                  onChange: (e) => setEditForm((f) => ({ ...f, label: e.target.value })),
-                  placeholder: "Label da credencial"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs14("div", { children: [
-              /* @__PURE__ */ jsx16("label", { htmlFor: "edit-cred-credential", className: "mb-1 block text-sm font-medium", children: "Nova Credencial (vazio = manter atual)" }),
-              /* @__PURE__ */ jsx16(
-                Input9,
-                {
-                  id: "edit-cred-credential",
-                  name: "credential",
-                  autoComplete: "off",
-                  type: "password",
-                  value: editForm.credentials_encrypted,
-                  onChange: (e) => setEditForm((f) => ({
-                    ...f,
-                    credentials_encrypted: e.target.value
-                  })),
-                  placeholder: "Nova credencial"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs14("div", { children: [
-              /* @__PURE__ */ jsx16("label", { htmlFor: "edit-cred-expires", className: "mb-1 block text-sm font-medium", children: "Data de Expira\xE7\xE3o" }),
-              /* @__PURE__ */ jsx16(
-                Input9,
-                {
-                  id: "edit-cred-expires",
-                  name: "expires",
-                  type: "date",
-                  value: editForm.expires_at,
-                  onChange: (e) => setEditForm((f) => ({ ...f, expires_at: e.target.value }))
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs14("div", { children: [
-              /* @__PURE__ */ jsx16("label", { htmlFor: "edit-cred-status", className: "mb-1 block text-sm font-medium", children: "Status" }),
-              /* @__PURE__ */ jsxs14(
-                Select3,
-                {
-                  value: editForm.status || void 0,
-                  onValueChange: (val) => setEditForm((f) => ({
-                    ...f,
-                    status: val
-                  })),
-                  children: [
-                    /* @__PURE__ */ jsx16(SelectTrigger3, { id: "edit-cred-status", children: /* @__PURE__ */ jsx16(SelectValue3, {}) }),
-                    /* @__PURE__ */ jsxs14(SelectContent3, { children: [
-                      /* @__PURE__ */ jsx16(SelectItem3, { value: "active", children: "Ativo" }),
-                      /* @__PURE__ */ jsx16(SelectItem3, { value: "expired", children: "Expirado" })
-                    ] })
-                  ]
-                }
-              )
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs14(DialogFooter6, { children: [
-            /* @__PURE__ */ jsx16(Button11, { variant: "outline", onClick: () => setEditTarget(null), children: "Cancelar" }),
-            /* @__PURE__ */ jsx16(
-              Button11,
-              {
-                onClick: handleSaveEdit,
-                disabled: updateMutation.isPending,
-                children: "Salvar"
-              }
-            )
-          ] })
-        ] })
-      }
-    ),
     /* @__PURE__ */ jsx16(
       AlertDialog5,
       {
@@ -4271,23 +4017,39 @@ function ToolCredentialsForm({
 }
 
 // src/components/capabilities/integration-card.tsx
-import { Badge as Badge9, Button as Button12, Tooltip as Tooltip5, TooltipContent as TooltipContent5, TooltipTrigger as TooltipTrigger5 } from "@greatapps/greatauth-ui/ui";
+import { useState as useState13 } from "react";
+import {
+  Badge as Badge9,
+  Button as Button12,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+  AlertDialog as AlertDialog6,
+  AlertDialogAction as AlertDialogAction6,
+  AlertDialogCancel as AlertDialogCancel6,
+  AlertDialogContent as AlertDialogContent6,
+  AlertDialogDescription as AlertDialogDescription6,
+  AlertDialogFooter as AlertDialogFooter6,
+  AlertDialogHeader as AlertDialogHeader6,
+  AlertDialogTitle as AlertDialogTitle6
+} from "@greatapps/greatauth-ui/ui";
 import {
   CalendarSync as CalendarSync2,
   Plug as Plug3,
   Settings as Settings3,
   RefreshCw,
-  Users as Users2,
   Clock,
-  Plus as Plus3
+  Plus as Plus3,
+  Unplug,
+  Trash2 as Trash26
 } from "lucide-react";
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
 var ICON_MAP2 = {
   CalendarSync: CalendarSync2,
   Plug: Plug3,
   Settings: Settings3,
   RefreshCw,
-  Users: Users2,
   Clock,
   Plus: Plus3
 };
@@ -4312,35 +4074,29 @@ var STATE_BADGES = {
     className: "bg-muted text-muted-foreground"
   }
 };
-function getActionLabel(card) {
-  if (card.isAddNew) return "Conectar";
-  switch (card.state) {
-    case "available":
-      return "Conectar";
-    case "connected":
-      return "Configurar";
-    case "expired":
-      return "Reconectar";
-    default:
-      return "";
-  }
-}
-function IntegrationCard({ card, onConnect }) {
-  const { definition, state, sharedByAgentsCount, isAddNew, accountLabel } = card;
+function IntegrationCard({
+  card,
+  onConnect,
+  onReconnect,
+  onDisconnect,
+  onDelete
+}) {
+  const { definition, state, isAddNew, accountLabel } = card;
   const Icon = resolveIcon2(definition.icon);
   const isComingSoon = state === "coming_soon";
-  const actionLabel = getActionLabel(card);
+  const isConnected = state === "connected" || state === "expired";
+  const [deleteDialogOpen, setDeleteDialogOpen] = useState13(false);
   if (isAddNew) {
     return /* @__PURE__ */ jsxs15(
       "div",
       {
         className: cn(
-          "group relative flex flex-col gap-3 rounded-xl border border-dashed bg-card/50 p-5 transition-shadow",
-          "hover:shadow-md hover:border-solid hover:bg-card cursor-pointer"
+          "group relative flex flex-col gap-3 rounded-xl border bg-card/50 p-5 transition-all",
+          "hover:shadow-md hover:bg-card cursor-pointer"
         ),
         role: "button",
         tabIndex: 0,
-        "aria-label": `Adicionar conta ${definition.name}`,
+        "aria-label": `Conectar ${definition.name}`,
         onClick: () => onConnect(card),
         onKeyDown: (e) => {
           if (e.key === "Enter" || e.key === " ") {
@@ -4349,15 +4105,11 @@ function IntegrationCard({ card, onConnect }) {
           }
         },
         children: [
-          /* @__PURE__ */ jsxs15("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs15("div", { className: "flex items-start gap-3", children: [
             /* @__PURE__ */ jsx17("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-primary/5 text-primary/60", children: /* @__PURE__ */ jsx17(Icon, { className: "h-5 w-5" }) }),
-            /* @__PURE__ */ jsx17(Badge9, { variant: "outline", className: "text-xs bg-muted text-muted-foreground", children: "Adicionar" })
-          ] }),
-          /* @__PURE__ */ jsxs15("div", { className: "space-y-1", children: [
-            /* @__PURE__ */ jsx17("h3", { className: "text-sm font-semibold leading-tight text-muted-foreground", children: definition.name }),
-            /* @__PURE__ */ jsxs15("p", { className: "text-xs text-muted-foreground/70 leading-relaxed flex items-center gap-1", children: [
-              /* @__PURE__ */ jsx17(Plus3, { className: "h-3 w-3" }),
-              "Adicionar conta"
+            /* @__PURE__ */ jsxs15("div", { className: "flex-1 min-w-0 space-y-0.5", children: [
+              /* @__PURE__ */ jsx17("h3", { className: "text-sm font-semibold leading-tight text-foreground", children: definition.name }),
+              /* @__PURE__ */ jsx17("p", { className: "text-xs text-muted-foreground leading-relaxed", children: "Conectar nova conta" })
             ] })
           ] }),
           /* @__PURE__ */ jsx17("div", { className: "mt-auto flex items-center justify-end pt-1", children: /* @__PURE__ */ jsx17(
@@ -4370,75 +4122,138 @@ function IntegrationCard({ card, onConnect }) {
                 e.stopPropagation();
                 onConnect(card);
               },
-              children: actionLabel
+              children: "Conectar"
             }
           ) })
         ]
       }
     );
   }
+  if (isComingSoon) {
+    const badge2 = STATE_BADGES[state];
+    return /* @__PURE__ */ jsxs15(
+      "div",
+      {
+        className: "group relative flex flex-col gap-3 rounded-xl border bg-card p-5 opacity-60 cursor-default",
+        "aria-disabled": true,
+        children: [
+          /* @__PURE__ */ jsxs15("div", { className: "flex items-start justify-between gap-2", children: [
+            /* @__PURE__ */ jsx17("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-primary/10 text-primary", children: /* @__PURE__ */ jsx17(Icon, { className: "h-5 w-5" }) }),
+            /* @__PURE__ */ jsx17(Badge9, { variant: "outline", className: cn("text-xs", badge2.className), children: badge2.label })
+          ] }),
+          /* @__PURE__ */ jsxs15("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx17("h3", { className: "text-sm font-semibold leading-tight", children: definition.name }),
+            /* @__PURE__ */ jsx17("p", { className: "text-xs text-muted-foreground leading-relaxed", children: definition.description })
+          ] })
+        ]
+      }
+    );
+  }
   const badge = STATE_BADGES[state];
-  return /* @__PURE__ */ jsxs15(
-    "div",
-    {
-      className: cn(
-        "group relative flex flex-col gap-3 rounded-xl border bg-card p-5 transition-shadow",
-        isComingSoon ? "opacity-60 cursor-default" : "hover:shadow-md cursor-pointer"
-      ),
-      role: "button",
-      tabIndex: isComingSoon ? -1 : 0,
-      "aria-label": `${definition.name}${accountLabel ? ` \u2014 ${accountLabel}` : ""} \u2014 ${badge.label}`,
-      "aria-disabled": isComingSoon,
-      onClick: () => !isComingSoon && onConnect(card),
-      onKeyDown: (e) => {
-        if (!isComingSoon && (e.key === "Enter" || e.key === " ")) {
-          e.preventDefault();
-          onConnect(card);
-        }
-      },
-      children: [
-        /* @__PURE__ */ jsxs15("div", { className: "flex items-start justify-between gap-2", children: [
-          /* @__PURE__ */ jsx17("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-primary/10 text-primary", children: /* @__PURE__ */ jsx17(Icon, { className: "h-5 w-5" }) }),
-          /* @__PURE__ */ jsx17(Badge9, { variant: "outline", className: cn("text-xs", badge.className), children: badge.label })
-        ] }),
-        /* @__PURE__ */ jsxs15("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx17("h3", { className: "text-sm font-semibold leading-tight", children: definition.name }),
-          accountLabel ? /* @__PURE__ */ jsx17("p", { className: "text-xs text-muted-foreground leading-relaxed truncate", title: accountLabel, children: accountLabel }) : /* @__PURE__ */ jsx17("p", { className: "text-xs text-muted-foreground leading-relaxed", children: definition.description })
-        ] }),
-        /* @__PURE__ */ jsxs15("div", { className: "mt-auto flex items-center justify-between gap-2 pt-1", children: [
-          sharedByAgentsCount > 0 ? /* @__PURE__ */ jsxs15(Tooltip5, { children: [
-            /* @__PURE__ */ jsx17(TooltipTrigger5, { asChild: true, children: /* @__PURE__ */ jsxs15("span", { className: "inline-flex items-center gap-1 text-xs text-blue-600 dark:text-blue-400", children: [
-              /* @__PURE__ */ jsx17(Users2, { className: "h-3.5 w-3.5" }),
-              "Compartilhada"
-            ] }) }),
-            /* @__PURE__ */ jsx17(TooltipContent5, { children: "Esta credencial est\xE1 dispon\xEDvel para todos os agentes da conta" })
-          ] }) : /* @__PURE__ */ jsx17("span", {}),
-          !isComingSoon && /* @__PURE__ */ jsx17(
-            Button12,
-            {
-              variant: state === "expired" ? "destructive" : "outline",
-              size: "sm",
-              className: "text-xs",
-              onClick: (e) => {
-                e.stopPropagation();
-                onConnect(card);
-              },
-              children: actionLabel
-            }
-          )
+  return /* @__PURE__ */ jsxs15(Fragment3, { children: [
+    /* @__PURE__ */ jsxs15(
+      "div",
+      {
+        className: "group relative flex flex-col gap-3 rounded-xl border bg-card p-5 transition-shadow hover:shadow-md",
+        children: [
+          /* @__PURE__ */ jsxs15("div", { className: "flex items-start justify-between gap-2", children: [
+            /* @__PURE__ */ jsxs15("div", { className: "flex items-start gap-3 min-w-0 flex-1", children: [
+              /* @__PURE__ */ jsx17("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-primary/10 text-primary", children: /* @__PURE__ */ jsx17(Icon, { className: "h-5 w-5" }) }),
+              /* @__PURE__ */ jsxs15("div", { className: "flex-1 min-w-0 space-y-0.5", children: [
+                /* @__PURE__ */ jsx17("h3", { className: "text-sm font-semibold leading-tight", children: definition.name }),
+                accountLabel && /* @__PURE__ */ jsx17("p", { className: "text-xs text-muted-foreground leading-relaxed truncate", title: accountLabel, children: accountLabel })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx17(Badge9, { variant: "outline", className: cn("text-xs shrink-0", badge.className), children: badge.label })
+          ] }),
+          /* @__PURE__ */ jsx17("div", { className: "mt-auto flex items-center justify-end gap-2 pt-1", children: /* @__PURE__ */ jsxs15(DropdownMenu, { children: [
+            /* @__PURE__ */ jsx17(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs15(
+              Button12,
+              {
+                variant: "outline",
+                size: "sm",
+                className: "text-xs gap-1.5",
+                children: [
+                  /* @__PURE__ */ jsx17(Settings3, { className: "h-3.5 w-3.5" }),
+                  "Configurar"
+                ]
+              }
+            ) }),
+            /* @__PURE__ */ jsxs15(DropdownMenuContent, { align: "end", children: [
+              /* @__PURE__ */ jsxs15(
+                DropdownMenuItem,
+                {
+                  onClick: () => onReconnect?.(card),
+                  className: "gap-2",
+                  children: [
+                    /* @__PURE__ */ jsx17(RefreshCw, { className: "h-4 w-4" }),
+                    "Reconectar"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs15(
+                DropdownMenuItem,
+                {
+                  onClick: () => onDisconnect?.(card),
+                  className: "gap-2",
+                  children: [
+                    /* @__PURE__ */ jsx17(Unplug, { className: "h-4 w-4" }),
+                    "Desconectar"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs15(
+                DropdownMenuItem,
+                {
+                  onClick: () => setDeleteDialogOpen(true),
+                  className: "gap-2 text-destructive focus:text-destructive",
+                  children: [
+                    /* @__PURE__ */ jsx17(Trash26, { className: "h-4 w-4" }),
+                    "Remover"
+                  ]
+                }
+              )
+            ] })
+          ] }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx17(AlertDialog6, { open: deleteDialogOpen, onOpenChange: setDeleteDialogOpen, children: /* @__PURE__ */ jsxs15(AlertDialogContent6, { children: [
+      /* @__PURE__ */ jsxs15(AlertDialogHeader6, { children: [
+        /* @__PURE__ */ jsx17(AlertDialogTitle6, { children: "Remover integra\xE7\xE3o?" }),
+        /* @__PURE__ */ jsxs15(AlertDialogDescription6, { children: [
+          "Esta a\xE7\xE3o vai remover a credencial",
+          accountLabel ? ` (${accountLabel})` : "",
+          " de ",
+          definition.name,
+          ". Esta a\xE7\xE3o n\xE3o pode ser desfeita."
         ] })
-      ]
-    }
-  );
+      ] }),
+      /* @__PURE__ */ jsxs15(AlertDialogFooter6, { children: [
+        /* @__PURE__ */ jsx17(AlertDialogCancel6, { children: "Cancelar" }),
+        /* @__PURE__ */ jsx17(
+          AlertDialogAction6,
+          {
+            onClick: () => {
+              onDelete?.(card);
+              setDeleteDialogOpen(false);
+            },
+            className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+            children: "Remover"
+          }
+        )
+      ] })
+    ] }) })
+  ] });
 }
 
 // src/components/capabilities/advanced-tab.tsx
-import { useState as useState13 } from "react";
+import { useState as useState14 } from "react";
 import { Info } from "lucide-react";
 import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
 function AdvancedTab({ config, agentId, gagentsApiUrl }) {
-  const [editingTool, setEditingTool] = useState13(null);
-  const [showToolForm, setShowToolForm] = useState13(false);
+  const [editingTool, setEditingTool] = useState14(null);
+  const [showToolForm, setShowToolForm] = useState14(false);
   function handleEditTool(tool) {
     setEditingTool(tool);
     setShowToolForm(true);
@@ -4475,13 +4290,13 @@ function AdvancedTab({ config, agentId, gagentsApiUrl }) {
 }
 
 // src/components/capabilities/integration-wizard.tsx
-import { useCallback as useCallback6, useEffect as useEffect5, useRef as useRef2, useState as useState14 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect5, useRef as useRef2, useState as useState15 } from "react";
 import {
-  Dialog as Dialog7,
-  DialogContent as DialogContent7,
-  DialogFooter as DialogFooter7,
-  DialogHeader as DialogHeader7,
-  DialogTitle as DialogTitle7,
+  Dialog as Dialog6,
+  DialogContent as DialogContent6,
+  DialogFooter as DialogFooter6,
+  DialogHeader as DialogHeader6,
+  DialogTitle as DialogTitle6,
   Button as Button14
 } from "@greatapps/greatauth-ui/ui";
 import { Loader2 as Loader29, ChevronLeft, ChevronRight, Check as Check2 } from "lucide-react";
@@ -4695,11 +4510,11 @@ function ApiKeyCredentials({
 import { Loader2 as Loader28 } from "lucide-react";
 import {
   Label as Label7,
-  Select as Select4,
-  SelectContent as SelectContent4,
-  SelectItem as SelectItem4,
-  SelectTrigger as SelectTrigger4,
-  SelectValue as SelectValue4
+  Select as Select3,
+  SelectContent as SelectContent3,
+  SelectItem as SelectItem3,
+  SelectTrigger as SelectTrigger3,
+  SelectValue as SelectValue3
 } from "@greatapps/greatauth-ui/ui";
 import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
 function ConfigStep({
@@ -4729,9 +4544,9 @@ function ConfigStep({
       /* @__PURE__ */ jsx21("p", { className: "text-sm text-muted-foreground", children: "Carregando op\xE7\xF5es..." })
     ] }) : options.length === 0 ? /* @__PURE__ */ jsx21("div", { className: "rounded-lg border border-dashed p-6 text-center", children: /* @__PURE__ */ jsx21("p", { className: "text-sm text-muted-foreground", children: "Nenhuma op\xE7\xE3o dispon\xEDvel. A configura\xE7\xE3o padr\xE3o ser\xE1 usada." }) }) : /* @__PURE__ */ jsxs19("div", { className: "space-y-2", children: [
       /* @__PURE__ */ jsx21(Label7, { htmlFor: "integration-config-select", children: label }),
-      /* @__PURE__ */ jsxs19(Select4, { value: selectedValue, onValueChange, children: [
-        /* @__PURE__ */ jsx21(SelectTrigger4, { id: "integration-config-select", children: /* @__PURE__ */ jsx21(SelectValue4, { placeholder }) }),
-        /* @__PURE__ */ jsx21(SelectContent4, { children: options.map((opt) => /* @__PURE__ */ jsxs19(SelectItem4, { value: opt.id, children: [
+      /* @__PURE__ */ jsxs19(Select3, { value: selectedValue, onValueChange, children: [
+        /* @__PURE__ */ jsx21(SelectTrigger3, { id: "integration-config-select", children: /* @__PURE__ */ jsx21(SelectValue3, { placeholder }) }),
+        /* @__PURE__ */ jsx21(SelectContent3, { children: options.map((opt) => /* @__PURE__ */ jsxs19(SelectItem3, { value: opt.id, children: [
           /* @__PURE__ */ jsx21("span", { children: opt.label }),
           opt.description && /* @__PURE__ */ jsxs19("span", { className: "ml-2 text-xs text-muted-foreground", children: [
             "(",
@@ -4877,18 +4692,18 @@ function IntegrationWizard({
   existingConfigValue
 }) {
   const isReconnect = !!existingCredentialId;
-  const [currentStep, setCurrentStep] = useState14("info");
+  const [currentStep, setCurrentStep] = useState15("info");
   const currentIndex = STEPS.indexOf(currentStep);
-  const [oauthStatus, setOauthStatus] = useState14("idle");
-  const [oauthResult, setOauthResult] = useState14(null);
+  const [oauthStatus, setOauthStatus] = useState15("idle");
+  const [oauthResult, setOauthResult] = useState15(null);
   const popupRef = useRef2(null);
   const popupPollRef = useRef2(null);
-  const [apiKey, setApiKey] = useState14("");
-  const [configOptions, setConfigOptions] = useState14([]);
-  const [configLoading, setConfigLoading] = useState14(false);
-  const [selectedConfigValue, setSelectedConfigValue] = useState14("");
-  const [enableOnComplete, setEnableOnComplete] = useState14(true);
-  const [isSubmitting, setIsSubmitting] = useState14(false);
+  const [apiKey, setApiKey] = useState15("");
+  const [configOptions, setConfigOptions] = useState15([]);
+  const [configLoading, setConfigLoading] = useState15(false);
+  const [selectedConfigValue, setSelectedConfigValue] = useState15("");
+  const [enableOnComplete, setEnableOnComplete] = useState15(true);
+  const [isSubmitting, setIsSubmitting] = useState15(false);
   useEffect5(() => {
     return () => {
       if (popupPollRef.current) {
@@ -5057,7 +4872,6 @@ function IntegrationWizard({
     setIsSubmitting(true);
     try {
       onComplete();
-      onOpenChange(false);
       toast11.success(
         `${integration.name} ${isReconnect ? "reconectado" : "configurado"} com sucesso!`
       );
@@ -5070,8 +4884,8 @@ function IntegrationWizard({
   const selectedConfigOption = configOptions.find((o) => o.id === selectedConfigValue) || null;
   const isLastStep = currentStep === "confirm";
   const effectiveSteps = meta.hasConfigStep ? STEPS : STEPS.filter((s) => s !== "config");
-  return /* @__PURE__ */ jsx23(Dialog7, { open, onOpenChange, children: /* @__PURE__ */ jsxs21(DialogContent7, { className: "sm:max-w-lg", children: [
-    /* @__PURE__ */ jsx23(DialogHeader7, { children: /* @__PURE__ */ jsx23(DialogTitle7, { children: integration.name }) }),
+  return /* @__PURE__ */ jsx23(Dialog6, { open, onOpenChange, children: /* @__PURE__ */ jsxs21(DialogContent6, { className: "sm:max-w-lg", children: [
+    /* @__PURE__ */ jsx23(DialogHeader6, { children: /* @__PURE__ */ jsx23(DialogTitle6, { children: integration.name }) }),
     /* @__PURE__ */ jsx23(StepIndicator, { steps: effectiveSteps, currentStep }),
     /* @__PURE__ */ jsxs21("div", { className: "min-h-[280px] py-2", children: [
       currentStep === "info" && /* @__PURE__ */ jsx23(
@@ -5115,7 +4929,7 @@ function IntegrationWizard({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs21(DialogFooter7, { className: "flex-row justify-between sm:justify-between", children: [
+    /* @__PURE__ */ jsxs21(DialogFooter6, { className: "flex-row justify-between sm:justify-between", children: [
       /* @__PURE__ */ jsx23("div", { children: currentStep === "info" ? /* @__PURE__ */ jsx23(
         Button14,
         {
@@ -5225,7 +5039,7 @@ function StepIndicator({
 }
 
 // src/pages/agents-page.tsx
-import { useState as useState15 } from "react";
+import { useState as useState16 } from "react";
 import { Button as Button15 } from "@greatapps/greatauth-ui/ui";
 import { Plus as Plus4 } from "lucide-react";
 import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
@@ -5235,7 +5049,7 @@ function AgentsPage({
   title = "Agentes AI",
   subtitle = "Gerencie seus agentes de atendimento inteligente"
 }) {
-  const [createOpen, setCreateOpen] = useState15(false);
+  const [createOpen, setCreateOpen] = useState16(false);
   return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-4 p-4 md:p-6", children: [
     /* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-between", children: [
       /* @__PURE__ */ jsxs22("div", { children: [
@@ -5260,10 +5074,10 @@ function AgentsPage({
 }
 
 // src/pages/agent-detail-page.tsx
-import { useState as useState16 } from "react";
+import { useState as useState17 } from "react";
 import { Badge as Badge10, Button as Button16, Skeleton as Skeleton7 } from "@greatapps/greatauth-ui/ui";
 import { EntityAvatar as EntityAvatar2 } from "@greatapps/greatauth-ui";
-import { ArrowLeft, Pencil as Pencil5 } from "lucide-react";
+import { ArrowLeft, Pencil as Pencil4 } from "lucide-react";
 import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
 function AgentDetailPage({
   config,
@@ -5272,7 +5086,7 @@ function AgentDetailPage({
   renderChatLink
 }) {
   const { data: agent, isLoading } = useAgent(config, agentId);
-  const [editOpen, setEditOpen] = useState16(false);
+  const [editOpen, setEditOpen] = useState17(false);
   if (isLoading) {
     return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-4 p-4", children: [
       /* @__PURE__ */ jsx25(Skeleton7, { className: "h-4 w-32" }),
@@ -5325,7 +5139,7 @@ function AgentDetailPage({
           className: "shrink-0 self-start",
           onClick: () => setEditOpen(true),
           children: [
-            /* @__PURE__ */ jsx25(Pencil5, { className: "mr-2 h-4 w-4" }),
+            /* @__PURE__ */ jsx25(Pencil4, { className: "mr-2 h-4 w-4" }),
             "Editar"
           ]
         }
@@ -5401,7 +5215,7 @@ function AgentCapabilitiesPage({
 }
 
 // src/pages/tools-page.tsx
-import { useState as useState17 } from "react";
+import { useState as useState18 } from "react";
 import { Button as Button17 } from "@greatapps/greatauth-ui/ui";
 import { Plus as Plus5 } from "lucide-react";
 import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
@@ -5410,8 +5224,8 @@ function ToolsPage({
   title = "Ferramentas",
   subtitle = "Gerencie as ferramentas dispon\xEDveis para seus agentes"
 }) {
-  const [createOpen, setCreateOpen] = useState17(false);
-  const [editTool, setEditTool] = useState17(void 0);
+  const [createOpen, setCreateOpen] = useState18(false);
+  const [editTool, setEditTool] = useState18(void 0);
   return /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-4 p-4 md:p-6", children: [
     /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
       /* @__PURE__ */ jsxs25("div", { children: [
@@ -5445,9 +5259,6 @@ function ToolsPage({
 }
 
 // src/pages/credentials-page.tsx
-import { useState as useState18 } from "react";
-import { Button as Button18 } from "@greatapps/greatauth-ui/ui";
-import { Plus as Plus6 } from "lucide-react";
 import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
 function CredentialsPage({
   config,
@@ -5456,85 +5267,63 @@ function CredentialsPage({
   subtitle = "Gerencie as credenciais de autentica\xE7\xE3o das ferramentas"
 }) {
   const { data: credentialsData, isLoading: credentialsLoading } = useToolCredentials(config);
-  const [createOpen, setCreateOpen] = useState18(false);
   const credentials = credentialsData?.data || [];
   return /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-4 p-4 md:p-6", children: [
-    /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxs26("div", { children: [
-        /* @__PURE__ */ jsx28("h1", { className: "text-xl font-semibold", children: title }),
-        /* @__PURE__ */ jsx28("p", { className: "text-sm text-muted-foreground", children: subtitle })
-      ] }),
-      /* @__PURE__ */ jsxs26(Button18, { onClick: () => setCreateOpen(true), size: "sm", children: [
-        /* @__PURE__ */ jsx28(Plus6, { className: "mr-2 h-4 w-4" }),
-        "Nova Credencial"
-      ] })
-    ] }),
+    /* @__PURE__ */ jsx28("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxs26("div", { children: [
+      /* @__PURE__ */ jsx28("h1", { className: "text-xl font-semibold", children: title }),
+      /* @__PURE__ */ jsx28("p", { className: "text-sm text-muted-foreground", children: subtitle })
+    ] }) }),
     /* @__PURE__ */ jsx28(
       ToolCredentialsForm,
       {
         config,
         gagentsApiUrl,
         credentials,
-        isLoading: credentialsLoading,
-        createOpen,
-        onCreateOpenChange: setCreateOpen
+        isLoading: credentialsLoading
       }
     )
   ] });
 }
 
 // src/pages/integrations-management-page.tsx
-import { useState as useState19, useMemo as useMemo8, useCallback as useCallback7 } from "react";
-import {
-  Badge as Badge11,
-  Button as Button19,
-  Tabs as Tabs3,
-  TabsContent as TabsContent3,
-  TabsList as TabsList3,
-  TabsTrigger as TabsTrigger3
-} from "@greatapps/greatauth-ui/ui";
-import { Plus as Plus7, Plug as Plug5, KeyRound, Info as Info3, Loader2 as Loader210 } from "lucide-react";
+import { useCallback as useCallback7, useState as useState19 } from "react";
+import { useQueryClient as useQueryClient7 } from "@tanstack/react-query";
+import { Plug as Plug5, Loader2 as Loader210 } from "lucide-react";
 import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
-function useCredentialAgentSummary(credentials, tools, agents) {
-  return useMemo8(() => {
-    const toolIdsWithCredentials = new Set(
-      credentials.map((c) => c.id_tool).filter(Boolean)
-    );
-    const linkedCount = credentials.filter(
-      (c) => c.id_tool && toolIdsWithCredentials.has(c.id_tool)
-    ).length;
-    return {
-      totalCredentials: credentials.length,
-      linkedToTools: linkedCount,
-      totalAgents: agents.length,
-      totalTools: tools.length
-    };
-  }, [credentials, tools, agents]);
-}
 function IntegrationsManagementPage({
   config,
   gagentsApiUrl,
   resolveWizardMeta,
   loadConfigOptions,
   onWizardComplete,
-  title = "Integra\xE7\xF5es e Credenciais",
-  subtitle = "Gerencie todas as integra\xE7\xF5es e credenciais da conta."
+  title = "Integra\xE7\xF5es",
+  subtitle = "Gerencie as integra\xE7\xF5es da conta."
 }) {
-  const { data: credentialsData, isLoading: credentialsLoading } = useToolCredentials(config);
-  const { data: agentsData } = useAgents(config);
-  const { data: toolsData } = useTools(config);
-  const [createOpen, setCreateOpen] = useState19(false);
+  const queryClient = useQueryClient7();
   const { cards, isLoading: cardsLoading } = useIntegrationState(config, null);
   const [wizardOpen, setWizardOpen] = useState19(false);
   const [activeCard, setActiveCard] = useState19(null);
-  const credentials = credentialsData?.data || [];
-  const agents = agentsData?.data || [];
-  const tools = toolsData?.data || [];
-  const summary = useCredentialAgentSummary(credentials, tools, agents);
+  const deleteCredential = useDeleteToolCredential(config);
+  const updateCredential = useUpdateToolCredential(config);
   const handleConnect = useCallback7((card) => {
     setActiveCard(card);
     setWizardOpen(true);
   }, []);
+  const handleReconnect = useCallback7((card) => {
+    setActiveCard(card);
+    setWizardOpen(true);
+  }, []);
+  const handleDisconnect = useCallback7((card) => {
+    if (!card.credentialId) return;
+    updateCredential.mutate({
+      id: card.credentialId,
+      body: { status: "inactive" }
+    });
+  }, [updateCredential]);
+  const handleDelete = useCallback7((card) => {
+    if (!card.credentialId) return;
+    deleteCredential.mutate(card.credentialId);
+  }, [deleteCredential]);
   const handleWizardClose = useCallback7((open) => {
     if (!open) {
       setActiveCard(null);
@@ -5542,10 +5331,13 @@ function IntegrationsManagementPage({
     setWizardOpen(open);
   }, []);
   const handleWizardComplete = useCallback7(() => {
+    queryClient.invalidateQueries({ queryKey: ["greatagents", "tool-credentials"] });
+    queryClient.invalidateQueries({ queryKey: ["greatagents", "tools"] });
+    queryClient.invalidateQueries({ queryKey: ["greatagents", "agent-tools"] });
     setWizardOpen(false);
     setActiveCard(null);
     onWizardComplete?.();
-  }, [onWizardComplete]);
+  }, [onWizardComplete, queryClient]);
   const wizardMeta = activeCard ? resolveWizardMeta?.(activeCard) ?? {
     capabilities: [],
     requirements: [],
@@ -5562,82 +5354,37 @@ function IntegrationsManagementPage({
       /* @__PURE__ */ jsx29("h1", { className: "text-xl font-semibold", children: title }),
       /* @__PURE__ */ jsx29("p", { className: "text-sm text-muted-foreground", children: subtitle })
     ] }) }),
-    /* @__PURE__ */ jsxs27(Tabs3, { defaultValue: "integrations", className: "w-full", children: [
-      /* @__PURE__ */ jsxs27(TabsList3, { children: [
-        /* @__PURE__ */ jsxs27(TabsTrigger3, { value: "integrations", className: "gap-2", children: [
-          /* @__PURE__ */ jsx29(Plug5, { className: "h-4 w-4" }),
-          "Integra\xE7\xF5es"
-        ] }),
-        /* @__PURE__ */ jsxs27(TabsTrigger3, { value: "credentials", className: "gap-2", children: [
-          /* @__PURE__ */ jsx29(KeyRound, { className: "h-4 w-4" }),
-          "Credenciais"
-        ] })
+    cardsLoading ? /* @__PURE__ */ jsx29("div", { className: "flex items-center justify-center py-16", children: /* @__PURE__ */ jsx29(Loader210, { className: "h-6 w-6 animate-spin text-muted-foreground" }) }) : cards.length === 0 ? /* @__PURE__ */ jsxs27("div", { className: "flex flex-col items-center justify-center gap-3 py-16 text-muted-foreground", children: [
+      /* @__PURE__ */ jsx29(Plug5, { className: "h-10 w-10" }),
+      /* @__PURE__ */ jsx29("p", { className: "text-sm", children: "Nenhuma integra\xE7\xE3o dispon\xEDvel" })
+    ] }) : /* @__PURE__ */ jsxs27("div", { className: "space-y-6", children: [
+      connectedCards.length > 0 && /* @__PURE__ */ jsxs27("div", { children: [
+        /* @__PURE__ */ jsx29("h3", { className: "mb-3 text-xs font-medium uppercase tracking-wider text-muted-foreground", children: "Contas conectadas" }),
+        /* @__PURE__ */ jsx29("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: connectedCards.map((card) => /* @__PURE__ */ jsx29(
+          IntegrationCard,
+          {
+            card,
+            onConnect: handleConnect,
+            onReconnect: handleReconnect,
+            onDisconnect: handleDisconnect,
+            onDelete: handleDelete
+          },
+          `${card.definition.slug}-cred-${card.credentialId}`
+        )) })
       ] }),
-      /* @__PURE__ */ jsx29(TabsContent3, { value: "integrations", className: "mt-4", children: cardsLoading ? /* @__PURE__ */ jsx29("div", { className: "flex items-center justify-center py-16", children: /* @__PURE__ */ jsx29(Loader210, { className: "h-6 w-6 animate-spin text-muted-foreground" }) }) : cards.length === 0 ? /* @__PURE__ */ jsxs27("div", { className: "flex flex-col items-center justify-center gap-3 py-16 text-muted-foreground", children: [
-        /* @__PURE__ */ jsx29(Plug5, { className: "h-10 w-10" }),
-        /* @__PURE__ */ jsx29("p", { className: "text-sm", children: "Nenhuma integra\xE7\xE3o dispon\xEDvel" })
-      ] }) : /* @__PURE__ */ jsxs27("div", { className: "space-y-6", children: [
-        connectedCards.length > 0 && /* @__PURE__ */ jsxs27("div", { children: [
-          /* @__PURE__ */ jsx29("h3", { className: "mb-3 text-xs font-medium uppercase tracking-wider text-muted-foreground", children: "Contas conectadas" }),
-          /* @__PURE__ */ jsx29("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: connectedCards.map((card) => /* @__PURE__ */ jsx29(
+      otherCards.length > 0 && /* @__PURE__ */ jsxs27("div", { children: [
+        connectedCards.length > 0 && /* @__PURE__ */ jsx29("h3", { className: "mb-3 text-xs font-medium uppercase tracking-wider text-muted-foreground", children: "Adicionar integra\xE7\xE3o" }),
+        /* @__PURE__ */ jsx29("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: otherCards.map((card) => {
+          const key = card.isAddNew ? `${card.definition.slug}-add-new` : card.definition.slug;
+          return /* @__PURE__ */ jsx29(
             IntegrationCard,
             {
               card,
               onConnect: handleConnect
             },
-            `${card.definition.slug}-cred-${card.credentialId}`
-          )) })
-        ] }),
-        otherCards.length > 0 && /* @__PURE__ */ jsxs27("div", { children: [
-          connectedCards.length > 0 && /* @__PURE__ */ jsx29("h3", { className: "mb-3 text-xs font-medium uppercase tracking-wider text-muted-foreground", children: "Adicionar integra\xE7\xE3o" }),
-          /* @__PURE__ */ jsx29("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: otherCards.map((card) => {
-            const key = card.isAddNew ? `${card.definition.slug}-add-new` : card.definition.slug;
-            return /* @__PURE__ */ jsx29(
-              IntegrationCard,
-              {
-                card,
-                onConnect: handleConnect
-              },
-              key
-            );
-          }) })
-        ] })
-      ] }) }),
-      /* @__PURE__ */ jsxs27(TabsContent3, { value: "credentials", className: "mt-4", children: [
-        !credentialsLoading && /* @__PURE__ */ jsxs27("div", { className: "flex items-center gap-4 rounded-lg border bg-muted/50 px-4 py-3 mb-4", children: [
-          /* @__PURE__ */ jsx29(Info3, { className: "h-4 w-4 text-muted-foreground shrink-0" }),
-          /* @__PURE__ */ jsxs27("div", { className: "flex flex-wrap items-center gap-3 text-sm", children: [
-            /* @__PURE__ */ jsxs27("span", { children: [
-              /* @__PURE__ */ jsx29(Badge11, { variant: "secondary", className: "mr-1", children: summary.totalCredentials }),
-              summary.totalCredentials === 1 ? "credencial configurada" : "credenciais configuradas"
-            ] }),
-            /* @__PURE__ */ jsx29("span", { className: "text-muted-foreground", children: "|" }),
-            /* @__PURE__ */ jsxs27("span", { children: [
-              /* @__PURE__ */ jsx29(Badge11, { variant: "secondary", className: "mr-1", children: summary.linkedToTools }),
-              summary.linkedToTools === 1 ? "vinculada a ferramentas" : "vinculadas a ferramentas"
-            ] }),
-            /* @__PURE__ */ jsx29("span", { className: "text-muted-foreground", children: "|" }),
-            /* @__PURE__ */ jsxs27("span", { children: [
-              /* @__PURE__ */ jsx29(Badge11, { variant: "secondary", className: "mr-1", children: summary.totalAgents }),
-              summary.totalAgents === 1 ? "agente na conta" : "agentes na conta"
-            ] })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx29("div", { className: "flex items-center justify-end mb-4", children: /* @__PURE__ */ jsxs27(Button19, { onClick: () => setCreateOpen(true), size: "sm", children: [
-          /* @__PURE__ */ jsx29(Plus7, { className: "mr-2 h-4 w-4" }),
-          "Nova Credencial"
-        ] }) }),
-        /* @__PURE__ */ jsx29(
-          ToolCredentialsForm,
-          {
-            config,
-            gagentsApiUrl,
-            credentials,
-            isLoading: credentialsLoading,
-            createOpen,
-            onCreateOpenChange: setCreateOpen
-          }
-        )
+            key
+          );
+        }) })
       ] })
     ] }),
     activeCard && wizardMeta && /* @__PURE__ */ jsx29(