@axiom-lattice/react-sdk 2.1.76 → 2.1.78

package/dist/index.mjs

@@ -8779,7 +8779,7 @@ import { Typography as Typography43 } from "antd";
 import {
   CloudUploadOutlined,
   PaperClipOutlined,
-  ReloadOutlined as ReloadOutlined3,
+  ReloadOutlined as ReloadOutlined4,
   FileImageOutlined as FileImageOutlined5,
   FileTextOutlined as FileTextOutlined10,
   FilePdfOutlined as FilePdfOutlined5,
@@ -8794,7 +8794,7 @@ import {
 import {
   Attachments,
   Prompts as Prompts3,
-  Sender as Sender2,
+  Sender,
   Suggestion
 } from "@ant-design/x";
 
@@ -8982,7 +8982,7 @@ import {
   Space as Space30,
   Typography as Typography42
 } from "antd";
-import React51, { useCallback as useCallback34, useContext as useContext10, useEffect as useEffect46, useRef as useRef23, useState as useState66 } from "react";
+import React51, { useCallback as useCallback33, useContext as useContext10, useEffect as useEffect45, useRef as useRef23, useState as useState65 } from "react";
 import { BrainCircuit as BrainCircuit3 } from "lucide-react";
 
 // src/components/GenUI/HITLContainer.tsx
@@ -10043,14 +10043,14 @@ var ThreadManagementButtons = () => {
 import React43, {
   createContext as createContext8,
   useContext as useContext9,
-  useState as useState58,
-  useCallback as useCallback32,
-  useEffect as useEffect41
+  useState as useState57,
+  useCallback as useCallback31,
+  useEffect as useEffect40
 } from "react";
 import { WorkspaceClient, Client as Client2 } from "@axiom-lattice/client-sdk";
 
 // src/components/Chat/WorkspaceResourceManager.tsx
-import { useMemo as useMemo19, useEffect as useEffect40, useRef as useRef17, useState as useState57 } from "react";
+import { useMemo as useMemo20, useEffect as useEffect39, useRef as useRef17, useState as useState56 } from "react";
 import { FolderOpen as FolderOpen2, Activity as Activity3, Database as Database4, Plug as Plug2, Bot as Bot2, Wrench, Zap, LogOut as LogOut3, Building2 as Building23, Key, Share2, History, Inbox, FlaskConical as FlaskConical3 } from "lucide-react";
 import { Modal as Modal13, Avatar as Avatar8, Popover as Popover2, Button as Button41 } from "antd";
 
@@ -18089,7 +18089,7 @@ var ToolsList = ({
 };
 
 // src/components/Chat/TopologyAutomationView.tsx
-import { useEffect as useEffect36, useState as useState51, useCallback as useCallback30, useMemo as useMemo16 } from "react";
+import { useEffect as useEffect35, useState as useState50, useCallback as useCallback29, useMemo as useMemo17 } from "react";
 import {
   ReactFlow as ReactFlow3,
   Background as Background3,
@@ -18102,8 +18102,8 @@ import {
   ReactFlowProvider as ReactFlowProvider3
 } from "@xyflow/react";
 import "@xyflow/react/dist/style.css";
-import { Spin as Spin9, Empty as Empty5, Card as Card16, Typography as Typography29, Tag as Tag15, Avatar as Avatar7, Button as Button36, Modal as Modal11 } from "antd";
-import { PlusOutlined as PlusOutlined8, InfoCircleOutlined as InfoCircleOutlined5 } from "@ant-design/icons";
+import { Spin as Spin8, Empty as Empty5, Card as Card16, Typography as Typography29, Tag as Tag15, Avatar as Avatar7, Button as Button36, Modal as Modal11, Popconfirm as Popconfirm4 } from "antd";
+import { PlusOutlined as PlusOutlined8, InfoCircleOutlined as InfoCircleOutlined5, DeleteOutlined as DeleteOutlined3 } from "@ant-design/icons";
 
 // src/components/Chat/TopologyNode.tsx
 import { Handle as Handle3, Position as Position3 } from "@xyflow/react";
@@ -18220,143 +18220,11 @@ var TopologyNode = ({ data }) => {
 var TopologyNode_default = TopologyNode;
 
 // src/components/Chat/CopilotPanel.tsx
-import { useState as useState50, useEffect as useEffect34, useCallback as useCallback29, useRef as useRef16 } from "react";
-import { Sender } from "@ant-design/x";
-import { Button as Button35, Typography as Typography28, Spin as Spin8 } from "antd";
+import { useMemo as useMemo16 } from "react";
+import { Button as Button35, Typography as Typography28 } from "antd";
 import { CloseOutlined as CloseOutlined2 } from "@ant-design/icons";
 import { jsx as jsx73, jsxs as jsxs48 } from "react/jsx-runtime";
 var { Text: Text25 } = Typography28;
-var CopilotPanelChatBody = ({ workflowContext, initialMessage, onInitialMessageSent }) => {
-  const {
-    messages,
-    isLoading,
-    error: chatError,
-    sendMessage,
-    stopStreaming,
-    threadId
-  } = useAgentChat();
-  const [inputValue, setInputValue] = useState50("");
-  const contextSentRef = useRef16(false);
-  const initialMessageSentRef = useRef16(false);
-  const prevLoadingRef = useRef16(false);
-  const workflowId = workflowContext?.id;
-  const workflowName = workflowContext?.name;
-  useEffect34(() => {
-    contextSentRef.current = false;
-  }, [threadId]);
-  useEffect34(() => {
-    initialMessageSentRef.current = false;
-  }, [threadId]);
-  useEffect34(() => {
-    const wasLoading = prevLoadingRef.current;
-    prevLoadingRef.current = isLoading;
-    if (wasLoading && !isLoading && initialMessage && threadId && !initialMessageSentRef.current) {
-      initialMessageSentRef.current = true;
-      const message23 = initialMessage.trim();
-      if (message23) {
-        const formattedMessage = [
-          `Purpose: ${message23}`,
-          "",
-          `Configure the topology for workflow "${workflowId}" based on this purpose. Create sub-agents, set up the processing pipeline, and wire them together with topology edges.`,
-          `The current name is a placeholder \u2014 feel free to update it via update_processing_agent if you have a better one.`
-        ].join("\n");
-        sendMessage({
-          input: { message: formattedMessage },
-          streaming: true
-        });
-        onInitialMessageSent?.();
-      }
-    }
-  }, [isLoading, initialMessage, threadId, sendMessage, onInitialMessageSent, workflowId, workflowName]);
-  const handleSubmit = useCallback29(
-    (nextContent) => {
-      if (!nextContent.trim()) return;
-      let finalContent = nextContent;
-      if (workflowId && workflowName && !contextSentRef.current) {
-        finalContent = `[Context: You're viewing workflow "${workflowName}" (agent: ${workflowId})]
-User: ${nextContent}`;
-        contextSentRef.current = true;
-      }
-      sendMessage({
-        input: { message: finalContent },
-        streaming: true
-      });
-      setInputValue("");
-    },
-    [workflowId, workflowName, sendMessage]
-  );
-  const isEmpty = messages.length === 0 && !isLoading;
-  const showContentLoading = isLoading && messages.length === 0;
-  const hasContent = !isEmpty;
-  return /* @__PURE__ */ jsxs48(
-    "div",
-    {
-      style: {
-        flex: 1,
-        minHeight: 0,
-        display: "flex",
-        flexDirection: "column",
-        padding: 0
-      },
-      children: [
-        isEmpty && /* @__PURE__ */ jsxs48(
-          "div",
-          {
-            style: {
-              display: "flex",
-              flexDirection: "column",
-              justifyContent: "center",
-              alignItems: "center",
-              height: "100%",
-              textAlign: "center",
-              gap: 4
-            },
-            children: [
-              /* @__PURE__ */ jsx73(Text25, { strong: true, children: "Workflow Builder" }),
-              /* @__PURE__ */ jsx73(Text25, { type: "secondary", children: "Ask me to design, review, or modify your workflows" })
-            ]
-          }
-        ),
-        showContentLoading && /* @__PURE__ */ jsx73(
-          "div",
-          {
-            style: {
-              display: "flex",
-              justifyContent: "center",
-              alignItems: "center",
-              height: "100%"
-            },
-            children: /* @__PURE__ */ jsx73(Spin8, {})
-          }
-        ),
-        hasContent && /* @__PURE__ */ jsx73("div", { style: { flex: 1, minHeight: 0, display: "flex" }, children: /* @__PURE__ */ jsx73(MessageList, { messages }) }),
-        chatError && /* @__PURE__ */ jsx73("div", { style: { padding: "8px 8px" }, children: /* @__PURE__ */ jsx73(Text25, { type: "danger", children: chatError.message }) }),
-        /* @__PURE__ */ jsx73(
-          "div",
-          {
-            style: {
-              padding: "12px 8px",
-              borderTop: "1px solid #f0f0f0",
-              flexShrink: 0
-            },
-            children: /* @__PURE__ */ jsx73(
-              Sender,
-              {
-                value: inputValue,
-                placeholder: "Ask about workflows...",
-                onChange: setInputValue,
-                onSubmit: handleSubmit,
-                loading: isLoading,
-                onCancel: () => stopStreaming(),
-                allowSpeech: false
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
-};
 var CopilotPanel = ({
   workflowContext,
   onClose,
@@ -18366,6 +18234,21 @@ var CopilotPanel = ({
 }) => {
   const client = useClient("agent-architect");
   const threadId = workflowContext?.id ? `${client.tenantId}:${workflowContext.id}` : null;
+  const systemContext = useMemo16(() => {
+    if (workflowContext?.id && workflowContext?.name) {
+      return `[Context: You're viewing workflow "${workflowContext.name}" (agent: ${workflowContext.id})]`;
+    }
+    return void 0;
+  }, [workflowContext]);
+  const initialMessageContent = useMemo16(() => {
+    if (!initialMessage || !workflowContext?.id) return void 0;
+    return [
+      `Purpose: ${initialMessage.trim()}`,
+      "",
+      `Configure the topology for workflow "${workflowContext.id}" based on this purpose. Create sub-agents, set up the processing pipeline, and wire them together with topology edges.`,
+      `The current name is a placeholder \u2014 feel free to update it via update_processing_agent if you have a better one.`
+    ].join("\n");
+  }, [initialMessage, workflowContext?.id]);
   return /* @__PURE__ */ jsxs48(
     "div",
     {
@@ -18417,10 +18300,16 @@ var CopilotPanel = ({
             options: { streaming: true },
             onToolCompleted,
             children: /* @__PURE__ */ jsx73(
-              CopilotPanelChatBody,
+              Chating,
               {
-                workflowContext,
-                initialMessage,
+                showHeader: false,
+                showEmptyState: false,
+                showDatabaseSlot: false,
+                showSkillSlot: false,
+                showAgentSlot: false,
+                showMetricsDataSourceSlot: false,
+                systemContext,
+                initialMessage: initialMessageContent,
                 onInitialMessageSent
               }
             )
@@ -18452,7 +18341,7 @@ var CopilotPanel = ({
 };
 
 // src/components/Chat/CreateWorkflowModal.tsx
-import { useEffect as useEffect35 } from "react";
+import { useEffect as useEffect34 } from "react";
 import { Modal as Modal10, Form as Form7, Input as Input13 } from "antd";
 import { jsx as jsx74 } from "react/jsx-runtime";
 function extractName(purpose) {
@@ -18477,7 +18366,7 @@ var CreateWorkflowModal = ({
 }) => {
   const { post } = useApi();
   const [form] = Form7.useForm();
-  useEffect35(() => {
+  useEffect34(() => {
     if (open) {
       form.resetFields();
     }
@@ -18661,14 +18550,15 @@ function TopologyFlowInner({
   selectedWorkflowId,
   onSelectWorkflow,
   onCreateWorkflow,
+  onDeleteWorkflow,
   nodes: initialNodes,
   edges: initialEdges
 }) {
   const [nodes, setNodes, onNodesChange] = useNodesState3(initialNodes);
   const [edges, setEdges, onEdgesChange] = useEdgesState3(initialEdges);
-  const [specModalOpen, setSpecModalOpen] = useState51(false);
-  const nodeTypes2 = useMemo16(() => ({ topologyNode: TopologyNode_default }), []);
-  useEffect36(() => {
+  const [specModalOpen, setSpecModalOpen] = useState50(false);
+  const nodeTypes2 = useMemo17(() => ({ topologyNode: TopologyNode_default }), []);
+  useEffect35(() => {
     setNodes(initialNodes);
     setEdges(initialEdges);
   }, [initialNodes, initialEdges, setNodes, setEdges]);
@@ -18792,7 +18682,8 @@ function TopologyFlowInner({
             display: "flex",
             alignItems: "center",
             gap: 6,
-            padding: "6px 14px",
+            height: 32,
+            padding: "0 14px",
             background: "rgba(255,255,255,0.95)",
             borderRadius: 10,
             boxShadow: "0 2px 12px rgba(0,0,0,0.08)",
@@ -18810,6 +18701,42 @@ function TopologyFlowInner({
           ]
         }
       ),
+      /* @__PURE__ */ jsx75(
+        "div",
+        {
+          style: {
+            position: "absolute",
+            top: 12,
+            right: 12,
+            zIndex: 10,
+            display: "flex",
+            alignItems: "center",
+            height: 32,
+            padding: "0 14px",
+            background: "rgba(255,255,255,0.95)",
+            borderRadius: 10,
+            boxShadow: "0 2px 12px rgba(0,0,0,0.08)",
+            border: "1px solid #f0f0f0"
+          },
+          children: /* @__PURE__ */ jsx75(
+            Popconfirm4,
+            {
+              title: "Delete workflow",
+              description: "This will delete the workflow and all associated topology. This action cannot be undone.",
+              onConfirm: () => onDeleteWorkflow(selectedAgent.id),
+              okText: "Delete",
+              cancelText: "Cancel",
+              okButtonProps: { danger: true },
+              children: /* @__PURE__ */ jsx75(
+                DeleteOutlined3,
+                {
+                  style: { color: "#ff4d4f", cursor: "pointer", fontSize: 15 }
+                }
+              )
+            }
+          )
+        }
+      ),
       /* @__PURE__ */ jsx75(
         Modal11,
         {
@@ -18838,16 +18765,16 @@ function TopologyFlowInner({
   ] });
 }
 var TopologyAutomationView = () => {
-  const { get } = useApi();
-  const [agents, setAgents] = useState51([]);
-  const [agentNameMap, setAgentNameMap] = useState51(/* @__PURE__ */ new Map());
-  const [selectedWorkflowId, setSelectedWorkflowId] = useState51(null);
-  const [copilotOpen, setCopilotOpen] = useState51(true);
-  const [initialLoading, setInitialLoading] = useState51(true);
-  const [error, setError] = useState51(null);
-  const [isCreateModalOpen, setIsCreateModalOpen] = useState51(false);
-  const [initialMessage, setInitialMessage] = useState51(null);
-  const workflowTools = useMemo16(
+  const { get, del } = useApi();
+  const [agents, setAgents] = useState50([]);
+  const [agentNameMap, setAgentNameMap] = useState50(/* @__PURE__ */ new Map());
+  const [selectedWorkflowId, setSelectedWorkflowId] = useState50(null);
+  const [copilotOpen, setCopilotOpen] = useState50(true);
+  const [initialLoading, setInitialLoading] = useState50(true);
+  const [error, setError] = useState50(null);
+  const [isCreateModalOpen, setIsCreateModalOpen] = useState50(false);
+  const [initialMessage, setInitialMessage] = useState50(null);
+  const workflowTools = useMemo17(
     () => [
       "create_agent",
       "create_processing_agent",
@@ -18857,7 +18784,7 @@ var TopologyAutomationView = () => {
     ],
     []
   );
-  const fetchData = useCallback30(async () => {
+  const fetchData = useCallback29(async () => {
     const [wfRes, assistantsRes] = await Promise.all([
       get("/api/workflows/definitions"),
       get("/api/assistants")
@@ -18881,7 +18808,7 @@ var TopologyAutomationView = () => {
     }
     setError(null);
   }, [get]);
-  useEffect36(() => {
+  useEffect35(() => {
     let cancelled = false;
     const load = async () => {
       try {
@@ -18900,7 +18827,7 @@ var TopologyAutomationView = () => {
       cancelled = true;
     };
   }, [fetchData]);
-  const handleWorkflowCreated = useCallback30((id, purpose) => {
+  const handleWorkflowCreated = useCallback29((id, purpose) => {
     setIsCreateModalOpen(false);
     fetchData().then(() => {
       setSelectedWorkflowId(id);
@@ -18909,27 +18836,37 @@ var TopologyAutomationView = () => {
       }
     });
   }, [fetchData]);
-  const handleSelectWorkflow = useCallback30((id) => {
+  const handleSelectWorkflow = useCallback29((id) => {
     setSelectedWorkflowId(id);
   }, []);
-  const selectedAgent = useMemo16(
+  const handleDeleteWorkflow = useCallback29(async (id) => {
+    try {
+      await del(`/api/assistants/${id}`);
+      setSelectedWorkflowId(null);
+      await fetchData();
+    } catch (err) {
+      const message23 = err instanceof Error ? err.message : "Failed to delete workflow";
+      setError(message23);
+    }
+  }, [del, fetchData]);
+  const selectedAgent = useMemo17(
     () => agents.find((a) => a.id === selectedWorkflowId) || null,
     [agents, selectedWorkflowId]
   );
-  const selectedWorkflowName = useMemo16(
+  const selectedWorkflowName = useMemo17(
     () => selectedAgent?.name || null,
     [selectedAgent]
   );
-  const workflowContext = useMemo16(
+  const workflowContext = useMemo17(
     () => selectedWorkflowId && selectedWorkflowName ? { id: selectedWorkflowId, name: selectedWorkflowName } : null,
     [selectedWorkflowId, selectedWorkflowName]
   );
-  const { nodes, edges } = useMemo16(
+  const { nodes, edges } = useMemo17(
     () => selectedAgent ? buildGraph([selectedAgent], agentNameMap) : { nodes: [], edges: [] },
     [selectedAgent, agentNameMap]
   );
   if (initialLoading) {
-    return /* @__PURE__ */ jsx75("div", { style: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%" }, children: /* @__PURE__ */ jsx75(Spin9, { size: "large", tip: "Loading workflows..." }) });
+    return /* @__PURE__ */ jsx75("div", { style: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%" }, children: /* @__PURE__ */ jsx75(Spin8, { size: "large", tip: "Loading workflows..." }) });
   }
   if (error) {
     return /* @__PURE__ */ jsx75(Empty5, { description: error });
@@ -18982,6 +18919,7 @@ var TopologyAutomationView = () => {
                 selectedWorkflowId,
                 onSelectWorkflow: handleSelectWorkflow,
                 onCreateWorkflow: () => setIsCreateModalOpen(true),
+                onDeleteWorkflow: handleDeleteWorkflow,
                 nodes,
                 edges
               }
@@ -19039,9 +18977,9 @@ var TopologyAutomationView = () => {
 };
 
 // src/components/Chat/TopologyRuntimeView.tsx
-import { useEffect as useEffect37, useState as useState52, useMemo as useMemo17, useCallback as useCallback31 } from "react";
+import { useEffect as useEffect36, useState as useState51, useMemo as useMemo18, useCallback as useCallback30, useRef as useRef16 } from "react";
 import {
-  Spin as Spin10,
+  Spin as Spin9,
   Empty as Empty6,
   List as List7,
   Tag as Tag16,
@@ -19050,13 +18988,18 @@ import {
   Card as Card17,
   Drawer as Drawer2,
   Badge as Badge5,
-  Progress as Progress3
+  Tooltip as Tooltip13,
+  Progress as Progress3,
+  Switch as Switch3,
+  Popconfirm as Popconfirm5
 } from "antd";
 import {
   CheckCircleOutlined as CheckCircleOutlined5,
   SyncOutlined as SyncOutlined2,
   CloseCircleOutlined as CloseCircleOutlined2,
-  ClockCircleOutlined as ClockCircleOutlined3
+  ClockCircleOutlined as ClockCircleOutlined3,
+  ReloadOutlined as ReloadOutlined2,
+  DeleteOutlined as DeleteOutlined4
 } from "@ant-design/icons";
 import {
   ReactFlow as ReactFlow4,
@@ -19179,7 +19122,7 @@ function StepNode({ data, selected }) {
 }
 var nodeTypes = { stepNode: StepNode };
 function useLayoutedElements(steps) {
-  return useMemo17(() => {
+  return useMemo18(() => {
     if (steps.length === 0) return [];
     const g = new dagre.graphlib.Graph();
     g.setGraph({ rankdir: "TB", nodesep: 40, ranksep: 40 });
@@ -19205,7 +19148,7 @@ function useLayoutedElements(steps) {
   }, [steps]);
 }
 function useEdgesFromSteps(steps) {
-  return useMemo17(() => {
+  return useMemo18(() => {
     const edges = [];
     for (let i = 0; i < steps.length - 1; i++) {
       const fromStep = steps[i];
@@ -19348,16 +19291,16 @@ function FlowCanvas({ steps }) {
   const initialEdges = useEdgesFromSteps(steps);
   const [nodes, setNodes, onNodesChange] = useNodesState4(initialNodes);
   const [edges, setEdges, onEdgesChange] = useEdgesState4(initialEdges);
-  const [selectedNodeId, setSelectedNodeId] = useState52(null);
-  const selectedStep = useMemo17(
+  const [selectedNodeId, setSelectedNodeId] = useState51(null);
+  const selectedStep = useMemo18(
     () => steps.find((s) => s.id === selectedNodeId) || null,
     [steps, selectedNodeId]
   );
-  useEffect37(() => {
+  useEffect36(() => {
     setNodes(initialNodes);
     setEdges(initialEdges);
   }, [initialNodes, initialEdges, setNodes, setEdges]);
-  useEffect37(() => {
+  useEffect36(() => {
     if (selectedNodeId) {
       setNodes(
         (nds) => nds.map((n) => ({
@@ -19367,13 +19310,13 @@ function FlowCanvas({ steps }) {
       );
     }
   }, [selectedNodeId, setNodes]);
-  const onNodeClick = useCallback31(
+  const onNodeClick = useCallback30(
     (_event, node) => {
       setSelectedNodeId(node.id);
     },
     []
   );
-  const onPaneClick = useCallback31(() => {
+  const onPaneClick = useCallback30(() => {
     setNodes(
       (nds) => nds.map((n) => ({
         ...n,
@@ -19550,26 +19493,69 @@ function RunSummaryBanner({ run, agentName }) {
     }
   );
 }
-var RunDetail = ({ run, agentName, open, onClose }) => {
+var RunDetail = ({ run, agentName, open, onClose, onRunUpdate, autoRefresh, onAutoRefreshChange }) => {
   const { get } = useApi();
-  const [steps, setSteps] = useState52([]);
-  const [loading, setLoading] = useState52(false);
-  useEffect37(() => {
+  const [steps, setSteps] = useState51([]);
+  const [loading, setLoading] = useState51(false);
+  const stepsPollTimeoutRef = useRef16(null);
+  const stepsPollSessionRef = useRef16(0);
+  const fetchSteps = useCallback30(async () => {
+    try {
+      const [stepsRes, runsRes] = await Promise.all([
+        get(
+          `/api/workflows/runs/${run.id}/steps`
+        ),
+        get(
+          "/api/workflows/runs"
+        )
+      ]);
+      if (stepsRes.success) setSteps(stepsRes.data?.records || []);
+      if (runsRes.success && runsRes.data?.records) {
+        const matched = runsRes.data.records.find((r) => r.id === run.id);
+        if (matched) onRunUpdate(matched);
+      }
+    } catch {
+    }
+  }, [get, run.id, onRunUpdate]);
+  useEffect36(() => {
     if (!open) return;
     setLoading(true);
-    get(
-      `/api/workflows/runs/${run.id}/steps`
-    ).then((res) => {
-      if (res.success) setSteps(res.data?.records || []);
-    }).catch(() => {
-    }).finally(() => setLoading(false));
-  }, [open, run.id, get]);
+    fetchSteps().finally(() => setLoading(false));
+  }, [open, run.id, fetchSteps]);
+  useEffect36(() => {
+    if (stepsPollTimeoutRef.current) {
+      clearTimeout(stepsPollTimeoutRef.current);
+      stepsPollTimeoutRef.current = null;
+    }
+    if (!open || run.status !== "running" || !autoRefresh) return;
+    const sessionId = Date.now();
+    stepsPollSessionRef.current = sessionId;
+    const poll = async () => {
+      if (stepsPollSessionRef.current !== sessionId) return;
+      await fetchSteps();
+      if (stepsPollSessionRef.current === sessionId) {
+        stepsPollTimeoutRef.current = setTimeout(poll, POLLING_INTERVAL);
+      }
+    };
+    poll();
+    return () => {
+      stepsPollSessionRef.current = 0;
+      if (stepsPollTimeoutRef.current) {
+        clearTimeout(stepsPollTimeoutRef.current);
+        stepsPollTimeoutRef.current = null;
+      }
+    };
+  }, [open, run.status, fetchSteps, autoRefresh]);
   return /* @__PURE__ */ jsxs50(
     Drawer2,
     {
       title: /* @__PURE__ */ jsxs50(Space23, { children: [
         /* @__PURE__ */ jsx76(Text27, { strong: true, children: "Pipeline Execution" }),
-        /* @__PURE__ */ jsx76(Tag16, { color: "purple", style: { fontSize: 11 }, children: "Flow View" })
+        /* @__PURE__ */ jsx76(Tag16, { color: "purple", style: { fontSize: 11 }, children: "Flow View" }),
+        /* @__PURE__ */ jsxs50(Space23, { size: 4, style: { marginLeft: 12 }, children: [
+          /* @__PURE__ */ jsx76(Text27, { type: "secondary", style: { fontSize: 11 }, children: "Auto-refresh" }),
+          /* @__PURE__ */ jsx76(Switch3, { size: "small", checked: autoRefresh, onChange: onAutoRefreshChange })
+        ] })
       ] }),
       placement: "right",
       width: "90%",
@@ -19578,7 +19564,7 @@ var RunDetail = ({ run, agentName, open, onClose }) => {
       styles: { body: { padding: "12px 0" } },
       children: [
         /* @__PURE__ */ jsx76("div", { style: { padding: "0 12px", marginBottom: 12 }, children: /* @__PURE__ */ jsx76(RunSummaryBanner, { run, agentName }) }),
-        loading ? /* @__PURE__ */ jsx76("div", { style: { display: "flex", justifyContent: "center", alignItems: "center", height: 300 }, children: /* @__PURE__ */ jsx76(Spin10, { size: "large" }) }) : steps.length === 0 ? /* @__PURE__ */ jsx76("div", { style: { padding: "0 12px" }, children: /* @__PURE__ */ jsx76(Text27, { type: "secondary", children: "No step records yet" }) }) : /* @__PURE__ */ jsx76("div", { style: { width: "100%", height: "calc(100vh - 200px)", position: "relative" }, children: /* @__PURE__ */ jsx76(ReactFlowProvider4, { children: /* @__PURE__ */ jsx76(FlowCanvas, { steps }) }) }),
+        loading ? /* @__PURE__ */ jsx76("div", { style: { display: "flex", justifyContent: "center", alignItems: "center", height: 300 }, children: /* @__PURE__ */ jsx76(Spin9, { size: "large" }) }) : steps.length === 0 ? /* @__PURE__ */ jsx76("div", { style: { padding: "0 12px" }, children: /* @__PURE__ */ jsx76(Text27, { type: "secondary", children: "No step records yet" }) }) : /* @__PURE__ */ jsx76("div", { style: { width: "100%", height: "calc(100vh - 200px)", position: "relative" }, children: /* @__PURE__ */ jsx76(ReactFlowProvider4, { children: /* @__PURE__ */ jsx76(FlowCanvas, { steps }) }) }),
         run.errorMessage && /* @__PURE__ */ jsx76("div", { style: { padding: "0 12px", marginTop: 12 }, children: /* @__PURE__ */ jsx76(
           "div",
           {
@@ -19595,16 +19581,64 @@ var RunDetail = ({ run, agentName, open, onClose }) => {
     }
   );
 };
+var POLLING_INTERVAL = 3e3;
 var TopologyRuntimeView = () => {
-  const { get } = useApi();
-  const [runs, setRuns] = useState52([]);
-  const [agentNames, setAgentNames] = useState52({});
-  const [loading, setLoading] = useState52(true);
-  const [error, setError] = useState52(null);
-  const [selectedRun, setSelectedRun] = useState52(null);
-  useEffect37(() => {
+  const { get, del } = useApi();
+  const [runs, setRuns] = useState51([]);
+  const [agentNames, setAgentNames] = useState51({});
+  const [loading, setLoading] = useState51(true);
+  const [error, setError] = useState51(null);
+  const [selectedRun, setSelectedRun] = useState51(null);
+  const [autoRefresh, setAutoRefresh] = useState51(true);
+  const pollingSessionRef = useRef16(0);
+  const handleRunUpdate = useCallback30((updated) => {
+    setRuns(
+      (prev) => prev.map((r) => r.id === updated.id ? updated : r)
+    );
+    setSelectedRun((prev) => prev?.id === updated.id ? updated : prev);
+  }, []);
+  const handleDeleteRun = useCallback30(async (runId) => {
+    try {
+      await del(`/api/workflows/runs/${runId}`);
+      setRuns((prev) => prev.filter((r) => r.id !== runId));
+      setSelectedRun((prev) => prev?.id === runId ? null : prev);
+    } catch (err) {
+      const message23 = err instanceof Error ? err.message : "Failed to delete run";
+      setError(message23);
+    }
+  }, [del]);
+  const refreshRuns = useCallback30(async () => {
+    setLoading(true);
+    try {
+      const defsRes = await get("/api/workflows/definitions");
+      const nameMap = {};
+      if (defsRes.success && defsRes.data?.records) {
+        defsRes.data.records.forEach((d) => {
+          nameMap[d.assistantId] = d.assistantName;
+        });
+      }
+      setAgentNames(nameMap);
+      const runsRes = await get("/api/workflows/runs");
+      if (runsRes.success && runsRes.data?.records) {
+        runsRes.data.records.sort(
+          (a, b) => new Date(b.startedAt).getTime() - new Date(a.startedAt).getTime()
+        );
+        setRuns(runsRes.data.records);
+        setSelectedRun((prev) => {
+          if (!prev) return null;
+          return runsRes.data.records.find((r) => r.id === prev.id) || prev;
+        });
+      }
+      setError(null);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to load workflow runs");
+    } finally {
+      setLoading(false);
+    }
+  }, [get]);
+  useEffect36(() => {
     let cancelled = false;
-    const fetchData = async () => {
+    const init2 = async () => {
       try {
         setLoading(true);
         const defsRes = await get("/api/workflows/definitions");
@@ -19633,13 +19667,18 @@ var TopologyRuntimeView = () => {
         if (!cancelled) setLoading(false);
       }
     };
-    fetchData();
+    init2();
     return () => {
       cancelled = true;
     };
   }, [get]);
+  useEffect36(() => {
+    return () => {
+      pollingSessionRef.current = 0;
+    };
+  }, []);
   if (loading) {
-    return /* @__PURE__ */ jsx76("div", { style: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%" }, children: /* @__PURE__ */ jsx76(Spin10, { size: "large" }) });
+    return /* @__PURE__ */ jsx76("div", { style: { display: "flex", justifyContent: "center", alignItems: "center", height: "100%" }, children: /* @__PURE__ */ jsx76(Spin9, { size: "large" }) });
   }
   if (error) {
     return /* @__PURE__ */ jsx76(Empty6, { description: error });
@@ -19648,7 +19687,16 @@ var TopologyRuntimeView = () => {
     return /* @__PURE__ */ jsx76(Empty6, { description: "No workflow runs yet. Execute a processing agent to see results here." });
   }
   return /* @__PURE__ */ jsxs50("div", { style: { padding: 16, overflow: "auto", height: "100%" }, children: [
-    /* @__PURE__ */ jsx76(Title5, { level: 5, style: { marginBottom: 16 }, children: "Workflow Runs" }),
+    /* @__PURE__ */ jsxs50("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 16 }, children: [
+      /* @__PURE__ */ jsx76(Title5, { level: 5, style: { marginBottom: 0 }, children: "Workflow Runs" }),
+      /* @__PURE__ */ jsx76(Tooltip13, { title: "Refresh now", children: /* @__PURE__ */ jsx76(
+        ReloadOutlined2,
+        {
+          style: { cursor: "pointer", color: "#999" },
+          onClick: () => refreshRuns()
+        }
+      ) })
+    ] }),
     /* @__PURE__ */ jsx76(
       List7,
       {
@@ -19689,7 +19737,25 @@ var TopologyRuntimeView = () => {
                     run.totalEdges
                   ] }),
                   /* @__PURE__ */ jsx76(Tag16, { color: sc.color, icon: sc.icon, children: sc.label }),
-                  /* @__PURE__ */ jsx76(Text27, { type: "secondary", style: { fontSize: 11 }, children: formatTime(run.startedAt) })
+                  /* @__PURE__ */ jsx76(Text27, { type: "secondary", style: { fontSize: 11 }, children: formatTime(run.startedAt) }),
+                  /* @__PURE__ */ jsx76(
+                    Popconfirm5,
+                    {
+                      title: "Delete run",
+                      description: "Delete this workflow run and all its step records?",
+                      onConfirm: () => handleDeleteRun(run.id),
+                      okText: "Delete",
+                      cancelText: "Cancel",
+                      okButtonProps: { danger: true },
+                      children: /* @__PURE__ */ jsx76(
+                        DeleteOutlined4,
+                        {
+                          style: { color: "#ff4d4f", cursor: "pointer", fontSize: 13 },
+                          onClick: (e) => e.stopPropagation()
+                        }
+                      )
+                    }
+                  )
                 ] })
               ] })
             },
@@ -19704,22 +19770,25 @@ var TopologyRuntimeView = () => {
         run: selectedRun,
         agentName: agentNames[selectedRun.assistantId] || selectedRun.assistantId,
         open: !!selectedRun,
-        onClose: () => setSelectedRun(null)
+        onClose: () => setSelectedRun(null),
+        onRunUpdate: handleRunUpdate,
+        autoRefresh,
+        onAutoRefreshChange: setAutoRefresh
       }
     )
   ] });
 };
 
 // src/components/Chat/TopologyInboxView.tsx
-import { useEffect as useEffect38, useState as useState53 } from "react";
-import { Card as Card18, Typography as Typography31, Spin as Spin11, Empty as Empty7, List as List8, Button as Button37, Space as Space24, Tag as Tag17 } from "antd";
-import { InboxOutlined, ReloadOutlined as ReloadOutlined2 } from "@ant-design/icons";
+import { useEffect as useEffect37, useState as useState52 } from "react";
+import { Card as Card18, Typography as Typography31, Spin as Spin10, Empty as Empty7, List as List8, Button as Button37, Space as Space24, Tag as Tag17 } from "antd";
+import { InboxOutlined, ReloadOutlined as ReloadOutlined3 } from "@ant-design/icons";
 import { jsx as jsx77, jsxs as jsxs51 } from "react/jsx-runtime";
 var { Text: Text28, Title: Title6 } = Typography31;
 var TopologyInboxView = () => {
   const { get } = useApi();
-  const [items, setItems] = useState53([]);
-  const [loading, setLoading] = useState53(true);
+  const [items, setItems] = useState52([]);
+  const [loading, setLoading] = useState52(true);
   const fetchInbox = async () => {
     setLoading(true);
     try {
@@ -19746,7 +19815,7 @@ var TopologyInboxView = () => {
       setLoading(false);
     }
   };
-  useEffect38(() => {
+  useEffect37(() => {
     fetchInbox();
   }, [get]);
   return /* @__PURE__ */ jsxs51("div", { style: { height: "100%", display: "flex", flexDirection: "column" }, children: [
@@ -19770,7 +19839,7 @@ var TopologyInboxView = () => {
           /* @__PURE__ */ jsx77(
             Button37,
             {
-              icon: /* @__PURE__ */ jsx77(ReloadOutlined2, {}),
+              icon: /* @__PURE__ */ jsx77(ReloadOutlined3, {}),
               onClick: fetchInbox,
               loading,
               size: "small",
@@ -19789,7 +19858,7 @@ var TopologyInboxView = () => {
           justifyContent: "center",
           height: 200
         },
-        children: /* @__PURE__ */ jsx77(Spin11, { size: "large" })
+        children: /* @__PURE__ */ jsx77(Spin10, { size: "large" })
       }
     ) : items.length === 0 ? /* @__PURE__ */ jsx77(Empty7, { description: "Inbox is empty" }) : /* @__PURE__ */ jsx77(
       List8,
@@ -19829,14 +19898,14 @@ var TopologyInboxView = () => {
 };
 
 // src/components/Eval/EvalPanel.tsx
-import React41, { useState as useState56, useMemo as useMemo18 } from "react";
+import React41, { useState as useState55, useMemo as useMemo19 } from "react";
 import { createStyles as createStyles22 } from "antd-style";
-import { Button as Button40, Card as Card22, Typography as Typography35, Row as Row3, Col as Col3, Tag as Tag20, theme as theme15, Dropdown as Dropdown2, Popconfirm as Popconfirm7, message as message14 } from "antd";
+import { Button as Button40, Card as Card22, Typography as Typography35, Row as Row3, Col as Col3, Tag as Tag20, theme as theme15, Dropdown as Dropdown2, Popconfirm as Popconfirm9, message as message14 } from "antd";
 import { Play as Play2, FlaskConical as FlaskConical2, TestTube2 as TestTube26, TrendingUp, CheckCircle as CheckCircle2, XCircle as XCircle2, ArrowRight as ArrowRight2, ChevronDown as ChevronDown3, Trash2 as Trash27, Clock } from "lucide-react";
 
 // src/components/Eval/EvalSuiteCardList.tsx
 import { createStyles as createStyles19 } from "antd-style";
-import { Card as Card19, Typography as Typography32, Row as Row2, Col as Col2, Empty as Empty8, Popconfirm as Popconfirm4, Spin as Spin12 } from "antd";
+import { Card as Card19, Typography as Typography32, Row as Row2, Col as Col2, Empty as Empty8, Popconfirm as Popconfirm6, Spin as Spin11 } from "antd";
 import { Trash2 as Trash24, TestTube2 as TestTube24 } from "lucide-react";
 import { jsx as jsx78, jsxs as jsxs52 } from "react/jsx-runtime";
 var { Text: Text29 } = Typography32;
@@ -19901,7 +19970,7 @@ var EvalSuiteCardList = ({ projectId, onSelectSuite }) => {
   const { styles } = useStyle9();
   const { suites, loading, remove } = useEvalSuites(projectId);
   if (loading) {
-    return /* @__PURE__ */ jsx78("div", { style: { display: "flex", justifyContent: "center", padding: 48 }, children: /* @__PURE__ */ jsx78(Spin12, {}) });
+    return /* @__PURE__ */ jsx78("div", { style: { display: "flex", justifyContent: "center", padding: 48 }, children: /* @__PURE__ */ jsx78(Spin11, {}) });
   }
   if (suites.length === 0) {
     return /* @__PURE__ */ jsx78(Empty8, { image: Empty8.PRESENTED_IMAGE_SIMPLE, description: /* @__PURE__ */ jsx78(Text29, { type: "secondary", children: "No test suites yet" }) });
@@ -19921,7 +19990,7 @@ var EvalSuiteCardList = ({ projectId, onSelectSuite }) => {
             /* @__PURE__ */ jsx78("div", { className: styles.subtitle, children: "Server-side agent testing" })
           ] }),
           /* @__PURE__ */ jsx78(
-            Popconfirm4,
+            Popconfirm6,
             {
               title: "Delete this suite?",
               onConfirm: (e) => {
@@ -19946,9 +20015,9 @@ var EvalSuiteCardList = ({ projectId, onSelectSuite }) => {
 };
 
 // src/components/Eval/EvalSuiteDetail.tsx
-import { useState as useState54 } from "react";
+import { useState as useState53 } from "react";
 import { createStyles as createStyles20 } from "antd-style";
-import { Button as Button38, Card as Card20, Typography as Typography33, Modal as Modal12, Form as Form8, Input as Input14, Select as Select6, Table as Table3, Popconfirm as Popconfirm5, Empty as Empty9 } from "antd";
+import { Button as Button38, Card as Card20, Typography as Typography33, Modal as Modal12, Form as Form8, Input as Input14, Select as Select6, Table as Table3, Popconfirm as Popconfirm7, Empty as Empty9 } from "antd";
 import { Play, Plus as Plus6, Trash2 as Trash25, Bot, MessageSquare, FlaskConical } from "lucide-react";
 import { jsx as jsx79, jsxs as jsxs53 } from "react/jsx-runtime";
 var { Text: Text30 } = Typography33;
@@ -20050,9 +20119,9 @@ var EvalSuiteDetail = ({ projectId, suiteId, onBack, onRun }) => {
   const { suites } = useEvalSuites(projectId);
   const { cases, create: createCase, remove: removeCase } = useEvalCases(projectId, suiteId);
   const { start } = useEvalRuns(projectId);
-  const [modalOpen, setModalOpen] = useState54(false);
+  const [modalOpen, setModalOpen] = useState53(false);
   const [form] = Form8.useForm();
-  const [agents, setAgents] = useState54([]);
+  const [agents, setAgents] = useState53([]);
   const suite = suites.find((s) => s.id === suiteId) || {};
   const loadAgents = async () => {
     try {
@@ -20108,7 +20177,7 @@ var EvalSuiteDetail = ({ projectId, suiteId, onBack, onRun }) => {
       title: "",
       key: "actions",
       width: 40,
-      render: (_, c) => /* @__PURE__ */ jsx79(Popconfirm5, { title: "Delete?", onConfirm: () => removeCase(projectId, suiteId, c.id), children: /* @__PURE__ */ jsx79(Button38, { type: "text", danger: true, size: "small", icon: /* @__PURE__ */ jsx79(Trash25, { size: 14 }) }) })
+      render: (_, c) => /* @__PURE__ */ jsx79(Popconfirm7, { title: "Delete?", onConfirm: () => removeCase(projectId, suiteId, c.id), children: /* @__PURE__ */ jsx79(Button38, { type: "text", danger: true, size: "small", icon: /* @__PURE__ */ jsx79(Trash25, { size: 14 }) }) })
     }
   ];
   return /* @__PURE__ */ jsxs53("div", { className: styles.shell, children: [
@@ -20185,9 +20254,9 @@ var EvalSuiteDetail = ({ projectId, suiteId, onBack, onRun }) => {
 };
 
 // src/components/Eval/EvalRunResults.tsx
-import { useEffect as useEffect39, useState as useState55 } from "react";
+import { useEffect as useEffect38, useState as useState54 } from "react";
 import { createStyles as createStyles21 } from "antd-style";
-import { Button as Button39, Card as Card21, Typography as Typography34, Progress as Progress4, Tag as Tag19, Table as Table4, Empty as Empty10, Popconfirm as Popconfirm6, message as message13 } from "antd";
+import { Button as Button39, Card as Card21, Typography as Typography34, Progress as Progress4, Tag as Tag19, Table as Table4, Empty as Empty10, Popconfirm as Popconfirm8, message as message13 } from "antd";
 import { CheckCircle, XCircle, Trash2 as Trash26 } from "lucide-react";
 import { jsx as jsx80, jsxs as jsxs54 } from "react/jsx-runtime";
 var { Text: Text31 } = Typography34;
@@ -20274,9 +20343,9 @@ var useStyle11 = createStyles21(({ token, css }) => ({
 var EvalRunResults = ({ runId, onBack }) => {
   const { styles } = useStyle11();
   const client = useClient("__GLOBAL__");
-  const [run, setRun] = useState55(null);
+  const [run, setRun] = useState54(null);
   const { status: streamingStatus, progress, connected } = useEvalRunStream(runId);
-  useEffect39(() => {
+  useEffect38(() => {
     client.eval.runs.get(runId).then(setRun).catch(console.error);
   }, [runId, client]);
   if (!run) {
@@ -20296,7 +20365,7 @@ var EvalRunResults = ({ runId, onBack }) => {
         /* @__PURE__ */ jsx80(Tag19, { color: run.status === "completed" ? "success" : run.status === "running" ? "processing" : run.status === "failed" ? "error" : "warning", children: run.status })
       ] }),
       /* @__PURE__ */ jsx80(
-        Popconfirm6,
+        Popconfirm8,
         {
           title: "Delete this run?",
           description: "Run results will be permanently deleted.",
@@ -20627,10 +20696,10 @@ var EvalPanel = () => {
   const { styles, cx } = useStyle12();
   const { token } = theme15.useToken();
   const { projects } = useEvalProjects();
-  const [projectId, setProjectId] = useState56("");
-  const [page, setPage] = useState56("dashboard");
-  const [suiteId, setSuiteId] = useState56("");
-  const [runId, setRunId] = useState56("");
+  const [projectId, setProjectId] = useState55("");
+  const [page, setPage] = useState55("dashboard");
+  const [suiteId, setSuiteId] = useState55("");
+  const [runId, setRunId] = useState55("");
   React41.useEffect(() => {
     if (!projectId && projects.length > 0) {
       setProjectId(projects[0].id);
@@ -20638,7 +20707,7 @@ var EvalPanel = () => {
   }, [projects, projectId]);
   const { suites } = useEvalSuites(projectId);
   const { runs, start, remove } = useEvalRuns(projectId);
-  const stats = useMemo18(() => {
+  const stats = useMemo19(() => {
     const totalCases = suites.reduce((s, x) => s + (x.caseCount ?? 0), 0);
     const latest = runs[0];
     const passRate = latest?.totalCases > 0 ? Math.round(latest.passedCases / latest.totalCases * 100) : null;
@@ -20786,7 +20855,7 @@ var EvalPanel = () => {
                 /* @__PURE__ */ jsx81(Tag20, { color: meta.color, style: { margin: 0 }, children: meta.label }),
                 /* @__PURE__ */ jsx81(Text32, { strong: true, style: { fontSize: 15, minWidth: 40, textAlign: "right" }, children: typeof r.avgScore === "number" ? r.avgScore.toFixed(1) : "\u2014" }),
                 /* @__PURE__ */ jsx81(
-                  Popconfirm7,
+                  Popconfirm9,
                   {
                     title: "Delete this run?",
                     description: "Run results will be permanently deleted.",
@@ -20818,8 +20887,8 @@ var EvalPanel = () => {
     ] });
   }
   const SuiteListPage = () => {
-    const [showAdd, setShowAdd] = useState56(false);
-    const [name, setName] = useState56("");
+    const [showAdd, setShowAdd] = useState55(false);
+    const [name, setName] = useState55("");
     const { create } = useEvalSuites(projectId);
     const handleAdd = async () => {
       if (!name.trim()) return;
@@ -21003,7 +21072,7 @@ var WorkspaceResourceManager = ({
   const { openContentApp, menuCollapsed, setMenuCollapsed } = useChatUIContext();
   const hasOpenedDefault = useRef17(false);
   const hasRegistered = useRef17(false);
-  useEffect40(() => {
+  useEffect39(() => {
     if (!hasRegistered.current) {
       hasRegistered.current = true;
       regsiterElement("workspace_projects", {
@@ -21062,9 +21131,9 @@ var WorkspaceResourceManager = ({
   const { user, logout, tenants, currentTenant, selectTenant, isLoading } = useAuth();
   const { setWorkspace, setProject } = useWorkspaceContext();
   const { config } = useLatticeChatShellContext();
-  const [tenantModalOpen, setTenantModalOpen] = useState57(false);
-  const [changePasswordOpen, setChangePasswordOpen] = useState57(false);
-  const menuItems = useMemo19(() => {
+  const [tenantModalOpen, setTenantModalOpen] = useState56(false);
+  const [changePasswordOpen, setChangePasswordOpen] = useState56(false);
+  const menuItems = useMemo20(() => {
     const items = config.workspaceMenuItems?.length ? [...config.workspaceMenuItems] : [...DEFAULT_WORKSPACE_MENU_ITEMS];
     return items.sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
   }, [config.workspaceMenuItems]);
@@ -21095,7 +21164,7 @@ var WorkspaceResourceManager = ({
       });
     }
   };
-  useEffect40(() => {
+  useEffect39(() => {
     if (!hasOpenedDefault.current && menuItems.length > 0) {
       hasOpenedDefault.current = true;
       const firstRoute = menuItems.find((item) => item.type === "route");
@@ -21311,8 +21380,8 @@ var WorkspaceContextProvider = ({
     }
     return null;
   };
-  const [workspaceId, setWorkspaceId] = useState58(getInitialWorkspaceId);
-  const [projectId, setProjectId] = useState58(getInitialProjectId);
+  const [workspaceId, setWorkspaceId] = useState57(getInitialWorkspaceId);
+  const [projectId, setProjectId] = useState57(getInitialProjectId);
   React43.useEffect(() => {
     const wsId = getInitialWorkspaceId();
     const pjId = getInitialProjectId();
@@ -21320,13 +21389,13 @@ var WorkspaceContextProvider = ({
       Client2.setWorkspaceContext(wsId || void 0, pjId || void 0);
     }
   }, []);
-  useEffect41(() => {
+  useEffect40(() => {
     Client2.setWorkspaceContext(workspaceId || void 0, projectId || void 0);
   }, [workspaceId, projectId]);
-  const [workspaces, setWorkspaces] = useState58([]);
-  const [projects, setProjects] = useState58([]);
-  const [loading, setLoading] = useState58(false);
-  const [error, setError] = useState58(null);
+  const [workspaces, setWorkspaces] = useState57([]);
+  const [projects, setProjects] = useState57([]);
+  const [loading, setLoading] = useState57(false);
+  const [error, setError] = useState57(null);
   const client = React43.useMemo(() => {
     const authApiKey = isAuthenticated ? sessionStorage.getItem("lattice_token") || config.apiKey || "" : config.apiKey || "";
     return new WorkspaceClient({
@@ -21336,22 +21405,22 @@ var WorkspaceContextProvider = ({
       transport: "sse"
     }, tenantId);
   }, [config.baseURL, config.apiKey, tenantId, isAuthenticated]);
-  const resetSelectedWorkspace = useCallback32(() => {
+  const resetSelectedWorkspace = useCallback31(() => {
     setProjects([]);
     setWorkspaceId(null);
     sessionStorage.removeItem("workspaceId");
     setProjectId(null);
     sessionStorage.removeItem("projectId");
   }, [setProjects, setWorkspaceId, setProjectId]);
-  const resetWS = useCallback32(() => {
+  const resetWS = useCallback31(() => {
     setWorkspaces([]);
     resetSelectedWorkspace();
   }, [resetSelectedWorkspace, setWorkspaces]);
-  useEffect41(() => {
+  useEffect40(() => {
     resetWS();
     refreshWorkspaces();
   }, [tenantId]);
-  const refreshWorkspaces = useCallback32(async () => {
+  const refreshWorkspaces = useCallback31(async () => {
     setLoading(true);
     setError(null);
     try {
@@ -21363,7 +21432,7 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client]);
-  const refreshProjects = useCallback32(async (wsId) => {
+  const refreshProjects = useCallback31(async (wsId) => {
     const targetWorkspaceId = wsId || workspaceId;
     if (!targetWorkspaceId) {
       setProjects([]);
@@ -21380,28 +21449,28 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client, workspaceId]);
-  useEffect41(() => {
+  useEffect40(() => {
     if (workspaceId && typeof window !== "undefined") {
       sessionStorage.setItem("workspaceId", workspaceId);
     }
   }, [workspaceId]);
-  useEffect41(() => {
+  useEffect40(() => {
     if (projectId && typeof window !== "undefined") {
       sessionStorage.setItem("projectId", projectId);
     }
   }, [projectId]);
-  useEffect41(() => {
+  useEffect40(() => {
     refreshWorkspaces().catch((err) => {
       console.warn("Failed to load workspaces:", err);
     });
   }, [refreshWorkspaces]);
-  useEffect41(() => {
+  useEffect40(() => {
     if (workspaces.length > 0 && !workspaceId) {
       const firstWorkspace = workspaces[0];
       setWorkspaceId(firstWorkspace.id);
     }
   }, [workspaces, workspaceId]);
-  useEffect41(() => {
+  useEffect40(() => {
     if (workspaceId) {
       refreshProjects(workspaceId);
     } else {
@@ -21409,7 +21478,7 @@ var WorkspaceContextProvider = ({
     }
     setProjectId(null);
   }, [workspaceId, refreshProjects]);
-  const createWorkspace = useCallback32(async (data) => {
+  const createWorkspace = useCallback31(async (data) => {
     setLoading(true);
     setError(null);
     try {
@@ -21424,7 +21493,7 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client, refreshWorkspaces]);
-  const updateWorkspace = useCallback32(async (id, updates) => {
+  const updateWorkspace = useCallback31(async (id, updates) => {
     setLoading(true);
     setError(null);
     try {
@@ -21439,7 +21508,7 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client, refreshWorkspaces]);
-  const deleteWorkspace = useCallback32(async (id) => {
+  const deleteWorkspace = useCallback31(async (id) => {
     setLoading(true);
     setError(null);
     try {
@@ -21456,7 +21525,7 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client, workspaceId, refreshWorkspaces]);
-  const createProject = useCallback32(async (wsId, data) => {
+  const createProject = useCallback31(async (wsId, data) => {
     setLoading(true);
     setError(null);
     try {
@@ -21471,7 +21540,7 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client, refreshProjects]);
-  const updateProject = useCallback32(async (wsId, id, updates) => {
+  const updateProject = useCallback31(async (wsId, id, updates) => {
     setLoading(true);
     setError(null);
     try {
@@ -21486,7 +21555,7 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client, refreshProjects]);
-  const deleteProject = useCallback32(async (wsId, id) => {
+  const deleteProject = useCallback31(async (wsId, id) => {
     setLoading(true);
     setError(null);
     try {
@@ -21503,7 +21572,7 @@ var WorkspaceContextProvider = ({
       setLoading(false);
     }
   }, [client, projectId, refreshProjects]);
-  const listPath = useCallback32(
+  const listPath = useCallback31(
     async (path = "/", assistantId) => {
       if (!workspaceId || !projectId) {
         return [];
@@ -21522,7 +21591,7 @@ var WorkspaceContextProvider = ({
     },
     [client, workspaceId, projectId]
   );
-  const listPathByFolder = useCallback32(
+  const listPathByFolder = useCallback31(
     async (folder, assistantId) => {
       let normalizedPath = folder;
       if (normalizedPath.startsWith("~/")) {
@@ -21535,7 +21604,7 @@ var WorkspaceContextProvider = ({
     },
     [listPath]
   );
-  const uploadFile = useCallback32(
+  const uploadFile = useCallback31(
     async (path, file, assistantId) => {
       if (!workspaceId || !projectId) {
         throw new Error("Workspace and project must be selected before uploading files");
@@ -21555,7 +21624,7 @@ var WorkspaceContextProvider = ({
     },
     [client, workspaceId, projectId]
   );
-  const uploadFileToFolder = useCallback32(
+  const uploadFileToFolder = useCallback31(
     async (folder, file, assistantId) => {
       let normalizedFolder = folder;
       if (normalizedFolder.startsWith("~/")) {
@@ -21565,7 +21634,7 @@ var WorkspaceContextProvider = ({
     },
     [uploadFile]
   );
-  const getFileViewUrl = useCallback32(
+  const getFileViewUrl = useCallback31(
     (filePath, assistantId) => {
       if (!workspaceId || !projectId) {
         return "";
@@ -21617,15 +21686,15 @@ var WorkspaceContextProvider = ({
 };
 
 // src/components/Chat/DatabasePicker.tsx
-import { useRef as useRef18, useState as useState59 } from "react";
-import { Modal as Modal14, List as List9, Checkbox as Checkbox5, Spin as Spin13, Empty as Empty11, Typography as Typography36, Button as Button42, Space as Space25, Tooltip as Tooltip14 } from "antd";
+import { useRef as useRef18, useState as useState58 } from "react";
+import { Modal as Modal14, List as List9, Checkbox as Checkbox5, Spin as Spin12, Empty as Empty11, Typography as Typography36, Button as Button42, Space as Space25, Tooltip as Tooltip14 } from "antd";
 import { Database as Database5 } from "lucide-react";
 import { Fragment as Fragment14, jsx as jsx84, jsxs as jsxs57 } from "react/jsx-runtime";
 var DatabasePicker = ({ senderRef, iconOnly }) => {
-  const [modalOpen, setModalOpen] = useState59(false);
-  const [databases, setDatabases] = useState59([]);
-  const [loading, setLoading] = useState59(false);
-  const [selectedDatabases, setSelectedDatabases] = useState59([]);
+  const [modalOpen, setModalOpen] = useState58(false);
+  const [databases, setDatabases] = useState58([]);
+  const [loading, setLoading] = useState58(false);
+  const [selectedDatabases, setSelectedDatabases] = useState58([]);
   const { get } = useApi();
   const fetchedRef = useRef18(false);
   const loadDatabases = async () => {
@@ -21707,7 +21776,7 @@ var DatabasePicker = ({ senderRef, iconOnly }) => {
         width: 600,
         okText: "Confirm",
         cancelText: "Cancel",
-        children: loading ? /* @__PURE__ */ jsx84("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx84(Spin13, { size: "large" }) }) : databases.length === 0 ? /* @__PURE__ */ jsx84(
+        children: loading ? /* @__PURE__ */ jsx84("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx84(Spin12, { size: "large" }) }) : databases.length === 0 ? /* @__PURE__ */ jsx84(
           Empty11,
           {
             description: "No databases available",
@@ -21767,15 +21836,15 @@ var DatabasePicker = ({ senderRef, iconOnly }) => {
 };
 
 // src/components/Chat/SkillPicker.tsx
-import { useRef as useRef19, useState as useState60 } from "react";
-import { Modal as Modal15, List as List10, Checkbox as Checkbox6, Spin as Spin14, Empty as Empty12, Typography as Typography37, Button as Button43, Space as Space26, Tooltip as Tooltip15 } from "antd";
+import { useRef as useRef19, useState as useState59 } from "react";
+import { Modal as Modal15, List as List10, Checkbox as Checkbox6, Spin as Spin13, Empty as Empty12, Typography as Typography37, Button as Button43, Space as Space26, Tooltip as Tooltip15 } from "antd";
 import { BrainCircuit } from "lucide-react";
 import { Fragment as Fragment15, jsx as jsx85, jsxs as jsxs58 } from "react/jsx-runtime";
 var SkillPicker = ({ senderRef, iconOnly }) => {
-  const [modalOpen, setModalOpen] = useState60(false);
-  const [skills, setSkills] = useState60([]);
-  const [loading, setLoading] = useState60(false);
-  const [selectedSkills, setSelectedSkills] = useState60([]);
+  const [modalOpen, setModalOpen] = useState59(false);
+  const [skills, setSkills] = useState59([]);
+  const [loading, setLoading] = useState59(false);
+  const [selectedSkills, setSelectedSkills] = useState59([]);
   const { get } = useApi();
   const fetchedRef = useRef19(false);
   const loadSkills = async () => {
@@ -21857,7 +21926,7 @@ var SkillPicker = ({ senderRef, iconOnly }) => {
         width: 600,
         okText: "Confirm",
         cancelText: "Cancel",
-        children: loading ? /* @__PURE__ */ jsx85("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx85(Spin14, { size: "large" }) }) : skills.length === 0 ? /* @__PURE__ */ jsx85(
+        children: loading ? /* @__PURE__ */ jsx85("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx85(Spin13, { size: "large" }) }) : skills.length === 0 ? /* @__PURE__ */ jsx85(
           Empty12,
           {
             description: "No skills available",
@@ -21917,14 +21986,14 @@ var SkillPicker = ({ senderRef, iconOnly }) => {
 };
 
 // src/components/Chat/AgentPicker.tsx
-import { useRef as useRef20, useState as useState61 } from "react";
+import { useRef as useRef20, useState as useState60 } from "react";
 import { Modal as Modal16, List as List11, Empty as Empty13, Typography as Typography38, Button as Button44, Tooltip as Tooltip16 } from "antd";
 import { Bot as Bot3 } from "lucide-react";
 import { Fragment as Fragment16, jsx as jsx86, jsxs as jsxs59 } from "react/jsx-runtime";
 var AgentPicker = ({ senderRef, iconOnly }) => {
-  const [modalOpen, setModalOpen] = useState61(false);
-  const [loading, setLoading] = useState61(false);
-  const [selectedAgent, setSelectedAgent] = useState61(null);
+  const [modalOpen, setModalOpen] = useState60(false);
+  const [loading, setLoading] = useState60(false);
+  const [selectedAgent, setSelectedAgent] = useState60(null);
   const { assistants, currentAssistant, selectAssistant } = useAssistantContext();
   const fetchedRef = useRef20(false);
   const handleOpenModal = () => {
@@ -22033,8 +22102,8 @@ var AgentPicker = ({ senderRef, iconOnly }) => {
 };
 
 // src/components/Chat/MetricsDataSourcePicker.tsx
-import { useEffect as useEffect43, useState as useState62, useRef as useRef21 } from "react";
-import { Modal as Modal17, List as List12, Spin as Spin16, Empty as Empty14, Typography as Typography39, Button as Button45, Tag as Tag21, Tooltip as Tooltip17 } from "antd";
+import { useEffect as useEffect42, useState as useState61, useRef as useRef21 } from "react";
+import { Modal as Modal17, List as List12, Spin as Spin15, Empty as Empty14, Typography as Typography39, Button as Button45, Tag as Tag21, Tooltip as Tooltip17 } from "antd";
 import { Database as Database6, Check as Check4, Server as Server3 } from "lucide-react";
 import { Fragment as Fragment17, jsx as jsx87, jsxs as jsxs60 } from "react/jsx-runtime";
 var SESSION_STORAGE_KEY = "metrics_datasource_selection";
@@ -22042,9 +22111,9 @@ var MetricsDataSourcePicker = ({
   senderRef,
   iconOnly
 }) => {
-  const [modalOpen, setModalOpen] = useState62(false);
-  const [loading, setLoading] = useState62(false);
-  const [dataSources, setDataSources] = useState62([]);
+  const [modalOpen, setModalOpen] = useState61(false);
+  const [loading, setLoading] = useState61(false);
+  const [dataSources, setDataSources] = useState61([]);
   const { config } = useLatticeChatShellContext();
   const { customRunConfig, updateCustomRunConfig } = useConversationContext();
   const { get } = useApi();
@@ -22122,7 +22191,7 @@ var MetricsDataSourcePicker = ({
       console.error("Failed to save datasource to sessionStorage:", error);
     }
   };
-  useEffect43(() => {
+  useEffect42(() => {
     if (hasInitializedRef.current) return;
     hasInitializedRef.current = true;
     loadDataSources().then(() => {
@@ -22219,7 +22288,7 @@ var MetricsDataSourcePicker = ({
             overflowY: "auto"
           }
         },
-        children: loading ? /* @__PURE__ */ jsx87("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx87(Spin16, { size: "large" }) }) : dataSources.length === 0 ? /* @__PURE__ */ jsx87(
+        children: loading ? /* @__PURE__ */ jsx87("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx87(Spin15, { size: "large" }) }) : dataSources.length === 0 ? /* @__PURE__ */ jsx87(
           Empty14,
           {
             description: "No Metrics Data Sources Available",
@@ -22373,7 +22442,7 @@ var MetricsDataSourcePicker = ({
 };
 
 // src/components/Chat/ModelSelector.tsx
-import { useState as useState63, useEffect as useEffect44, useCallback as useCallback33, useRef as useRef22 } from "react";
+import { useState as useState62, useEffect as useEffect43, useCallback as useCallback32, useRef as useRef22 } from "react";
 import { Select as Select7 } from "antd";
 import { jsx as jsx88 } from "react/jsx-runtime";
 var ModelSelector = ({
@@ -22382,22 +22451,22 @@ var ModelSelector = ({
   defaultModelKey = "default",
   style
 }) => {
-  const [models, setModels] = useState63([]);
-  const [isLoading, setIsLoading] = useState63(false);
-  const [internalValue, setInternalValue] = useState63(null);
-  const [dropdownOpen, setDropdownOpen] = useState63(false);
-  const [isHovered, setIsHovered] = useState63(false);
+  const [models, setModels] = useState62([]);
+  const [isLoading, setIsLoading] = useState62(false);
+  const [internalValue, setInternalValue] = useState62(null);
+  const [dropdownOpen, setDropdownOpen] = useState62(false);
+  const [isHovered, setIsHovered] = useState62(false);
   const hasFetchedRef = useRef22(false);
   const hasSetDefaultRef = useRef22(false);
   const { get } = useApi();
   const selectedModelConfig = value !== void 0 ? value : internalValue;
-  const setSelectedModelConfig = useCallback33((config) => {
+  const setSelectedModelConfig = useCallback32((config) => {
     if (value === void 0) {
       setInternalValue(config);
     }
     onChange?.(config);
   }, [value, onChange]);
-  const fetchModels = useCallback33(async () => {
+  const fetchModels = useCallback32(async () => {
     if (hasFetchedRef.current) return;
     hasFetchedRef.current = true;
     setIsLoading(true);
@@ -22418,7 +22487,7 @@ var ModelSelector = ({
       setIsLoading(false);
     }
   }, [get, defaultModelKey]);
-  useEffect44(() => {
+  useEffect43(() => {
     fetchModels();
   }, [fetchModels]);
   const handleChange = (modelKey) => {
@@ -22480,8 +22549,8 @@ import {
   WarningOutlined
 } from "@ant-design/icons";
 import { Prompts } from "@ant-design/x";
-import { Space as Space28, Typography as Typography40, Spin as Spin17 } from "antd";
-import { useEffect as useEffect45, useState as useState64, useMemo as useMemo20 } from "react";
+import { Space as Space28, Typography as Typography40, Spin as Spin16 } from "antd";
+import { useEffect as useEffect44, useState as useState63, useMemo as useMemo21 } from "react";
 import { BrainCircuit as BrainCircuit2 } from "lucide-react";
 import { jsx as jsx89, jsxs as jsxs61 } from "react/jsx-runtime";
 var categoryConfig = {
@@ -22566,12 +22635,12 @@ var SkillCategoryPrompts = ({
   senderRef,
   visible = true
 }) => {
-  const [skills, setSkills] = useState64([]);
-  const [loading, setLoading] = useState64(false);
-  const [showAll, setShowAll] = useState64(false);
+  const [skills, setSkills] = useState63([]);
+  const [loading, setLoading] = useState63(false);
+  const [showAll, setShowAll] = useState63(false);
   const { get } = useApi();
   const MAX_SIMPLE_ITEMS = 10;
-  useEffect45(() => {
+  useEffect44(() => {
     const loadSkills = async () => {
       setLoading(true);
       try {
@@ -22589,7 +22658,7 @@ var SkillCategoryPrompts = ({
       loadSkills();
     }
   }, [get, visible]);
-  const groupedSkills = useMemo20(() => {
+  const groupedSkills = useMemo21(() => {
     const groups = {};
     skills.forEach((skill) => {
       const category = skill.metadata?.category || "global";
@@ -22658,7 +22727,7 @@ var SkillCategoryPrompts = ({
     return null;
   }
   if (loading) {
-    return /* @__PURE__ */ jsx89("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx89(Spin17, { size: "large" }) });
+    return /* @__PURE__ */ jsx89("div", { style: { textAlign: "center", padding: 40 }, children: /* @__PURE__ */ jsx89(Spin16, { size: "large" }) });
   }
   if (skills.length === 0) {
     return null;
@@ -22750,7 +22819,7 @@ import {
 } from "@ant-design/icons";
 import { Prompts as Prompts2 } from "@ant-design/x";
 import { Space as Space29, Tabs } from "antd";
-import { useState as useState65, useMemo as useMemo21 } from "react";
+import { useState as useState64, useMemo as useMemo22 } from "react";
 import { jsx as jsx90, jsxs as jsxs62 } from "react/jsx-runtime";
 var defaultCategoryIcons = {
   financial: /* @__PURE__ */ jsx90(DollarOutlined, {}),
@@ -22969,9 +23038,9 @@ var BusinessAnalysisPrompts = ({
   simpleModeTitle = "Quick Analysis",
   expandModeTitle = "Analysis Categories"
 }) => {
-  const [showAll, setShowAll] = useState65(false);
+  const [showAll, setShowAll] = useState64(false);
   const { config } = useLatticeChatShellContext();
-  const analysisData = useMemo21(() => {
+  const analysisData = useMemo22(() => {
     const customData = config.quickPromptsData;
     if (customData && Array.isArray(customData) && customData.length > 0) {
       return customData.map((category) => ({
@@ -22991,7 +23060,7 @@ var BusinessAnalysisPrompts = ({
       color: defaultCategoryColors[category.key] || "#8C8C8C"
     }));
   }, [config.quickPromptsData]);
-  const allItems = useMemo21(() => {
+  const allItems = useMemo22(() => {
     const items = [];
     analysisData.forEach((category) => {
       category.items.forEach((item) => {
@@ -23130,15 +23199,22 @@ var Chating = ({
   showHITL = true,
   showRefreshButton = false,
   showModelSelector,
+  showDatabaseSlot,
+  showSkillSlot,
+  showAgentSlot,
+  showMetricsDataSourceSlot,
   showEmptyState = true,
   emptyStateGreeting,
   emptyStateQuestion = "Ready to turn data into insightful charts in seconds?",
-  welcomePrefix = "Hey"
+  welcomePrefix = "Hey",
+  systemContext,
+  initialMessage,
+  onInitialMessageSent
 }) => {
-  const [content, setContent] = useState66("");
-  const [attachedFiles, setAttachedFiles] = useState66([]);
+  const [content, setContent] = useState65("");
+  const [attachedFiles, setAttachedFiles] = useState65([]);
   const { styles } = useStyle();
-  const [headerOpen, setHeaderOpen] = useState66(false);
+  const [headerOpen, setHeaderOpen] = useState65(false);
   const attachmentsRef = useRef23(null);
   const senderRef = React51.useRef(null);
   const {
@@ -23163,8 +23239,8 @@ var Chating = ({
   const hasPendingMessages = pendingMessages?.length > 0;
   const isInputDisabled = interrupts && interrupts.length > 0;
   const typingFrames = ["\u280B", "\u2819", "\u2839", "\u2838", "\u283C", "\u2834", "\u2826", "\u2827", "\u2807", "\u280F"];
-  const [typingFrameIndex, setTypingFrameIndex] = useState66(0);
-  useEffect46(() => {
+  const [typingFrameIndex, setTypingFrameIndex] = useState65(0);
+  useEffect45(() => {
     if (!isStreaming) return;
     const interval = setInterval(() => {
       setTypingFrameIndex((prev) => (prev + 1) % typingFrames.length);
@@ -23172,16 +23248,37 @@ var Chating = ({
     return () => clearInterval(interval);
   }, [isStreaming]);
   const conversationContext = useConversationContext();
-  const [modelConfig, setModelConfig] = useState66(null);
-  const handleModelChange = useCallback34((config2) => {
+  const systemContextSentRef = useRef23(false);
+  const initialMessageSentRef = useRef23(false);
+  const prevLoadingRef = useRef23(false);
+  useEffect45(() => {
+    systemContextSentRef.current = false;
+  }, [threadId]);
+  useEffect45(() => {
+    initialMessageSentRef.current = false;
+  }, [threadId]);
+  useEffect45(() => {
+    const wasLoading = prevLoadingRef.current;
+    prevLoadingRef.current = isLoading;
+    if (wasLoading && !isLoading && initialMessage && threadId && !initialMessageSentRef.current) {
+      initialMessageSentRef.current = true;
+      sendMessage({
+        input: { message: initialMessage },
+        streaming: true
+      });
+      onInitialMessageSent?.();
+    }
+  }, [isLoading, initialMessage, threadId, sendMessage, onInitialMessageSent]);
+  const [modelConfig, setModelConfig] = useState65(null);
+  const handleModelChange = useCallback33((config2) => {
     setModelConfig(config2);
     if (config2) {
       updateCustomRunConfig({ modelConfig: config2 });
     }
   }, [updateCustomRunConfig]);
-  const [isEmptyState, setIsEmptyState] = useState66(showEmptyState && messages.length === 0 && !pendingMessages?.length);
-  const [isTransitioning, setIsTransitioning] = useState66(false);
-  useEffect46(() => {
+  const [isEmptyState, setIsEmptyState] = useState65(showEmptyState && messages.length === 0 && !pendingMessages?.length);
+  const [isTransitioning, setIsTransitioning] = useState65(false);
+  useEffect45(() => {
     if (!showEmptyState) {
       setIsEmptyState(false);
       return;
@@ -23206,9 +23303,9 @@ var Chating = ({
   const listPathByFolder = workspaceContext?.listPathByFolder ?? (async () => []);
   const workspaceId = workspaceContext?.workspaceId ?? null;
   const projectId = workspaceContext?.projectId ?? null;
-  const [workspaceFiles, setWorkspaceFiles] = useState66([]);
-  const [suggestionsLoading, setSuggestionsLoading] = useState66(false);
-  const [suggestionsOpen, setSuggestionsOpen] = useState66(false);
+  const [workspaceFiles, setWorkspaceFiles] = useState65([]);
+  const [suggestionsLoading, setSuggestionsLoading] = useState65(false);
+  const [suggestionsOpen, setSuggestionsOpen] = useState65(false);
   const getFileIcon3 = (filename) => {
     const ext = filename.split(".").pop()?.toLowerCase();
     const iconStyle = { fontSize: 16 };
@@ -23268,7 +23365,7 @@ var Chating = ({
       setSuggestionsLoading(false);
     }
   };
-  useEffect46(() => {
+  useEffect45(() => {
     regsiterElement("action_show_attachments_uploader", {
       card_view: () => null,
       action: (data) => {
@@ -23296,6 +23393,11 @@ var Chating = ({
     if (!nextContent && attachedFiles.length > 0) {
       nextContent = default_submit_message || "";
     }
+    if (systemContext && !systemContextSentRef.current) {
+      systemContextSentRef.current = true;
+      nextContent = `${systemContext}
+${nextContent}`;
+    }
     const files = attachedFiles.map(
       (file) => isArchiveFile(file) ? {
         name: file.response.zipFileName || file.response.rarFileName,
@@ -23364,7 +23466,7 @@ var Chating = ({
     return true;
   };
   const senderHeader = /* @__PURE__ */ jsx91(
-    Sender2.Header,
+    Sender.Header,
     {
       title: "Attachments",
       open: headerOpen,
@@ -23407,13 +23509,13 @@ var Chating = ({
       )
     }
   );
-  const showDatabaseSlot = config.enableDatabaseSlot;
-  const showSkillSlot = config.enableSkillSlot;
-  const showAgentSlot = config.enableAgentSlot;
-  const showMetricsDataSourceSlot = config.enableMetricsDataSourceSlot;
+  const effectiveShowDatabaseSlot = showDatabaseSlot !== void 0 ? showDatabaseSlot : config.enableDatabaseSlot;
+  const effectiveShowSkillSlot = showSkillSlot !== void 0 ? showSkillSlot : config.enableSkillSlot;
+  const effectiveShowAgentSlot = showAgentSlot !== void 0 ? showAgentSlot : config.enableAgentSlot;
+  const effectiveShowMetricsDataSourceSlot = showMetricsDataSourceSlot !== void 0 ? showMetricsDataSourceSlot : config.enableMetricsDataSourceSlot;
   const shouldShowModelSelector = showModelSelector !== void 0 ? showModelSelector : config.enableModelSelector;
   const senderFooter = (actionNode) => {
-    const hasSlotButtons = showAgentSlot || showDatabaseSlot || showSkillSlot || showMetricsDataSourceSlot;
+    const hasSlotButtons = effectiveShowAgentSlot || effectiveShowDatabaseSlot || effectiveShowSkillSlot || effectiveShowMetricsDataSourceSlot;
     return /* @__PURE__ */ jsxs63(Flex5, { justify: "space-between", align: "center", style: { padding: "8px 0" }, children: [
       /* @__PURE__ */ jsxs63(Flex5, { align: "center", gap: 8, children: [
         /* @__PURE__ */ jsx91(Badge6, { dot: attachedFiles.length > 0 && !headerOpen, children: /* @__PURE__ */ jsx91(
@@ -23426,10 +23528,10 @@ var Chating = ({
         ) }),
         /* @__PURE__ */ jsx91(Divider6, { type: "vertical", style: { margin: 0 } }),
         hasSlotButtons && /* @__PURE__ */ jsxs63(Flex5, { align: "center", gap: 8, children: [
-          showAgentSlot && /* @__PURE__ */ jsx91(AgentPicker, { senderRef, iconOnly: true }),
-          showDatabaseSlot && /* @__PURE__ */ jsx91(DatabasePicker, { senderRef, iconOnly: true }),
-          showSkillSlot && /* @__PURE__ */ jsx91(SkillPicker, { senderRef, iconOnly: true }),
-          showMetricsDataSourceSlot && /* @__PURE__ */ jsx91(MetricsDataSourcePicker, { senderRef, iconOnly: true })
+          effectiveShowAgentSlot && /* @__PURE__ */ jsx91(AgentPicker, { senderRef, iconOnly: true }),
+          effectiveShowDatabaseSlot && /* @__PURE__ */ jsx91(DatabasePicker, { senderRef, iconOnly: true }),
+          effectiveShowSkillSlot && /* @__PURE__ */ jsx91(SkillPicker, { senderRef, iconOnly: true }),
+          effectiveShowMetricsDataSourceSlot && /* @__PURE__ */ jsx91(MetricsDataSourcePicker, { senderRef, iconOnly: true })
         ] })
       ] }),
       /* @__PURE__ */ jsxs63(Flex5, { align: "center", gap: 8, children: [
@@ -23451,7 +23553,7 @@ var Chating = ({
     Button46,
     {
       type: "text",
-      icon: /* @__PURE__ */ jsx91(ReloadOutlined3, {}),
+      icon: /* @__PURE__ */ jsx91(ReloadOutlined4, {}),
       onClick: () => {
         loadMessages();
       }
@@ -23461,8 +23563,8 @@ var Chating = ({
     ...showRefreshButton ? [refreshButton] : [],
     /* @__PURE__ */ jsx91(ThreadManagementButtons, {}, "thread-buttons")
   ];
-  const [skills, setSkills] = useState66([]);
-  const [skillsLoading, setSkillsLoading] = useState66(false);
+  const [skills, setSkills] = useState65([]);
+  const [skillsLoading, setSkillsLoading] = useState65(false);
   const { get: apiGet } = useApi();
   const loadSkills = async () => {
     if (skills.length > 0) return;
@@ -23486,7 +23588,7 @@ var Chating = ({
     return isEmpty ? "Type / to see available skills, or @ to reference files" : void 0;
   };
   const renderSender = (isEmpty) => {
-    const [suggestionMode, setSuggestionMode] = useState66(null);
+    const [suggestionMode, setSuggestionMode] = useState65(null);
     const suggestionItems = suggestionMode === "skills" ? skills.map((skill) => ({
       value: skill.name,
       icon: /* @__PURE__ */ jsx91(BrainCircuit3, { size: 14, style: { color: "#722ed1" } }),
@@ -23530,7 +23632,7 @@ var Chating = ({
           }
         },
         children: ({ onTrigger, onKeyDown }) => /* @__PURE__ */ jsx91(
-          Sender2,
+          Sender,
           {
             slotConfig,
             disabled: isInputDisabled,
@@ -23865,16 +23967,16 @@ var InternetSearchCard = ({
 };
 
 // src/components/GenUI/elements/schedule_viewer.tsx
-import { useState as useState67, useEffect as useEffect47, useCallback as useCallback35 } from "react";
+import { useState as useState66, useEffect as useEffect46, useCallback as useCallback34 } from "react";
 import {
   Tag as Tag22,
   Button as Button48,
   Empty as Empty16,
-  Spin as Spin18,
+  Spin as Spin17,
   Typography as Typography45,
   Space as Space32,
   Tooltip as Tooltip18,
-  Popconfirm as Popconfirm8,
+  Popconfirm as Popconfirm10,
   message as message16,
   Card as Card23
 } from "antd";
@@ -23883,7 +23985,7 @@ import {
   PauseCircleOutlined,
   PlayCircleOutlined as PlayCircleOutlined2,
   StopOutlined,
-  ReloadOutlined as ReloadOutlined4,
+  ReloadOutlined as ReloadOutlined5,
   CheckCircleOutlined as CheckCircleOutlined7,
   CloseCircleOutlined as CloseCircleOutlined3,
   ExclamationCircleOutlined,
@@ -24029,10 +24131,10 @@ var ScheduleViewer = ({ data }) => {
   const { styles } = useStyles8();
   const { threadId, assistantId, tasks: initialTasks, onRefresh } = data ?? {};
   const client = useClient(assistantId || "");
-  const [tasks, setTasks] = useState67(initialTasks || []);
-  const [loading, setLoading] = useState67(false);
-  const [actionLoading, setActionLoading] = useState67(null);
-  const handleRefresh = useCallback35(async () => {
+  const [tasks, setTasks] = useState66(initialTasks || []);
+  const [loading, setLoading] = useState66(false);
+  const [actionLoading, setActionLoading] = useState66(null);
+  const handleRefresh = useCallback34(async () => {
     if (!threadId) return;
     setLoading(true);
     try {
@@ -24046,7 +24148,7 @@ var ScheduleViewer = ({ data }) => {
       setLoading(false);
     }
   }, [client, threadId, onRefresh]);
-  const handleCancel = useCallback35(
+  const handleCancel = useCallback34(
     async (taskId) => {
       setActionLoading(taskId);
       try {
@@ -24062,7 +24164,7 @@ var ScheduleViewer = ({ data }) => {
     },
     [client, handleRefresh]
   );
-  const handlePause = useCallback35(
+  const handlePause = useCallback34(
     async (taskId) => {
       setActionLoading(taskId);
       try {
@@ -24078,7 +24180,7 @@ var ScheduleViewer = ({ data }) => {
     },
     [client, handleRefresh]
   );
-  const handleResume = useCallback35(
+  const handleResume = useCallback34(
     async (taskId) => {
       setActionLoading(taskId);
       try {
@@ -24094,12 +24196,12 @@ var ScheduleViewer = ({ data }) => {
     },
     [client, handleRefresh]
   );
-  useEffect47(() => {
+  useEffect46(() => {
     if (threadId && (!initialTasks || initialTasks.length === 0)) {
       handleRefresh();
     }
   }, [threadId]);
-  useEffect47(() => {
+  useEffect46(() => {
     if (initialTasks) {
       setTasks(initialTasks);
     }
@@ -24131,7 +24233,7 @@ var ScheduleViewer = ({ data }) => {
         }
       ) }),
       (isPending || isPaused) && /* @__PURE__ */ jsx94(
-        Popconfirm8,
+        Popconfirm10,
         {
           title: "Cancel this scheduled task?",
           description: "This action cannot be undone.",
@@ -24218,14 +24320,14 @@ var ScheduleViewer = ({ data }) => {
         Button48,
         {
           type: "text",
-          icon: /* @__PURE__ */ jsx94(ReloadOutlined4, { spin: loading }),
+          icon: /* @__PURE__ */ jsx94(ReloadOutlined5, { spin: loading }),
           onClick: handleRefresh,
           loading
         }
       ) })
     ] }),
     loading && tasks.length === 0 ? /* @__PURE__ */ jsxs65("div", { className: styles.emptyContainer, children: [
-      /* @__PURE__ */ jsx94(Spin18, { size: "large" }),
+      /* @__PURE__ */ jsx94(Spin17, { size: "large" }),
       /* @__PURE__ */ jsx94(Text35, { type: "secondary", style: { marginTop: 16 }, children: "Loading scheduled tasks..." })
     ] }) : tasks.length === 0 ? /* @__PURE__ */ jsx94("div", { className: styles.emptyContainer, children: /* @__PURE__ */ jsx94(
       Empty16,
@@ -24567,13 +24669,13 @@ var TeamGraph = ({ data }) => {
 var TeamGraph_default = TeamGraph;
 
 // src/components/GenUI/elements/TeamWorkspace/index.tsx
-import { useState as useState72, useMemo as useMemo26 } from "react";
-import { Layout, Spin as Spin19, Button as Button52 } from "antd";
+import { useState as useState71, useMemo as useMemo27 } from "react";
+import { Layout, Spin as Spin18, Button as Button52 } from "antd";
 import { RefreshCw } from "lucide-react";
 import { createStyles as createStyles33 } from "antd-style";
 
 // src/components/GenUI/elements/TeamWorkspace/TeamWorkspaceMenu.tsx
-import React53, { useState as useState68 } from "react";
+import React53, { useState as useState67 } from "react";
 import {
   LayoutDashboard,
   Inbox as Inbox2,
@@ -24767,7 +24869,7 @@ var TeamWorkspaceMenu = ({
   onItemClick
 }) => {
   const { styles } = useStyles9();
-  const [isExpanded, setIsExpanded] = useState68(false);
+  const [isExpanded, setIsExpanded] = useState67(false);
   const mainItems = items.filter((item) => !item.group);
   const teammateItems = items.filter((item) => item.group === "Teammates");
   const teamItems = items.filter((item) => item.group === "Team");
@@ -24849,13 +24951,13 @@ import {
 import { createStyles as createStyles26 } from "antd-style";
 
 // src/components/GenUI/elements/TeamWorkspace/hooks/useTeamWorkspaceData.ts
-import { useMemo as useMemo22 } from "react";
+import { useMemo as useMemo23 } from "react";
 function useTeamWorkspaceData(threadId, assistantId) {
   const { agentState, isLoading, error, refresh } = useAgentState(threadId, assistantId, {
     pollingInterval: 5e3,
     autoStart: true
   });
-  const data = useMemo22(() => {
+  const data = useMemo23(() => {
     const team = agentState?.values?.team || null;
     const tasks = agentState?.values?.tasks || [];
     const mailbox = agentState?.values?.team_mailbox || [];
@@ -25244,7 +25346,7 @@ var TeamDashboard = ({
 };
 
 // src/components/GenUI/elements/TeamWorkspace/IssuesView.tsx
-import { useState as useState70, useMemo as useMemo23 } from "react";
+import { useState as useState69, useMemo as useMemo24 } from "react";
 import { Typography as Typography51, Badge as Badge8, Empty as Empty17, Tooltip as Tooltip21 } from "antd";
 import {
   CheckCircle2 as CheckCircle24,
@@ -25259,7 +25361,7 @@ import {
 import { createStyles as createStyles28 } from "antd-style";
 
 // src/components/GenUI/elements/TeamWorkspace/TaskDetailModal.tsx
-import { useState as useState69 } from "react";
+import { useState as useState68 } from "react";
 import { Modal as Modal18, Typography as Typography50, Tag as Tag24, Divider as Divider7, Tabs as Tabs2, Timeline } from "antd";
 import { createStyles as createStyles27 } from "antd-style";
 import {
@@ -25684,7 +25786,7 @@ var TaskDetailModal = ({
   onClose
 }) => {
   const { styles } = useStyles11();
-  const [activeTab, setActiveTab] = useState69("comments");
+  const [activeTab, setActiveTab] = useState68("comments");
   if (!task) return null;
   const statusConfig2 = getStatusConfig2(task.status);
   const tabItems = [
@@ -26110,7 +26212,7 @@ var formatDate2 = (timestamp) => {
   });
 };
 var ListGroupComponent = ({ group, styles, defaultExpanded = true, onTaskClick }) => {
-  const [isExpanded, setIsExpanded] = useState70(defaultExpanded);
+  const [isExpanded, setIsExpanded] = useState69(defaultExpanded);
   return /* @__PURE__ */ jsxs72("div", { className: styles.listGroup, children: [
     /* @__PURE__ */ jsxs72(
       "div",
@@ -26153,10 +26255,10 @@ var IssuesView = ({
   teammates
 }) => {
   const { styles } = useStyles12();
-  const [viewMode, setViewMode] = useState70("list");
-  const [selectedTask, setSelectedTask] = useState70(null);
-  const [modalVisible, setModalVisible] = useState70(false);
-  const listGroups = useMemo23(() => {
+  const [viewMode, setViewMode] = useState69("list");
+  const [selectedTask, setSelectedTask] = useState69(null);
+  const [modalVisible, setModalVisible] = useState69(false);
+  const listGroups = useMemo24(() => {
     const groups = [
       {
         id: "pending",
@@ -26195,7 +26297,7 @@ var IssuesView = ({
     });
     return groups;
   }, [tasks]);
-  const tasksByStatus = useMemo23(() => {
+  const tasksByStatus = useMemo24(() => {
     const grouped = {
       pending: [],
       claimed: [],
@@ -26328,7 +26430,7 @@ var IssuesView = ({
 };
 
 // src/components/GenUI/elements/TeamWorkspace/TeamOrgCanvas.tsx
-import React56, { useMemo as useMemo24 } from "react";
+import React56, { useMemo as useMemo25 } from "react";
 import {
   ReactFlow as ReactFlow5,
   Background as Background5,
@@ -26494,7 +26596,7 @@ var TeamOrgCanvasInner = ({
 }) => {
   const { styles } = useStyles13();
   const { fitView } = useReactFlow2();
-  const taskStatsByTeammate = useMemo24(() => {
+  const taskStatsByTeammate = useMemo25(() => {
     const stats = {};
     teammates.forEach((t) => {
       stats[t.name] = { completed: 0, inProgress: 0, pending: 0 };
@@ -26512,7 +26614,7 @@ var TeamOrgCanvasInner = ({
     });
     return stats;
   }, [teammates, tasks]);
-  const { nodes, edges } = useMemo24(() => {
+  const { nodes, edges } = useMemo25(() => {
     const newNodes = [];
     const newEdges = [];
     const teamLeadId = team?.teamLeadId || "team_lead";
@@ -26766,7 +26868,7 @@ var TeamMemberChat = ({
 };
 
 // src/components/GenUI/elements/MailboxPanel.tsx
-import { useState as useState71, useMemo as useMemo25 } from "react";
+import { useState as useState70, useMemo as useMemo26 } from "react";
 import { Typography as Typography55, Empty as Empty18 } from "antd";
 import { createStyles as createStyles32 } from "antd-style";
 import {
@@ -27189,7 +27291,7 @@ var getMessagePreview = (content) => {
   return firstLine.length > 80 ? firstLine.slice(0, 80) + "..." : firstLine;
 };
 var MessageGroupComponent = ({ group, styles, defaultExpanded = true, onMessageClick }) => {
-  const [isExpanded, setIsExpanded] = useState71(defaultExpanded);
+  const [isExpanded, setIsExpanded] = useState70(defaultExpanded);
   return /* @__PURE__ */ jsxs76("div", { className: styles.listGroup, children: [
     /* @__PURE__ */ jsxs76(
       "div",
@@ -27244,10 +27346,10 @@ var MessageGroupComponent = ({ group, styles, defaultExpanded = true, onMessageC
 };
 var MailboxPanel = ({ data }) => {
   const { styles } = useStyles16();
-  const [selectedMessage, setSelectedMessage] = useState71(null);
-  const [modalVisible, setModalVisible] = useState71(false);
+  const [selectedMessage, setSelectedMessage] = useState70(null);
+  const [modalVisible, setModalVisible] = useState70(false);
   const { teamMailbox = [] } = data || {};
-  const messageGroups = useMemo25(() => {
+  const messageGroups = useMemo26(() => {
     const groupsMap = /* @__PURE__ */ new Map();
     teamMailbox.forEach((message23) => {
       const sender = message23.from;
@@ -27375,8 +27477,8 @@ var TeamWorkspace = ({
     isLoading,
     refresh
   } = useTeamWorkspaceData(parent_thread_id || null, assistantId);
-  const [activeMenuId, setActiveMenuId] = useState72("dashboard");
-  const menuItems = useMemo26(() => {
+  const [activeMenuId, setActiveMenuId] = useState71("dashboard");
+  const menuItems = useMemo27(() => {
     const items = [
       {
         id: "dashboard",
@@ -27418,7 +27520,7 @@ var TeamWorkspace = ({
   };
   const renderContent = () => {
     if (isLoading) {
-      return /* @__PURE__ */ jsx106("div", { className: styles.loadingContainer, children: /* @__PURE__ */ jsx106(Spin19, { size: "large" }) });
+      return /* @__PURE__ */ jsx106("div", { className: styles.loadingContainer, children: /* @__PURE__ */ jsx106(Spin18, { size: "large" }) });
     }
     const activeItem = menuItems.find((item) => item.id === activeMenuId);
     switch (activeItem?.type) {
@@ -27513,7 +27615,7 @@ var TeamWorkspace = ({
 };
 
 // src/components/GenUI/elements/TaskBoard.tsx
-import { useMemo as useMemo27 } from "react";
+import { useMemo as useMemo28 } from "react";
 
 // src/components/GenUI/elements/TaskBoardCard.tsx
 import { jsx as jsx107, jsxs as jsxs78 } from "react/jsx-runtime";
@@ -27792,7 +27894,7 @@ var TaskBoard = ({
   const { tasks: contextTasks } = useAgentChat();
   const { tasks: propTasks, onAddTask, teammates } = data || {};
   const tasks = contextTasks || propTasks || [];
-  const tasksByStatus = useMemo27(() => {
+  const tasksByStatus = useMemo28(() => {
     const grouped = {
       pending: [],
       in_progress: [],
@@ -27858,7 +27960,7 @@ var TaskBoard = ({
 };
 
 // src/components/GenUI/elements/Mailbox.tsx
-import { useState as useState73, useMemo as useMemo28, useRef as useRef24, useEffect as useEffect48 } from "react";
+import { useState as useState72, useMemo as useMemo29, useRef as useRef24, useEffect as useEffect47 } from "react";
 import { jsx as jsx109, jsxs as jsxs80 } from "react/jsx-runtime";
 var useStyle16 = () => {
   return {
@@ -28144,17 +28246,17 @@ var renderMessageWithMentions = (content, mentions, styles) => {
 var TeamChat = ({ data }) => {
   const styles = useStyle16();
   const { teamName, currentUser, teammates, messages, onSendMessage } = data || {};
-  const [inputValue, setInputValue] = useState73("");
+  const [inputValue, setInputValue] = useState72("");
   const messagesEndRef = useRef24(null);
-  const sortedMessages = useMemo28(() => {
+  const sortedMessages = useMemo29(() => {
     return [...messages || []].sort(
       (a, b) => new Date(a.timestamp).getTime() - new Date(b.timestamp).getTime()
     );
   }, [messages]);
-  const mentions = useMemo28(() => {
+  const mentions = useMemo29(() => {
     return teammates?.map((t) => t.name) || [];
   }, [teammates]);
-  useEffect48(() => {
+  useEffect47(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [sortedMessages]);
   const handleSend = () => {
@@ -28323,12 +28425,12 @@ var TeamChat = ({ data }) => {
 };
 
 // src/components/GenUI/elements/ShowWidget.tsx
-import { useCallback as useCallback37 } from "react";
+import { useCallback as useCallback36 } from "react";
 import { Button as Button53, Typography as Typography56 } from "antd";
 import { ExpandOutlined as ExpandOutlined2 } from "@ant-design/icons";
 
 // src/streaming-html/StreamingHTMLRenderer.tsx
-import React61, { useEffect as useEffect49, useRef as useRef25, useCallback as useCallback36, useState as useState74 } from "react";
+import React61, { useEffect as useEffect48, useRef as useRef25, useCallback as useCallback35, useState as useState73 } from "react";
 
 // src/streaming-html/show-widget-css-generator.ts
 function generateShowWidgetCSS(tokens) {
@@ -29029,12 +29131,12 @@ var StreamingHTMLRenderer = ({
   const isScriptExecuted = useRef25(false);
   const [iframeHeight, setIframeHeight] = React61.useState(0);
   const [iframeWidth, setIframeWidth] = React61.useState(void 0);
-  const [currentMessageIndex, setCurrentMessageIndex] = useState74(0);
-  const [showLoading, setShowLoading] = useState74(true);
-  useEffect49(() => {
+  const [currentMessageIndex, setCurrentMessageIndex] = useState73(0);
+  const [showLoading, setShowLoading] = useState73(true);
+  useEffect48(() => {
     isCompleteRef.current = isComplete;
   }, [isComplete]);
-  useEffect49(() => {
+  useEffect48(() => {
     if (iframeHeight > 0) {
       setShowLoading(false);
       return;
@@ -29059,7 +29161,7 @@ var StreamingHTMLRenderer = ({
     }, 1500);
     return () => clearInterval(interval);
   }, [iframeHeight, loadingMessages]);
-  const executeScripts = useCallback36(() => {
+  const executeScripts = useCallback35(() => {
     if (isScriptExecuted.current) {
       console.log("[StreamingHTMLRenderer]  scripts is executed");
       return;
@@ -29086,7 +29188,7 @@ var StreamingHTMLRenderer = ({
       onError?.(streamingError);
     }
   }, [onError]);
-  const sendChunk = useCallback36((chunk) => {
+  const sendChunk = useCallback35((chunk) => {
     const iframe = iframeRef.current;
     if (!iframe || !iframe.contentWindow) {
       return;
@@ -29110,7 +29212,7 @@ var StreamingHTMLRenderer = ({
       onError?.(streamingError);
     }
   }, [onError]);
-  useEffect49(() => {
+  useEffect48(() => {
     const handleMessage = (event) => {
       const iframe = iframeRef.current;
       if (!iframe || event.source !== iframe.contentWindow) {
@@ -29163,7 +29265,7 @@ var StreamingHTMLRenderer = ({
       window.removeEventListener("message", handleMessage);
     };
   }, [onError, onPrompt, sendChunk, executeScripts]);
-  useEffect49(() => {
+  useEffect48(() => {
     if (html === prevHTMLRef.current) {
       return;
     }
@@ -29174,12 +29276,12 @@ var StreamingHTMLRenderer = ({
       sendChunk(newChunk);
     }
   }, [html, sendChunk]);
-  useEffect49(() => {
+  useEffect48(() => {
     if (isComplete && isReadyRef.current) {
       executeScripts();
     }
   }, [isComplete, executeScripts]);
-  useEffect49(() => {
+  useEffect48(() => {
     const container = containerRef.current;
     if (!container) return;
     const antBubble = container.closest(".ant-bubble");
@@ -29205,7 +29307,7 @@ var StreamingHTMLRenderer = ({
       resizeObserverRef.current = null;
     };
   }, []);
-  useEffect49(() => {
+  useEffect48(() => {
     return () => {
       isReadyRef.current = false;
       pendingChunksRef.current = [];
@@ -29308,14 +29410,14 @@ var ShowWidget = ({
       console.warn("Failed to parse tool response:", e);
     }
   }
-  const sendPrompt = useCallback37((text) => {
+  const sendPrompt = useCallback36((text) => {
     sendMessage({
       input: {
         message: text
       }
     });
   }, [sendMessage]);
-  const handleOpenInSideApp = useCallback37(() => {
+  const handleOpenInSideApp = useCallback36(() => {
     openSideApp({
       component_key: "show_widget",
       data: {
@@ -29384,14 +29486,14 @@ var ShowWidget = ({
 };
 
 // src/components/GenUI/elements/ShowWidgetApp.tsx
-import { useCallback as useCallback38 } from "react";
+import { useCallback as useCallback37 } from "react";
 import { jsx as jsx112 } from "react/jsx-runtime";
 var ShowWidgetApp = ({
   data
 }) => {
   const { widget_code, title } = data || {};
   const { sendMessage } = useAgentChat();
-  const sendPrompt = useCallback38(
+  const sendPrompt = useCallback37(
     (text) => {
       sendMessage({
         input: {
@@ -29518,7 +29620,7 @@ var regsiterElement = (language, ElementMeta) => {
 // src/components/Chat/SideAppViewBrowser.tsx
 import { Dropdown as Dropdown3, Tooltip as Tooltip23 } from "antd";
 import { createStyles as createStyles34 } from "antd-style";
-import { useEffect as useEffect50, useState as useState75 } from "react";
+import { useEffect as useEffect49, useState as useState74 } from "react";
 import { Fragment as Fragment21, jsx as jsx113, jsxs as jsxs83 } from "react/jsx-runtime";
 var useStyle17 = createStyles34(({ token, css }) => {
   return {
@@ -29716,11 +29818,11 @@ var SideAppViewBrowser = ({ region = "side" }) => {
   } = useChatUIContext();
   const selectedCard = region === "side" ? sideAppSelectedCard : contextAppSelectedCard;
   const closeApp = region === "side" ? closeSideApp : closeContentApp;
-  const [activeKey, setActiveKey] = useState75(
+  const [activeKey, setActiveKey] = useState74(
     JSON.stringify(selectedCard)
   );
-  const [hoveredTab, setHoveredTab] = useState75(null);
-  const [items, setItems] = useState75([]);
+  const [hoveredTab, setHoveredTab] = useState74(null);
+  const [items, setItems] = useState74([]);
   const add = (key, label, children, componentKey) => {
     const newPanes = [...items, { label, children, key, componentKey }];
     setItems(newPanes);
@@ -29747,7 +29849,7 @@ var SideAppViewBrowser = ({ region = "side" }) => {
   const switchTab = (key) => {
     setActiveKey(key);
   };
-  useEffect50(() => {
+  useEffect49(() => {
     if (!selectedCard) return;
     const key = JSON.stringify(selectedCard);
     if (items.find((item) => item.key === key)) {
@@ -29852,7 +29954,7 @@ var SideAppViewBrowser = ({ region = "side" }) => {
 };
 
 // src/components/Chat/ProjectSelector.tsx
-import { useState as useState76, useCallback as useCallback39, useMemo as useMemo29, useRef as useRef26 } from "react";
+import { useState as useState75, useCallback as useCallback38, useMemo as useMemo30, useRef as useRef26 } from "react";
 import { Modal as Modal20, Input as Input15, Button as Button54, message as message18 } from "antd";
 import { createStyles as createStyles35 } from "antd-style";
 import { Folder, ChevronDown as ChevronDown6, Building2 as Building24 } from "lucide-react";
@@ -30088,34 +30190,34 @@ var ProjectSelector = ({
     setProject,
     createProject
   } = useWorkspaceContext();
-  const [isWorkspaceListOpen, setIsWorkspaceListOpen] = useState76(false);
+  const [isWorkspaceListOpen, setIsWorkspaceListOpen] = useState75(false);
   const workspaceDropdownRef = useRef26(null);
-  const [isProjectListOpen, setIsProjectListOpen] = useState76(false);
-  const [isModalOpen, setIsModalOpen] = useState76(false);
-  const [projectName, setProjectName] = useState76("");
-  const [validationError, setValidationError] = useState76(null);
-  const [isCreating, setIsCreating] = useState76(false);
+  const [isProjectListOpen, setIsProjectListOpen] = useState75(false);
+  const [isModalOpen, setIsModalOpen] = useState75(false);
+  const [projectName, setProjectName] = useState75("");
+  const [validationError, setValidationError] = useState75(null);
+  const [isCreating, setIsCreating] = useState75(false);
   const projectNameInputRef = useRef26(null);
-  const currentProject = useMemo29(() => {
+  const currentProject = useMemo30(() => {
     return projects.find((p) => p.id === projectId);
   }, [projects, projectId]);
-  const currentWorkspace = useMemo29(() => {
+  const currentWorkspace = useMemo30(() => {
     return workspaces.find((w) => w.id === workspaceId);
   }, [workspaces, workspaceId]);
-  const handleSelectProject = useCallback39((selectedProjectId) => {
+  const handleSelectProject = useCallback38((selectedProjectId) => {
     setProject(selectedProjectId);
     setIsProjectListOpen(false);
   }, [setProject]);
-  const handleWorkspaceClick = useCallback39(() => {
+  const handleWorkspaceClick = useCallback38(() => {
     setProject(null);
   }, [setProject]);
-  const toggleProjectList = useCallback39(() => {
+  const toggleProjectList = useCallback38(() => {
     setIsProjectListOpen((prev) => !prev);
   }, []);
-  const toggleWorkspaceList = useCallback39(() => {
+  const toggleWorkspaceList = useCallback38(() => {
     setIsWorkspaceListOpen((prev) => !prev);
   }, []);
-  const validateProjectName = useCallback39((name) => {
+  const validateProjectName = useCallback38((name) => {
     const trimmed = name.trim();
     if (!trimmed) return "Project name is required";
     if (trimmed.length > PROJECT_NAME_MAX_LENGTH) {
@@ -30123,7 +30225,7 @@ var ProjectSelector = ({
     }
     return null;
   }, []);
-  const handleOpenModal = useCallback39((e) => {
+  const handleOpenModal = useCallback38((e) => {
     e.stopPropagation();
     if (!workspaceId) {
       message18.warning("Please select a workspace first");
@@ -30134,7 +30236,7 @@ var ProjectSelector = ({
     setIsModalOpen(true);
     setTimeout(() => projectNameInputRef.current?.input?.focus(), 100);
   }, [workspaceId]);
-  const handleCloseModal = useCallback39(() => {
+  const handleCloseModal = useCallback38(() => {
     setIsModalOpen(false);
     setProjectName("");
     setValidationError(null);
@@ -30144,7 +30246,7 @@ var ProjectSelector = ({
     setProjectName(value);
     setValidationError(validateProjectName(value));
   };
-  const handleCreateProject = useCallback39(async () => {
+  const handleCreateProject = useCallback38(async () => {
     if (!workspaceId) return;
     const trimmed = projectName.trim();
     const error = validateProjectName(trimmed);
@@ -30263,12 +30365,12 @@ var ProjectSelector = ({
 };
 
 // src/components/Chat/ToolPanelFiles.tsx
-import { useCallback as useCallback40, useEffect as useEffect51, useMemo as useMemo30, useState as useState77 } from "react";
+import { useCallback as useCallback39, useEffect as useEffect50, useMemo as useMemo31, useState as useState76 } from "react";
 import { message as message19 } from "antd";
 
 // src/components/Chat/FileDirectoryPanel.tsx
 import React66 from "react";
-import { Spin as Spin20 } from "antd";
+import { Spin as Spin19 } from "antd";
 import { ChevronRight as ChevronRight8, FolderOpen as FolderOpen3, Upload } from "lucide-react";
 import { createStyles as createStyles36 } from "antd-style";
 import { Fragment as Fragment23, jsx as jsx115, jsxs as jsxs85 } from "react/jsx-runtime";
@@ -30533,7 +30635,7 @@ var FileDirectoryPanel = ({
             }
           )
         ] }),
-        isExpanded ? isLoading ? /* @__PURE__ */ jsx115("div", { className: styles.loading, children: /* @__PURE__ */ jsx115(Spin20, { size: "small" }) }) : children.length > 0 ? children.map((child) => renderEntry(child, depth + 1)) : /* @__PURE__ */ jsx115("div", { className: styles.emptyState, children: "No files in this folder" }) : null
+        isExpanded ? isLoading ? /* @__PURE__ */ jsx115("div", { className: styles.loading, children: /* @__PURE__ */ jsx115(Spin19, { size: "small" }) }) : children.length > 0 ? children.map((child) => renderEntry(child, depth + 1)) : /* @__PURE__ */ jsx115("div", { className: styles.emptyState, children: "No files in this folder" }) : null
       ] }, entry.path);
     }
     return /* @__PURE__ */ jsxs85("div", { className: styles.treeRow, children: [
@@ -30583,7 +30685,7 @@ var FileDirectoryPanel = ({
           ),
           /* @__PURE__ */ jsx115("span", { className: styles.badge, children: itemCount })
         ] }),
-        isLoading ? /* @__PURE__ */ jsx115("div", { className: styles.loading, children: /* @__PURE__ */ jsx115(Spin20, { size: "small" }) }) : /* @__PURE__ */ jsxs85("div", { className: styles.assetList, children: [
+        isLoading ? /* @__PURE__ */ jsx115("div", { className: styles.loading, children: /* @__PURE__ */ jsx115(Spin19, { size: "small" }) }) : /* @__PURE__ */ jsxs85("div", { className: styles.assetList, children: [
           entries.map((entry) => renderEntry(entry, 0)),
           entries.length === 0 ? /* @__PURE__ */ jsx115("div", { className: styles.emptyState, children: "No files in this folder" }) : null,
           folder.allowUpload ? /* @__PURE__ */ jsx115(
@@ -30594,7 +30696,7 @@ var FileDirectoryPanel = ({
               onClick: () => void onUploadFolder(folder.name),
               disabled: !workspaceId || !projectId || uploadingFolder === folder.name,
               children: uploadingFolder === folder.name ? /* @__PURE__ */ jsxs85(Fragment23, { children: [
-                /* @__PURE__ */ jsx115(Spin20, { size: "small" }),
+                /* @__PURE__ */ jsx115(Spin19, { size: "small" }),
                 /* @__PURE__ */ jsx115("span", { children: "Uploading..." })
               ] }) : /* @__PURE__ */ jsxs85(Fragment23, { children: [
                 /* @__PURE__ */ jsx115(Upload, { size: 14 }),
@@ -30622,16 +30724,16 @@ var ToolPanelFiles = () => {
     uploadFileToFolder
   } = useWorkspaceContext();
   const { currentAssistant } = useAssistantContext();
-  const [folderEntries, setFolderEntries] = useState77({});
-  const [folderLoading, setFolderLoading] = useState77({});
-  const [directoryChildren, setDirectoryChildren] = useState77({});
-  const [directoryLoading, setDirectoryLoading] = useState77({});
-  const [directoryExpanded, setDirectoryExpanded] = useState77({});
-  const [uploadingFolder, setUploadingFolder] = useState77(null);
-  const resourceFolders = useMemo30(() => {
+  const [folderEntries, setFolderEntries] = useState76({});
+  const [folderLoading, setFolderLoading] = useState76({});
+  const [directoryChildren, setDirectoryChildren] = useState76({});
+  const [directoryLoading, setDirectoryLoading] = useState76({});
+  const [directoryExpanded, setDirectoryExpanded] = useState76({});
+  const [uploadingFolder, setUploadingFolder] = useState76(null);
+  const resourceFolders = useMemo31(() => {
     return config.resourceFolders && config.resourceFolders.length > 0 ? config.resourceFolders : [{ name: "/", displayName: "Project Assets", allowUpload: true }];
   }, [config.resourceFolders]);
-  const loadAssetsForFolder = useCallback40(
+  const loadAssetsForFolder = useCallback39(
     async (folder, clearSubdirectoryCache = true) => {
       if (!workspaceId || !projectId) {
         setFolderEntries((prev) => ({ ...prev, [folder.name]: [] }));
@@ -30671,7 +30773,7 @@ var ToolPanelFiles = () => {
     },
     [workspaceId, projectId, listPathByFolder, currentAssistant?.id]
   );
-  const handleToggleDirectory = useCallback40(async (path) => {
+  const handleToggleDirectory = useCallback39(async (path) => {
     const isExpanded = directoryExpanded[path] || false;
     if (isExpanded) {
       setDirectoryExpanded((prev) => ({ ...prev, [path]: false }));
@@ -30689,12 +30791,12 @@ var ToolPanelFiles = () => {
       setDirectoryLoading((prev) => ({ ...prev, [path]: false }));
     }
   }, [directoryExpanded, listPath, currentAssistant?.id]);
-  useEffect51(() => {
+  useEffect50(() => {
     resourceFolders.forEach((folder) => {
       void loadAssetsForFolder(folder, false);
     });
   }, [resourceFolders, loadAssetsForFolder]);
-  const handleAssetClick = useCallback40((asset) => {
+  const handleAssetClick = useCallback39((asset) => {
     const fileUrl = getFileViewUrl(asset.path, currentAssistant?.id);
     if (!fileUrl) {
       message19.warning("Please select a workspace and project first.");
@@ -30710,7 +30812,7 @@ var ToolPanelFiles = () => {
       message: `Preview: ${asset.name || asset.path}`
     });
   }, [getFileViewUrl, openSideApp, currentAssistant?.id]);
-  const handleUploadFolder = useCallback40(async (folderName) => {
+  const handleUploadFolder = useCallback39(async (folderName) => {
     if (!workspaceId || !projectId) {
       message19.warning("Please select a workspace and project before uploading.");
       return;
@@ -30890,7 +30992,7 @@ var LatticeChat = (props) => {
 // src/components/Chat/AgentConversations.tsx
 import { Conversations } from "@ant-design/x";
 import { theme as theme16 } from "antd";
-import { useMemo as useMemo31 } from "react";
+import { useMemo as useMemo32 } from "react";
 import { jsx as jsx119 } from "react/jsx-runtime";
 var AgentConversations = ({
   enableThreadCreation = true,
@@ -30911,7 +31013,7 @@ var AgentConversations = ({
     background: "transparent",
     borderRadius: token.borderRadius
   };
-  const threadItems = useMemo31(() => {
+  const threadItems = useMemo32(() => {
     return threads || [];
   }, [threads]);
   const items = threadItems.map((thread2) => ({
@@ -30949,7 +31051,7 @@ var AgentConversations = ({
 import { useContext as useContext11 } from "react";
 
 // src/components/Chat/ChatSidebar.tsx
-import { useState as useState78, useMemo as useMemo32, useCallback as useCallback42 } from "react";
+import { useState as useState77, useMemo as useMemo33, useCallback as useCallback41 } from "react";
 import { Drawer as Drawer3, Avatar as Avatar14, Popover as Popover3, Button as Button56 } from "antd";
 import {
   History as History2,
@@ -30960,7 +31062,7 @@ import {
 } from "lucide-react";
 
 // src/components/Chat/ThreadHistoryMenuContent.tsx
-import React69, { useCallback as useCallback41 } from "react";
+import React69, { useCallback as useCallback40 } from "react";
 import { createStyles as createStyles39 } from "antd-style";
 import { MessageSquare as MessageSquare3, Trash2 as Trash28 } from "lucide-react";
 import { message as message20, Modal as Modal21 } from "antd";
@@ -31074,7 +31176,7 @@ var ThreadHistoryMenuContent = () => {
     deleteThread,
     isLoading
   } = useConversationContext();
-  const handleDeleteThread = useCallback41(
+  const handleDeleteThread = useCallback40(
     async (e, threadIdToDelete) => {
       e.stopPropagation();
       Modal21.confirm({
@@ -31187,8 +31289,8 @@ var ChatSidebar = ({
   const { sideAppVisible, menuCollapsed, setMenuCollapsed } = useChatUIContext();
   const { user, logout } = useAuth();
   const { createThread } = useConversationContext();
-  const [drawerStates, setDrawerStates] = useState78({});
-  const [changePasswordOpen, setChangePasswordOpen] = useState78(false);
+  const [drawerStates, setDrawerStates] = useState77({});
+  const [changePasswordOpen, setChangePasswordOpen] = useState77(false);
   const {
     sidebarMode,
     sidebarShowToggle,
@@ -31197,11 +31299,11 @@ var ChatSidebar = ({
     sidebarLogoIcon
   } = config;
   const isExpandedMode = sidebarMode === "expanded";
-  const menuItems = useMemo32(() => {
+  const menuItems = useMemo33(() => {
     const items = customMenuItems.length > 0 ? [...customMenuItems] : [...DEFAULT_MENU_ITEMS];
     return items.sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
   }, [customMenuItems]);
-  const handleMenuClick = useCallback42(async (item) => {
+  const handleMenuClick = useCallback41(async (item) => {
     if (item.builtin === "settings") {
       setSettingsModalOpen(true);
       onSettingsClick?.();
@@ -31224,17 +31326,17 @@ var ChatSidebar = ({
       }
     }
   }, [onSettingsClick, setSettingsModalOpen, createThread, logout]);
-  const handleCloseDrawer = useCallback42((itemId) => {
+  const handleCloseDrawer = useCallback41((itemId) => {
     setDrawerStates((prev) => ({ ...prev, [itemId]: false }));
   }, []);
-  const handleNewAnalysis = useCallback42(async () => {
+  const handleNewAnalysis = useCallback41(async () => {
     try {
       await createThread("New Analysis");
     } catch (error) {
       console.error("Failed to create new thread:", error);
     }
   }, [createThread]);
-  const renderDrawerContent = useCallback42((item) => {
+  const renderDrawerContent = useCallback41((item) => {
     switch (item.builtin) {
       case "thread-history":
         return /* @__PURE__ */ jsx121(ThreadHistoryMenuContent, {});
@@ -31447,7 +31549,7 @@ var LatticeChatView = (props) => {
 };
 
 // src/components/Chat/SettingsModal.tsx
-import { useState as useState79, useEffect as useEffect52, useRef as useRef27 } from "react";
+import { useState as useState78, useEffect as useEffect51, useRef as useRef27 } from "react";
 import {
   Modal as Modal22,
   Input as Input16,
@@ -31457,14 +31559,14 @@ import {
   Typography as Typography57,
   Alert as Alert9,
   Select as Select8,
-  Switch as Switch3,
+  Switch as Switch4,
   Space as Space39,
   Tabs as Tabs3
 } from "antd";
 import {
   SaveOutlined as SaveOutlined2,
   EnvironmentOutlined,
-  ReloadOutlined as ReloadOutlined5,
+  ReloadOutlined as ReloadOutlined6,
   CheckCircleOutlined as CheckCircleOutlined9,
   ApiOutlined,
   LinkOutlined as LinkOutlined2,
@@ -31836,7 +31938,7 @@ var SettingsModal = ({
 }) => {
   const { styles } = useStyles23();
   const { config: shellConfig, updateConfigValue } = useLatticeChatShellContext();
-  const [connections, setConnections] = useState79(() => {
+  const [connections, setConnections] = useState78(() => {
     if (typeof window !== "undefined") {
       try {
         const stored = localStorage.getItem("lattice_server_connections");
@@ -31859,21 +31961,21 @@ var SettingsModal = ({
     }
     return [];
   });
-  const [serverConfigs, setServerConfigs] = useState79({});
+  const [serverConfigs, setServerConfigs] = useState78({});
   const connectionsRef = useRef27(connections);
-  useEffect52(() => {
+  useEffect51(() => {
     connectionsRef.current = connections;
   }, [connections]);
-  const [activeTabKey, setActiveTabKey] = useState79(
+  const [activeTabKey, setActiveTabKey] = useState78(
     connections.length > 0 ? connections[0].id : ""
   );
-  const [activeMenu, setActiveMenu] = useState79("environment");
-  const [loading, setLoading] = useState79(false);
-  const [showAddServerModal, setShowAddServerModal] = useState79(false);
-  const [newServerUrl, setNewServerUrl] = useState79("");
-  const [newServerName, setNewServerName] = useState79("");
-  const [newServerApiKey, setNewServerApiKey] = useState79("");
-  const [addingServer, setAddingServer] = useState79(false);
+  const [activeMenu, setActiveMenu] = useState78("environment");
+  const [loading, setLoading] = useState78(false);
+  const [showAddServerModal, setShowAddServerModal] = useState78(false);
+  const [newServerUrl, setNewServerUrl] = useState78("");
+  const [newServerName, setNewServerName] = useState78("");
+  const [newServerApiKey, setNewServerApiKey] = useState78("");
+  const [addingServer, setAddingServer] = useState78(false);
   const saveConnections = (newConnections) => {
     setConnections(newConnections);
     if (typeof window !== "undefined") {
@@ -32063,7 +32165,7 @@ var SettingsModal = ({
       console.error("Failed to load models configuration:", error);
     }
   };
-  useEffect52(() => {
+  useEffect51(() => {
     if (open && activeTabKey) {
       initializeServerConfig(activeTabKey);
       const connection = connections.find((c) => c.id === activeTabKey);
@@ -32072,7 +32174,7 @@ var SettingsModal = ({
       }
     }
   }, [open, activeTabKey]);
-  useEffect52(() => {
+  useEffect51(() => {
     if (open && activeTabKey) {
       const connection = connections.find((c) => c.id === activeTabKey);
       if (connection?.connected) {
@@ -32300,7 +32402,7 @@ var SettingsModal = ({
               " QUEUE_SERVICE_TYPE, REDIS_URL, REDIS_PASSWORD, QUEUE_NAME"
             ] }),
             /* @__PURE__ */ jsxs89("div", { children: [
-              /* @__PURE__ */ jsx123(ReloadOutlined5, { style: { color: "#faad14", marginRight: 8 } }),
+              /* @__PURE__ */ jsx123(ReloadOutlined6, { style: { color: "#faad14", marginRight: 8 } }),
               /* @__PURE__ */ jsx123("strong", { children: "Requires restart:" }),
               " PORT (server must be restarted to change port)"
             ] })
@@ -32510,7 +32612,7 @@ QUEUE_NAME=tasks`,
           ] }),
           /* @__PURE__ */ jsx123("div", { children: /* @__PURE__ */ jsxs89(Space39, { children: [
             /* @__PURE__ */ jsx123(
-              Switch3,
+              Switch4,
               {
                 checked: model.streaming,
                 onChange: (checked) => handleModelChange(index, "streaming", checked)
@@ -32852,15 +32954,15 @@ var LatticeChatShell = (props) => {
 };
 
 // src/components/Chat/ChannelInstallationsDrawerContent.tsx
-import { useEffect as useEffect53, useState as useState80 } from "react";
+import { useEffect as useEffect52, useState as useState79 } from "react";
 import {
   Button as Button58,
   Card as Card30,
   Form as Form9,
   Input as Input17,
   Modal as Modal23,
-  Popconfirm as Popconfirm10,
-  Spin as Spin21,
+  Popconfirm as Popconfirm12,
+  Spin as Spin20,
   Tag as Tag29,
   Typography as Typography58,
   message as message22
@@ -32870,10 +32972,10 @@ import { jsx as jsx126, jsxs as jsxs91 } from "react/jsx-runtime";
 var { Text: Text47, Title: Title17 } = Typography58;
 var ChannelInstallationsDrawerContent = () => {
   const { get, post, put, del } = useApi();
-  const [installations, setInstallations] = useState80([]);
-  const [loading, setLoading] = useState80(false);
-  const [formModalOpen, setFormModalOpen] = useState80(false);
-  const [editingInstallation, setEditingInstallation] = useState80(null);
+  const [installations, setInstallations] = useState79([]);
+  const [loading, setLoading] = useState79(false);
+  const [formModalOpen, setFormModalOpen] = useState79(false);
+  const [editingInstallation, setEditingInstallation] = useState79(null);
   const loadInstallations = async () => {
     setLoading(true);
     try {
@@ -32894,7 +32996,7 @@ var ChannelInstallationsDrawerContent = () => {
       setLoading(false);
     }
   };
-  useEffect53(() => {
+  useEffect52(() => {
     loadInstallations();
   }, []);
   const handleDelete = async (installation) => {
@@ -32941,7 +33043,7 @@ var ChannelInstallationsDrawerContent = () => {
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx126("div", { style: { flex: 1, overflowY: "auto", padding: 16 }, children: loading ? /* @__PURE__ */ jsx126("div", { style: { display: "flex", justifyContent: "center", padding: 32 }, children: /* @__PURE__ */ jsx126(Spin21, {}) }) : installations.length === 0 ? /* @__PURE__ */ jsxs91(
+    /* @__PURE__ */ jsx126("div", { style: { flex: 1, overflowY: "auto", padding: 16 }, children: loading ? /* @__PURE__ */ jsx126("div", { style: { display: "flex", justifyContent: "center", padding: 32 }, children: /* @__PURE__ */ jsx126(Spin20, {}) }) : installations.length === 0 ? /* @__PURE__ */ jsxs91(
       "div",
       {
         style: {
@@ -33006,7 +33108,7 @@ var ChannelInstallationsDrawerContent = () => {
             }
           ),
           /* @__PURE__ */ jsx126(
-            Popconfirm10,
+            Popconfirm12,
             {
               title: "Delete Channel Installation",
               description: `Are you sure you want to delete "${installation.name || installation.id}"?`,
@@ -33042,7 +33144,7 @@ var ChannelInstallationsDrawerContent = () => {
 };
 var LarkChannelInstallationFormModal = ({ installation, open, post, put, onCancel, onSave }) => {
   const [form] = Form9.useForm();
-  useEffect53(() => {
+  useEffect52(() => {
     if (installation) {
       const config = installation.config;
       form.setFieldsValue({