diff --git a/src/pages/workspace/accounting/netsuite/import/NetSuiteImportCustomFieldNew/NetSuiteCustomListSelectorModal.tsx b/src/pages/workspace/accounting/netsuite/import/NetSuiteImportCustomFieldNew/NetSuiteCustomListSelectorModal.tsx index 9849ec967a11..2a3a71730144 100644 --- a/src/pages/workspace/accounting/netsuite/import/NetSuiteImportCustomFieldNew/NetSuiteCustomListSelectorModal.tsx +++ b/src/pages/workspace/accounting/netsuite/import/NetSuiteImportCustomFieldNew/NetSuiteCustomListSelectorModal.tsx @@ -3,8 +3,8 @@ import React, {useMemo} from 'react'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import Modal from '@components/Modal'; import ScreenWrapper from '@components/ScreenWrapper'; -import SelectionList from '@components/SelectionListWithSections'; -import RadioListItem from '@components/SelectionListWithSections/RadioListItem'; +import SelectionList from '@components/SelectionList'; +import RadioListItem from '@components/SelectionList/ListItem/RadioListItem'; import useDebouncedState from '@hooks/useDebouncedState'; import useLocalize from '@hooks/useLocalize'; import type {CustomListSelectorType} from '@pages/workspace/accounting/netsuite/types'; @@ -37,8 +37,10 @@ function NetSuiteCustomListSelectorModal({isVisible, currentCustomListValue, onC const {translate} = useLocalize(); const [searchValue, debouncedSearchValue, setSearchValue] = useDebouncedState(''); - const {sections, headerMessage, showTextInput} = useMemo(() => { - const customLists = policy?.connections?.netsuite?.options?.data?.customLists ?? []; + const rawCustomLists = policy?.connections?.netsuite?.options?.data?.customLists; + + const {options, showTextInput} = useMemo(() => { + const customLists = rawCustomLists ?? []; const customListData = customLists.map((customListRecord) => ({ text: customListRecord.name, value: customListRecord.name, @@ -52,17 +54,20 @@ function NetSuiteCustomListSelectorModal({isVisible, currentCustomListValue, onC const isEmpty = debouncedSearchValue.trim() && !filteredCustomLists.length; return { - sections: isEmpty - ? [] - : [ - { - data: filteredCustomLists, - }, - ], - headerMessage: isEmpty ? translate('common.noResultsFound') : '', + options: isEmpty ? [] : filteredCustomLists, showTextInput: customListData.length > CONST.STANDARD_LIST_ITEM_LIMIT, }; - }, [debouncedSearchValue, policy?.connections?.netsuite?.options?.data?.customLists, translate, currentCustomListValue]); + }, [debouncedSearchValue, rawCustomLists, currentCustomListValue]); + + const textInputOptions = useMemo( + () => ({ + value: searchValue, + label: showTextInput ? translate('common.search') : undefined, + onChangeText: setSearchValue, + headerMessage: debouncedSearchValue.trim() && options.length === 0 ? translate('common.noResultsFound') : '', + }), + [searchValue, showTextInput, translate, setSearchValue, debouncedSearchValue, options.length], + ); return (