@greatapps/greatagents-ui 0.3.6 → 0.3.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@greatapps/greatagents-ui",
-  "version": "0.3.6",
+  "version": "0.3.8",
   "description": "Shared agents UI components for Great platform",
   "type": "module",
   "main": "./dist/index.js",

package/src/components/agents/agent-tabs.tsx

@@ -3,7 +3,6 @@ import type { GagentsHookConfig } from "../../hooks/types";
 import type { IntegrationCardData } from "../../hooks/use-integrations";
 import type { WizardIntegrationMeta } from "../capabilities/types";
 import type { ConfigOption } from "../capabilities/wizard-steps/config-step";
-import { AgentToolsList } from "./agent-tools-list";
 import { AgentObjectivesList } from "./agent-objectives-list";
 import { AgentPromptEditor } from "./agent-prompt-editor";
 import { AgentConversationsPanel } from "../conversations/agent-conversations-panel";
@@ -14,7 +13,7 @@ import {
   TabsTrigger,
   TabsContent,
 } from "@greatapps/greatauth-ui/ui";
-import { Wrench, Target, FileText, MessageCircle, Blocks } from "lucide-react";
+import { Target, FileText, MessageCircle, Blocks } from "lucide-react";
 
 interface AgentTabsProps {
   agent: Agent;
@@ -52,10 +51,6 @@ export function AgentTabs({
           <Target aria-hidden="true" className="h-3.5 w-3.5" />
           Objetivos
         </TabsTrigger>
-        <TabsTrigger value="ferramentas" className="flex items-center gap-1.5">
-          <Wrench aria-hidden="true" className="h-3.5 w-3.5" />
-          Ferramentas
-        </TabsTrigger>
         <TabsTrigger value="capacidades" className="flex items-center gap-1.5">
           <Blocks aria-hidden="true" className="h-3.5 w-3.5" />
           Capacidades
@@ -74,10 +69,6 @@ export function AgentTabs({
         <AgentObjectivesList agent={agent} config={config} />
       </TabsContent>
 
-      <TabsContent value="ferramentas" className="mt-4">
-        <AgentToolsList agent={agent} config={config} />
-      </TabsContent>
-
       <TabsContent value="capacidades" className="mt-4">
         <AgentCapabilitiesPage
           config={config}

package/src/components/agents/agent-tools-list.tsx

@@ -70,10 +70,15 @@ export function AgentToolsList({ agent, config }: AgentToolsListProps) {
   const allCredentials: ToolCredential[] = credentialsData?.data || [];
 
   const agentTools = agentToolsData?.data || [];
-  const allTools = allToolsData?.data || [];
+  const allTools = (allToolsData?.data || []).filter((t: Tool) => !t.slug?.startsWith("gclinic_"));
   const assignedToolIds = new Set(agentTools.map((at) => at.id_tool));
-  const availableTools = allTools.filter((t) => !assignedToolIds.has(t.id));
-  const filteredAvailable = availableTools.filter((t) =>
+  // Filter out internal gclinic_* tools from assigned tools display
+  const visibleAgentTools = agentTools.filter((at) => {
+    const tool = allTools.find((t: Tool) => t.id === at.id_tool);
+    return !tool || !tool.slug?.startsWith("gclinic_");
+  });
+  const availableTools = allTools.filter((t: Tool) => !assignedToolIds.has(t.id));
+  const filteredAvailable = availableTools.filter((t: Tool) =>
     t.name.toLowerCase().includes(search.toLowerCase()),
   );
 
@@ -170,7 +175,7 @@ export function AgentToolsList({ agent, config }: AgentToolsListProps) {
     <div className="space-y-4 p-4">
       <div className="flex items-center justify-between">
         <h3 className="text-sm font-medium text-muted-foreground">
-          {agentTools.length} ferramenta{agentTools.length !== 1 ? "s" : ""} associada{agentTools.length !== 1 ? "s" : ""}
+          {visibleAgentTools.length} ferramenta{visibleAgentTools.length !== 1 ? "s" : ""} associada{visibleAgentTools.length !== 1 ? "s" : ""}
         </h3>
         <Popover open={addOpen} onOpenChange={setAddOpen}>
           <PopoverTrigger asChild>
@@ -217,7 +222,7 @@ export function AgentToolsList({ agent, config }: AgentToolsListProps) {
         </Popover>
       </div>
 
-      {agentTools.length === 0 ? (
+      {visibleAgentTools.length === 0 ? (
         <div className="flex flex-col items-center justify-center rounded-lg border border-dashed p-8 text-center">
           <Wrench className="mb-2 h-8 w-8 text-muted-foreground" />
           <p className="text-sm text-muted-foreground">
@@ -226,7 +231,7 @@ export function AgentToolsList({ agent, config }: AgentToolsListProps) {
         </div>
       ) : (
         <div className="space-y-2">
-          {agentTools.map((agentTool) => {
+          {visibleAgentTools.map((agentTool) => {
             const tool = getToolInfo(agentTool.id_tool);
             return (
               <div

package/src/components/capabilities/capabilities-tab.tsx

@@ -337,7 +337,7 @@ export function CapabilitiesTab({ config, agentId }: CapabilitiesTabProps) {
                   </Badge>
                 </div>
               </AccordionTrigger>
-              <AccordionContent className="pb-3">
+              <AccordionContent className="pb-3 !h-auto">
                 <div className="space-y-1">
                   {cat.modules.map((mod) => {
                     const enabledOps = localState.get(mod.slug);

package/src/components/capabilities/integration-wizard.tsx

@@ -218,49 +218,64 @@ export function IntegrationWizard({
   // OAuth start
   // -----------------------------------------------------------------------
 
-  function startOAuth() {
-    const { language = "pt-br", idWl = 1, accountId } = config;
-
-    // Build OAuth authorize URL -- the backend already handles the full flow
-    const redirectUri = `${window.location.origin}/oauth/callback`;
-    const url = new URL(
-      `${gagentsApiUrl}/v1/${language}/${idWl}/accounts/${accountId}/oauth/authorize/${integration.slug}`,
-    );
-    url.searchParams.set("redirect_uri", redirectUri);
+  async function startOAuth() {
+    const { language = "pt-br", idWl = 1, accountId, token } = config;
 
     setOauthStatus("waiting");
 
-    // Open popup
-    const popup = window.open(
-      url.toString(),
-      "oauth-popup",
-      "width=500,height=600,scrollbars=yes,resizable=yes",
-    );
-    popupRef.current = popup;
-
-    // Poll for popup closed without completing
-    if (popup) {
-      // Clear any previous poll interval
-      if (popupPollRef.current) {
-        clearInterval(popupPollRef.current);
+    try {
+      // 1. Get auth URL from backend
+      const response = await fetch(
+        `${gagentsApiUrl}/v1/${language}/${idWl}/accounts/${accountId}/oauth/authorize/${integration.slug}`,
+        { headers: { Authorization: `Bearer ${token}` } },
+      );
+      const result = await response.json();
+
+      if (result.status !== 1 || !result.data?.auth_url) {
+        setOauthStatus("error");
+        setOauthResult({
+          success: false,
+          error: result.message || "Erro ao obter URL de autorização",
+        });
+        return;
       }
-      popupPollRef.current = setInterval(() => {
-        if (popup.closed) {
-          if (popupPollRef.current) {
-            clearInterval(popupPollRef.current);
-            popupPollRef.current = null;
-          }
-          // Only set error if we're still waiting (no success message received)
-          setOauthStatus((prev) =>
-            prev === "waiting" ? "error" : prev,
-          );
-          setOauthResult((prev) =>
-            prev === null
-              ? { success: false, error: "Janela fechada antes de concluir" }
-              : prev,
-          );
+
+      // 2. Open auth URL in popup
+      const popup = window.open(
+        result.data.auth_url,
+        "oauth-popup",
+        "width=500,height=600,scrollbars=yes,resizable=yes",
+      );
+      popupRef.current = popup;
+
+      // Poll for popup closed without completing
+      if (popup) {
+        if (popupPollRef.current) {
+          clearInterval(popupPollRef.current);
         }
-      }, 500);
+        popupPollRef.current = setInterval(() => {
+          if (popup.closed) {
+            if (popupPollRef.current) {
+              clearInterval(popupPollRef.current);
+              popupPollRef.current = null;
+            }
+            setOauthStatus((prev) =>
+              prev === "waiting" ? "error" : prev,
+            );
+            setOauthResult((prev) =>
+              prev === null
+                ? { success: false, error: "Janela fechada antes de concluir" }
+                : prev,
+            );
+          }
+        }, 500);
+      }
+    } catch (err) {
+      setOauthStatus("error");
+      setOauthResult({
+        success: false,
+        error: "Erro de rede ao obter URL de autorização",
+      });
     }
   }
 

package/src/components/capabilities/wizard-steps/credentials-step.tsx

@@ -77,7 +77,11 @@ function OAuthCredentials({
       {/* OAuth status area */}
       <div className="flex flex-col items-center gap-4 rounded-lg border p-6">
         {oauthStatus === "idle" && (
-          <Button onClick={onStartOAuth} size="lg" className="gap-2">
+          <Button
+            onClick={onStartOAuth}
+            size="lg"
+            className="gap-2"
+          >
             {meta.icon}
             {isReconnect
               ? `Reconectar com ${providerLabel}`

package/src/components/tools/tool-credentials-form.tsx

@@ -185,7 +185,7 @@ export function ToolCredentialsForm({
   const updateMutation = useUpdateToolCredential(config);
   const deleteMutation = useDeleteToolCredential(config);
   const { data: toolsData } = useTools(config);
-  const tools: Tool[] = toolsData?.data || [];
+  const tools: Tool[] = (toolsData?.data || []).filter((t: Tool) => !t.slug?.startsWith("gclinic_"));
 
   const [search, setSearch] = useState("");
   const [internalCreateOpen, setInternalCreateOpen] = useState(false);
@@ -209,17 +209,31 @@ export function ToolCredentialsForm({
 
   const [removeTarget, setRemoveTarget] = useState<ToolCredential | null>(null);
 
+  // Build a set of internal tool IDs to exclude from credentials display
+  const internalToolIds = useMemo(() => {
+    const allRawTools: Tool[] = toolsData?.data || [];
+    return new Set(
+      allRawTools
+        .filter((t: Tool) => t.slug?.startsWith("gclinic_"))
+        .map((t: Tool) => t.id),
+    );
+  }, [toolsData]);
+
   const filteredCredentials = useMemo(() => {
-    if (!search) return credentials;
+    // Exclude credentials linked to internal gclinic_* tools
+    const visible = credentials.filter(
+      (cred) => !cred.id_tool || !internalToolIds.has(cred.id_tool),
+    );
+    if (!search) return visible;
     const term = search.toLowerCase();
-    return credentials.filter((cred) => {
+    return visible.filter((cred) => {
       const toolName = tools.find((t) => t.id === cred.id_tool)?.name || "";
       return (
         (cred.label || "").toLowerCase().includes(term) ||
         toolName.toLowerCase().includes(term)
       );
     });
-  }, [credentials, search, tools]);
+  }, [credentials, search, tools, internalToolIds]);
 
   const columns = useColumns(
     tools,

package/src/components/tools/tools-table.tsx

@@ -145,8 +145,9 @@ export function ToolsTable({ onEdit, config }: ToolsTableProps) {
   const deleteTool = useDeleteTool(config);
   const [deleteId, setDeleteId] = useState<number | null>(null);
 
-  const tools = data?.data || [];
-  const total = data?.total || 0;
+  const rawTools = data?.data || [];
+  const tools = rawTools.filter((t: Tool) => !t.slug?.startsWith("gclinic_"));
+  const total = tools.length;
 
   const columns = useColumns(
     (tool) => onEdit(tool),