diff --git a/ui/admin/app/components/agent/ToolForm.tsx b/ui/admin/app/components/agent/ToolForm.tsx index 4df132dae..6b447504b 100644 --- a/ui/admin/app/components/agent/ToolForm.tsx +++ b/ui/admin/app/components/agent/ToolForm.tsx @@ -9,12 +9,13 @@ import { noop } from "~/lib/utils"; import { ToolEntry } from "~/components/agent/ToolEntry"; import { ToolCatalogDialog } from "~/components/tools/ToolCatalog"; import { Form } from "~/components/ui/form"; -import { Switch } from "~/components/ui/switch"; import { - Tooltip, - TooltipContent, - TooltipTrigger, -} from "~/components/ui/tooltip"; + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from "~/components/ui/select"; const ToolVariant = { FIXED: "fixed", @@ -99,14 +100,6 @@ export function ToolForm({ }).unsubscribe; }, [watch, onChange]); - const [allTools, fixedFields, userFields] = useMemo(() => { - return [ - toolFields.fields.map(({ tool }) => tool), - toolFields.fields?.filter((field) => field.variant === ToolVariant.FIXED), - toolFields.fields?.filter((field) => field.variant !== ToolVariant.FIXED), - ]; - }, [toolFields]); - const removeTools = (tools: string[]) => { const indexes = tools .map((tool) => toolFields.fields.findIndex((t) => t.tool === tool)) @@ -137,80 +130,62 @@ export function ToolForm({ } }; + const sortedFields = toolFields.fields.toSorted((a, b) => + a.tool.localeCompare(b.tool) + ); + return (
-

- Agent Tools -

- - - These tools are essential for the agent's core functionality and - are always enabled. - - -
- {fixedFields.map((field) => ( - removeTools([field.tool])} - actions={renderActions?.(field.tool)} - /> - ))} -
- -
- updateTools(tools, ToolVariant.FIXED)} - /> -
- -

- User Tools -

- - - Optional tools users can turn on or off. Use the toggle to set whether - they're active by default for the agent. - -
- {userFields.map((field) => ( + {sortedFields.map((field) => ( removeTools([field.tool])} actions={ <> + + {renderActions?.(field.tool)} - - -
- - updateVariant( - field.tool, - checked - ? ToolVariant.DEFAULT - : ToolVariant.AVAILABLE - ) - } - /> -
-
- - - {field.variant === ToolVariant.DEFAULT - ? "Active by Default" - : "Inactive by Default"} - -
} /> @@ -219,9 +194,8 @@ export function ToolForm({
updateTools(tools, ToolVariant.DEFAULT)} - className="w-auto" + tools={toolFields.fields.map((field) => field.tool)} + onUpdateTools={(tools) => updateTools(tools, ToolVariant.FIXED)} />
diff --git a/ui/admin/app/components/agent/shared/ToolAuthenticationStatus.tsx b/ui/admin/app/components/agent/shared/ToolAuthenticationStatus.tsx index bfda65984..99c0a9d99 100644 --- a/ui/admin/app/components/agent/shared/ToolAuthenticationStatus.tsx +++ b/ui/admin/app/components/agent/shared/ToolAuthenticationStatus.tsx @@ -1,4 +1,4 @@ -import { GlobeIcon, GlobeLockIcon } from "lucide-react"; +import { GlobeIcon, GlobeLockIcon, ShieldOffIcon } from "lucide-react"; import { ToolInfo } from "~/lib/model/agents"; import { AssistantNamespace } from "~/lib/model/assistants"; @@ -95,7 +95,22 @@ export function ToolAuthenticationStatus({ } }; - if (!credentialNames?.length) return null; + if (!credentialNames?.length) + return ( + + +
+ +
+
+ + + This tool does not require authentication. + +
+ ); return ( <> diff --git a/ui/admin/app/components/tools/ToolCatalog.tsx b/ui/admin/app/components/tools/ToolCatalog.tsx index c568a0d1e..cac44e139 100644 --- a/ui/admin/app/components/tools/ToolCatalog.tsx +++ b/ui/admin/app/components/tools/ToolCatalog.tsx @@ -141,7 +141,7 @@ export function ToolCatalogDialog(props: ToolCatalogProps) {