@xinghunm/ai-chat 1.1.2 → 1.2.1

package/dist/index.js

@@ -47,7 +47,7 @@ module.exports = __toCommonJS(src_exports);
 
 // src/components/ai-chat/index.tsx
 var import_styled17 = __toESM(require("@emotion/styled"));
-var import_compass_ui5 = require("@xinghunm/compass-ui");
+var import_compass_ui4 = require("@xinghunm/compass-ui");
 
 // src/components/ai-chat-provider/index.tsx
 var import_react2 = require("react");
@@ -96,6 +96,28 @@ var DEFAULT_AI_CHAT_LABELS = {
   questionnaireOtherPlaceholder: "Other"
 };
 
+// src/lib/chat-session.ts
+var DRAFT_CHAT_SESSION_ID_PREFIX = "draft-session-";
+var draftChatSessionSequence = 0;
+var createDraftChatSessionId = () => `${DRAFT_CHAT_SESSION_ID_PREFIX}${Date.now()}-${draftChatSessionSequence++}`;
+var isDraftChatSessionId = (sessionId) => Boolean(sessionId?.startsWith(DRAFT_CHAT_SESSION_ID_PREFIX));
+var createDraftChatSession = ({
+  model,
+  mode = DEFAULT_CHAT_AGENT_MODE,
+  nowIso: nowIso2,
+  createSessionId = createDraftChatSessionId
+}) => {
+  const iso = nowIso2();
+  return {
+    sessionId: createSessionId(),
+    title: "New Chat",
+    createdAt: iso,
+    updatedAt: iso,
+    model,
+    mode
+  };
+};
+
 // src/store/chat-store.ts
 var DEFAULT_CHAT_SESSION_TITLE = "New Chat";
 var IMAGE_MESSAGE_SESSION_TITLE = "Image message";
@@ -229,6 +251,15 @@ var createChatStore = (initialState) => (0, import_vanilla.createStore)((set, ge
       isStoppingBySession: nextIsStoppingBySession
     });
   },
+  startNewChat: () => {
+    const state = get();
+    const session = createDraftChatSession({
+      model: "",
+      mode: state.preferredMode,
+      nowIso: () => (/* @__PURE__ */ new Date()).toISOString()
+    });
+    get().createSession(session);
+  },
   setActiveSession: (sessionId) => {
     set({ activeSessionId: sessionId });
   },
@@ -491,6 +522,7 @@ var startChatStream = async ({
   sessionId,
   authToken,
   requestHeaders,
+  requestBody,
   model,
   mode,
   content,
@@ -512,12 +544,14 @@ var startChatStream = async ({
     const response = await fetch(`${apiBaseUrl}${endpointPath}`, {
       method: "POST",
       headers,
-      body: JSON.stringify({
-        model,
-        mode,
-        stream: true,
-        messages: [{ role: "user", content }]
-      }),
+      body: JSON.stringify(
+        requestBody ?? {
+          model,
+          mode,
+          stream: true,
+          messages: [{ role: "user", content }]
+        }
+      ),
       signal
     });
     const contentType = response.headers.get("content-type") ?? "";
@@ -593,11 +627,70 @@ var createModeDefaultHeaders = (mode) => {
   }
   return {};
 };
+var readFileAsDataUrl = (file) => new Promise((resolve, reject) => {
+  const reader = new FileReader();
+  reader.onload = () => {
+    if (typeof reader.result === "string") {
+      resolve(reader.result);
+      return;
+    }
+    reject(new Error(`Failed to read image attachment: ${file.name}`));
+  };
+  reader.onerror = () => {
+    reject(new Error(`Failed to read image attachment: ${file.name}`));
+  };
+  reader.readAsDataURL(file);
+});
+var resolveAttachmentDataUrl = async (attachment) => {
+  if (attachment.file) {
+    return readFileAsDataUrl(attachment.file);
+  }
+  if (attachment.previewUrl.startsWith("data:image/")) {
+    return attachment.previewUrl;
+  }
+  throw new Error(`Attachment is missing file data: ${attachment.name}`);
+};
+var createDefaultRequestBody = async ({
+  model,
+  mode,
+  content,
+  attachments
+}) => {
+  const hasAttachments = Boolean(attachments?.length);
+  if (!hasAttachments) {
+    return {
+      model,
+      mode,
+      stream: true,
+      messages: [{ role: "user", content }]
+    };
+  }
+  const imageParts = await Promise.all(
+    (attachments ?? []).map(async (attachment) => ({
+      type: "image_url",
+      image_url: {
+        url: await resolveAttachmentDataUrl(attachment)
+      }
+    }))
+  );
+  const messageContent = [
+    ...content ? [{ type: "text", text: content }] : [],
+    ...imageParts
+  ];
+  return {
+    model,
+    mode,
+    stream: true,
+    messages: [{ role: "user", content: messageContent }]
+  };
+};
 var createDefaultChatTransport = ({
   apiBaseUrl,
   authToken,
   toolExecutionPolicy,
   streamHeaders,
+  resolveModels,
+  buildRequestBody,
   transformStreamPacket,
   endpoints,
   axiosInstance
@@ -612,12 +705,13 @@ var createDefaultChatTransport = ({
     ...streamHeaders
   };
   return {
-    getModels: () => getChatModels(client, resolvedEndpoints.models),
+    getModels: () => resolveModels?.() ?? getChatModels(client, resolvedEndpoints.models),
     startStream: async ({
       sessionId,
       model,
       mode,
       content,
+      attachments,
       signal,
       onUpdate,
       onSessionId,
@@ -628,12 +722,20 @@ var createDefaultChatTransport = ({
         ...createModeDefaultHeaders(mode),
         ...resolvedStreamHeaders
       };
+      const requestBody = buildRequestBody ? buildRequestBody({
+        sessionId,
+        model,
+        mode,
+        content,
+        attachments
+      }) : await createDefaultRequestBody({ model, mode, content, attachments });
       await startChatStream({
         apiBaseUrl,
         endpointPath: resolvedEndpoints.completions,
         sessionId,
         authToken,
         requestHeaders,
+        requestBody,
         model,
         mode,
         content,
@@ -675,6 +777,8 @@ var AiChatProvider = (props) => {
   });
   const retryRef = (0, import_react2.useRef)(async () => {
   });
+  const stopRef = (0, import_react2.useRef)(async (_sessionId) => {
+  });
   const defaultApiBaseUrl = "apiBaseUrl" in props ? props.apiBaseUrl : void 0;
   const defaultAuthToken = "authToken" in props ? props.authToken : void 0;
   const defaultTransformStreamPacket = "transformStreamPacket" in props ? props.transformStreamPacket : void 0;
@@ -718,6 +822,7 @@ var AiChatProvider = (props) => {
       labels: { ...DEFAULT_AI_CHAT_LABELS, ...labels },
       sendRef,
       retryRef,
+      stopRef,
       renderMessageBlock,
       handleQuestionnaireSubmit,
       handleConfirmationSubmit,
@@ -738,6 +843,7 @@ var AiChatProvider = (props) => {
       renderMessageBlock,
       sendRef,
       retryRef,
+      stopRef,
       store,
       transport
     ]
@@ -1538,7 +1644,6 @@ var Value = import_styled3.default.span`
 // src/components/chat-thread/components/questionnaire-card.tsx
 var import_react7 = require("react");
 var import_styled4 = __toESM(require("@emotion/styled"));
-var import_compass_ui = require("@xinghunm/compass-ui");
 
 // src/components/chat-thread/components/questionnaire-card-helpers.ts
 var OTHER_OPTION_VALUE = "__other__";
@@ -2339,7 +2444,7 @@ var TextInput = import_styled4.default.input`
     color: rgba(255, 255, 255, 0.34);
   }
 `;
-var InlineOtherInput = (0, import_styled4.default)(import_compass_ui.Input)`
+var InlineOtherInput = import_styled4.default.input`
   width: 100%;
   margin-top: 0;
 
@@ -3727,19 +3832,20 @@ var ChatThread = () => {
     if (!activeSessionId)
       return;
     clearSessionError(activeSessionId);
-    void retryRef.current();
+    void retryRef.current(activeSessionId);
   }, [activeSessionId, clearSessionError, retryRef]);
   const handleQuestionnaireSubmit = (0, import_react11.useCallback)(
     async (submission) => {
+      const sourceSessionId = activeSessionId;
       if (customQuestionnaireSubmit) {
         const handled = await customQuestionnaireSubmit(submission, {
-          sessionId: activeSessionId ?? void 0,
+          sessionId: sourceSessionId ?? void 0,
           mode: activeSessionMode
         });
         if (handled !== false) {
-          if (activeSessionId && submission.sourceMessageId) {
+          if (sourceSessionId && submission.sourceMessageId) {
             updateQA(
-              activeSessionId,
+              sourceSessionId,
               submission.sourceMessageId,
               submission.questionnaireId,
               submission.answers
@@ -3748,10 +3854,13 @@ var ChatThread = () => {
           return;
         }
       }
-      await sendRef.current(submission.content);
-      if (activeSessionId && submission.sourceMessageId) {
+      await sendRef.current(submission.content, {
+        sessionId: sourceSessionId ?? void 0,
+        includeComposerAttachments: false
+      });
+      if (sourceSessionId && submission.sourceMessageId) {
         updateQA(
-          activeSessionId,
+          sourceSessionId,
           submission.sourceMessageId,
           submission.questionnaireId,
           submission.answers
@@ -3762,16 +3871,20 @@ var ChatThread = () => {
   );
   const handleConfirmation = (0, import_react11.useCallback)(
     async (submission) => {
+      const sourceSessionId = activeSessionId;
       if (customConfirmationSubmit) {
         const handled = await customConfirmationSubmit(submission, {
-          sessionId: activeSessionId ?? void 0,
+          sessionId: sourceSessionId ?? void 0,
           mode: activeSessionMode
         });
         if (handled !== false) {
           return;
         }
       }
-      await sendRef.current(submission.content);
+      await sendRef.current(submission.content, {
+        sessionId: sourceSessionId ?? void 0,
+        includeComposerAttachments: false
+      });
     },
     [activeSessionId, activeSessionMode, sendRef, customConfirmationSubmit]
   );
@@ -3908,25 +4021,6 @@ var import_react15 = require("react");
 var import_styled14 = __toESM(require("@emotion/styled"));
 
 // src/components/chat-composer/lib/chat-composer.ts
-var DRAFT_CHAT_SESSION_ID_PREFIX = "draft-session-";
-var createDraftChatSessionId = () => `${DRAFT_CHAT_SESSION_ID_PREFIX}${Date.now()}`;
-var isDraftChatSessionId = (sessionId) => Boolean(sessionId?.startsWith(DRAFT_CHAT_SESSION_ID_PREFIX));
-var createDraftChatSession = ({
-  model,
-  mode = DEFAULT_CHAT_AGENT_MODE,
-  nowIso: nowIso2,
-  createSessionId
-}) => {
-  const iso = nowIso2();
-  return {
-    sessionId: createSessionId(),
-    title: "New Chat",
-    createdAt: iso,
-    updatedAt: iso,
-    model,
-    mode
-  };
-};
 var createUserMessage = ({
   sessionId,
   content,
@@ -4087,7 +4181,8 @@ var useComposerAttachments = () => {
       return [];
     }
     const nextMessageAttachments = currentAttachments.map(({ file: _file, ...attachment }) => ({
-      ...attachment
+      ...attachment,
+      file: _file
     }));
     attachmentsRef.current = [];
     setAttachments([]);
@@ -4126,19 +4221,20 @@ var normalizeChatErrorMessage = (message, labels) => {
   return trimmedMessage;
 };
 var useChatComposer = () => {
-  const { transport, enableImageAttachments, labels } = useChatContext();
+  const { transport, enableImageAttachments, labels, store } = useChatContext();
   const activeSessionId = useChatStore((s) => s.activeSessionId);
   const activeSession = useChatStore(
     (s) => s.sessions.find((x) => x.sessionId === s.activeSessionId) ?? null
   );
   const preferredMode = useChatStore((s) => s.preferredMode);
   const streamingSessionId = useChatStore(
-    (s) => Object.entries(s.isStreamingBySession).find(([, v]) => v)?.[0] ?? null
+    (s) => s.activeSessionId && s.isStreamingBySession[s.activeSessionId] ? s.activeSessionId : null
   );
   const isStreaming = Boolean(streamingSessionId);
-  const isStopping = useChatStore(
-    (s) => streamingSessionId ? s.isStoppingBySession[streamingSessionId] ?? false : false
-  );
+  const isStopping = useChatStore((s) => {
+    const currentStreamingSessionId = s.activeSessionId && s.isStreamingBySession[s.activeSessionId] ? s.activeSessionId : null;
+    return currentStreamingSessionId ? s.isStoppingBySession[currentStreamingSessionId] ?? false : false;
+  });
   const createSession = useChatStore((s) => s.createSession);
   const replaceSessionId = useChatStore((s) => s.replaceSessionId);
   const appendMessage = useChatStore((s) => s.appendMessage);
@@ -4175,9 +4271,9 @@ var useChatComposer = () => {
   const [selectedMode, setSelectedModeLocal] = (0, import_react13.useState)(DEFAULT_CHAT_AGENT_MODE);
   const [attachmentNotice, setAttachmentNotice] = (0, import_react13.useState)(null);
   const { attachments, appendFiles, removeAttachment, takeMessageAttachments } = useComposerAttachments();
-  const abortControllerRef = (0, import_react13.useRef)(null);
-  const stopRequestRef = (0, import_react13.useRef)(null);
-  const lastRequestRef = (0, import_react13.useRef)(null);
+  const abortControllerBySessionRef = (0, import_react13.useRef)(/* @__PURE__ */ new Map());
+  const stopRequestBySessionRef = (0, import_react13.useRef)(/* @__PURE__ */ new Map());
+  const lastRequestBySessionRef = (0, import_react13.useRef)(/* @__PURE__ */ new Map());
   (0, import_react13.useEffect)(() => {
     setSelectedModel(
       (current) => resolveSelectedChatModel({ currentModel: current, availableModels, isModelsLoading })
@@ -4200,33 +4296,47 @@ var useChatComposer = () => {
     return () => window.clearTimeout(timeoutId);
   }, [attachmentNotice]);
   const clearStopTimeout = (sessionId) => {
-    if (!stopRequestRef.current)
+    const stopRequest = stopRequestBySessionRef.current.get(sessionId);
+    if (!stopRequest || stopRequest.timeoutId === null) {
       return;
-    if (sessionId && stopRequestRef.current.sessionId !== sessionId)
-      return;
-    if (stopRequestRef.current.timeoutId !== null) {
-      window.clearTimeout(stopRequestRef.current.timeoutId);
-      stopRequestRef.current.timeoutId = null;
     }
+    window.clearTimeout(stopRequest.timeoutId);
+    stopRequest.timeoutId = null;
   };
   const clearStopRequest = (0, import_react13.useCallback)((sessionId) => {
-    if (!stopRequestRef.current)
-      return;
-    if (sessionId && stopRequestRef.current.sessionId !== sessionId)
-      return;
     clearStopTimeout(sessionId);
-    stopRequestRef.current = null;
+    stopRequestBySessionRef.current.delete(sessionId);
   }, []);
+  const moveSessionRuntimeState = (0, import_react13.useCallback)(
+    (previousSessionId, nextSessionId) => {
+      if (previousSessionId === nextSessionId) {
+        return;
+      }
+      const abortController = abortControllerBySessionRef.current.get(previousSessionId);
+      if (abortController) {
+        abortControllerBySessionRef.current.set(nextSessionId, abortController);
+        abortControllerBySessionRef.current.delete(previousSessionId);
+      }
+      const stopRequest = stopRequestBySessionRef.current.get(previousSessionId);
+      if (stopRequest) {
+        stopRequestBySessionRef.current.set(nextSessionId, stopRequest);
+        stopRequestBySessionRef.current.delete(previousSessionId);
+      }
+    },
+    []
+  );
   const finalizeStop = (0, import_react13.useCallback)(
     (sessionId) => {
-      if (stopRequestRef.current?.sessionId === sessionId) {
-        if (stopRequestRef.current.finalized)
+      const stopRequest = stopRequestBySessionRef.current.get(sessionId);
+      if (stopRequest) {
+        if (stopRequest.finalized) {
           return;
-        stopRequestRef.current.finalized = true;
+        }
+        stopRequest.finalized = true;
       }
       clearStopTimeout(sessionId);
-      abortControllerRef.current?.abort();
-      abortControllerRef.current = null;
+      abortControllerBySessionRef.current.get(sessionId)?.abort();
+      abortControllerBySessionRef.current.delete(sessionId);
       finalizeStoppedStreamingMessage(sessionId);
       clearStopRequest(sessionId);
     },
@@ -4237,10 +4347,11 @@ var useChatComposer = () => {
       localSessionId,
       sessionId,
       content,
+      attachments: attachments2,
       model,
       mode
     }) => {
-      clearStopRequest();
+      clearStopRequest(localSessionId);
       let currentSessionId = localSessionId;
       clearSessionError(currentSessionId);
       const assistantMessage = createAssistantStreamingMessage({
@@ -4249,29 +4360,44 @@ var useChatComposer = () => {
         createMessageId: () => `assistant-${Date.now()}`
       });
       startStreamingMessage(currentSessionId, assistantMessage);
-      abortControllerRef.current?.abort();
-      abortControllerRef.current = new AbortController();
-      lastRequestRef.current = { localSessionId, sessionId, content, model, mode };
+      abortControllerBySessionRef.current.get(currentSessionId)?.abort();
+      const abortController = new AbortController();
+      abortControllerBySessionRef.current.set(currentSessionId, abortController);
+      lastRequestBySessionRef.current.set(currentSessionId, {
+        localSessionId,
+        sessionId,
+        content,
+        attachments: attachments2,
+        model,
+        mode
+      });
       let accumulated = "";
+      let streamSettled = false;
       try {
         await transport.startStream({
           sessionId,
           model,
           mode,
           content,
-          signal: abortControllerRef.current.signal,
+          attachments: attachments2,
+          signal: abortController.signal,
           onSessionId: (nextSessionId) => {
             if (!nextSessionId || nextSessionId === currentSessionId)
               return;
-            replaceSessionId(currentSessionId, nextSessionId);
+            const previousSessionId = currentSessionId;
+            replaceSessionId(previousSessionId, nextSessionId);
+            moveSessionRuntimeState(previousSessionId, nextSessionId);
             currentSessionId = nextSessionId;
-            lastRequestRef.current = {
+            const nextRequest = {
               localSessionId: nextSessionId,
               sessionId: nextSessionId,
               content,
+              attachments: attachments2,
               model,
               mode
             };
+            lastRequestBySessionRef.current.delete(previousSessionId);
+            lastRequestBySessionRef.current.set(nextSessionId, nextRequest);
           },
           onUpdate: (update) => {
             accumulated = resolveAccumulatedContent(accumulated, update);
@@ -4281,16 +4407,18 @@ var useChatComposer = () => {
             });
           },
           onDone: () => {
-            if (stopRequestRef.current?.sessionId === currentSessionId) {
+            streamSettled = true;
+            if (stopRequestBySessionRef.current.has(currentSessionId)) {
               finalizeStop(currentSessionId);
               return;
             }
             completeStreamingMessage(currentSessionId);
-            abortControllerRef.current = null;
+            abortControllerBySessionRef.current.delete(currentSessionId);
             clearStopRequest(currentSessionId);
           },
           onError: (streamError) => {
-            if (stopRequestRef.current?.sessionId === currentSessionId) {
+            streamSettled = true;
+            if (stopRequestBySessionRef.current.has(currentSessionId)) {
               finalizeStop(currentSessionId);
               return;
             }
@@ -4299,12 +4427,24 @@ var useChatComposer = () => {
               currentSessionId,
               normalizeChatErrorMessage(streamError.message, labels)
             );
-            abortControllerRef.current = null;
+            abortControllerBySessionRef.current.delete(currentSessionId);
             clearStopRequest(currentSessionId);
           }
         });
-      } catch {
-        abortControllerRef.current = null;
+      } catch (streamError) {
+        abortControllerBySessionRef.current.delete(currentSessionId);
+        if (streamSettled || abortController.signal.aborted || !store.getState().isStreamingBySession[currentSessionId]) {
+          return;
+        }
+        finalizeStoppedStreamingMessage(currentSessionId);
+        setSessionError(
+          currentSessionId,
+          normalizeChatErrorMessage(
+            streamError instanceof Error ? streamError.message : void 0,
+            labels
+          )
+        );
+        clearStopRequest(currentSessionId);
       }
     },
     [
@@ -4313,61 +4453,68 @@ var useChatComposer = () => {
       clearStopRequest,
       finalizeStop,
       labels,
+      moveSessionRuntimeState,
       startStreamingMessage,
       replaceSessionId,
       patchStreamingMessage,
       completeStreamingMessage,
       finalizeStoppedStreamingMessage,
-      setSessionError
+      setSessionError,
+      store
     ]
   );
   const send = (0, import_react13.useCallback)(
-    async (contentOverride) => {
+    async (contentOverride, options) => {
       const content = (contentOverride ?? value).trim();
-      const hasText = Boolean(content);
-      const hasAttachments = attachments.length > 0;
+      const includeComposerAttachments = options?.includeComposerAttachments ?? true;
+      const composerAttachmentCount = includeComposerAttachments ? attachments.length : 0;
       if (!canSendChatMessage({
         value: content,
-        attachmentCount: attachments.length,
+        attachmentCount: composerAttachmentCount,
         isModelsLoading,
         isModelsError,
         hasModels
       })) {
         return;
       }
-      if (hasText && !(selectedModel || activeSession?.model || availableModels[0]?.id)) {
+      const storeState = store.getState();
+      const currentActiveSessionId = options?.sessionId ?? storeState.activeSessionId;
+      const currentActiveSession = storeState.sessions.find((session2) => session2.sessionId === currentActiveSessionId) ?? null;
+      const currentMode = currentActiveSession?.mode ?? selectedMode;
+      if (!(selectedModel || currentActiveSession?.model || availableModels[0]?.id)) {
         return;
       }
-      const resolvedModel = selectedModel || activeSession?.model || availableModels[0]?.id || "local-image";
+      const resolvedModel = selectedModel || currentActiveSession?.model || availableModels[0]?.id || "local-image";
       const { localSessionId, sessionId, session } = resolveSendSession({
-        activeSessionId,
+        activeSessionId: currentActiveSessionId,
         selectedModel: resolvedModel,
-        selectedMode,
+        selectedMode: currentMode,
         nowIso,
         createSessionId: createDraftChatSessionId
       });
       if (session)
         createSession(session);
-      const messageAttachments = takeMessageAttachments();
+      const messageAttachments = includeComposerAttachments ? takeMessageAttachments() : void 0;
       const userMessage = createUserMessage({
         sessionId: localSessionId,
         content,
         attachments: messageAttachments,
-        localOnly: hasAttachments,
+        localOnly: false,
         createdAt: nowIso(),
         createMessageId: () => `user-${Date.now()}`
       });
       appendMessage(localSessionId, userMessage);
-      setAttachmentNotice(null);
-      setValue("");
-      if (!hasText)
-        return;
+      if (includeComposerAttachments) {
+        setAttachmentNotice(null);
+        setValue("");
+      }
       await runStream({
         localSessionId,
         sessionId,
         content,
+        attachments: messageAttachments,
         model: resolvedModel,
-        mode: selectedMode
+        mode: currentMode
       });
     },
     [
@@ -4377,16 +4524,47 @@ var useChatComposer = () => {
       isModelsError,
       hasModels,
       selectedModel,
-      activeSession,
       availableModels,
-      activeSessionId,
       selectedMode,
       createSession,
       takeMessageAttachments,
       appendMessage,
-      runStream
+      runStream,
+      store
     ]
   );
+  const stopSession = (0, import_react13.useCallback)(
+    async (sessionId) => {
+      const storeState = store.getState();
+      const isSessionStreaming = storeState.isStreamingBySession[sessionId] ?? false;
+      const isSessionStopping = storeState.isStoppingBySession[sessionId] ?? false;
+      if (!isSessionStreaming || isSessionStopping) {
+        return;
+      }
+      if (isDraftChatSessionId(sessionId)) {
+        finalizeStop(sessionId);
+        return;
+      }
+      requestStopStreaming(sessionId);
+      stopRequestBySessionRef.current.set(sessionId, {
+        timeoutId: window.setTimeout(() => {
+          finalizeStop(sessionId);
+        }, STOP_WAIT_TIMEOUT_MS),
+        finalized: false
+      });
+      try {
+        const result = await transport.terminateStream(sessionId);
+        if (!result.terminated) {
+          console.error("Failed to terminate chat session: server returned not terminated");
+        }
+        finalizeStop(sessionId);
+      } catch (err) {
+        console.error("Failed to terminate chat session", err);
+        finalizeStop(sessionId);
+      }
+    },
+    [finalizeStop, requestStopStreaming, store, transport]
+  );
   return {
     state: {
       value,
@@ -4426,43 +4604,27 @@ var useChatComposer = () => {
         setPreferredMode(mode);
         if (activeSessionId)
           setSessionMode(activeSessionId, mode);
-        if (lastRequestRef.current && activeSessionId && (lastRequestRef.current.localSessionId === activeSessionId || lastRequestRef.current.sessionId === activeSessionId)) {
-          lastRequestRef.current = { ...lastRequestRef.current, mode };
+        if (activeSessionId) {
+          const previousRequest = lastRequestBySessionRef.current.get(activeSessionId);
+          if (previousRequest) {
+            lastRequestBySessionRef.current.set(activeSessionId, { ...previousRequest, mode });
+          }
         }
       },
       reloadModels: () => void fetchModels(),
+      stopSession,
       stop: async () => {
         if (!streamingSessionId)
           return;
-        if (isStopping)
-          return;
-        if (isDraftChatSessionId(streamingSessionId)) {
-          finalizeStop(streamingSessionId);
-          return;
-        }
-        requestStopStreaming(streamingSessionId);
-        stopRequestRef.current = {
-          sessionId: streamingSessionId,
-          timeoutId: window.setTimeout(() => {
-            finalizeStop(streamingSessionId);
-          }, STOP_WAIT_TIMEOUT_MS),
-          finalized: false
-        };
-        try {
-          const result = await transport.terminateStream(streamingSessionId);
-          if (!result.terminated) {
-            console.error("Failed to terminate chat session: server returned not terminated");
-          }
-          finalizeStop(streamingSessionId);
-        } catch (err) {
-          console.error("Failed to terminate chat session", err);
-          finalizeStop(streamingSessionId);
-        }
+        await stopSession(streamingSessionId);
       },
-      retry: () => {
-        if (!lastRequestRef.current)
+      retry: (sessionId) => {
+        if (!sessionId)
+          return;
+        const request = lastRequestBySessionRef.current.get(sessionId);
+        if (!request)
           return;
-        void runStream(lastRequestRef.current);
+        void runStream(request);
       }
     }
   };
@@ -4627,7 +4789,7 @@ var CloseGlyph = import_styled10.default.span`
 
 // src/components/chat-composer/components/chat-model-control.tsx
 var import_styled11 = __toESM(require("@emotion/styled"));
-var import_compass_ui2 = require("@xinghunm/compass-ui");
+var import_compass_ui = require("@xinghunm/compass-ui");
 var import_jsx_runtime12 = require("@emotion/react/jsx-runtime");
 var ChatModelControl = ({
   selectedModel,
@@ -4728,7 +4890,7 @@ var ModelReloadButton = import_styled11.default.button`
 var ReloadIcon = import_styled11.default.svg`
   flex-shrink: 0;
 `;
-var ModelSelect = (0, import_styled11.default)(import_compass_ui2.Select)`
+var ModelSelect = (0, import_styled11.default)(import_compass_ui.Select)`
   && {
     width: auto;
     min-width: 0;
@@ -4749,7 +4911,7 @@ var ModelSelect = (0, import_styled11.default)(import_compass_ui2.Select)`
 
 // src/components/chat-composer/components/chat-mode-control.tsx
 var import_styled12 = __toESM(require("@emotion/styled"));
-var import_compass_ui3 = require("@xinghunm/compass-ui");
+var import_compass_ui2 = require("@xinghunm/compass-ui");
 var import_jsx_runtime13 = require("@emotion/react/jsx-runtime");
 var ChatModeControl = ({
   value,
@@ -4772,7 +4934,7 @@ var ChatModeControl = ({
     }
   );
 };
-var ModeSelect = (0, import_styled12.default)(import_compass_ui3.Select)`
+var ModeSelect = (0, import_styled12.default)(import_compass_ui2.Select)`
   && {
     flex: 0 1 auto;
     width: auto;
@@ -4794,7 +4956,7 @@ var ModeSelect = (0, import_styled12.default)(import_compass_ui3.Select)`
 
 // src/components/chat-composer/components/chat-send-actions.tsx
 var import_styled13 = __toESM(require("@emotion/styled"));
-var import_compass_ui4 = require("@xinghunm/compass-ui");
+var import_compass_ui3 = require("@xinghunm/compass-ui");
 var import_jsx_runtime14 = require("@emotion/react/jsx-runtime");
 var ArrowUpIcon = () => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
   "svg",
@@ -4848,7 +5010,7 @@ var ChatSendActions = ({
     onClick: () => void onSend()
   }
 ) });
-var PrimaryButton = (0, import_styled13.default)(import_compass_ui4.Button)`
+var PrimaryButton = (0, import_styled13.default)(import_compass_ui3.Button)`
   && {
     min-width: 24px;
     width: 24px;
@@ -4874,7 +5036,7 @@ var PrimaryButton = (0, import_styled13.default)(import_compass_ui4.Button)`
     }
   }
 `;
-var StopButton = (0, import_styled13.default)(import_compass_ui4.Button)`
+var StopButton = (0, import_styled13.default)(import_compass_ui3.Button)`
   && {
     min-width: 24px;
     width: 24px;
@@ -5109,7 +5271,7 @@ var ChatComposerView = ({
         }
       ) : null,
       /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-        Input2,
+        Input,
         {
           ref: inputRef,
           "data-testid": "chat-composer-input",
@@ -5170,15 +5332,16 @@ var ChatComposerView = ({
   ] }) });
 };
 var ChatComposer = () => {
-  const { labels, sendRef, retryRef, enableImageAttachments } = useChatContext();
+  const { labels, sendRef, retryRef, stopRef, enableImageAttachments } = useChatContext();
   const { state, actions } = useChatComposer();
   const { send, retry } = actions;
   (0, import_react15.useEffect)(() => {
     sendRef.current = send;
-    retryRef.current = async () => {
-      retry();
+    retryRef.current = async (sessionId) => {
+      retry(sessionId);
     };
-  }, [retry, retryRef, send, sendRef]);
+    stopRef.current = actions.stopSession;
+  }, [actions.stopSession, retry, retryRef, send, sendRef, stopRef]);
   const modeLabels = {
     ask: labels.modeLabelAsk,
     plan: labels.modeLabelPlan,
@@ -5253,7 +5416,7 @@ var InputArea = import_styled14.default.div`
   grid-area: input;
   position: relative;
 `;
-var Input2 = import_styled14.default.textarea`
+var Input = import_styled14.default.textarea`
   --textarea-line-height: ${CHAT_COMPOSER_LINE_HEIGHT_PX}px;
   --textarea-min-rows: ${CHAT_COMPOSER_MIN_ROWS};
   --textarea-max-rows: ${CHAT_COMPOSER_MAX_ROWS};
@@ -5324,9 +5487,9 @@ var ComposerExpandButton = import_styled14.default.button`
 var Footer = import_styled14.default.div`
   grid-area: footer;
   display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
+  grid-template-columns: auto minmax(0, 1fr);
   align-items: flex-end;
-  gap: 16px;
+  gap: 8px;
   padding: 0 14px 14px;
 `;
 var LeadingActions = import_styled14.default.div`
@@ -5341,6 +5504,9 @@ var TrailingActions = import_styled14.default.div`
   align-items: center;
   flex-wrap: wrap;
   min-width: 0;
+  width: fit-content;
+  max-width: 100%;
+  justify-self: end;
   justify-content: flex-end;
   gap: 8px;
 `;
@@ -5427,28 +5593,17 @@ var ChatConversationList = () => {
   const { labels } = useChatContext();
   const sessions = useChatStore((s) => s.sessions);
   const activeSessionId = useChatStore((s) => s.activeSessionId);
-  const preferredMode = useChatStore((s) => s.preferredMode);
-  const createSession = useChatStore((s) => s.createSession);
+  const startNewChat = useChatStore((s) => s.startNewChat);
   const setActiveSession = useChatStore((s) => s.setActiveSession);
   const modeLabels = {
     ask: labels.modeLabelAsk,
     plan: labels.modeLabelPlan,
     agent: labels.modeLabelAgent
   };
-  const handleCreateSession = () => {
-    const session = createDraftChatSession({
-      // Model is intentionally deferred: ChatComposer resolves selectedModel at send time.
-      model: "",
-      mode: preferredMode,
-      nowIso: () => (/* @__PURE__ */ new Date()).toISOString(),
-      createSessionId: createDraftChatSessionId
-    });
-    createSession(session);
-  };
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Container3, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Toolbar, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Title3, { children: "Sessions" }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(CreateButton, { type: "button", "data-testid": "chat-create-session", onClick: handleCreateSession, children: labels.newChat })
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(CreateButton, { type: "button", "data-testid": "chat-create-session", onClick: startNewChat, children: labels.newChat })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(List2, { "data-testid": "chat-session-list", children: sessions.map((session) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       ChatSessionItem,
@@ -5500,8 +5655,70 @@ var List2 = import_styled16.default.div`
 
 // src/components/ai-chat/index.tsx
 var import_jsx_runtime18 = require("@emotion/react/jsx-runtime");
-var AiChat = ({ showConversationList = false, ...providerProps }) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-  import_compass_ui5.ConfigProvider,
+var QuickActions = ({ renderNewChatTrigger }) => {
+  const { labels, stopRef, store } = useChatContext();
+  const startNewChat = useChatStore((state) => state.startNewChat);
+  const activeSessionId = useChatStore((state) => state.activeSessionId);
+  const isActiveSessionStreaming = useChatStore(
+    (state) => state.activeSessionId ? state.isStreamingBySession[state.activeSessionId] ?? false : false
+  );
+  const isActiveSessionStopping = useChatStore(
+    (state) => state.activeSessionId ? state.isStoppingBySession[state.activeSessionId] ?? false : false
+  );
+  const createNewSession = () => {
+    startNewChat();
+  };
+  const stopActiveSession = async () => {
+    const currentState = store.getState();
+    const currentSessionId = currentState.activeSessionId;
+    const isCurrentSessionStreaming = currentSessionId ? currentState.isStreamingBySession[currentSessionId] ?? false : false;
+    if (!currentSessionId || !isCurrentSessionStreaming) {
+      return;
+    }
+    await stopRef.current(currentSessionId);
+  };
+  const handleStartNewChat = async () => {
+    const currentState = store.getState();
+    const currentSessionId = currentState.activeSessionId;
+    const isCurrentSessionStreaming = currentSessionId ? currentState.isStreamingBySession[currentSessionId] ?? false : false;
+    if (currentSessionId && isCurrentSessionStreaming) {
+      void stopRef.current(currentSessionId);
+    }
+    createNewSession();
+  };
+  const triggerProps = {
+    activeSessionId,
+    isStreaming: isActiveSessionStreaming,
+    isStopping: isActiveSessionStopping,
+    createNewSession,
+    stopActiveSession,
+    startNewChat: handleStartNewChat
+  };
+  if (renderNewChatTrigger) {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(QuickActionsRow, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(NewChatTriggerRenderer, { renderNewChatTrigger, triggerProps }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(QuickActionsRow, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    QuickActionButton,
+    {
+      type: "button",
+      "data-testid": "chat-start-new-session",
+      onClick: () => void handleStartNewChat(),
+      disabled: isActiveSessionStopping,
+      children: labels.newChat
+    }
+  ) });
+};
+var NewChatTriggerRenderer = ({
+  renderNewChatTrigger,
+  triggerProps
+}) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children: renderNewChatTrigger(triggerProps) });
+var AiChat = ({
+  showConversationList = false,
+  showNewChatButton = false,
+  renderNewChatTrigger,
+  ...providerProps
+}) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  import_compass_ui4.ConfigProvider,
   {
     theme: {
       token: {
@@ -5538,6 +5755,7 @@ var AiChat = ({ showConversationList = false, ...providerProps }) => /* @__PURE_
     children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AiChatProvider, { ...providerProps, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(Root, { "data-testid": "ai-chat", children: [
       showConversationList ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChatConversationList, {}) : null,
       /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(Workspace, { children: [
+        showNewChatButton && !showConversationList ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(QuickActions, { renderNewChatTrigger }) : null,
         /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChatThread, {}),
         /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChatComposer, {})
       ] })
@@ -5555,9 +5773,28 @@ var Workspace = import_styled17.default.section`
   flex: 1;
   display: flex;
   flex-direction: column;
+  gap: 12px;
   min-height: 0;
   overflow: hidden;
 `;
+var QuickActionsRow = import_styled17.default.div`
+  display: flex;
+  justify-content: flex-end;
+  padding: 12px 12px 0;
+`;
+var QuickActionButton = import_styled17.default.button`
+  border: none;
+  border-radius: 12px;
+  padding: 10px 14px;
+  background: rgba(255, 255, 255, 0.08);
+  color: var(--text-primary, #fcfbf8);
+  cursor: pointer;
+
+  &:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+`;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AiChat,