fix: prevent toolbar search flicker on outside page click
This commit is contained in:
@@ -53,6 +53,7 @@ export default function SearchBar({ placeholder = 'Search artworks, artists, tag
|
|||||||
}
|
}
|
||||||
|
|
||||||
function collapse() {
|
function collapse() {
|
||||||
|
if (phase === 'idle' || phase === 'closing') return
|
||||||
clearTimeout(openTimerRef.current)
|
clearTimeout(openTimerRef.current)
|
||||||
setPhase('closing')
|
setPhase('closing')
|
||||||
setOpen(false)
|
setOpen(false)
|
||||||
@@ -78,11 +79,12 @@ export default function SearchBar({ placeholder = 'Search artworks, artists, tag
|
|||||||
// ── outside click ────────────────────────────────────────────────────────
|
// ── outside click ────────────────────────────────────────────────────────
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
function onMouse(e) {
|
function onMouse(e) {
|
||||||
|
if (!isExpanded) return
|
||||||
if (wrapperRef.current && !wrapperRef.current.contains(e.target)) collapse()
|
if (wrapperRef.current && !wrapperRef.current.contains(e.target)) collapse()
|
||||||
}
|
}
|
||||||
document.addEventListener('mousedown', onMouse)
|
document.addEventListener('mousedown', onMouse)
|
||||||
return () => document.removeEventListener('mousedown', onMouse)
|
return () => document.removeEventListener('mousedown', onMouse)
|
||||||
}, [])
|
}, [isExpanded, phase])
|
||||||
|
|
||||||
// ── fetch (parallel artworks + tags) ────────────────────────────────────
|
// ── fetch (parallel artworks + tags) ────────────────────────────────────
|
||||||
const fetchSuggestions = useCallback(async (q) => {
|
const fetchSuggestions = useCallback(async (q) => {
|
||||||
|
|||||||
Reference in New Issue
Block a user