diff --git a/frontend/src/pages/pc/admin/AdminSchedule.jsx b/frontend/src/pages/pc/admin/AdminSchedule.jsx index 5e9df68..50d215d 100644 --- a/frontend/src/pages/pc/admin/AdminSchedule.jsx +++ b/frontend/src/pages/pc/admin/AdminSchedule.jsx @@ -213,6 +213,34 @@ function AdminSchedule() { } prevInViewRef.current = inView; }, [inView, hasNextPage, isFetchingNextPage, fetchNextPage, isSearchMode, searchTerm]); + + // 검색어 자동완성 API 호출 (debounce 적용) + useEffect(() => { + // 검색어가 비어있으면 초기화 + if (!originalSearchQuery || originalSearchQuery.trim().length === 0) { + setSuggestions([]); + return; + } + + // debounce: 200ms 후에 API 호출 + const timeoutId = setTimeout(async () => { + setIsLoadingSuggestions(true); + try { + const response = await fetch(`/api/schedules/suggestions?q=${encodeURIComponent(originalSearchQuery)}&limit=10`); + if (response.ok) { + const data = await response.json(); + setSuggestions(data.suggestions || []); + } + } catch (error) { + console.error('추천 검색어 API 오류:', error); + setSuggestions([]); + } finally { + setIsLoadingSuggestions(false); + } + }, 200); + + return () => clearTimeout(timeoutId); + }, [originalSearchQuery]); // selectedDate가 없으면 오늘 날짜로 초기화 useEffect(() => { @@ -1005,33 +1033,28 @@ function AdminSchedule() { }} onFocus={() => setShowSuggestions(true)} onKeyDown={(e) => { - // 필터링은 원본 쿼리 기준으로 유지 - const dummySuggestions = ['성수기', '성수기 이채영', '이채영 먹방', 'NOW TOMORROW', '하얀 그리움', '콘서트', '월드투어'].filter(s => - s.toLowerCase().includes(originalSearchQuery.toLowerCase()) - ).slice(0, 7); - if (e.key === 'ArrowDown') { e.preventDefault(); - const newIndex = selectedSuggestionIndex < dummySuggestions.length - 1 + const newIndex = selectedSuggestionIndex < suggestions.length - 1 ? selectedSuggestionIndex + 1 : 0; setSelectedSuggestionIndex(newIndex); - if (dummySuggestions[newIndex]) { - setSearchInput(dummySuggestions[newIndex]); + if (suggestions[newIndex]) { + setSearchInput(suggestions[newIndex]); } } else if (e.key === 'ArrowUp') { e.preventDefault(); const newIndex = selectedSuggestionIndex > 0 ? selectedSuggestionIndex - 1 - : dummySuggestions.length - 1; + : suggestions.length - 1; setSelectedSuggestionIndex(newIndex); - if (dummySuggestions[newIndex]) { - setSearchInput(dummySuggestions[newIndex]); + if (suggestions[newIndex]) { + setSearchInput(suggestions[newIndex]); } } else if (e.key === 'Enter') { - if (selectedSuggestionIndex >= 0 && dummySuggestions[selectedSuggestionIndex]) { - setSearchInput(dummySuggestions[selectedSuggestionIndex]); - setSearchTerm(dummySuggestions[selectedSuggestionIndex]); + if (selectedSuggestionIndex >= 0 && suggestions[selectedSuggestionIndex]) { + setSearchInput(suggestions[selectedSuggestionIndex]); + setSearchTerm(suggestions[selectedSuggestionIndex]); } else if (searchInput.trim()) { setSearchTerm(searchInput); } @@ -1065,41 +1088,27 @@ function AdminSchedule() { {/* 검색어 추천 드롭다운 */} - {showSuggestions && originalSearchQuery.length > 0 && ( + {showSuggestions && !isLoadingSuggestions && suggestions.length > 0 && (