From c81a499e6e4ca0aa068928314a91fef6d8224ebe Mon Sep 17 00:00:00 2001
From: Bryan Van Deusen <bryan.vandeusen@fabledsword.com>
Date: Fri, 3 Apr 2026 14:18:34 -0400
Subject: [PATCH] fix(tts): add speak() for complete responses; fix briefing
 message commit race

---
 frontend/src/composables/useStreamingTts.ts | 17 ++++++++++++++++-
 frontend/src/views/BriefingView.vue         | 13 ++++++++-----
 frontend/src/views/ChatView.vue             |  2 +-
 frontend/src/views/WorkspaceView.vue        |  2 +-
 4 files changed, 26 insertions(+), 8 deletions(-)

diff --git a/frontend/src/composables/useStreamingTts.ts b/frontend/src/composables/useStreamingTts.ts
index f813caa..dda7084 100644
--- a/frontend/src/composables/useStreamingTts.ts
+++ b/frontend/src/composables/useStreamingTts.ts
@@ -52,6 +52,8 @@ export interface UseStreamingTtsReturn {
   speaking: ComputedRef<boolean>
   /** Cancel all in-flight synthesis/playback and clear the queue. */
   stop: () => void
+  /** Speak a complete text through the same sentence-chunking pipeline. */
+  speak: (text: string) => void
 }
 
 export function useStreamingTts(options: UseStreamingTtsOptions): UseStreamingTtsReturn {
@@ -139,5 +141,18 @@ export function useStreamingTts(options: UseStreamingTtsOptions): UseStreamingTt
     }
   })
 
-  return { speaking, stop }
+  function speak(text: string): void {
+    stop()
+    if (!text.trim()) return
+    const myAbortId = abortId
+    const { sentences, remainder } = extractSentences(text)
+    for (const sentence of sentences) {
+      enqueueSentence(sentence, myAbortId)
+    }
+    if (remainder.trim().length >= MIN_CHARS) {
+      enqueueSentence(remainder.trim(), myAbortId)
+    }
+  }
+
+  return { speaking, stop, speak }
 }
diff --git a/frontend/src/views/BriefingView.vue b/frontend/src/views/BriefingView.vue
index 661a5ec..89b50c9 100644
--- a/frontend/src/views/BriefingView.vue
+++ b/frontend/src/views/BriefingView.vue
@@ -148,11 +148,14 @@ watch(selectedConvId, async (id) => {
   }
 })
 
-// Refresh messages after streaming ends
+// Refresh messages after streaming ends — read from store directly (already updated before streaming=false)
 watch(() => chatStore.streaming, async (streaming) => {
-  if (!streaming && _mounted && selectedConvId.value === todayConvId.value && todayConvId.value) {
-    const today = await getBriefingToday().catch(() => null)
-    if (_mounted && today) messages.value = today.messages
+  if (!streaming && _mounted && selectedConvId.value === todayConvId.value) {
+    const storeMessages = chatStore.currentConversation?.messages
+    if (_mounted && storeMessages?.length) {
+      messages.value = storeMessages as unknown as BriefingMessage[]
+    }
+    await nextTick()
     if (_mounted) scrollToBottom()
   }
 })
@@ -420,7 +423,7 @@ onMounted(async () => {
             v-if="voiceTtsEnabled"
             class="btn-icon"
             :class="{ 'btn-icon-active': listenMode, 'btn-icon-busy': tts.speaking.value }"
-            @click="listenMode = !listenMode; if (!listenMode) tts.stop()"
+            @click="listenMode = !listenMode; if (listenMode) tts.speak([...messages].reverse().find(m => m.role === 'assistant')?.content ?? ''); else tts.stop()"
             :title="listenMode ? 'Stop auto-read' : 'Read replies aloud'"
             aria-label="Toggle listen mode"
           >
diff --git a/frontend/src/views/ChatView.vue b/frontend/src/views/ChatView.vue
index 1e6dba7..6f21ed2 100644
--- a/frontend/src/views/ChatView.vue
+++ b/frontend/src/views/ChatView.vue
@@ -892,7 +892,7 @@ onUnmounted(() => {
                 <button
                   class="btn-attach btn-listen"
                   :class="{ 'btn-listen--active': listenMode, 'btn-listen--busy': tts.speaking.value }"
-                  @click="listenMode = !listenMode; if (!listenMode) tts.stop()"
+                  @click="listenMode = !listenMode; if (listenMode) tts.speak([...store.currentConversation?.messages ?? []].reverse().find(m => m.role === 'assistant')?.content ?? ''); else tts.stop()"
                   :title="listenMode ? 'Stop auto-read' : 'Read responses aloud'"
                   aria-label="Toggle listen mode"
                 >
diff --git a/frontend/src/views/WorkspaceView.vue b/frontend/src/views/WorkspaceView.vue
index 157b975..4e3e9ff 100644
--- a/frontend/src/views/WorkspaceView.vue
+++ b/frontend/src/views/WorkspaceView.vue
@@ -388,7 +388,7 @@ onUnmounted(async () => {
             :class="{ 'btn-listen-ws--active': listenMode, 'btn-listen-ws--busy': tts.speaking.value }"
             :title="listenMode ? 'Stop auto-read' : 'Read responses aloud'"
             aria-label="Toggle listen mode"
-            @click="listenMode = !listenMode; if (!listenMode) tts.stop()"
+            @click="listenMode = !listenMode; if (listenMode) tts.speak([...chatStore.currentConversation?.messages ?? []].reverse().find(m => m.role === 'assistant')?.content ?? ''); else tts.stop()"
           >
             <svg v-if="!tts.speaking.value" width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
               <path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/>