From edbb18afa44bcfee4560ac19880a0c32563b6a0e Mon Sep 17 00:00:00 2001 From: Samuel Newman Date: Fri, 19 Apr 2024 22:55:53 +0100 Subject: Throttle gif search by 500ms (#3622) * debounce gif search by 300ms * Throttle it instead --------- Co-authored-by: Dan Abramov --- src/components/dialogs/GifSelect.tsx | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) (limited to 'src/components/dialogs/GifSelect.tsx') diff --git a/src/components/dialogs/GifSelect.tsx b/src/components/dialogs/GifSelect.tsx index 92e21af47..c8897da36 100644 --- a/src/components/dialogs/GifSelect.tsx +++ b/src/components/dialogs/GifSelect.tsx @@ -1,10 +1,4 @@ -import React, { - useCallback, - useDeferredValue, - useMemo, - useRef, - useState, -} from 'react' +import React, {useCallback, useMemo, useRef, useState} from 'react' import {TextInput, View} from 'react-native' import {Image} from 'expo-image' import {msg, Trans} from '@lingui/macro' @@ -22,6 +16,7 @@ import {Gif, useGifphySearch, useGiphyTrending} from '#/state/queries/giphy' import {atoms as a, useBreakpoints, useTheme} from '#/alf' import * as Dialog from '#/components/Dialog' import * as TextField from '#/components/forms/TextField' +import {useThrottledValue} from '#/components/hooks/useThrottledValue' import {ArrowLeft_Stroke2_Corner0_Rounded as Arrow} from '#/components/icons/Arrow' import {MagnifyingGlass2_Stroke2_Corner0_Rounded as Search} from '#/components/icons/MagnifyingGlass2' import {InlineLinkText} from '#/components/Link' @@ -82,7 +77,7 @@ function GifList({ const {gtMobile} = useBreakpoints() const ref = useRef(null) const [undeferredSearch, setSearch] = useState('') - const search = useDeferredValue(undeferredSearch) + const search = useThrottledValue(undeferredSearch, 500) const isSearching = search.length > 0 -- cgit 1.4.1