diff --git a/lib/hooks/search-sidebars.js b/lib/hooks/search-sidebars.js --- a/lib/hooks/search-sidebars.js +++ b/lib/hooks/search-sidebars.js @@ -20,7 +20,7 @@ +listData: $ReadOnlyArray, +searchState: SidebarSearchState, +setSearchState: SetState, - +searchIndex: SearchIndex, + +onChangeSearchText: (text: string) => mixed, } { const [searchState, setSearchState] = React.useState({ text: '', @@ -57,6 +57,16 @@ return index; }, [sidebarInfos, userInfos, viewerID]); + const onChangeSearchText = React.useCallback( + (text: string) => { + setSearchState({ + text, + results: new Set(searchIndex.getSearchResults(text)), + }); + }, + [searchIndex, setSearchState], + ); + React.useEffect(() => { setSearchState(curState => ({ ...curState, @@ -65,8 +75,13 @@ }, [searchIndex, setSearchState]); return React.useMemo( - () => ({ listData, searchState, setSearchState, searchIndex }), - [listData, setSearchState, searchState, searchIndex], + () => ({ + listData, + searchState, + setSearchState, + onChangeSearchText, + }), + [listData, setSearchState, searchState, onChangeSearchText], ); } diff --git a/native/chat/sidebar-list-modal.react.js b/native/chat/sidebar-list-modal.react.js --- a/native/chat/sidebar-list-modal.react.js +++ b/native/chat/sidebar-list-modal.react.js @@ -35,18 +35,9 @@ listData, searchState, setSearchState, - searchIndex, + onChangeSearchText, } = useSearchSidebars(props.route.params.threadInfo); - const onChangeSearchText = React.useCallback( - (searchText: string) => - setSearchState({ - text: searchText, - results: new Set(searchIndex.getSearchResults(searchText)), - }), - [searchIndex, setSearchState], - ); - const searchTextInputRef = React.useRef(); const setSearchTextInputRef = React.useCallback( async (textInput: ?React.ElementRef) => { diff --git a/web/modals/chat/sidebar-list-modal.react.js b/web/modals/chat/sidebar-list-modal.react.js --- a/web/modals/chat/sidebar-list-modal.react.js +++ b/web/modals/chat/sidebar-list-modal.react.js @@ -26,7 +26,7 @@ listData, searchState, setSearchState, - searchIndex, + onChangeSearchText, } = useSearchSidebars(threadInfo); const { popModal } = useModalContext(); @@ -47,17 +47,6 @@ [popModal, listData], ); - const onChangeSearchText = React.useCallback( - (event: SyntheticEvent) => { - const searchText = event.currentTarget.value; - setSearchState({ - text: searchText, - results: new Set(searchIndex.getSearchResults(searchText)), - }); - }, - [searchIndex, setSearchState], - ); - const clearQuery = React.useCallback( (event: SyntheticEvent) => { event.preventDefault(); @@ -78,6 +67,14 @@ ); } + const handleOnChangeSearchText = React.useCallback( + (event: SyntheticEvent) => { + const { value } = event.currentTarget; + onChangeSearchText(value); + }, + [onChangeSearchText], + ); + return (
{clearQueryButton}