[251030] feat: implement conditional V1/V2 WebSpeech handling

🕐 커밋 시간: 2025. 10. 30. 03:30:00

📊 변경 통계:
  • 총 파일: 2개
  • 추가: +70줄
  • 삭제: -10줄

📁 수정된 파일:
  ~ src/services/voice/VoiceRecognitionManager.js
  ~ src/views/SearchPanel/VoiceInputOverlay/VoiceInputOverlay.jsx

🔧 주요 변경 내용:
  • CURRENT_WEBSPEECH_VERSION = 'v1'로 설정
  • VoiceInputOverlay의 handleWebSpeechMicClick을 V1/V2로 조건부 분리
  • V1 블록: 기존 Redux dispatch 방식 유지 (현재 활성화)
  • V2 블록: 별도 격리 (미래 Promise 기반 구현 준비)
  • 현재 기능 100% 보호됨 (V2 코드는 절대 실행 안 됨)
  • 디버그 로그 추가 (CURRENT_WEBSPEECH_VERSION 표시)
  • dependency array에 CURRENT_WEBSPEECH_VERSION 추가

com.twin.app.shoptime/src/services/voice/VoiceRecognitionManager.js

@@ -18,6 +18,24 @@ export const WEBSPEECH_VERSION = {
   V2: 'v2',  // 미래: 개선된 기능 추가
 };
 
+/**
+ * ⚠️ 현재 사용 중인 WebSpeech 버전
+ *
+ * V1: Redux dispatch 방식 (현재 기본)
+ *     - 현재 기능 완전 호환
+ *     - continuous=true 기본 구현
+ *
+ * V2: Promise 체인 비동기 방식 (미래)
+ *     - 고급 기능 (타이머, 재시도 등)
+ *     - 아직 VoiceInputOverlay에 통합되지 않음
+ *
+ * 설정 변경 시:
+ * 1. 이 값을 'v2'로 변경
+ * 2. VoiceInputOverlay.jsx의 handleWebSpeechMicClick 검토
+ * 3. 조건부 처리 로직 확인
+ */
+export const CURRENT_WEBSPEECH_VERSION = 'v1';
+
 /**
  * 음성 인식 상태 머신
  */

com.twin.app.shoptime/src/views/SearchPanel/VoiceInputOverlay/VoiceInputOverlay.jsx

@@ -18,6 +18,7 @@ import {
   cleanupWebSpeech,
   startWebSpeech,
 } from '../../../actions/webSpeechActions';
+import { CURRENT_WEBSPEECH_VERSION } from '../../../services/voice/VoiceRecognitionManager';
 import { panel_names } from '../../../utils/Config';
 import TFullPopup from '../../../components/TFullPopup/TFullPopup';
 import TInputSimple, { ICONS, KINDS } from '../TInput/TInputSimple';
@@ -1534,6 +1535,7 @@ const VoiceInputOverlay = ({
     (e) => {
       if (DEBUG_MODE) {
         console.log('🎤 [DEBUG] handleWebSpeechMicClick called, currentMode:', currentMode);
+        console.log('🎤 [DEBUG] CURRENT_WEBSPEECH_VERSION:', CURRENT_WEBSPEECH_VERSION);
       }
 
       // 이벤트 전파 방지 - dim 레이어의 onClick 실행 방지
@@ -1544,11 +1546,15 @@ const VoiceInputOverlay = ({
         e.nativeEvent.stopImmediatePropagation();
       }
 
-      if (currentMode === VOICE_MODES.PROMPT) {
-        // ✨ PROMPT 모드에서만 LISTENING으로 전환 가능
-        console.log('\n🎤 ════════════════════════════════════════════════════════════════');
-        console.log('🎤 [VoiceInput] MIC BUTTON CLICKED - WebSpeech Initialization Flow');
-        console.log('🎤 ════════════════════════════════════════════════════════════════\n');
+      // ============================================================
+      // V1: Redux dispatch 방식 (현재 활성화)
+      // ============================================================
+      if (CURRENT_WEBSPEECH_VERSION === 'v1') {
+        if (currentMode === VOICE_MODES.PROMPT) {
+          // ✨ PROMPT 모드에서만 LISTENING으로 전환 가능
+          console.log('\n🎤 ════════════════════════════════════════════════════════════════');
+          console.log('🎤 [VoiceInput] MIC BUTTON CLICKED - WebSpeech Initialization Flow (V1)');
+          console.log('🎤 ════════════════════════════════════════════════════════════════\n');
 
         // 📋 단계별 처리:
         // 1. WebSpeech 완전 cleanup (이전 상태 제거)
@@ -1656,12 +1662,31 @@ const VoiceInputOverlay = ({
         return () => {
           clearTimeout(reinitializeWebSpeech);
         };
-      } else {
-        // listening 모드 또는 기타 모드에서 클릭 시 -> overlay 닫기
-        if (DEBUG_MODE) {
-          console.log('🎤 [DEBUG] Closing overlay (not in PROMPT mode)');
+        } else {
+          // listening 모드 또는 기타 모드에서 클릭 시 -> overlay 닫기
+          if (DEBUG_MODE) {
+            console.log('🎤 [DEBUG] Closing overlay (not in PROMPT mode)');
+          }
+          handleClose();
         }
-        handleClose();
+      }
+      // ============================================================
+      // V2: Promise 체인 비동기 방식 (미래 - 아직 구현 대기 중)
+      // ============================================================
+      else if (CURRENT_WEBSPEECH_VERSION === 'v2') {
+        console.log('\n🎤 ════════════════════════════════════════════════════════════════');
+        console.log('🎤 [VoiceInput] MIC BUTTON CLICKED - WebSpeech Initialization Flow (V2)');
+        console.log('🎤 ════════════════════════════════════════════════════════════════\n');
+
+        if (DEBUG_MODE) {
+          console.log('🎤 [DEBUG] V2 flow triggered');
+        }
+
+        // ⚠️ V2 로직은 여기에 구현됨
+        // - useWebSpeechManager hook 사용
+        // - Promise 기반 비동기 처리
+        // - 타이머, 재시도 등 고급 기능
+        console.warn('[VoiceInput] ⚠️  V2 구현 아직 준비 중입니다');
       }
     },
     [
@@ -1672,6 +1697,7 @@ const VoiceInputOverlay = ({
       dispatch,
       processFinalVoiceInput,
       addWebSpeechEventLog,
+      CURRENT_WEBSPEECH_VERSION,
     ]
   );