@open-mercato/ui 0.6.1-develop.3291.1.6fad645fd0 → 0.6.1

package/dist/ai/AiChat.js

@@ -41,6 +41,7 @@ import {
 } from "./useAiChat.js";
 import { useAiChatUpload } from "./useAiChatUpload.js";
 import { useAiShortcuts } from "./useAiShortcuts.js";
+import { LoopTracePanel } from "./LoopTracePanel.js";
 const PREVIEW_DATA_URL_MAX_BYTES = 2 * 1024 * 1024;
 const COMPACT_FOOTER_MAX_WIDTH = 640;
 const MODEL_PICKER_STORAGE_PREFIX = "om-ai-model-picker:";
@@ -73,7 +74,7 @@ function writeModelPickerValue(agentId, value) {
 }
 function useAgentModels(agent) {
   const [providers, setProviders] = React.useState([]);
-  const [allowRuntimeModelOverride, setAllowRuntimeModelOverride] = React.useState(false);
+  const [allowRuntimeOverride, setAllowRuntimeOverride] = React.useState(false);
   const [defaultLabel, setDefaultLabel] = React.useState(null);
   const [loaded, setLoaded] = React.useState(false);
   React.useEffect(() => {
@@ -85,7 +86,8 @@ function useAgentModels(agent) {
         setLoaded(true);
         return;
       }
-      setAllowRuntimeModelOverride(result.result.allowRuntimeModelOverride);
+      const effectiveAllowRuntimeOverride = result.result.allowRuntimeOverride ?? result.result.allowRuntimeModelOverride ?? false;
+      setAllowRuntimeOverride(effectiveAllowRuntimeOverride);
       setProviders(result.result.providers);
       setDefaultLabel(
         result.result.defaultProviderName && result.result.defaultModelName ? `${result.result.defaultProviderName} / ${result.result.defaultModelName}` : result.result.defaultProviderId && result.result.defaultModelId ? `${result.result.defaultProviderId} / ${result.result.defaultModelId}` : null
@@ -93,16 +95,13 @@ function useAgentModels(agent) {
       setLoaded(true);
     });
   }, [agent]);
-  return { providers, allowRuntimeModelOverride, defaultLabel, loaded };
-}
-function firstAvailableModelPickerValue(providers) {
-  for (const provider of providers) {
-    const model = provider.models[0];
-    if (model) {
-      return { providerId: provider.id, modelId: model.id };
-    }
-  }
-  return null;
+  return {
+    providers,
+    allowRuntimeOverride,
+    allowRuntimeModelOverride: allowRuntimeOverride,
+    defaultLabel,
+    loaded
+  };
 }
 function isModelPickerValueAvailable(value, providers) {
   return providers.some(
@@ -197,70 +196,76 @@ function ToolCallList({ toolCalls }) {
   const t = useT();
   const [openId, setOpenId] = React.useState(null);
   if (!toolCalls || toolCalls.length === 0) return null;
-  return /* @__PURE__ */ jsx("div", { className: "space-y-1", "data-ai-chat-tool-calls": "", children: toolCalls.map((call) => {
-    const isOpen = openId === call.id;
-    const isError = call.state === "error";
-    const isPending = call.state === "pending";
-    const isComplete = call.state === "complete";
-    const statusLabel = isError ? t("ai_assistant.chat.toolError", "failed") : isPending ? t("ai_assistant.chat.toolRunning", "running\u2026") : t("ai_assistant.chat.toolDone", "done");
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "rounded-md border border-border bg-muted/30",
-          isError ? "border-destructive/40 bg-destructive/5" : ""
-        ),
-        "data-ai-chat-tool-call": call.toolName,
-        "data-ai-chat-tool-state": call.state,
-        children: [
-          /* @__PURE__ */ jsxs(
-            "button",
-            {
-              type: "button",
-              onClick: () => setOpenId(isOpen ? null : call.id),
-              className: "flex w-full items-center gap-2 px-2 py-1.5 text-left text-xs font-medium hover:bg-muted/60",
-              children: [
-                isOpen ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5 text-muted-foreground", "aria-hidden": true }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 text-muted-foreground", "aria-hidden": true }),
-                isPending ? /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 animate-spin text-muted-foreground", "aria-hidden": true }) : /* @__PURE__ */ jsx(
-                  Wrench,
-                  {
-                    className: cn(
-                      "size-3.5",
-                      isError ? "text-destructive" : "text-muted-foreground"
-                    ),
-                    "aria-hidden": true
-                  }
-                ),
-                /* @__PURE__ */ jsx("span", { className: "font-mono", children: call.toolName }),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    className: cn(
-                      "ml-auto text-[10px] uppercase tracking-wide",
-                      isError ? "text-destructive" : isComplete ? "text-status-success-text" : "text-muted-foreground"
-                    ),
-                    children: statusLabel
-                  }
-                )
-              ]
-            }
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1", "data-ai-chat-tool-calls": "", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-0.5 text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: [
+      /* @__PURE__ */ jsx("span", { children: t("ai_assistant.chat.agentTasksTitle", "Agent tasks") }),
+      /* @__PURE__ */ jsx("span", { children: toolCalls.length })
+    ] }),
+    toolCalls.map((call) => {
+      const isOpen = openId === call.id;
+      const isError = call.state === "error";
+      const isPending = call.state === "pending";
+      const isComplete = call.state === "complete";
+      const statusLabel = isError ? t("ai_assistant.chat.toolError", "failed") : isPending ? t("ai_assistant.chat.toolRunning", "running\u2026") : t("ai_assistant.chat.toolDone", "done");
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "rounded-md border border-border bg-muted/30",
+            isError ? "border-destructive/40 bg-destructive/5" : ""
           ),
-          isOpen ? /* @__PURE__ */ jsxs("div", { className: "space-y-1 border-t border-border/60 px-2 py-1.5 text-xs", children: [
-            call.input !== void 0 ? /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: t("ai_assistant.chat.toolInput", "Input") }),
-              /* @__PURE__ */ jsx("pre", { className: "mt-0.5 max-h-32 overflow-auto rounded bg-background p-1.5 font-mono text-[11px]", children: safeStringify(call.input) })
-            ] }) : null,
-            call.output !== void 0 && !isError ? /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: t("ai_assistant.chat.toolOutput", "Output") }),
-              /* @__PURE__ */ jsx("pre", { className: "mt-0.5 max-h-32 overflow-auto rounded bg-background p-1.5 font-mono text-[11px]", children: safeStringify(call.output) })
-            ] }) : null,
-            call.errorMessage ? /* @__PURE__ */ jsx("div", { className: "text-destructive", children: call.errorMessage }) : null
-          ] }) : null
-        ]
-      },
-      call.id
-    );
-  }) });
+          "data-ai-chat-tool-call": call.toolName,
+          "data-ai-chat-tool-state": call.state,
+          children: [
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => setOpenId(isOpen ? null : call.id),
+                className: "flex w-full items-center gap-2 px-2 py-1.5 text-left text-xs font-medium hover:bg-muted/60",
+                children: [
+                  isOpen ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5 text-muted-foreground", "aria-hidden": true }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 text-muted-foreground", "aria-hidden": true }),
+                  isPending ? /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 animate-spin text-muted-foreground", "aria-hidden": true }) : /* @__PURE__ */ jsx(
+                    Wrench,
+                    {
+                      className: cn(
+                        "size-3.5",
+                        isError ? "text-destructive" : "text-muted-foreground"
+                      ),
+                      "aria-hidden": true
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "font-mono", children: call.toolName }),
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "ml-auto text-[10px] uppercase tracking-wide",
+                        isError ? "text-destructive" : isComplete ? "text-status-success-text" : "text-muted-foreground"
+                      ),
+                      children: statusLabel
+                    }
+                  )
+                ]
+              }
+            ),
+            isOpen ? /* @__PURE__ */ jsxs("div", { className: "space-y-1 border-t border-border/60 px-2 py-1.5 text-xs", children: [
+              call.input !== void 0 ? /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: t("ai_assistant.chat.toolInput", "Input") }),
+                /* @__PURE__ */ jsx("pre", { className: "mt-0.5 max-h-32 overflow-auto rounded bg-background p-1.5 font-mono text-[11px]", children: safeStringify(call.input) })
+              ] }) : null,
+              call.output !== void 0 && !isError ? /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: t("ai_assistant.chat.toolOutput", "Output") }),
+                /* @__PURE__ */ jsx("pre", { className: "mt-0.5 max-h-32 overflow-auto rounded bg-background p-1.5 font-mono text-[11px]", children: safeStringify(call.output) })
+              ] }) : null,
+              call.errorMessage ? /* @__PURE__ */ jsx("div", { className: "text-destructive", children: call.errorMessage }) : null
+            ] }) : null
+          ]
+        },
+        call.id
+      );
+    })
+  ] });
 }
 function ReasoningPanel({ text, streaming }) {
   const t = useT();
@@ -560,6 +565,7 @@ function AiChat({
   uiParts: uiPartsProp,
   debugTools,
   debugPromptSections,
+  loopTrace,
   conversationId,
   suggestions,
   contextItems,
@@ -602,6 +608,7 @@ function AiChat({
   );
   const {
     providers: modelProviders,
+    allowRuntimeOverride,
     allowRuntimeModelOverride,
     defaultLabel: modelDefaultLabel,
     loaded: modelProvidersLoaded
@@ -610,15 +617,15 @@ function AiChat({
     () => readModelPickerValue(agent)
   );
   const effectiveModelPickerValue = React.useMemo(() => {
-    if (!modelProvidersLoaded || !allowRuntimeModelOverride || modelProviders.length === 0) {
+    if (!modelProvidersLoaded || !allowRuntimeOverride || modelProviders.length === 0) {
       return null;
     }
     if (modelPickerValue && isModelPickerValueAvailable(modelPickerValue, modelProviders)) {
       return modelPickerValue;
     }
-    return firstAvailableModelPickerValue(modelProviders);
+    return null;
   }, [
-    allowRuntimeModelOverride,
+    allowRuntimeOverride,
     modelPickerValue,
     modelProviders,
     modelProvidersLoaded
@@ -636,9 +643,8 @@ function AiChat({
       return;
     }
     if (modelPickerValue && !isModelPickerValueAvailable(modelPickerValue, modelProviders)) {
-      const fallback = firstAvailableModelPickerValue(modelProviders);
-      setModelPickerValue(fallback);
-      writeModelPickerValue(agent, fallback);
+      setModelPickerValue(null);
+      writeModelPickerValue(agent, null);
     }
   }, [
     agent,
@@ -695,26 +701,16 @@ function AiChat({
       toolSig
     ].join("#");
   }, [lastAssistant]);
-  const lastStreamUpdateRef = React.useRef(Date.now());
   const lastSnapshotRef = React.useRef("");
   const [, setStreamTick] = React.useState(0);
   React.useEffect(() => {
     if (assistantStreamSnapshot !== lastSnapshotRef.current) {
       lastSnapshotRef.current = assistantStreamSnapshot;
-      lastStreamUpdateRef.current = Date.now();
       setStreamTick((value) => value + 1);
     }
   }, [assistantStreamSnapshot]);
-  React.useEffect(() => {
-    if (!isStreaming && !isSubmitting) return;
-    const interval = window.setInterval(() => {
-      setStreamTick((value) => value + 1);
-    }, 200);
-    return () => window.clearInterval(interval);
-  }, [isStreaming, isSubmitting]);
-  const idleDuringStream = isStreaming && Date.now() - lastStreamUpdateRef.current >= 300;
   const showThinkingIndicator = isSubmitting || isStreaming && (!hasAnyVisibleSignal || hasPendingToolCall || // Tool just returned and the model hasn't started speaking yet.
-  hasCompletedToolCall && !trimmedContent || idleDuringStream);
+  hasCompletedToolCall && !trimmedContent);
   const activeRegistry = registry ?? defaultAiUiPartRegistry;
   const uiParts = React.useMemo(
     () => (uiPartsProp ?? []).map((part) => ({
@@ -1043,7 +1039,7 @@ function AiChat({
                           children: /* @__PURE__ */ jsx(Paperclip, { className: "size-4", "aria-hidden": true })
                         }
                       ),
-                      allowRuntimeModelOverride && modelProviders.length > 0 ? /* @__PURE__ */ jsx(
+                      allowRuntimeOverride && modelProviders.length > 0 ? /* @__PURE__ */ jsx(
                         ModelPicker,
                         {
                           agentId: agent,
@@ -1103,6 +1099,7 @@ function AiChat({
           {
             tools: debugTools,
             promptSections: debugPromptSections,
+            loopTrace: loopTrace ?? chat.lastLoopTrace ?? void 0,
             lastRequestDebug: chat.lastRequestDebug,
             lastResponseDebug: chat.lastResponseDebug,
             status: chat.status,
@@ -1116,6 +1113,7 @@ function AiChat({
 function AiChatDebugPanel({
   tools,
   promptSections,
+  loopTrace,
   lastRequestDebug,
   lastResponseDebug,
   status,
@@ -1129,6 +1127,7 @@ function AiChatDebugPanel({
       "data-ai-chat-debug": "true",
       children: [
         /* @__PURE__ */ jsx("div", { className: "font-semibold", children: t("ai_assistant.chat.debug.panelTitle", "Debug panel") }),
+        loopTrace ? /* @__PURE__ */ jsx(LoopTracePanel, { trace: loopTrace }) : null,
         /* @__PURE__ */ jsxs("details", { className: "rounded border border-border bg-background", "data-ai-chat-debug-section": "tools", open: true, children: [
           /* @__PURE__ */ jsxs("summary", { className: "cursor-pointer px-2 py-1 font-semibold", children: [
             t("ai_assistant.chat.debug.toolsSection", "Resolved tools"),