Merge pull request #47726 from callstack-internal/perf/ChatFinderPage…

…-rendering [Perf] Improve open report action via search panel performance
Expensify · Aug 27, 2024 · fe0e4f3 · fe0e4f3
2 parents 3d7aa7d + 64c8d37
commit fe0e4f3
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 4 deletions.
diff --git a/src/CONST.ts b/src/CONST.ts
@@ -999,6 +999,7 @@ const CONST = {
         RESIZE_DEBOUNCE_TIME: 100,
         UNREAD_UPDATE_DEBOUNCE_TIME: 300,
         SEARCH_FILTER_OPTIONS: 'search_filter_options',
+        USE_DEBOUNCED_STATE_DELAY: 300,
     },
     PRIORITY_MODE: {
         GSD: 'gsd',

diff --git a/src/hooks/useDebouncedState.ts b/src/hooks/useDebouncedState.ts
@@ -6,7 +6,7 @@ import CONST from '@src/CONST';
  * A React hook that provides a state and its debounced version.
  *
  * @param initialValue - The initial value of the state.
- * @param delay - The debounce delay in milliseconds. Defaults to SEARCH_OPTION_LIST_DEBOUNCE_TIME = 300ms.
+ * @param delay - The debounce delay in milliseconds. Defaults to USE_DEBOUNCED_STATE_DELAY = 300ms.
  * @returns A tuple containing:
  *          - The current state value.
  *          - The debounced state value.
@@ -17,7 +17,7 @@ import CONST from '@src/CONST';
  * @example
  * const [value, debouncedValue, setValue] = useDebouncedState<string>("", 300);
  */
-function useDebouncedState<T>(initialValue: T, delay: number = CONST.TIMING.SEARCH_OPTION_LIST_DEBOUNCE_TIME): [T, T, (value: T) => void] {
+function useDebouncedState<T>(initialValue: T, delay: number = CONST.TIMING.USE_DEBOUNCED_STATE_DELAY): [T, T, (value: T) => void] {
     const [value, setValue] = useState(initialValue);
     const [debouncedValue, setDebouncedValue] = useState(initialValue);
     const debouncedSetDebouncedValue = useRef(debounce(setDebouncedValue, delay)).current;

diff --git a/src/pages/ChatFinderPage/index.tsx b/src/pages/ChatFinderPage/index.tsx
@@ -22,6 +22,7 @@ import * as Report from '@userActions/Report';
 import Timing from '@userActions/Timing';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 import type * as OnyxTypes from '@src/types/onyx';
 import ChatFinderPageFooter from './ChatFinderPageFooter';
@@ -153,8 +154,7 @@ function ChatFinderPage({betas, isSearchingForReports, navigation}: ChatFinderPa
         }
 
         if (option.reportID) {
-            updateSearchValue('');
-            Navigation.dismissModal(option.reportID);
+            Navigation.closeAndNavigate(ROUTES.REPORT_WITH_ID.getRoute(option.reportID));
         } else {
             Report.navigateToAndOpenReport(option.login ? [option.login] : []);
         }