|
|
|
|
@ -1,16 +1,25 @@
@@ -1,16 +1,25 @@
|
|
|
|
|
import SearchBar, { TSearchBarRef } from '@/components/SearchBar' |
|
|
|
|
import SearchResult from '@/components/SearchResult' |
|
|
|
|
import PrimaryPageLayout from '@/layouts/PrimaryPageLayout' |
|
|
|
|
import PrimaryPageLayout, { TPrimaryPageLayoutRef } from '@/layouts/PrimaryPageLayout' |
|
|
|
|
import { usePrimaryPage } from '@/PageManager' |
|
|
|
|
import { TSearchParams } from '@/types' |
|
|
|
|
import { forwardRef, useEffect, useMemo, useRef, useState } from 'react' |
|
|
|
|
import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react' |
|
|
|
|
|
|
|
|
|
const SearchPage = forwardRef((_, ref) => { |
|
|
|
|
const { current, display } = usePrimaryPage() |
|
|
|
|
const [input, setInput] = useState('') |
|
|
|
|
const [searchParams, setSearchParams] = useState<TSearchParams | null>(null) |
|
|
|
|
const searchBarRef = useRef<TSearchBarRef>(null) |
|
|
|
|
const isActive = useMemo(() => current === 'search' && display, [current, display]) |
|
|
|
|
const searchBarRef = useRef<TSearchBarRef>(null) |
|
|
|
|
const layoutRef = useRef<TPrimaryPageLayoutRef>(null) |
|
|
|
|
|
|
|
|
|
useImperativeHandle( |
|
|
|
|
ref, |
|
|
|
|
() => ({ |
|
|
|
|
scrollToTop: (behavior: ScrollBehavior = 'smooth') => layoutRef.current?.scrollToTop(behavior) |
|
|
|
|
}), |
|
|
|
|
[] |
|
|
|
|
) |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
if (isActive && !searchParams) { |
|
|
|
|
@ -23,11 +32,12 @@ const SearchPage = forwardRef((_, ref) => {
@@ -23,11 +32,12 @@ const SearchPage = forwardRef((_, ref) => {
|
|
|
|
|
if (params?.input) { |
|
|
|
|
setInput(params.input) |
|
|
|
|
} |
|
|
|
|
layoutRef.current?.scrollToTop('instant') |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<PrimaryPageLayout |
|
|
|
|
ref={ref} |
|
|
|
|
ref={layoutRef} |
|
|
|
|
pageName="search" |
|
|
|
|
titlebar={ |
|
|
|
|
<SearchBar ref={searchBarRef} onSearch={onSearch} input={input} setInput={setInput} /> |
|
|
|
|
|