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

[251024] fix: HowAboutThese ShopperHouse API,DEBUG_MODE=false

Browse Source 
🕐 커밋 시간: 2025. 10. 24. 12:18:21

📊 변경 통계:
  • 총 파일: 5개
  • 추가: +51줄
  • 삭제: -31줄

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

🔧 함수 변경 내용:
  📄 com.twin.app.shoptime/src/views/SearchPanel/HowAboutThese/HowAboutThese.jsx (javascript):
    ✅ Added: HowAboutThese()
    ❌ Deleted: HowAboutThese()
  📄 com.twin.app.shoptime/src/views/SearchPanel/HowAboutThese/HowAboutThese.small.jsx (javascript):
    ✅ Added: Bubble()
  📄 com.twin.app.shoptime/src/views/SearchPanel/SearchPanel.new.v2.jsx (javascript):
    🔄 Modified: SpotlightContainerDecorator()
  📄 com.twin.app.shoptime/src/views/SearchPanel/SearchResults.new.v2.jsx (javascript):
    ✅ Added: SafeImage()
  📄 com.twin.app.shoptime/src/views/SearchPanel/VoiceInputOverlay/VoiceInputOverlay.jsx (javascript):
    🔄 Modified: Spottable(), clearAllTimers()
This commit is contained in:
hyeon soo noh
2025-10-24 12:18:22 +09:00
parent 6f9b6133b9
commit 09bb9fb3e9
5 changed files with 147 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -108,15 +108,7 @@ const SafeImageComponent = ({ src, alt, className, ...props }) => {
};
}, []);
return (
<img
ref={imgRef}
src={src}
alt={alt}
className={className}
{...props}
/>
);
return <img ref={imgRef} src={src} alt={alt} className={className} {...props} />;
};
const ITEMS_PER_PAGE = 9;
@@ -150,6 +142,12 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
const panels = useSelector((state) => state.panels.panels);
// 0hun: 음성 검색 결과에 대한 전역 상태
const shopperHouseData = useSelector((state) => state.search.shopperHouseData);
// 0hun: 음성 검색 searchId (Redux에서 별도 관리)
const shopperHouseSearchId = useSelector((state) => state.search.shopperHouseSearchId);
// 0hun: 음성 검색 relativeQueries (Redux에서 별도 관리)
const shopperHouseRelativeQueries = useSelector(
(state) => state.search.shopperHouseRelativeQueries
);
// 0hun: 검색 메인, Hot Picks for you 영역에 대한 전역 상태 값
const hotPicksForYou = useSelector((state) => state.search.searchMainData.hotPicksForYou);
// 0hun: 검색 메인, Popular Brands 영역에 대한 전역 상태 값
@@ -192,7 +190,11 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
timestamp: new Date().toISOString(),
});
}
}, [shopperHouseData?.results?.[0]?.docs?.length, shopperHouseData?.results?.[0]?.searchId, DEBUG_MODE]);
}, [
shopperHouseData?.results?.[0]?.docs?.length,
shopperHouseData?.results?.[0]?.searchId,
DEBUG_MODE,
]);
// 🐛 [DEBUG] SearchPanel 마운트/언마운트 추적 (DEBUG_MODE가 true일 경우에만)
useEffect(() => {
@@ -255,11 +257,7 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
/**
* useSearchHistory Hook 적용
*/
const {
normalSearches,
addNormalSearch,
executeSearchFromHistory,
} = useSearchHistory();
const { normalSearches, addNormalSearch, executeSearchFromHistory } = useSearchHistory();
// Voice overlay suggestions (동적으로 변경 가능)
const voiceSuggestions = useMemo(
@@ -326,8 +324,9 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
if (e.key === 'ArrowRight' || e.key === 'Right') {
// 커서가 텍스트 끝에 있을 때만 포커스 이동 허용
// DOM 쿼리 최적화: 캐싱된 input element 사용
const input = inputElementRef.current ||
document.querySelector(`[data-spotlight-id="input-field-box"] > input`);
const input =
inputElementRef.current ||
document.querySelector(`[data-spotlight-id="input-field-box"] > input`);
if (input) {
inputElementRef.current = input; // 캐싱
if (position === input.value.length) {
@@ -406,8 +405,9 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
*/
const cursorPosition = useCallback(() => {
// ref를 사용하여 캐싱된 input element 사용
const input = inputElementRef.current ||
document.querySelector(`[data-spotlight-id="input-field-box"] > input`);
const input =
inputElementRef.current ||
document.querySelector(`[data-spotlight-id="input-field-box"] > input`);
if (input) {
inputElementRef.current = input; // 캐싱
@@ -639,7 +639,6 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
}, 150); // Overlay 닫히는 시간을 고려한 지연
}, []);
// ✨ [Phase 3] handleInputIconClick 제거 (돋보기 아이콘 기능 비활성화)
// /**
// * ✨ [Phase 3] TInput icon click handler (showVirtualKeyboard 제거)
@@ -753,6 +752,8 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
itemInfo={searchDatas.item}
showInfo={searchDatas.show}
shopperHouseInfo={shopperHouseData}
shopperHouseSearchId={shopperHouseSearchId}
shopperHouseRelativeQueries={shopperHouseRelativeQueries}
keywordClick={handleKeywordClick}
panelInfo={panelInfo}
/>
@@ -1247,8 +1248,14 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
kind={KINDS.withIcon}
icon={ICONS.search}
text={searchQuery} // ✨ [Phase 8] Overlay에서 입력받은 텍스트만 표시
alwaysShowText={currentMode === SEARCH_PANEL_MODES.VOICE_RESULT || currentMode === SEARCH_PANEL_MODES.SEARCH_RESULT} // 🎯 VOICE_RESULT & SEARCH_RESULT 모드에서 항상 텍스트 표시
inputFocus={currentMode === SEARCH_PANEL_MODES.VOICE_RESULT || currentMode === SEARCH_PANEL_MODES.SEARCH_RESULT} // ✅ VOICE_RESULT & SEARCH_RESULT 모드에서 TInputSimple 내부 포커스 활성화
alwaysShowText={
currentMode === SEARCH_PANEL_MODES.VOICE_RESULT ||
currentMode === SEARCH_PANEL_MODES.SEARCH_RESULT
} // 🎯 VOICE_RESULT & SEARCH_RESULT 모드에서 항상 텍스트 표시
inputFocus={
currentMode === SEARCH_PANEL_MODES.VOICE_RESULT ||
currentMode === SEARCH_PANEL_MODES.SEARCH_RESULT
} // ✅ VOICE_RESULT & SEARCH_RESULT 모드에서 TInputSimple 내부 포커스 활성화
onKeyDown={handleKeydown}
spotlightId={SPOTLIGHT_IDS.SEARCH_INPUT_BOX}
forcedSpotlight="recent-keyword-0"