Merge pull request #1 from optrader8/claude/github-shoptime-detail-v3-011CUwTTQSKC95PQqm6VPFvY

Update detail_v3 in github-shoptime
This commit is contained in:
optrader8
2025-11-09 11:04:24 +09:00
committed by GitHub
2 changed files with 14 additions and 5 deletions

View File

@@ -1804,9 +1804,14 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
clearTimeout(unifiedFocusTimerRef.current); clearTimeout(unifiedFocusTimerRef.current);
} }
// 🎯 DETAIL_PANEL_RETURN 시나리오에서는 빠른 포커스 복원 (50ms) // 🎯 [포커스 충돌 해결] 우선순위가 높은 시나리오에서는 빠른 포커스 전환 (50ms)
// DETAIL_PANEL_RETURN: DetailPanel에서 복귀 시 빠른 포커스 복원
// NEW_SEARCH_LOADED: 음성 검색 결과 로드 시 VoiceInputOverlay와 충돌 방지
// 다른 시나리오에서는 기존과 같은 지연 시간 (100ms) // 다른 시나리오에서는 기존과 같은 지연 시간 (100ms)
const focusDelay = scenario === 'DETAIL_PANEL_RETURN' ? 50 : 100; const focusDelay =
scenario === 'DETAIL_PANEL_RETURN' || scenario === 'NEW_SEARCH_LOADED'
? 50
: 100;
unifiedFocusTimerRef.current = setTimeout(() => { unifiedFocusTimerRef.current = setTimeout(() => {
const targetElement = document.querySelector(`[data-spotlight-id="${targetId}"]`); const targetElement = document.querySelector(`[data-spotlight-id="${targetId}"]`);
@@ -2237,6 +2242,7 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
isVoiceResultMode={currentMode === SEARCH_PANEL_MODES.VOICE_RESULT} isVoiceResultMode={currentMode === SEARCH_PANEL_MODES.VOICE_RESULT}
externalResponseText={voiceOverlayResponseText} externalResponseText={voiceOverlayResponseText}
isExternalBubbleSearch={isVoiceOverlayBubbleSearch} isExternalBubbleSearch={isVoiceOverlayBubbleSearch}
shopperHouseData={shopperHouseData} // 🎯 [포커스 충돌 해결] 음성 검색 결과 데이터 전달
/> />
{/* ✨ [Phase 2] Search Input Overlay - isVisible 감지로 전환 자동 감지 */} {/* ✨ [Phase 2] Search Input Overlay - isVisible 감지로 전환 자동 감지 */}

View File

@@ -147,6 +147,7 @@ const VoiceInputOverlay = ({
isVoiceResultMode = false, isVoiceResultMode = false,
externalResponseText = '', externalResponseText = '',
isExternalBubbleSearch = false, isExternalBubbleSearch = false,
shopperHouseData = null, // 🎯 [포커스 충돌 해결] 음성 검색 결과 데이터
}) => { }) => {
if (DEBUG_MODE) { if (DEBUG_MODE) {
console.log('🔄 [DEBUG] VoiceInputOverlay render - isVisible:', isVisible, 'mode:', mode); console.log('🔄 [DEBUG] VoiceInputOverlay render - isVisible:', isVisible, 'mode:', mode);
@@ -1164,9 +1165,11 @@ const VoiceInputOverlay = ({
setVoiceInputMode(null); setVoiceInputMode(null);
setCurrentMode(VOICE_MODES.PROMPT); setCurrentMode(VOICE_MODES.PROMPT);
// VoiceInputOverlay를 통한 음성 검색 후에는 TInput으로 포커스 복원하지 않음 // 🎯 [포커스 충돌 해결] VoiceInputOverlay를 통한 음성 검색 후에는 TInput으로 포커스 복원하지 않음
// SearchResults의 첫 번째 상품으로 포커스가 가도록 // SearchResults의 첫 번째 상품으로 포커스가 가도록 SearchPanel에 위임
if (lastFocusedElement.current && !isVoiceResultMode) { // shopperHouseData가 있으면 (음성 검색 결과가 있으면) 포커스 복원하지 않음
const hasVoiceSearchResult = shopperHouseData && shopperHouseData.results && shopperHouseData.results.length > 0;
if (lastFocusedElement.current && !isVoiceResultMode && !hasVoiceSearchResult) {
focusRestoreTimerRef.current = setTimeout(() => { focusRestoreTimerRef.current = setTimeout(() => {
Spotlight.focus(lastFocusedElement.current); Spotlight.focus(lastFocusedElement.current);
}, 100); }, 100);