From 1720478b2e94cd7a06602ad298276f023db2b716 Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Sat, 20 Jan 2024 12:21:43 +0530 Subject: [PATCH 1/8] fix: Selecting last possible member to group hides selected members. Signed-off-by: Krishna Gupta --- src/libs/OptionsListUtils.js | 14 +++++++++-- src/pages/NewChatPage.js | 24 +++++++++++++++---- ...yForRefactorRequestParticipantsSelector.js | 16 ++++++++----- .../MoneyRequestParticipantsSelector.js | 14 +++++++---- 4 files changed, 51 insertions(+), 17 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index e86c9daacb4..bc489438778 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -1941,13 +1941,23 @@ function shouldOptionShowTooltip(option) { * @param {Object} personalDetails * @param {Boolean} shouldGetOptionDetails * @param {Number} indexOffset + * @param {Boolean} maxOptionsSelected * @returns {Object} */ -function formatSectionsFromSearchTerm(searchTerm, selectedOptions, filteredRecentReports, filteredPersonalDetails, personalDetails = {}, shouldGetOptionDetails = false, indexOffset) { +function formatSectionsFromSearchTerm( + searchTerm, + selectedOptions, + filteredRecentReports, + filteredPersonalDetails, + personalDetails = {}, + shouldGetOptionDetails = false, + indexOffset, + maxOptionsSelected, +) { // We show the selected participants at the top of the list when there is no search term // However, if there is a search term we remove the selected participants from the top of the list unless they are part of the search results // This clears up space on mobile views, where if you create a group with 4+ people you can't see the selected participants and the search results at the same time - if (searchTerm === '') { + if (searchTerm === '' || maxOptionsSelected) { return { section: { title: undefined, diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index b90ce6bbc24..98d2ecbd4b9 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -77,7 +77,16 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i const sectionsList = []; let indexOffset = 0; - const formatResults = OptionsListUtils.formatSectionsFromSearchTerm(searchTerm, selectedOptions, filteredRecentReports, filteredPersonalDetails, {}, false, indexOffset); + const formatResults = OptionsListUtils.formatSectionsFromSearchTerm( + searchTerm, + selectedOptions, + filteredRecentReports, + filteredPersonalDetails, + {}, + false, + indexOffset, + maxParticipantsReached, + ); sectionsList.push(formatResults.section); indexOffset = formatResults.newIndexOffset; @@ -230,10 +239,15 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i }, [didScreenTransitionEnd, updateOptions]); // When search term updates we will fetch any reports - const setSearchTermAndSearchInServer = useCallback((text = '') => { - Report.searchInServer(text); - setSearchTerm(text); - }, []); + const setSearchTermAndSearchInServer = useCallback( + (text = '') => { + if (text && !maxParticipantsReached) { + Report.searchInServer(text); + } + setSearchTerm(text); + }, + [maxParticipantsReached], + ); const {inputCallbackRef} = useAutoFocusInput(); diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index 0949081435c..df863469f1d 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -131,6 +131,7 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ personalDetails, true, indexOffset, + maxParticipantsReached, ); newSections.push(formatResults.section); indexOffset = formatResults.newIndexOffset; @@ -239,12 +240,15 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ ); // When search term updates we will fetch any reports - const setSearchTermAndSearchInServer = useCallback((text = '') => { - if (text.length) { - Report.searchInServer(text); - } - setSearchTerm(text); - }, []); + const setSearchTermAndSearchInServer = useCallback( + (text = '') => { + if (text.length && !maxParticipantsReached) { + Report.searchInServer(text); + } + setSearchTerm(text); + }, + [maxParticipantsReached], + ); // Right now you can't split a request with a workspace and other additional participants // This is getting properly fixed in https://github.com/Expensify/App/issues/27508, but as a stop-gap to prevent diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index 9567b17ecdf..7700387996c 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -142,6 +142,7 @@ function MoneyRequestParticipantsSelector({ personalDetails, true, indexOffset, + maxParticipantsReached, ); newSections.push(formatResults.section); indexOffset = formatResults.newIndexOffset; @@ -259,10 +260,15 @@ function MoneyRequestParticipantsSelector({ ); // When search term updates we will fetch any reports - const setSearchTermAndSearchInServer = useCallback((text = '') => { - Report.searchInServer(text); - setSearchTerm(text); - }, []); + const setSearchTermAndSearchInServer = useCallback( + (text = '') => { + if (text && !maxParticipantsReached) { + Report.searchInServer(text); + } + setSearchTerm(text); + }, + [maxParticipantsReached], + ); // Right now you can't split a request with a workspace and other additional participants // This is getting properly fixed in https://github.com/Expensify/App/issues/27508, but as a stop-gap to prevent From 1176d22ec08825d50ef1cdbe3050fcff8cb0e255 Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Sat, 20 Jan 2024 12:26:25 +0530 Subject: [PATCH 2/8] comment added. Signed-off-by: Krishna Gupta --- src/libs/OptionsListUtils.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index bc489438778..c7db5867036 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -1954,7 +1954,7 @@ function formatSectionsFromSearchTerm( indexOffset, maxOptionsSelected, ) { - // We show the selected participants at the top of the list when there is no search term + // We show the selected participants at the top of the list when there is no search term or maximum number of participants has already been selected // However, if there is a search term we remove the selected participants from the top of the list unless they are part of the search results // This clears up space on mobile views, where if you create a group with 4+ people you can't see the selected participants and the search results at the same time if (searchTerm === '' || maxOptionsSelected) { From 89c96b1a3308782bc2489ba8bc9c9c683b855308 Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Tue, 23 Jan 2024 16:28:18 +0530 Subject: [PATCH 3/8] minor fix. Signed-off-by: Krishna Gupta --- .../MoneyTemporaryForRefactorRequestParticipantsSelector.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index df863469f1d..552d791ac85 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -242,7 +242,7 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ // When search term updates we will fetch any reports const setSearchTermAndSearchInServer = useCallback( (text = '') => { - if (text.length && !maxParticipantsReached) { + if (text && !maxParticipantsReached) { Report.searchInServer(text); } setSearchTerm(text); From 47e6c4f9f4c1cb2469dfbbe4223dde70f48dc626 Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Fri, 26 Jan 2024 18:49:07 +0530 Subject: [PATCH 4/8] fix: ordering of formatSectionsFromSearchTerm defauls parameters. Signed-off-by: Krishna Gupta --- src/libs/OptionsListUtils.js | 8 ++++---- src/pages/NewChatPage.js | 11 +---------- ...TemporaryForRefactorRequestParticipantsSelector.js | 4 ++-- .../MoneyRequestParticipantsSelector.js | 4 ++-- 4 files changed, 9 insertions(+), 18 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index c7db5867036..50b1be420b6 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -1938,10 +1938,10 @@ function shouldOptionShowTooltip(option) { * @param {Array} selectedOptions * @param {Array} filteredRecentReports * @param {Array} filteredPersonalDetails - * @param {Object} personalDetails - * @param {Boolean} shouldGetOptionDetails * @param {Number} indexOffset * @param {Boolean} maxOptionsSelected + * @param {Object} personalDetails + * @param {Boolean} shouldGetOptionDetails * @returns {Object} */ function formatSectionsFromSearchTerm( @@ -1949,10 +1949,10 @@ function formatSectionsFromSearchTerm( selectedOptions, filteredRecentReports, filteredPersonalDetails, - personalDetails = {}, - shouldGetOptionDetails = false, indexOffset, maxOptionsSelected, + personalDetails = {}, + shouldGetOptionDetails = false, ) { // We show the selected participants at the top of the list when there is no search term or maximum number of participants has already been selected // However, if there is a search term we remove the selected participants from the top of the list unless they are part of the search results diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index 98d2ecbd4b9..8766e0b21fe 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -77,16 +77,7 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i const sectionsList = []; let indexOffset = 0; - const formatResults = OptionsListUtils.formatSectionsFromSearchTerm( - searchTerm, - selectedOptions, - filteredRecentReports, - filteredPersonalDetails, - {}, - false, - indexOffset, - maxParticipantsReached, - ); + const formatResults = OptionsListUtils.formatSectionsFromSearchTerm(searchTerm, selectedOptions, filteredRecentReports, filteredPersonalDetails, indexOffset, maxParticipantsReached); sectionsList.push(formatResults.section); indexOffset = formatResults.newIndexOffset; diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index 552d791ac85..c3c75242103 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -128,10 +128,10 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ participants, chatOptions.recentReports, chatOptions.personalDetails, - personalDetails, - true, indexOffset, maxParticipantsReached, + personalDetails, + true, ); newSections.push(formatResults.section); indexOffset = formatResults.newIndexOffset; diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index 7700387996c..649a42a5e55 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -139,10 +139,10 @@ function MoneyRequestParticipantsSelector({ participants, newChatOptions.recentReports, newChatOptions.personalDetails, - personalDetails, - true, indexOffset, maxParticipantsReached, + personalDetails, + true, ); newSections.push(formatResults.section); indexOffset = formatResults.newIndexOffset; From 71913238d8d09ede04e01e35d27f29a938fe1dae Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Sun, 28 Jan 2024 06:25:10 +0530 Subject: [PATCH 5/8] fix: comments. Signed-off-by: Krishna Gupta --- src/pages/NewChatPage.js | 2 +- .../MoneyTemporaryForRefactorRequestParticipantsSelector.js | 2 +- .../MoneyRequestParticipantsSelector.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index 8766e0b21fe..90ebda4ac24 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -229,7 +229,7 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i updateOptions(); }, [didScreenTransitionEnd, updateOptions]); - // When search term updates we will fetch any reports + // When search term updates & user hasn't selected max number of participants we will fetch any reports const setSearchTermAndSearchInServer = useCallback( (text = '') => { if (text && !maxParticipantsReached) { diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index c3c75242103..1f8d1c470fa 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -239,7 +239,7 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ [maxParticipantsReached, newChatOptions, participants, searchTerm], ); - // When search term updates we will fetch any reports + // When search term updates & user hasn't selected max number of participants we will fetch any reports const setSearchTermAndSearchInServer = useCallback( (text = '') => { if (text && !maxParticipantsReached) { diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index 649a42a5e55..58fc81dcd80 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -259,7 +259,7 @@ function MoneyRequestParticipantsSelector({ [maxParticipantsReached, newChatOptions.personalDetails.length, newChatOptions.recentReports.length, newChatOptions.userToInvite, participants, searchTerm], ); - // When search term updates we will fetch any reports + // When search term updates & user hasn't selected max number of participants we will fetch any reports const setSearchTermAndSearchInServer = useCallback( (text = '') => { if (text && !maxParticipantsReached) { From efa6bfa02a88d9030c384fa97923ac80d5612268 Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Sun, 28 Jan 2024 06:45:25 +0530 Subject: [PATCH 6/8] fix: code updated due to merge conflicts. Signed-off-by: Krishna Gupta --- src/libs/OptionsListUtils.ts | 5 +++-- src/pages/NewChatPage.js | 2 +- .../MoneyTemporaryForRefactorRequestParticipantsSelector.js | 2 +- .../MoneyRequestParticipantsSelector.js | 2 +- 4 files changed, 6 insertions(+), 5 deletions(-) diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts index 6332a57deec..478bed7c9af 100644 --- a/src/libs/OptionsListUtils.ts +++ b/src/libs/OptionsListUtils.ts @@ -1914,14 +1914,15 @@ function formatSectionsFromSearchTerm( selectedOptions: ReportUtils.OptionData[], filteredRecentReports: ReportUtils.OptionData[], filteredPersonalDetails: PersonalDetails[], + maxOptionsSelected: boolean, + indexOffset = 0, personalDetails: OnyxEntry = {}, shouldGetOptionDetails = false, - indexOffset = 0, ): SectionForSearchTerm { // We show the selected participants at the top of the list when there is no search term // However, if there is a search term we remove the selected participants from the top of the list unless they are part of the search results // This clears up space on mobile views, where if you create a group with 4+ people you can't see the selected participants and the search results at the same time - if (searchTerm === '') { + if (searchTerm === '' || maxOptionsSelected) { return { section: { title: undefined, diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index 90ebda4ac24..9624967a89a 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -77,7 +77,7 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i const sectionsList = []; let indexOffset = 0; - const formatResults = OptionsListUtils.formatSectionsFromSearchTerm(searchTerm, selectedOptions, filteredRecentReports, filteredPersonalDetails, indexOffset, maxParticipantsReached); + const formatResults = OptionsListUtils.formatSectionsFromSearchTerm(searchTerm, selectedOptions, filteredRecentReports, filteredPersonalDetails, maxParticipantsReached, indexOffset); sectionsList.push(formatResults.section); indexOffset = formatResults.newIndexOffset; diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index 51cc6fe5e9a..b25b545a538 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -133,8 +133,8 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ participants, chatOptions.recentReports, chatOptions.personalDetails, - indexOffset, maxParticipantsReached, + indexOffset, personalDetails, true, ); diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index cc0f854f59a..e62d77f1a52 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -140,8 +140,8 @@ function MoneyRequestParticipantsSelector({ participants, newChatOptions.recentReports, newChatOptions.personalDetails, - indexOffset, maxParticipantsReached, + indexOffset, personalDetails, true, ); From 40b30f065e743586e10345afaa0be71b53749c0e Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Sun, 28 Jan 2024 06:47:36 +0530 Subject: [PATCH 7/8] comment updated for formatSectionsFromSearchTerm. Signed-off-by: Krishna Gupta --- src/libs/OptionsListUtils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts index 478bed7c9af..2c7695ade9e 100644 --- a/src/libs/OptionsListUtils.ts +++ b/src/libs/OptionsListUtils.ts @@ -1919,7 +1919,7 @@ function formatSectionsFromSearchTerm( personalDetails: OnyxEntry = {}, shouldGetOptionDetails = false, ): SectionForSearchTerm { - // We show the selected participants at the top of the list when there is no search term + // We show the selected participants at the top of the list when there is no search term or maximum number of participants has already been selected // However, if there is a search term we remove the selected participants from the top of the list unless they are part of the search results // This clears up space on mobile views, where if you create a group with 4+ people you can't see the selected participants and the search results at the same time if (searchTerm === '' || maxOptionsSelected) { From 5b42bdf2aa0c06f83d8965bc168556716861621f Mon Sep 17 00:00:00 2001 From: Krishna Gupta Date: Wed, 31 Jan 2024 15:15:48 +0530 Subject: [PATCH 8/8] update: callback function to hook. Signed-off-by: Krishna Gupta --- src/hooks/useSearchTermAndSearch.ts | 22 +++++++++++++++++++ src/pages/NewChatPage.js | 14 +++--------- ...yForRefactorRequestParticipantsSelector.js | 14 ++---------- .../MoneyRequestParticipantsSelector.js | 18 ++++----------- 4 files changed, 31 insertions(+), 37 deletions(-) create mode 100644 src/hooks/useSearchTermAndSearch.ts diff --git a/src/hooks/useSearchTermAndSearch.ts b/src/hooks/useSearchTermAndSearch.ts new file mode 100644 index 00000000000..827b6c6d8bd --- /dev/null +++ b/src/hooks/useSearchTermAndSearch.ts @@ -0,0 +1,22 @@ +import type {Dispatch} from 'react'; +import {useCallback} from 'react'; +import * as Report from '@userActions/Report'; + +/** + * Hook for fetching reports when user updated search term and hasn't selected max number of participants + */ +const useSearchTermAndSearch = (setSearchTerm: Dispatch>, maxParticipantsReached: boolean) => { + const setSearchTermAndSearchInServer = useCallback( + (text = '') => { + if (text && !maxParticipantsReached) { + Report.searchInServer(text); + } + setSearchTerm(text); + }, + [maxParticipantsReached, setSearchTerm], + ); + + return setSearchTermAndSearchInServer; +}; + +export default useSearchTermAndSearch; diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index 9624967a89a..7dd328e6a0b 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -11,6 +11,7 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useNetwork from '@hooks/useNetwork'; +import useSearchTermAndSearch from '@hooks/useSearchTermAndSearch'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; @@ -64,6 +65,8 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i const [didScreenTransitionEnd, setDidScreenTransitionEnd] = useState(false); const maxParticipantsReached = selectedOptions.length === CONST.REPORT.MAXIMUM_PARTICIPANTS; + const setSearchTermAndSearchInServer = useSearchTermAndSearch(setSearchTerm, maxParticipantsReached); + const headerMessage = OptionsListUtils.getHeaderMessage( filteredPersonalDetails.length + filteredRecentReports.length !== 0, Boolean(filteredUserToInvite), @@ -229,17 +232,6 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i updateOptions(); }, [didScreenTransitionEnd, updateOptions]); - // When search term updates & user hasn't selected max number of participants we will fetch any reports - const setSearchTermAndSearchInServer = useCallback( - (text = '') => { - if (text && !maxParticipantsReached) { - Report.searchInServer(text); - } - setSearchTerm(text); - }, - [maxParticipantsReached], - ); - const {inputCallbackRef} = useAutoFocusInput(); return ( diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index b25b545a538..e47b0b8198e 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -13,8 +13,8 @@ import SelectCircle from '@components/SelectCircle'; import SelectionList from '@components/SelectionList'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useSearchTermAndSearch from '@hooks/useSearchTermAndSearch'; import useThemeStyles from '@hooks/useThemeStyles'; -import * as Report from '@libs/actions/Report'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; @@ -88,6 +88,7 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ const offlineMessage = isOffline ? `${translate('common.youAppearToBeOffline')} ${translate('search.resultsAreLimited')}` : ''; const maxParticipantsReached = participants.length === CONST.REPORT.MAXIMUM_PARTICIPANTS; + const setSearchTermAndSearchInServer = useSearchTermAndSearch(setSearchTerm, maxParticipantsReached); /** * Returns the sections needed for the OptionsSelector @@ -244,17 +245,6 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ [maxParticipantsReached, newChatOptions, participants, searchTerm], ); - // When search term updates & user hasn't selected max number of participants we will fetch any reports - const setSearchTermAndSearchInServer = useCallback( - (text = '') => { - if (text && !maxParticipantsReached) { - Report.searchInServer(text); - } - setSearchTerm(text); - }, - [maxParticipantsReached], - ); - // Right now you can't split a request with a workspace and other additional participants // This is getting properly fixed in https://github.com/Expensify/App/issues/27508, but as a stop-gap to prevent // the app from crashing on native when you try to do this, we'll going to hide the button if you have a workspace and other participants diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index e62d77f1a52..daaa63aae14 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -13,8 +13,8 @@ import SelectCircle from '@components/SelectCircle'; import SelectionList from '@components/SelectionList'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useSearchTermAndSearch from '@hooks/useSearchTermAndSearch'; import useThemeStyles from '@hooks/useThemeStyles'; -import * as Report from '@libs/actions/Report'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import reportPropTypes from '@pages/reportPropTypes'; @@ -89,6 +89,9 @@ function MoneyRequestParticipantsSelector({ const {isOffline} = useNetwork(); const personalDetails = usePersonalDetails(); + const maxParticipantsReached = participants.length === CONST.REPORT.MAXIMUM_PARTICIPANTS; + const setSearchTermAndSearchInServer = useSearchTermAndSearch(setSearchTerm, maxParticipantsReached); + const offlineMessage = isOffline ? `${translate('common.youAppearToBeOffline')} ${translate('search.resultsAreLimited')}` : ''; const newChatOptions = useMemo(() => { @@ -124,8 +127,6 @@ function MoneyRequestParticipantsSelector({ }; }, [betas, reports, participants, personalDetails, searchTerm, iouType, isDistanceRequest]); - const maxParticipantsReached = participants.length === CONST.REPORT.MAXIMUM_PARTICIPANTS; - /** * Returns the sections needed for the OptionsSelector * @@ -260,17 +261,6 @@ function MoneyRequestParticipantsSelector({ [maxParticipantsReached, newChatOptions.personalDetails.length, newChatOptions.recentReports.length, newChatOptions.userToInvite, participants, searchTerm], ); - // When search term updates & user hasn't selected max number of participants we will fetch any reports - const setSearchTermAndSearchInServer = useCallback( - (text = '') => { - if (text && !maxParticipantsReached) { - Report.searchInServer(text); - } - setSearchTerm(text); - }, - [maxParticipantsReached], - ); - // Right now you can't split a request with a workspace and other additional participants // This is getting properly fixed in https://github.com/Expensify/App/issues/27508, but as a stop-gap to prevent // the app from crashing on native when you try to do this, we'll going to show error message if you have a workspace and other participants