feat: add openai embedding service

ui/src/components/flow/ToolBadges.tsx

@@ -2,43 +2,43 @@
 
 import { useCallback, useEffect, useState } from "react";
 
-import { listToolsApiV1ToolsGet } from "@/client/sdk.gen";
+import { useWorkflow } from "@/app/workflow/[workflowId]/contexts/WorkflowContext";
 import type { ToolResponse } from "@/client/types.gen";
 import { Badge } from "@/components/ui/badge";
-import { useAuth } from "@/lib/auth";
 
 interface ToolBadgesProps {
     toolUuids: string[];
+    onStaleUuidsDetected?: (staleUuids: string[]) => void;
 }
 
-export function ToolBadges({ toolUuids }: ToolBadgesProps) {
-    const { getAccessToken } = useAuth();
-    const [tools, setTools] = useState<ToolResponse[]>([]);
+export function ToolBadges({ toolUuids, onStaleUuidsDetected }: ToolBadgesProps) {
+    const { tools } = useWorkflow();
+    const [selectedTools, setSelectedTools] = useState<ToolResponse[]>([]);
 
-    const fetchTools = useCallback(async () => {
-        try {
-            const accessToken = await getAccessToken();
-            const response = await listToolsApiV1ToolsGet({
-                headers: { Authorization: `Bearer ${accessToken}` },
-            });
-            if (response.data) {
-                setTools(response.data);
+    const processTools = useCallback((toolsData: ToolResponse[]) => {
+        const filtered = toolsData.filter(tool => toolUuids.includes(tool.tool_uuid));
+        setSelectedTools(filtered);
+
+        // Detect stale UUIDs - this only runs when we have loaded data (not undefined)
+        if (onStaleUuidsDetected) {
+            const validUuids = new Set(toolsData.map(tool => tool.tool_uuid));
+            const staleUuids = toolUuids.filter(uuid => !validUuids.has(uuid));
+            if (staleUuids.length > 0) {
+                onStaleUuidsDetected(staleUuids);
             }
-        } catch (error) {
-            console.error("Failed to fetch tools:", error);
         }
-    }, [getAccessToken]);
+    }, [toolUuids, onStaleUuidsDetected]);
 
     useEffect(() => {
-        if (toolUuids.length > 0) {
-            fetchTools();
+        if (toolUuids.length > 0 && tools !== undefined) {
+            processTools(tools);
+        } else if (toolUuids.length === 0) {
+            setSelectedTools([]);
         }
-    }, [toolUuids.length, fetchTools]);
+    }, [toolUuids, tools, processTools]);
 
-    const selectedTools = tools.filter((tool) => toolUuids.includes(tool.tool_uuid));
-
-    if (selectedTools.length === 0 && toolUuids.length > 0) {
-        // Still loading or tools not found
+    // Show loading while data hasn't loaded yet
+    if (tools === undefined && toolUuids.length > 0) {
         return (
             <div className="flex flex-wrap gap-1">
                 <Badge variant="outline" className="text-xs">