From e1fc0b247c3096ea791facd3bf7bf23d5a6642de Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Thu, 14 Mar 2024 15:35:31 +0700
Subject: [PATCH] Fix member search input does not display in invite search
 input

---
 src/pages/RoomInvitePage.tsx  | 11 ++++++++++-
 src/pages/RoomMembersPage.tsx | 20 +++++++++++++++++++-
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/src/pages/RoomInvitePage.tsx b/src/pages/RoomInvitePage.tsx
index 7bcd64397e20..6dad38deb21d 100644
--- a/src/pages/RoomInvitePage.tsx
+++ b/src/pages/RoomInvitePage.tsx
@@ -32,6 +32,7 @@ import type {PersonalDetailsList, Policy} from '@src/types/onyx';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import type {WithReportOrNotFoundProps} from './home/report/withReportOrNotFound';
 import withReportOrNotFound from './home/report/withReportOrNotFound';
+import SearchInputManager from './workspace/SearchInputManager';
 
 type RoomInvitePageOnyxProps = {
     /** All of the personal details for everyone */
@@ -52,6 +53,10 @@ function RoomInvitePage({betas, personalDetails, report, policies}: RoomInvitePa
     const [didScreenTransitionEnd, setDidScreenTransitionEnd] = useState(false);
     const navigation: StackNavigationProp<RootStackParamList> = useNavigation();
 
+    useEffect(() => {
+        setSearchTerm(SearchInputManager.searchInput);
+    }, []);
+
     // Any existing participants and Expensify emails should not be eligible for invitation
     const excludedUsers = useMemo(
         () =>
@@ -187,6 +192,7 @@ function RoomInvitePage({betas, personalDetails, report, policies}: RoomInvitePa
         if (reportID) {
             Report.inviteToRoom(reportID, invitedEmailsToAccountIDs);
         }
+        SearchInputManager.searchInput = '';
         Navigation.navigate(backRoute);
     }, [selectedOptions, backRoute, reportID, validate]);
 
@@ -231,7 +237,10 @@ function RoomInvitePage({betas, personalDetails, report, policies}: RoomInvitePa
                     ListItem={UserListItem}
                     textInputLabel={translate('optionsSelector.nameEmailOrPhoneNumber')}
                     textInputValue={searchTerm}
-                    onChangeText={setSearchTerm}
+                    onChangeText={(value) => {
+                        SearchInputManager.searchInput = value;
+                        setSearchTerm(value);
+                    }}
                     headerMessage={headerMessage}
                     onSelectRow={toggleOption}
                     onConfirm={inviteUsers}
diff --git a/src/pages/RoomMembersPage.tsx b/src/pages/RoomMembersPage.tsx
index 89d20287f66c..6cdcc6e06b95 100644
--- a/src/pages/RoomMembersPage.tsx
+++ b/src/pages/RoomMembersPage.tsx
@@ -1,3 +1,4 @@
+import {useIsFocused} from '@react-navigation/native';
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useCallback, useEffect, useMemo, useState} from 'react';
 import {View} from 'react-native';
@@ -35,6 +36,7 @@ import type {Session} from '@src/types/onyx';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import type {WithReportOrNotFoundProps} from './home/report/withReportOrNotFound';
 import withReportOrNotFound from './home/report/withReportOrNotFound';
+import SearchInputManager from './workspace/SearchInputManager';
 
 type RoomMembersPageOnyxProps = {
     session: OnyxEntry<Session>;
@@ -54,6 +56,19 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) {
     const [didLoadRoomMembers, setDidLoadRoomMembers] = useState(false);
     const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT;
 
+    const isFocusedScreen = useIsFocused();
+
+    useEffect(() => {
+        setSearchValue(SearchInputManager.searchInput);
+    }, [isFocusedScreen]);
+
+    useEffect(
+        () => () => {
+            SearchInputManager.searchInput = '';
+        },
+        [],
+    );
+
     /**
      * Get members for the current room
      */
@@ -274,7 +289,10 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) {
                             textInputLabel={translate('optionsSelector.findMember')}
                             disableKeyboardShortcuts={removeMembersConfirmModalVisible}
                             textInputValue={searchValue}
-                            onChangeText={setSearchValue}
+                            onChangeText={(value) => {
+                                SearchInputManager.searchInput = value;
+                                setSearchValue(value);
+                            }}
                             headerMessage={headerMessage}
                             onSelectRow={(item) => toggleUser(item)}
                             onSelectAll={() => toggleAllUsers(data)}