show spinner properly for autocomplete

This commit is contained in:
Hailey
2024-04-26 18:58:15 -07:00
parent 629bb5ca41
commit 79fd2b69b2
+4 -9
View File
@@ -56,7 +56,6 @@ import {
} from '#/view/shell/desktop/Search' } from '#/view/shell/desktop/Search'
import {ProfileCardFeedLoadingPlaceholder} from 'view/com/util/LoadingPlaceholder' import {ProfileCardFeedLoadingPlaceholder} from 'view/com/util/LoadingPlaceholder'
import {atoms as a} from '#/alf' import {atoms as a} from '#/alf'
import {useThrottledValue} from '#/components/hooks/useThrottledValue'
function Loader() { function Loader() {
const pal = usePalette('default') const pal = usePalette('default')
@@ -486,13 +485,8 @@ export function SearchScreen(
// Query terms // Query terms
const queryParam = props.route?.params?.q ?? '' const queryParam = props.route?.params?.q ?? ''
const [searchText, setSearchText] = React.useState<string>(queryParam) const [searchText, setSearchText] = React.useState<string>(queryParam)
const throttledInput = useThrottledValue(searchText, 300) const {data: autocompleteData, isFetching: isAutocompleteFetching} =
useActorAutocompleteQuery(searchText, true)
// Autocomplete
const {data: autocompleteData} = useActorAutocompleteQuery(
throttledInput,
true,
)
const [inputIsFocused, setInputIsFocused] = React.useState(false) const [inputIsFocused, setInputIsFocused] = React.useState(false)
const [searchHistory, setSearchHistory] = React.useState<string[]>([]) const [searchHistory, setSearchHistory] = React.useState<string[]>([])
@@ -725,7 +719,8 @@ export function SearchScreen(
{inputIsFocused && searchText.length > 0 ? ( {inputIsFocused && searchText.length > 0 ? (
<> <>
{!autocompleteData || !moderationOpts ? ( {(isAutocompleteFetching && !autocompleteData?.length) ||
!moderationOpts ? (
<Loader /> <Loader />
) : ( ) : (
<ScrollView <ScrollView