@meistrari/chat-nuxt 3.11.0 → 3.12.0-rc.0

package/dist/runtime/messages/components/reasoning/chat-reasoning-thought.vue

@@ -14,17 +14,15 @@ const SUCCESS_ANIMATION_DURATION_MS = 1e3;
 const DOT_ANIMATION_INTERVAL_MS = 500;
 const AUTO_COLLAPSE_DELAY_MS = 1500;
 const TEXT_TRUNCATE_LENGTH = 40;
-const isExpanded = ref(false);
+const isExpanded = ref(!props.completed);
 const userHasExpanded = ref(false);
 const showingSuccess = ref(false);
 const wasEverPending = ref(!props.completed);
-const previewContainer = ref(null);
 const dotCount = ref(0);
 const elapsedTime = ref(0);
 let dotInterval;
 let timerInterval;
 const storageKey = computed(() => `reasoning-timer-${new Date(props.createdAt).getTime()}`);
-const showGradient = computed(() => !props.completed && !isExpanded.value);
 const displayedReasoning = computed(
   () => resolveDisplayedReasoning(props.reasoningData, props.preparingSteps)
 );
@@ -74,26 +72,11 @@ const loadingText = computed(() => {
   const dots = ".".repeat(dotCount.value);
   return `${currentStepName.value}${dots}`;
 });
-function toggleExpanded() {
-  userHasExpanded.value = true;
-  isExpanded.value = !isExpanded.value;
-}
-function scheduleScroll() {
-  requestAnimationFrame(() => {
-    if (!previewContainer.value)
-      return;
-    previewContainer.value.scrollTop = previewContainer.value.scrollHeight;
-  });
-}
-watch(() => groupedReasoning.value.length, () => {
-  if (props.completed || isExpanded.value || !previewContainer.value) {
-    return;
-  }
-  scheduleScroll();
-});
 watch(() => props.completed, (newCompleted, oldCompleted) => {
   if (!newCompleted) {
     wasEverPending.value = true;
+    if (!userHasExpanded.value)
+      isExpanded.value = true;
   }
   if (newCompleted && !oldCompleted && wasEverPending.value) {
     showingSuccess.value = true;
@@ -101,19 +84,13 @@ watch(() => props.completed, (newCompleted, oldCompleted) => {
       showingSuccess.value = false;
       if (!userHasExpanded.value) {
         setTimeout(() => {
-          isExpanded.value = false;
+          if (props.completed)
+            isExpanded.value = false;
         }, AUTO_COLLAPSE_DELAY_MS);
       }
     }, SUCCESS_ANIMATION_DURATION_MS);
   }
 });
-watch(isExpanded, (newExpanded, oldExpanded) => {
-  if (!newExpanded && oldExpanded) {
-    nextTick(() => {
-      scheduleScroll();
-    });
-  }
-});
 watch(() => props.completed, (isCompleted) => {
   if (!isCompleted && !dotInterval) {
     dotInterval = setInterval(() => {
@@ -150,11 +127,6 @@ onMounted(() => {
       elapsedTime.value = Date.now() - startTime;
     }
   }
-  if (hasReasoning.value && !isExpanded.value) {
-    nextTick(() => {
-      scheduleScroll();
-    });
-  }
 });
 onUnmounted(() => {
   if (dotInterval)
@@ -209,14 +181,15 @@ onUnmounted(() => {
                         key="loading-text"
                         class="body-14-regular flex items-center gap-8px"
                     >
-                        <span
-                            :class="hasReasoning ? 'text-gray-700' : 'running-gradient-text'"
-                        >
-                            {{ hasReasoning ? currentStepName : loadingText }}
+                        <span v-if="hasReasoning" class="text-gray-700">
+                            {{ currentStepName }}
                         </span>
+                        <TelaChatTextShimmer v-else>
+                            {{ loadingText }}
+                        </TelaChatTextShimmer>
                         <span
                             v-if="liveFormattedDuration"
-                            class="text-12px text-gray-500 timer-mono"
+                            body-12-regular text-secondary
                         >
                             ({{ liveFormattedDuration }})
                         </span>
@@ -234,34 +207,9 @@ onUnmounted(() => {
                 </button>
             </TelaCollapsibleTrigger>
 
-            <!-- Preview mode: Always visible during loading, with gradient -->
-            <div
-                v-if="!completed && !isExpanded"
-                border="~ 0.5 default rounded-16px"
-                mt-8px mb-16px
-                cursor-pointer
-                @click="toggleExpanded"
-            >
-                <div
-                    ref="previewContainer"
-                    class="preview-container"
-                    :class="{ 'with-gradient': showGradient }"
-                >
-                    <ChatReasoningSteps
-                        :reasoning-data="displayedReasoning"
-                        :animate="animate && !completed"
-                        :completed="completed"
-                        :is-preview-mode="true"
-                    />
-                </div>
-            </div>
-
-            <!-- Expanded mode: Full content without gradient -->
+            <!-- Open while running, collapsible once done -->
             <TelaCollapsibleContent>
-                <div
-                    border="~ 0.5 default rounded-16px"
-                    mb-16px
-                >
+                <div mb-8px>
                     <ChatReasoningSteps
                         :reasoning-data="displayedReasoning"
                         :animate="animate && !completed"
@@ -274,5 +222,5 @@ onUnmounted(() => {
 </template>
 
 <style scoped>
-.running-gradient-text{background:linear-gradient(90deg,#9da2aa,#f4f5f7 50%,#9da2aa);background-clip:text;-webkit-background-clip:text;background-size:200% 100%;-webkit-text-fill-color:transparent;animation:gradientAnimation 1.5s linear infinite}.static-gradient-text{color:#9da2aa}.preview-container{max-height:153px;overflow-x:hidden;overflow-y:auto;position:relative;scrollbar-width:none;-ms-overflow-style:none}.preview-container.with-gradient{mask-image:linear-gradient(180deg,transparent 0,#000 60%,#000);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 60%,#000)}.preview-container::-webkit-scrollbar{display:none}@keyframes gradientAnimation{0%{background-position:200% 50%}to{background-position:0 50%}}.loading-dot{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.success-check{animation:successFade .2s ease-out}@keyframes successFade{0%{opacity:0}to{opacity:1}}.timer-mono{font-family:ui-monospace,SFMono-Regular,SF Mono,Monaco,Cascadia Mono,Segoe UI Mono,Roboto Mono,Oxygen Mono,"Ubuntu Monospace",Source Code Pro,Fira Mono,Droid Sans Mono,Courier New,monospace;font-variant-numeric:tabular-nums}
+.static-gradient-text{color:#9da2aa}.loading-dot{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.success-check{animation:successFade .2s ease-out}@keyframes successFade{0%{opacity:0}to{opacity:1}}
 </style>

package/dist/runtime/messages/composables/chat-message-terminal.js

@@ -11,15 +11,15 @@ export function terminalMessageTransitions(previousMessages, nextMessages) {
   const transitions = [];
   for (const message of nextMessages) {
     const previous = previousById.get(message.id);
-    if (message.role !== "assistant" || previous?.status !== "pending" /* Pending */)
+    if (message.role !== "assistant" || !previous)
       continue;
-    if (message.status === "completed" /* Completed */) {
+    if (previous.status === "pending" /* Pending */ && message.status === "completed" /* Completed */) {
       transitions.push({
         conversationId: message.conversationId,
         messageId: message.id,
         status: "completed" /* Completed */
       });
-    } else if (message.status === "failed" /* Failed */) {
+    } else if (message.status === "failed" /* Failed */ && (previous.status === "pending" /* Pending */ || previous.status === "completed" /* Completed */)) {
       transitions.push({
         conversationId: message.conversationId,
         messageId: message.id,

package/dist/runtime/messages/composables/chat.d.ts

@@ -1,11 +1,16 @@
-import type { DeepReadonly } from 'vue';
+import { type DeepReadonly, type MaybeRefOrGetter } from 'vue';
 import type { Conversation, ConversationWithMessages, Message } from '../../types/schemas/chat/conversations.js';
 import type { FileUploadInput } from '../../types/schemas/chat/files.js';
 import type { SendMessageBody } from '../../types/schemas/chat/messages.js';
 import type { TelaAgentExecutionInput } from '../../types/schemas/integrations/tela-agent-api.js';
+import { type QueuedSend } from './outbound-queue.js';
 export declare function resolveTelaAgentInputs(messageInputs: TelaAgentExecutionInput[] | undefined, configuredInputs: DeepReadonly<TelaAgentExecutionInput[]> | null | undefined): SendMessageBody['agentInputs'];
 export declare function resolveStreamingContent(authoritative: string, provisional: string): string;
-export declare function useChat(): {
+export declare function useChat(options?: {
+    outboundQueueEnabled?: MaybeRefOrGetter<boolean>;
+    onQueuedSendCancelled?: (send: QueuedSend) => void;
+    onQueuedSendFailed?: (send: QueuedSend) => void;
+}): {
     currentConversation: any;
     messages: any;
     loading: any;
@@ -13,6 +18,12 @@ export declare function useChat(): {
     error: any;
     isPolling: any;
     hasPendingMessage: any;
+    composerLocked: any;
+    queuedMessageContent: any;
+    outboundOccupied: any;
+    sessionReady: any;
+    agentSessionStatus: any;
+    agentSessionRewakeable: any;
     streamingActiveMessageId: any;
     preparingSteps: any;
     cancelling: any;
@@ -25,7 +36,10 @@ export declare function useChat(): {
     pendingModelSelection: any;
     sendMessage: (content: string, files?: FileUploadInput[], agentInputs?: TelaAgentExecutionInput[], prepare?: (signal: AbortSignal) => Promise<{
         wakeSessionId?: string;
-    }>) => Promise<Message | null>;
+        defer?: boolean;
+    }>, queuedSend?: QueuedSend) => Promise<Message | null>;
+    flushOutboundQueue: (wakeSessionId?: string) => Promise<Message | null>;
+    failOutboundQueue: (message: string) => boolean;
     retryMessage: (messageId: string, wakeSessionId?: string) => Promise<boolean>;
     cancelConversation: () => Promise<boolean>;
     startPolling: () => void;

package/dist/runtime/messages/composables/chat.js

@@ -1,5 +1,6 @@
 import { useChatAuth } from "#chat-auth";
 import * as Sentry from "@sentry/nuxt";
+import { toValue } from "vue";
 import { defaultChatModel } from "../../types/schemas/chat/models.js";
 import {
   createReasoningCache,
@@ -12,18 +13,20 @@ import {
   restoreAssistantMessageAfterRetryFailure,
   selectTitleGenerationMessages,
   shouldTreatLoadedConversationTitleAsGenerated,
-  CANCELLATION_FAILED_TEXT
+  CANCELLATION_FAILED_TEXT,
+  GENERATION_FAILED_TEXT
 } from "../message-state.js";
 import { exportConversationToMarkdown } from "../../conversations/export.js";
 import { resolveChatStateScope } from "../../conversations/scope.js";
-import { getChatApiErrorCode, getChatApiErrorMessage } from "../../shared/chat-api-error.js";
+import { getChatApiErrorCode, getChatApiErrorMessage, getChatApiErrorStatus } from "../../shared/chat-api-error.js";
 import { useChatApi } from "../../shared/composables/chat-api.js";
 import { useConversationFileActions } from "../../files/composables/conversation-files.js";
 import { useEmbedConfig } from "../../embed/composables/embed-config.js";
 import { CHAT_PREPARING_STEPS, nextChatPreparingStepDelay } from "../../embed/loading-messages.js";
 import { usePolling } from "../../shared/composables/polling.js";
-import { terminalMessageTransitions, useChatMessageTerminal } from "./chat-message-terminal.js";
+import { ChatMessageStatus, terminalMessageTransitions, useChatMessageTerminal } from "./chat-message-terminal.js";
 import { useDirectStream } from "./use-direct-stream.js";
+import { useOutboundQueue } from "./outbound-queue.js";
 const WORKSPACE_AGENT_NOT_READY_TEXT = "O agente deste workspace ainda n\xE3o foi configurado no Tela. Abra as configura\xE7\xF5es do workspace para criar o agente.";
 export function resolveTelaAgentInputs(messageInputs, configuredInputs) {
   const inputs = messageInputs ?? configuredInputs;
@@ -36,7 +39,7 @@ export function resolveStreamingContent(authoritative, provisional) {
     return authoritative;
   return authoritative || provisional;
 }
-export function useChat() {
+export function useChat(options = {}) {
   const chatApi = useChatApi();
   const chatMessageTerminal = useChatMessageTerminal();
   const embedConfig = useEmbedConfig();
@@ -67,6 +70,23 @@ export function useChat() {
       };
     }
   });
+  const agentSessionStatusBuckets = useState("chat-agent-session-status", () => ({}));
+  const agentSessionExecutableBuckets = useState("chat-agent-session-executable", () => ({}));
+  const agentSessionRewakeableBuckets = useState("chat-agent-session-rewakeable", () => ({}));
+  const agentSessionStatus = computed({
+    get: () => agentSessionStatusBuckets.value[chatScope.value] ?? null,
+    set: (value) => agentSessionStatusBuckets.value = { ...agentSessionStatusBuckets.value, [chatScope.value]: value }
+  });
+  const agentSessionExecutable = computed({
+    get: () => agentSessionExecutableBuckets.value[chatScope.value] ?? false,
+    set: (value) => agentSessionExecutableBuckets.value = { ...agentSessionExecutableBuckets.value, [chatScope.value]: value }
+  });
+  const agentSessionRewakeable = computed({
+    get: () => agentSessionRewakeableBuckets.value[chatScope.value] ?? false,
+    set: (value) => agentSessionRewakeableBuckets.value = { ...agentSessionRewakeableBuckets.value, [chatScope.value]: value }
+  });
+  const outbound = useOutboundQueue(chatScope);
+  const outboundQueueEnabled = computed(() => toValue(options.outboundQueueEnabled) ?? false);
   const loading = ref(false);
   const sending = ref(false);
   const gateHolding = ref(false);
@@ -104,11 +124,49 @@ export function useChat() {
   const hasPendingMessage = computed(
     () => messages.value.some((m) => m.status === "pending")
   );
+  const sessionReady = computed(() => {
+    if (!currentConversation.value?.threadSessionId)
+      return null;
+    return agentSessionStatus.value === "waiting_messages" && agentSessionExecutable.value;
+  });
+  const composerLocked = computed(() => hasPendingMessage.value || outbound.occupied.value);
+  const queuedMessageContent = computed(() => outbound.slot.value?.content ?? null);
   const streamingMessageId = ref(null);
+  const pendingStreamReconciliationIds = ref(/* @__PURE__ */ new Set());
   let requestDurableRecovery = () => {
   };
+  function optimisticallyCompleteStreamedMessage(result) {
+    if (result.status === "waiting_messages") {
+      agentSessionStatus.value = "waiting_messages";
+      agentSessionExecutable.value = true;
+      agentSessionRewakeable.value = false;
+    }
+    const messageId = streamingMessageId.value;
+    if (!messageId)
+      return;
+    const pendingMessage = messages.value.find(
+      (message) => message.id === messageId && message.role === "assistant" && message.status === ChatMessageStatus.Pending
+    );
+    if (!pendingMessage)
+      return;
+    pendingStreamReconciliationIds.value = /* @__PURE__ */ new Set([
+      ...pendingStreamReconciliationIds.value,
+      messageId
+    ]);
+    messages.value = messages.value.map((message) => message.id === messageId ? {
+      ...message,
+      content: resolveStreamingContent(message.content, result.text),
+      status: ChatMessageStatus.Completed
+    } : message);
+    chatMessageTerminal.emit({
+      conversationId: pendingMessage.conversationId,
+      messageId,
+      status: ChatMessageStatus.Completed
+    });
+  }
   const directStream = useDirectStream({
-    onResult: () => requestDurableRecovery(),
+    onResult: optimisticallyCompleteStreamedMessage,
+    onTerminal: () => requestDurableRecovery(),
     onDisconnect: () => requestDurableRecovery()
   });
   const streamingActiveMessageId = computed(
@@ -121,12 +179,16 @@ export function useChat() {
     const content = directStream.streamingText.value;
     if (!messageId || !content)
       return resolved;
-    return resolved.map((message) => message.id === messageId && message.status === "pending" ? { ...message, content: resolveStreamingContent(message.content, content) } : message);
+    return resolved.map((message) => message.id === messageId && (message.status === "pending" || pendingStreamReconciliationIds.value.has(message.id)) ? { ...message, content: resolveStreamingContent(message.content, content) } : message);
   });
-  const stopCondition = computed(() => !hasPendingMessage.value);
+  const stopCondition = computed(
+    () => !hasPendingMessage.value && pendingStreamReconciliationIds.value.size === 0
+  );
   let pollGeneration = 0;
   const pollMessages = async () => {
-    if (!currentConversation.value || gateHolding.value)
+    if (!currentConversation.value)
+      return;
+    if (gateHolding.value && !outboundQueueEnabled.value)
       return;
     const generation = pollGeneration;
     try {
@@ -136,9 +198,34 @@ export function useChat() {
       );
       if (generation !== pollGeneration)
         return;
-      const terminalMessages = terminalMessageTransitions(messages.value, response.messages);
-      messages.value = response.messages;
-      const latestSessionId = response.messages.findLast((message) => message.agentSessionId)?.agentSessionId;
+      if (response.agentSession) {
+        agentSessionStatus.value = response.agentSession.status;
+        agentSessionExecutable.value = response.agentSession.executable;
+        agentSessionRewakeable.value = response.agentSession.rewakeable ?? false;
+      }
+      if (gateHolding.value)
+        return;
+      const currentMessagesById = new Map(messages.value.map((message) => [message.id, message]));
+      const remainingReconciliationIds = new Set(pendingStreamReconciliationIds.value);
+      const durableMessageIds = new Set(response.messages.map((message) => message.id));
+      for (const messageId of remainingReconciliationIds) {
+        if (!durableMessageIds.has(messageId))
+          remainingReconciliationIds.delete(messageId);
+      }
+      const reconciledMessages = response.messages.map((message) => {
+        if (!remainingReconciliationIds.has(message.id))
+          return message;
+        if (message.status === ChatMessageStatus.Completed || message.status === ChatMessageStatus.Failed) {
+          remainingReconciliationIds.delete(message.id);
+          return message;
+        }
+        const optimisticMessage = currentMessagesById.get(message.id);
+        return optimisticMessage?.status === ChatMessageStatus.Completed ? optimisticMessage : message;
+      });
+      const terminalMessages = terminalMessageTransitions(messages.value, reconciledMessages);
+      pendingStreamReconciliationIds.value = remainingReconciliationIds;
+      messages.value = reconciledMessages;
+      const latestSessionId = reconciledMessages.findLast((message) => message.agentSessionId)?.agentSessionId;
       if (latestSessionId && currentConversation.value.threadSessionId === null) {
         currentConversation.value = {
           ...currentConversation.value,
@@ -148,7 +235,7 @@ export function useChat() {
       for (const terminalMessage of terminalMessages)
         chatMessageTerminal.emit(terminalMessage);
       if (response.newFiles && response.newFiles.length > 0) {
-        const lastAssistantMessage = response.messages.findLast((m) => m.role === "assistant");
+        const lastAssistantMessage = reconciledMessages.findLast((m) => m.role === "assistant");
         if (lastAssistantMessage) {
           addFilesToConversation(
             currentConversation.value.id,
@@ -165,7 +252,22 @@ export function useChat() {
       const errorRecord = err && typeof err === "object" ? err : null;
       const statusCode = typeof errorRecord?.statusCode === "number" ? errorRecord.statusCode : typeof errorRecord?.status === "number" ? errorRecord.status : typeof errorRecord?.response?.status === "number" ? errorRecord.response.status : null;
       if (statusCode && statusCode >= 400 && statusCode < 500 && statusCode !== 408 && statusCode !== 429) {
-        messages.value = markPendingAssistantMessagesFailed(messages.value);
+        const previousMessages = messages.value;
+        const failedMessages = markPendingAssistantMessagesFailed(previousMessages).map((message) => {
+          if (message.role !== "assistant" || message.status !== ChatMessageStatus.Completed || !pendingStreamReconciliationIds.value.has(message.id)) {
+            return message;
+          }
+          return {
+            ...message,
+            content: GENERATION_FAILED_TEXT,
+            status: ChatMessageStatus.Failed
+          };
+        });
+        const terminalMessages = terminalMessageTransitions(previousMessages, failedMessages);
+        pendingStreamReconciliationIds.value = /* @__PURE__ */ new Set();
+        messages.value = failedMessages;
+        for (const terminalMessage of terminalMessages)
+          chatMessageTerminal.emit(terminalMessage);
         error.value = getChatApiErrorMessage(err) ?? "Erro ao atualizar mensagens";
         stopPolling();
       }
@@ -219,6 +321,10 @@ export function useChat() {
     const conversationMessages = "messages" in conv ? conv.messages : [];
     currentConversation.value = { ...conv, messages: conversationMessages };
     messages.value = conversationMessages;
+    pendingStreamReconciliationIds.value = /* @__PURE__ */ new Set();
+    agentSessionStatus.value = null;
+    agentSessionExecutable.value = false;
+    agentSessionRewakeable.value = false;
     titleGenerated.value = false;
     error.value = null;
   };
@@ -233,6 +339,7 @@ export function useChat() {
       );
       currentConversation.value = data;
       messages.value = data.messages;
+      pendingStreamReconciliationIds.value = /* @__PURE__ */ new Set();
       if (shouldTreatLoadedConversationTitleAsGenerated(data.messages)) {
         titleGenerated.value = true;
       }
@@ -255,16 +362,20 @@ export function useChat() {
       loading.value = false;
     }
   };
-  const sendMessage = async (content, files, agentInputs, prepare) => {
+  const sendMessage = async (content, files, agentInputs, prepare, queuedSend) => {
     if (!currentConversation.value && !prepare)
       return null;
+    if (outboundQueueEnabled.value && outbound.occupied.value && !queuedSend)
+      return null;
     sending.value = true;
     error.value = null;
     sendStartedAt = Date.now();
     schedulePreparingSteps();
     const filesWithSource = files?.map((f) => ({ ...f, source: "user" })) ?? null;
     const conversationId = currentConversation.value?.id ?? "";
-    const optimisticUserMessage = {
+    const existingOptimisticUserMessage = queuedSend ? messages.value.find((message) => message.id === queuedSend.optimisticIds.user) : void 0;
+    const existingOptimisticAssistantMessage = queuedSend ? messages.value.find((message) => message.id === queuedSend.optimisticIds.assistant) : void 0;
+    const optimisticUserMessage = existingOptimisticUserMessage ?? {
       id: crypto.randomUUID(),
       conversationId,
       role: "user",
@@ -278,7 +389,7 @@ export function useChat() {
       createdAt: /* @__PURE__ */ new Date(),
       updatedAt: null
     };
-    const optimisticAssistantMessage = {
+    const optimisticAssistantMessage = existingOptimisticAssistantMessage ?? {
       id: crypto.randomUUID(),
       conversationId,
       role: "assistant",
@@ -294,15 +405,19 @@ export function useChat() {
     };
     streamingMessageId.value = optimisticAssistantMessage.id;
     directStream.beginMessage();
-    messages.value = [...messages.value, optimisticUserMessage, optimisticAssistantMessage];
+    if (!queuedSend)
+      messages.value = [...messages.value, optimisticUserMessage, optimisticAssistantMessage];
     const controller = new AbortController();
     gateController = controller;
     try {
-      let wakeSessionId;
+      let wakeSessionId = queuedSend?.wakeSessionId;
+      let defer = false;
       if (prepare) {
         gateHolding.value = true;
         try {
-          wakeSessionId = (await prepare(controller.signal)).wakeSessionId;
+          const prepared = await prepare(controller.signal);
+          wakeSessionId = prepared.wakeSessionId;
+          defer = prepared.defer === true;
         } finally {
           gateHolding.value = false;
         }
@@ -311,6 +426,21 @@ export function useChat() {
         throw new DOMException("Aborted", "AbortError");
       if (!currentConversation.value)
         throw new Error("Erro ao enviar mensagem");
+      const sessionReady2 = currentConversation.value.threadSessionId ? agentSessionStatus.value === "waiting_messages" && agentSessionExecutable.value : null;
+      if (outboundQueueEnabled.value && !queuedSend && (defer || sessionReady2 === false)) {
+        outbound.enqueue({
+          content,
+          files,
+          agentInputs,
+          wakeSessionId,
+          optimisticIds: { user: optimisticUserMessage.id, assistant: optimisticAssistantMessage.id },
+          queuedAt: Date.now(),
+          attempts: 0
+        });
+        gateHolding.value = true;
+        startPolling();
+        return optimisticUserMessage;
+      }
       const resolvedAgentInputs = resolveTelaAgentInputs(agentInputs, embedConfig?.telaAgentInputs?.value);
       const body = {
         content,
@@ -347,7 +477,10 @@ export function useChat() {
           acceptMessagePair
         );
         acceptedByStream = true;
-      } catch {
+      } catch (streamError) {
+        const statusCode = getChatApiErrorStatus(streamError);
+        if (statusCode !== null && statusCode >= 400 && statusCode < 500)
+          throw streamError;
         response = await $fetch(
           chatApi.path(`/conversations/${currentConversation.value.id}/messages`),
           chatApi.withChatHeaders({ method: "POST", body })
@@ -366,6 +499,30 @@ export function useChat() {
         startPolling();
       return response.userMessage;
     } catch (err) {
+      const code = getChatApiErrorCode(err);
+      const queuedAttempts = (queuedSend?.attempts ?? 0) + 1;
+      const queuedAgeMs = Date.now() - (queuedSend?.queuedAt ?? Date.now());
+      if (outboundQueueEnabled.value && (code === "turn_in_progress" || code === "sandbox_not_woken") && queuedAttempts < 3 && queuedAgeMs <= 9e4) {
+        outbound.replace({
+          content,
+          files,
+          agentInputs,
+          wakeSessionId: queuedSend?.wakeSessionId,
+          optimisticIds: { user: optimisticUserMessage.id, assistant: optimisticAssistantMessage.id },
+          queuedAt: queuedSend?.queuedAt ?? Date.now(),
+          attempts: queuedAttempts
+        });
+        if (code === "sandbox_not_woken") {
+          agentSessionExecutable.value = false;
+          agentSessionRewakeable.value = true;
+        } else {
+          agentSessionStatus.value = "running";
+          agentSessionExecutable.value = false;
+        }
+        gateHolding.value = true;
+        startPolling();
+        return optimisticUserMessage;
+      }
       messages.value = messages.value.filter(
         (msg) => msg.id !== optimisticUserMessage.id && msg.id !== optimisticAssistantMessage.id
       );
@@ -377,27 +534,84 @@ export function useChat() {
         return null;
       const message = getChatApiErrorCode(err) === "workspace_agent_not_ready" ? WORKSPACE_AGENT_NOT_READY_TEXT : err instanceof Error ? err.message : "Erro ao enviar mensagem";
       error.value = message;
+      if (outboundQueueEnabled.value && queuedSend)
+        options.onQueuedSendFailed?.(queuedSend);
       Sentry.captureException(err);
       return null;
     } finally {
       sending.value = false;
-      gateHolding.value = false;
+      gateHolding.value = outbound.occupied.value;
       if (gateController === controller)
         gateController = null;
     }
   };
+  let outboundFlushInFlight = null;
+  function flushOutboundQueue(wakeSessionId) {
+    if (outboundFlushInFlight)
+      return outboundFlushInFlight;
+    const queued = outbound.take();
+    if (!queued)
+      return Promise.resolve(null);
+    gateHolding.value = false;
+    const send = wakeSessionId ? { ...queued, wakeSessionId } : queued;
+    const pending = sendMessage(send.content, send.files, send.agentInputs, void 0, send);
+    outboundFlushInFlight = pending;
+    void pending.finally(() => {
+      if (outboundFlushInFlight === pending)
+        outboundFlushInFlight = null;
+    });
+    return pending;
+  }
+  function failOutboundQueue(message) {
+    const queued = outbound.clear();
+    if (!queued)
+      return false;
+    messages.value = messages.value.filter(
+      (item) => item.id !== queued.optimisticIds.user && item.id !== queued.optimisticIds.assistant
+    );
+    gateHolding.value = false;
+    streamingMessageId.value = null;
+    clearPreparingSteps();
+    directStream.disconnect();
+    stopPolling();
+    error.value = message;
+    options.onQueuedSendFailed?.(queued);
+    return true;
+  }
+  watch(sessionReady, (ready) => {
+    if (ready === true && outbound.occupied.value)
+      void flushOutboundQueue();
+  });
   const clearConversation = () => {
     stopPolling();
     gateController?.abort();
     streamingMessageId.value = null;
     clearPreparingSteps();
     directStream.disconnect();
+    outbound.clear();
     currentConversation.value = null;
     messages.value = [];
+    pendingStreamReconciliationIds.value = /* @__PURE__ */ new Set();
     error.value = null;
+    agentSessionStatus.value = null;
+    agentSessionExecutable.value = false;
+    agentSessionRewakeable.value = false;
   };
   const cancelling = ref(false);
   const cancelConversation = async () => {
+    const queued = outbound.clear();
+    if (queued) {
+      messages.value = messages.value.filter(
+        (message) => message.id !== queued.optimisticIds.user && message.id !== queued.optimisticIds.assistant
+      );
+      gateHolding.value = false;
+      streamingMessageId.value = null;
+      clearPreparingSteps();
+      directStream.disconnect();
+      stopPolling();
+      options.onQueuedSendCancelled?.(queued);
+      return true;
+    }
     if (gateHolding.value) {
       gateController?.abort();
       return true;
@@ -445,6 +659,7 @@ export function useChat() {
         messages: []
       };
       messages.value = [];
+      pendingStreamReconciliationIds.value = /* @__PURE__ */ new Set();
       streamingMessageId.value = null;
       directStream.disconnect();
       return true;
@@ -548,8 +763,8 @@ export function useChat() {
       messages: messages.value
     });
   };
-  watch(hasPendingMessage, (isPending, wasPending) => {
-    if (wasPending && !isPending) {
+  watch(stopCondition, (settled, wasSettled) => {
+    if (settled && !wasSettled) {
       streamingMessageId.value = null;
       directStream.disconnect();
       void generateTitle();
@@ -566,6 +781,12 @@ export function useChat() {
     error: readonly(error),
     isPolling: readonly(isPolling),
     hasPendingMessage,
+    composerLocked,
+    queuedMessageContent,
+    outboundOccupied: outbound.occupied,
+    sessionReady,
+    agentSessionStatus: readonly(agentSessionStatus),
+    agentSessionRewakeable: readonly(agentSessionRewakeable),
     streamingActiveMessageId,
     preparingSteps: readonly(preparingSteps),
     cancelling: readonly(cancelling),
@@ -577,6 +798,8 @@ export function useChat() {
     setConversationModel,
     pendingModelSelection,
     sendMessage,
+    flushOutboundQueue,
+    failOutboundQueue,
     retryMessage,
     cancelConversation,
     startPolling,