optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[251023] fix: SearchPanel.new.v2.jsx VOICE_RESULT->Intial 모드 구현

Browse Source 
🕐 커밋 시간: 2025. 10. 23. 16:23:57

📊 변경 통계:
  • 총 파일: 1개
  • 추가: +69줄
  • 삭제: -16줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/views/SearchPanel/SearchPanel.new.v2.jsx

🔧 주요 변경 내용:
  • 소규모 기능 개선
This commit is contained in:
hyeon soo noh
2025-10-23 16:23:59 +09:00
parent d2ff9a9a1d
commit 0c9d9bd19e
1 changed files with 78 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
com.twin.app.shoptime/src/views/SearchPanel/SearchPanel.new.v2.jsx
View File

@@ -19,6 +19,7 @@ import {
getSearchMain,
resetSearch,
resetVoiceSearch,
clearShopperHouseData,
} from '../../actions/searchActions';
// import {
// showErrorToast,
@@ -313,30 +314,69 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
* 0hun: panel 뒤로가기 이벤트
*/
const onCancel = useCallback(() => {
console.log('[DEBUG]-onCancel called', {
isOnTop: isOnTopRef.current,
isVoiceOverlayVisible,
isSearchOverlayVisible,
currentMode,
searchQuery,
hasShopperHouseData: !!shopperHouseData,
});
if (!isOnTopRef.current) {
console.log('[DEBUG]-onCancel: isOnTopRef is false, returning');
return;
}
// VoiceInputOverlay가 열려있으면 먼저 닫기
if (isVoiceOverlayVisible) {
console.log('[DEBUG]-onCancel: closing VoiceInputOverlay');
setIsVoiceOverlayVisible(false);
return;
}
// SearchInputOverlay가 열려있으면 먼저 닫기
if (isSearchOverlayVisible) {
console.log('[DEBUG]-onCancel: closing SearchInputOverlay');
setIsSearchOverlayVisible(false);
return;
}
// ✨ [Phase 5] VOICE_RESULT 모드에서 ESC/뒤로가기 누르면 INITIAL 모드로 돌아가기
console.log('[DEBUG]-VOICE_RESULT check:', {
currentMode,
isVoiceResultMode: currentMode === SEARCH_PANEL_MODES.VOICE_RESULT,
VOICE_RESULT_value: SEARCH_PANEL_MODES.VOICE_RESULT,
});
if (currentMode === SEARCH_PANEL_MODES.VOICE_RESULT) {
console.log(
'[DEBUG]-VOICE_RESULT: Clearing ShopperHouse data (searchId will be preserved for 2nd search)'
);
dispatch(clearShopperHouseData()); // ✨ shopperHouseData만 초기화, searchId 유지
Spotlight.focus(SPOTLIGHT_IDS.SEARCH_INPUT_BOX);
return;
}
console.log('[DEBUG]-onCancel: normal cancel logic', { searchQuery });
if (searchQuery === null || searchQuery === '') {
console.log('[DEBUG]-onCancel: popping panel');
dispatch(popPanel(panel_names.SEARCH_PANEL));
} else {
console.log('[DEBUG]-onCancel: resetting search query');
setSearchQuery('');
dispatch(resetSearch());
Spotlight.focus(SPOTLIGHT_IDS.SEARCH_INPUT_BOX);
}
}, [isVoiceOverlayVisible, isSearchOverlayVisible, searchQuery]);
}, [
isVoiceOverlayVisible,
isSearchOverlayVisible,
searchQuery,
currentMode,
dispatch,
shopperHouseData,
]);
/**
* 0hun: paginator 내부 아이템들의 onFocus 이벤트, containerId인자로 받는다
@@ -701,12 +741,29 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
useEffect(() => {
let nextMode = SEARCH_PANEL_MODES.INITIAL;
console.log('[DEBUG]-MODE DECISION useEffect running', {
isVoiceOverlayVisible,
hasShopperHouseData: !!shopperHouseData,
shopperHouseData_detail: shopperHouseData ? 'EXISTS' : 'NULL',
searchPerformed,
searchQuery,
hasSearchResults: !!(
searchDatas?.theme?.length > 0 ||
searchDatas?.item?.length > 0 ||
searchDatas?.show?.length > 0
),
isSearchOverlayVisible,
currentMode,
});
// 우선순위 1: 음성 입력 오버레이가 열려있으면 VOICE_INPUT 모드
if (isVoiceOverlayVisible) {
console.log('[DEBUG]-MODE: isVoiceOverlayVisible is TRUE → VOICE_INPUT');
nextMode = SEARCH_PANEL_MODES.VOICE_INPUT;
}
// 우선순위 2: 음성 검색 결과가 있으면 VOICE_RESULT 모드
else if (shopperHouseData) {
console.log('[DEBUG]-MODE: shopperHouseData EXISTS → VOICE_RESULT');
nextMode = SEARCH_PANEL_MODES.VOICE_RESULT;
}
// 우선순위 3: 검색 결과가 있으면 SEARCH_RESULT 모드
@@ -716,35 +773,38 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
searchDatas?.item?.length > 0 ||
searchDatas?.show?.length > 0
) {
console.log('[DEBUG]-MODE: searchResults EXISTS → SEARCH_RESULT');
nextMode = SEARCH_PANEL_MODES.SEARCH_RESULT;
}
// 우선순위 4: 검색 입력 오버레이가 열려있으면 SEARCH_INPUT 모드
else if (isSearchOverlayVisible) {
console.log('[DEBUG]-MODE: isSearchOverlayVisible is TRUE → SEARCH_INPUT');
nextMode = SEARCH_PANEL_MODES.SEARCH_INPUT;
}
// 우선순위 5: 초기 상태 (기본값)
else {
console.log('[DEBUG]-MODE: No condition met → INITIAL');
nextMode = SEARCH_PANEL_MODES.INITIAL;
}
// 모드가 변경되었을 때만 업데이트
if (nextMode !== currentMode) {
if (process.env.NODE_ENV === 'development') {
console.log(`🔀 [SearchPanel] Mode changed: ${currentMode} → ${nextMode}`, {
isVoiceOverlayVisible,
shopperHouseData: !!shopperHouseData,
searchPerformed,
searchQuery,
hasSearchResults: !!(
searchDatas?.theme?.length > 0 ||
searchDatas?.item?.length > 0 ||
searchDatas?.show?.length > 0
),
isSearchOverlayVisible,
inputFocus,
});
}
console.log(`[DEBUG]-VOICE_RESULT 🔀 Mode changed: ${currentMode} → ${nextMode}`, {
isVoiceOverlayVisible,
shopperHouseData: !!shopperHouseData,
searchPerformed,
searchQuery,
hasSearchResults: !!(
searchDatas?.theme?.length > 0 ||
searchDatas?.item?.length > 0 ||
searchDatas?.show?.length > 0
),
isSearchOverlayVisible,
inputFocus,
});
setCurrentMode(nextMode);
} else {
console.log('[DEBUG]-MODE: Mode unchanged -', currentMode);
}
}, [
isVoiceOverlayVisible,
@@ -764,7 +824,9 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
* TODO: 현재 검색어가 빈 스트링일 경우, `resetSearch`가 발동해서 searchData가 reset되는 현상이 있음, 조건이 변경되어야 한다.
*/
useEffect(() => {
console.log('[DEBUG]-searchQuery useEffect:', { searchQuery });
if (!searchQuery) {
console.log('[DEBUG]-VOICE_RESULT: searchQuery is empty, calling resetSearch');
dispatch(resetSearch());
}
// eslint-disable-next-line react-hooks/exhaustive-deps