feat(tts): add TTS buttons to PlanView and FilesView markdown preview with configurable input mode (#1443)

Add TTS controls to markdown preview surfaces so users can listen to plans and markdown files directly from the preview toolbar. Changes: - Add read-aloud / stop buttons to PlanView markdown preview. - Add read-aloud / stop buttons to FilesView markdown preview for markdown files. - Respect the existing showMessageTTSButtons preference in both preview views. - Add a persisted ttsInputMode setting with sanitized/raw modes. - Keep sanitized mode as the default for backward compatibility. - Allow raw markdown only for server TTS providers that can handle markdown. - Always use sanitized text for browser and macOS say fallback paths. - Add Voice Settings controls for TTS input mode. - Add i18n keys for the new preview buttons and setting labels. - Merge latest main and preserve newer FilesView toolbar/editor changes. Validation: - bun test packages/ui/src/stores/useConfigStore.test.ts packages/ui/src/components/chat/message/parts/ToolPart.test.ts packages/web/server/lib/tts/routes.test.js - bun run type-check - bun run lint - git diff --check --------- Co-authored-by: Bohdan Triapitsyn <artmore@protonmail.com>
2026-06-08 19:31:21 +03:00
parent a6bf73b245
commit ba95e13b36
21 changed files with 191 additions and 19 deletions
@@ -1537,6 +1537,9 @@ export const settingsDict = {
  'settings.voice.page.preview.browserVoiceFallback': 'your browser voice',
  'settings.voice.page.preview.voiceLine': 'Hello! I\'m {voiceName}. This is how I sound.',
  'settings.voice.page.preview.customServerLine': 'Hello! This is a preview of the custom TTS server.',
+  'settings.voice.page.field.ttsInputMode': 'TTS Input Mode',
+  'settings.voice.page.field.ttsInputModeSanitized': 'Sanitized',
+  'settings.voice.page.field.ttsInputModeRaw': 'Raw Markdown',
  'settings.openchamber.visual.section.colorMode': 'Color Mode',
  'settings.openchamber.visual.section.mobileLayout': 'Mobile Layout',
  'settings.openchamber.visual.option.mobileLayout.default': 'Old',
@@ -1741,6 +1741,10 @@ export const dict = {
  'chat.messageBody.tts.stopSpeaking': 'Stop speaking',
  'chat.messageBody.tts.readAloud': 'Read aloud',
  'chat.messageBody.tts.readAloudWithProvider': 'Read aloud ({provider} voice)',
+  'planView.tts.readAloud': 'Read plan aloud',
+  'planView.tts.stopSpeaking': 'Stop speaking',
+  'filesView.tts.readAloud': 'Read file aloud',
+  'filesView.tts.stopSpeaking': 'Stop speaking',
  'chat.messageBody.toast.noProject': 'No project found for this session',
  'chat.messageBody.toast.savePlanFailed': 'Failed to save plan',
  'chat.messageBody.toast.planSaved': 'Plan saved',
@@ -1504,6 +1504,9 @@ export const settingsDict = {
  "settings.voice.page.preview.browserVoiceFallback": "voz del navegador",
  "settings.voice.page.preview.voiceLine": "¡Hola! Soy {voiceName}. Así suena mi voz.",
  "settings.voice.page.preview.customServerLine": "¡Hola! Esta es una previsualización del servidor TTS personalizado.",
+  "settings.voice.page.field.ttsInputMode": "Modo de entrada TTS",
+  "settings.voice.page.field.ttsInputModeSanitized": "Texto limpio",
+  "settings.voice.page.field.ttsInputModeRaw": "Markdown sin procesar",
  "settings.openchamber.visual.section.colorMode": "Modo de color",
  "settings.openchamber.visual.section.mobileLayout": "Diseño móvil",
  "settings.openchamber.visual.option.mobileLayout.default": "Anterior",
@@ -1707,6 +1707,10 @@ export const dict: Record<I18nKey, string> = {
  "chat.messageBody.tts.stopSpeaking": "Dejar de hablar",
  "chat.messageBody.tts.readAloud": "Leer en voz alta",
  "chat.messageBody.tts.readAloudWithProvider": "Leer en voz alta ({provider} voz)",
+  "planView.tts.readAloud": "Leer plan en voz alta",
+  "planView.tts.stopSpeaking": "Detener lectura",
+  "filesView.tts.readAloud": "Leer archivo en voz alta",
+  "filesView.tts.stopSpeaking": "Detener lectura",
  "chat.messageBody.toast.noProject": "No se encontró proyecto para esta sesión",
  "chat.messageBody.toast.savePlanFailed": "No se pudo guardar el plan",
  "chat.messageBody.toast.planSaved": "Plan guardado",
@@ -1504,6 +1504,9 @@ export const settingsDict = {
  'settings.voice.page.preview.browserVoiceFallback': '브라우저 음성',
  'settings.voice.page.preview.voiceLine': '안녕하세요! 저는 {voiceName}입니다. 이렇게 들립니다.',
  'settings.voice.page.preview.customServerLine': '안녕하세요! 사용자 정의 TTS 서버 미리보기입니다.',
+  'settings.voice.page.field.ttsInputMode': 'TTS 입력 모드',
+  'settings.voice.page.field.ttsInputModeSanitized': '정제된 텍스트',
+  'settings.voice.page.field.ttsInputModeRaw': '원본 Markdown',
  'settings.openchamber.visual.section.colorMode': '색상 모드',
  'settings.openchamber.visual.section.mobileLayout': '모바일 레이아웃',
  'settings.openchamber.visual.option.mobileLayout.default': '이전',
@@ -1741,6 +1741,10 @@ export const dict: Record<I18nKey, string> = {
  'chat.messageBody.tts.stopSpeaking': '읽기 중지',
  'chat.messageBody.tts.readAloud': '소리 내어 읽기',
  'chat.messageBody.tts.readAloudWithProvider': '소리 내어 읽기({provider} 음성)',
+  'planView.tts.readAloud': '계획 소리 내어 읽기',
+  'planView.tts.stopSpeaking': '읽기 중지',
+  'filesView.tts.readAloud': '파일 소리 내어 읽기',
+  'filesView.tts.stopSpeaking': '읽기 중지',
  'chat.messageBody.toast.noProject': '이 세션의 프로젝트를 찾을 수 없음',
  'chat.messageBody.toast.savePlanFailed': '플랜 저장 실패',
  'chat.messageBody.toast.planSaved': '플랜이 저장되었습니다',
@@ -1749,5 +1749,8 @@ export const settingsDict = {
  'settings.voice.page.tooltip.say': 'Natywne dla macOS. Szybkie, darmowe, offline.',
  'settings.voice.page.tooltip.sttBrowser': 'Web Speech API (Chrome/Edge). Darmowe, bez konfiguracji.',
  'settings.voice.page.tooltip.sttServer': 'Serwer Whisper zgodny z OpenAI. Lepsza dokładność, dowolny język.',
+  'settings.voice.page.field.ttsInputMode': 'Tryb wejścia TTS',
+  'settings.voice.page.field.ttsInputModeSanitized': 'Oczyszczony tekst',
+  'settings.voice.page.field.ttsInputModeRaw': 'Surowy Markdown',
  'settings.window.description': 'Okno ustawień OpenChamber.',
 };
@@ -714,6 +714,10 @@ export const dict: Record<I18nKey, string> = {
  'chat.messageBody.tts.stopSpeaking': 'Przestań mówić',
  'chat.messageBody.tts.readAloud': 'Czytaj na głos',
  'chat.messageBody.tts.readAloudWithProvider': 'Czytaj na głos ({provider} voice)',
+  'planView.tts.readAloud': 'Czytaj plan na głos',
+  'planView.tts.stopSpeaking': 'Zatrzymaj czytanie',
+  'filesView.tts.readAloud': 'Czytaj plik na głos',
+  'filesView.tts.stopSpeaking': 'Zatrzymaj czytanie',
  'chat.messageBody.toast.noProject': 'Nie znaleziono projektu dla tej sesji',
  'chat.messageBody.toast.savePlanFailed': 'Nie udało się zapisać planu',
  'chat.messageBody.toast.planSaved': 'Plan zapisany',
@@ -1504,6 +1504,9 @@ export const settingsDict = {
  "settings.voice.page.preview.browserVoiceFallback": "voz do navegador",
  "settings.voice.page.preview.voiceLine": "Olá! Sou {voiceName}. É assim que minha voz soa.",
  "settings.voice.page.preview.customServerLine": "Olá! Esta é uma prévia do servidor TTS personalizado.",
+  "settings.voice.page.field.ttsInputMode": "Modo de entrada TTS",
+  "settings.voice.page.field.ttsInputModeSanitized": "Texto limpo",
+  "settings.voice.page.field.ttsInputModeRaw": "Markdown bruto",
  "settings.openchamber.visual.section.colorMode": "Modo de cor",
  "settings.openchamber.visual.section.mobileLayout": "Layout móvel",
  "settings.openchamber.visual.option.mobileLayout.default": "Anterior",
@@ -1707,6 +1707,10 @@ export const dict: Record<I18nKey, string> = {
  "chat.messageBody.tts.stopSpeaking": "Parar de falar",
  "chat.messageBody.tts.readAloud": "Ler em voz alta",
  "chat.messageBody.tts.readAloudWithProvider": "Ler em voz alta (voz {provider})",
+  "planView.tts.readAloud": "Ler plano em voz alta",
+  "planView.tts.stopSpeaking": "Parar de falar",
+  "filesView.tts.readAloud": "Ler arquivo em voz alta",
+  "filesView.tts.stopSpeaking": "Parar de falar",
  "chat.messageBody.toast.noProject": "Não foi encontrado projeto para esta sessão",
  "chat.messageBody.toast.savePlanFailed": "Não foi possível salvar o plano",
  "chat.messageBody.toast.planSaved": "Plano salvo",
@@ -1504,6 +1504,9 @@ export const settingsDict = {
  "settings.voice.page.preview.browserVoiceFallback": "голос вашого браузера",
  "settings.voice.page.preview.voiceLine": "Привіт! Я {voiceName}. Ось як я звучу.",
  "settings.voice.page.preview.customServerLine": "Привіт! Це попередній перегляд спеціального сервера TTS.",
+  "settings.voice.page.field.ttsInputMode": "Режим вводу TTS",
+  "settings.voice.page.field.ttsInputModeSanitized": "Очищений текст",
+  "settings.voice.page.field.ttsInputModeRaw": "Сирий Markdown",
  "settings.openchamber.visual.section.colorMode": "Режим теми",
  "settings.openchamber.visual.section.mobileLayout": "Мобільний макет",
  "settings.openchamber.visual.option.mobileLayout.default": "Попередній",
@@ -1707,6 +1707,10 @@ export const dict: Record<I18nKey, string> = {
  "chat.messageBody.tts.stopSpeaking": "Зупинити озвучення",
  "chat.messageBody.tts.readAloud": "Прочитати вголос",
  "chat.messageBody.tts.readAloudWithProvider": "Прочитати вголос (голос {provider})",
+  "planView.tts.readAloud": "Прочитати план вголос",
+  "planView.tts.stopSpeaking": "Зупинити читання",
+  "filesView.tts.readAloud": "Прочитати файл вголос",
+  "filesView.tts.stopSpeaking": "Зупинити читання",
  "chat.messageBody.toast.noProject": "Для цієї сесії не знайдено жодного проєкту",
  "chat.messageBody.toast.savePlanFailed": "Не вдалося зберегти план",
  "chat.messageBody.toast.planSaved": "План збережено",
@@ -1504,6 +1504,9 @@ export const settingsDict = {
  'settings.voice.page.preview.browserVoiceFallback': '你的浏览器声音',
  'settings.voice.page.preview.voiceLine': '你好！我是 {voiceName}。这是我的声音效果。',
  'settings.voice.page.preview.customServerLine': '你好！这是自定义 TTS 服务器的预览。',
+  'settings.voice.page.field.ttsInputMode': 'TTS 输入模式',
+  'settings.voice.page.field.ttsInputModeSanitized': '清理后文本',
+  'settings.voice.page.field.ttsInputModeRaw': '原始 Markdown',
  'settings.openchamber.visual.section.colorMode': '颜色模式',
  'settings.openchamber.visual.section.mobileLayout': '移动端布局',
  'settings.openchamber.visual.option.mobileLayout.default': '旧版',
@@ -1707,6 +1707,10 @@ export const dict: Record<I18nKey, string> = {
  'chat.messageBody.tts.stopSpeaking': '停止朗读',
  'chat.messageBody.tts.readAloud': '朗读',
  'chat.messageBody.tts.readAloudWithProvider': '朗读（{provider} 语音）',
+  'planView.tts.readAloud': '朗读计划',
+  'planView.tts.stopSpeaking': '停止朗读',
+  'filesView.tts.readAloud': '朗读文件',
+  'filesView.tts.stopSpeaking': '停止朗读',
  'chat.messageBody.toast.noProject': '未找到此会话对应的项目',
  'chat.messageBody.toast.savePlanFailed': '保存计划失败',
  'chat.messageBody.toast.planSaved': '计划已保存',
@@ -1425,6 +1425,9 @@
  'settings.voice.page.preview.browserVoiceFallback': '你的瀏覽器聲音',
  'settings.voice.page.preview.voiceLine': '你好！我是 {voiceName}。這是我的聲音效果。',
  'settings.voice.page.preview.customServerLine': '你好！這是自訂 TTS 伺服器的預覽。',
+  'settings.voice.page.field.ttsInputMode': 'TTS 輸入模式',
+  'settings.voice.page.field.ttsInputModeSanitized': '清理後文字',
+  'settings.voice.page.field.ttsInputModeRaw': '原始 Markdown',
  'settings.openchamber.visual.section.colorMode': '顏色模式',
  'settings.openchamber.visual.section.localization': '在地化',
  'settings.openchamber.visual.section.spacingAndLayout': '間距與佈局',
@@ -1711,6 +1711,10 @@ export const dict: Record<I18nKey, string> = {
  'chat.messageBody.tts.stopSpeaking': '停止朗讀',
  'chat.messageBody.tts.readAloud': '朗讀',
  'chat.messageBody.tts.readAloudWithProvider': '朗讀（{provider} 語音）',
+  'planView.tts.readAloud': '朗讀計畫',
+  'planView.tts.stopSpeaking': '停止朗讀',
+  'filesView.tts.readAloud': '朗讀檔案',
+  'filesView.tts.stopSpeaking': '停止朗讀',
  'chat.messageBody.toast.noProject': '找不到此會話對應的專案',
  'chat.messageBody.toast.savePlanFailed': '儲存計畫失敗',
  'chat.messageBody.toast.planSaved': '計畫已儲存',