diff --git a/src/state/queries/actor-search.ts b/src/state/queries/actor-search.ts index f19916103c..eb065b6cf5 100644 --- a/src/state/queries/actor-search.ts +++ b/src/state/queries/actor-search.ts @@ -5,19 +5,25 @@ import {STALE} from '#/state/queries' import {getAgent} from '#/state/session' const RQKEY_ROOT = 'actor-search' -export const RQKEY = (prefix: string) => [RQKEY_ROOT, prefix] +export const RQKEY = (query: string) => [RQKEY_ROOT, query] -export function useActorSearch(prefix: string) { +export function useActorSearch({ + query, + enabled, +}: { + query: string + enabled?: boolean +}) { return useQuery({ staleTime: STALE.MINUTES.ONE, - queryKey: RQKEY(prefix || ''), + queryKey: RQKEY(query || ''), async queryFn() { const res = await getAgent().searchActors({ - q: prefix, + q: query, }) return res.data.actors }, - enabled: !!prefix, + enabled: enabled && !!query, }) } diff --git a/src/state/queries/search-posts.ts b/src/state/queries/search-posts.ts index ef8b083584..1822577c93 100644 --- a/src/state/queries/search-posts.ts +++ b/src/state/queries/search-posts.ts @@ -19,9 +19,11 @@ const searchPostsQueryKey = ({query, sort}: {query: string; sort?: string}) => [ export function useSearchPostsQuery({ query, sort, + enabled, }: { query: string sort?: 'top' | 'latest' + enabled?: boolean }) { return useInfiniteQuery< AppBskyFeedSearchPosts.OutputSchema, @@ -47,6 +49,7 @@ export function useSearchPostsQuery({ }, initialPageParam: undefined, getNextPageParam: lastPage => lastPage.cursor, + enabled, }) } diff --git a/src/view/screens/Search/Search.tsx b/src/view/screens/Search/Search.tsx index 0f24252ce6..3b06992fc9 100644 --- a/src/view/screens/Search/Search.tsx +++ b/src/view/screens/Search/Search.tsx @@ -195,9 +195,11 @@ type SearchResultSlice = function SearchScreenPostResults({ query, sort, + active, }: { query: string sort?: 'top' | 'latest' + active: boolean }) { const {_} = useLingui() const {currentAccount} = useSession() @@ -216,7 +218,7 @@ function SearchScreenPostResults({ fetchNextPage, isFetchingNextPage, hasNextPage, - } = useSearchPostsQuery({query: augmentedQuery, sort}) + } = useSearchPostsQuery({query: augmentedQuery, sort, enabled: active}) const onPullToRefresh = React.useCallback(async () => { setIsPTR(true) @@ -297,9 +299,19 @@ function SearchScreenPostResults({ ) } -function SearchScreenUserResults({query}: {query: string}) { +function SearchScreenUserResults({ + query, + active, +}: { + query: string + active: boolean +}) { const {_} = useLingui() - const {data: results, isFetched} = useActorSearch(query) + + const {data: results, isFetched} = useActorSearch({ + query, + enabled: active, + }) return isFetched && results ? ( <> @@ -335,6 +347,7 @@ export function SearchScreenInner({ const setDrawerSwipeDisabled = useSetDrawerSwipeDisabled() const {hasSession} = useSession() const {isDesktop} = useWebMediaQueries() + const [activeTab, setActiveTab] = React.useState(0) const {_} = useLingui() const isNewSearch = useGate('new_search') @@ -343,6 +356,7 @@ export function SearchScreenInner({ (index: number) => { setMinimalShellMode(false) setDrawerSwipeDisabled(index > 0) + setActiveTab(index) }, [setDrawerSwipeDisabled, setMinimalShellMode], ) @@ -354,22 +368,38 @@ export function SearchScreenInner({ return [ { title: _(msg`Top`), - component: , + component: ( + + ), }, { title: _(msg`Latest`), - component: , + component: ( + + ), }, { title: _(msg`People`), - component: , + component: ( + + ), }, ] } else { return [ { title: _(msg`People`), - component: , + component: ( + + ), }, ] } @@ -378,23 +408,29 @@ export function SearchScreenInner({ return [ { title: _(msg`Posts`), - component: , + component: ( + + ), }, { title: _(msg`Users`), - component: , + component: ( + + ), }, ] } else { return [ { title: _(msg`Users`), - component: , + component: ( + + ), }, ] } } - }, [hasSession, isNewSearch, _, query]) + }, [hasSession, isNewSearch, _, query, activeTab]) if (hasSession) { return query ? (