Merge pull request Expensify#86967 from mkzie2/mkzie2-issue/86737

blimpich · web-flow · commit 8ac7e7f85a12 · 2026-04-28T08:50:56.000-07:00
diff --git a/src/components/Search/FilterDropdowns/UserSelectPopup.tsx b/src/components/Search/FilterDropdowns/UserSelectPopup.tsx
@@ -14,6 +14,7 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import canFocusInputOnScreenFocus from '@libs/canFocusInputOnScreenFocus';
 import {getParticipantsOption} from '@libs/OptionsListUtils';
+import {doesPersonalDetailMatchSearchTerm} from '@libs/OptionsListUtils/searchMatchUtils';
 import type {OptionData} from '@libs/ReportUtils';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
@@ -92,24 +93,48 @@ function UserSelectPopup({value, label, closeOverlay, onChange, isSearchable}: U
             ...report,
             keyForList: String(report.reportID),
         }));
-        const combinedOptions = [...selectedOptionsForDisplay, ...personalDetailsList, ...recentReports];
 
-        // Sort the options so that selected items appear first, and the current user appears right after that, followed by the rest of the options in their original order
+        const isCurrentUserSelected = selectedOptionsForDisplay.some((option) => option.accountID === currentUserAccountID);
+
+        // Extract the current user from available options to guarantee they appear at the top.
+        // Falls back to creating from personal details to handle pagination edge cases.
+        let currentUserOption: OptionData | undefined;
+        if (!isCurrentUserSelected && currentUserAccountID) {
+            const currentUserPersonalDetail = personalDetailsList.find((p) => p.accountID === currentUserAccountID) ?? recentReports.find((r) => r.accountID === currentUserAccountID);
+            if (currentUserPersonalDetail) {
+                currentUserOption = currentUserPersonalDetail;
+            } else if (personalDetails?.[currentUserAccountID]) {
+                const candidateOption = getParticipantsOption(personalDetails[currentUserAccountID], personalDetails) as OptionData;
+                const trimmedSearchTerm = debouncedSearchTerm.trim().toLowerCase();
+                if (!trimmedSearchTerm || doesPersonalDetailMatchSearchTerm(candidateOption, currentUserAccountID, trimmedSearchTerm)) {
+                    currentUserOption = candidateOption;
+                }
+            }
+        }
+
+        // Filter current user from regular lists to avoid duplication
+        const filteredPersonalDetails = currentUserOption ? personalDetailsList.filter((p) => p.accountID !== currentUserAccountID) : personalDetailsList;
+        const filteredRecentReports = currentUserOption ? recentReports.filter((r) => r.accountID !== currentUserAccountID) : recentReports;
+
+        // Place selected options first, then the current user, then the rest
+        const combinedOptions = [...selectedOptionsForDisplay, ...(currentUserOption ? [currentUserOption] : []), ...filteredPersonalDetails, ...filteredRecentReports];
+
+        // Sort so that selected items appear first; current user placement is handled explicitly above
         combinedOptions.sort((a, b) => {
-            // selected items first
             if (a.isSelected && !b.isSelected) {
                 return -1;
             }
             if (!a.isSelected && b.isSelected) {
                 return 1;
             }
-
-            // Put the current user at the top of the list
-            if (a.accountID === currentUserAccountID) {
-                return -1;
-            }
-            if (b.accountID === currentUserAccountID) {
-                return 1;
+            // Among selected items, prioritize the current user
+            if (a.isSelected && b.isSelected) {
+                if (a.accountID === currentUserAccountID) {
+                    return -1;
+                }
+                if (b.accountID === currentUserAccountID) {
+                    return 1;
+                }
             }
             return 0;
         });
@@ -119,7 +144,7 @@ function UserSelectPopup({value, label, closeOverlay, onChange, isSearchable}: U
             keyForList: option.keyForList ?? option.login ?? '',
         }));
         return combinedOptionsWithKeyForList;
-    }, [availableOptions.personalDetails, availableOptions.recentReports, selectedOptionsForDisplay, currentUserAccountID]);
+    }, [availableOptions.personalDetails, availableOptions.recentReports, selectedOptionsForDisplay, currentUserAccountID, personalDetails, debouncedSearchTerm]);
 
     const headerMessage = useMemo(() => {
         const noResultsFound = isEmpty(listData);
diff --git a/src/components/Search/SearchFiltersParticipantsSelector.tsx b/src/components/Search/SearchFiltersParticipantsSelector.tsx
@@ -11,6 +11,7 @@ import useScreenWrapperTransitionStatus from '@hooks/useScreenWrapperTransitionS
 import useSearchSelector from '@hooks/useSearchSelector';
 import {canUseTouchScreen} from '@libs/DeviceCapabilities';
 import {formatSectionsFromSearchTerm, getFilteredRecentAttendees, getParticipantsOption} from '@libs/OptionsListUtils';
+import {doesPersonalDetailMatchSearchTerm} from '@libs/OptionsListUtils/searchMatchUtils';
 import type {OptionData} from '@libs/ReportUtils';
 import {getDisplayNameForParticipant} from '@libs/ReportUtils';
 import Navigation from '@navigation/Navigation';
@@ -76,18 +77,19 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate,
         [personalDetails, recentAttendees, currentUserEmail, currentUserAccountID, shouldAllowNameOnlyOptions],
     );
 
-    const {searchTerm, setSearchTerm, availableOptions, selectedOptions, setSelectedOptions, toggleSelection, areOptionsInitialized, onListEndReached} = useSearchSelector({
-        selectionMode: CONST.SEARCH_SELECTOR.SELECTION_MODE_MULTI,
-        searchContext: CONST.SEARCH_SELECTOR.SEARCH_CONTEXT_GENERAL,
-        maxRecentReportsToShow: CONST.IOU.MAX_RECENT_REPORTS_TO_SHOW,
-        includeUserToInvite: true,
-        excludeLogins: CONST.EXPENSIFY_EMAILS_OBJECT,
-        includeRecentReports: true,
-        shouldInitialize: didScreenTransitionEnd,
-        includeCurrentUser: true,
-        recentAttendees: recentAttendeeLists,
-        shouldAllowNameOnlyOptions,
-    });
+    const {searchTerm, debouncedSearchTerm, setSearchTerm, availableOptions, selectedOptions, setSelectedOptions, toggleSelection, areOptionsInitialized, onListEndReached} =
+        useSearchSelector({
+            selectionMode: CONST.SEARCH_SELECTOR.SELECTION_MODE_MULTI,
+            searchContext: CONST.SEARCH_SELECTOR.SEARCH_CONTEXT_GENERAL,
+            maxRecentReportsToShow: CONST.IOU.MAX_RECENT_REPORTS_TO_SHOW,
+            includeUserToInvite: true,
+            excludeLogins: CONST.EXPENSIFY_EMAILS_OBJECT,
+            includeRecentReports: true,
+            shouldInitialize: didScreenTransitionEnd,
+            includeCurrentUser: true,
+            recentAttendees: recentAttendeeLists,
+            shouldAllowNameOnlyOptions,
+        });
 
     const {sections, headerMessage} = useMemo(() => {
         const newSections = [];
@@ -104,7 +106,7 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate,
         }
 
         const formattedResults = formatSectionsFromSearchTerm(
-            searchTerm.trim().toLowerCase(),
+            debouncedSearchTerm.trim().toLowerCase(),
             selectedOptions,
             chatOptions.recentReports,
             chatOptions.personalDetails,
@@ -116,7 +118,7 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate,
             undefined,
             reportAttributesDerived,
         );
-        const selectedCurrentUser = formattedResults.section.data.find((option) => option.accountID === chatOptions.currentUserOption?.accountID);
+        const selectedCurrentUser = formattedResults.section.data.find((option) => option.accountID === currentUserAccountID);
 
         // If the current user is already selected, remove them from the recent reports and personal details
         if (selectedCurrentUser) {
@@ -125,20 +127,33 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate,
         }
 
         // If the current user is not selected, add them to the top of the list
-        if (!selectedCurrentUser && chatOptions.currentUserOption) {
-            const formattedName = getDisplayNameForParticipant({
-                accountID: chatOptions.currentUserOption.accountID,
-                shouldAddCurrentUserPostfix: true,
-                personalDetailsData: personalDetails,
-                formatPhoneNumber,
-            });
-            chatOptions.currentUserOption.text = formattedName;
-
-            newSections.push({
-                title: '',
-                data: [chatOptions.currentUserOption],
-                sectionIndex: 0,
-            });
+        // Falls back to creating from personal details to handle pagination edge cases
+        if (!selectedCurrentUser) {
+            let currentUserOptionToShow = chatOptions.currentUserOption;
+            const currentUserDetails = currentUserAccountID ? personalDetails?.[currentUserAccountID] : undefined;
+            if (!currentUserOptionToShow && currentUserAccountID && currentUserDetails) {
+                const candidateOption = getParticipantsOption(currentUserDetails, personalDetails) as OptionData;
+                const trimmedSearchTerm = debouncedSearchTerm.trim().toLowerCase();
+                if (!trimmedSearchTerm || doesPersonalDetailMatchSearchTerm(candidateOption, currentUserAccountID, trimmedSearchTerm)) {
+                    currentUserOptionToShow = candidateOption;
+                }
+            }
+
+            if (currentUserOptionToShow) {
+                const formattedName = getDisplayNameForParticipant({
+                    accountID: currentUserOptionToShow.accountID,
+                    shouldAddCurrentUserPostfix: true,
+                    personalDetailsData: personalDetails,
+                    formatPhoneNumber,
+                });
+                currentUserOptionToShow.text = formattedName;
+
+                newSections.push({
+                    title: '',
+                    data: [currentUserOptionToShow],
+                    sectionIndex: 0,
+                });
+            }
         }
 
         newSections.push({
@@ -175,7 +190,7 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate,
     }, [
         areOptionsInitialized,
         availableOptions,
-        searchTerm,
+        debouncedSearchTerm,
         selectedOptions,
         privateIsArchivedMap,
         currentUserAccountID,
