Merge pull request #34489 from callstack-internal/chore/add-searchpag…

…e-metrics

[No QA] chore: add metrics for SearchPage

src/CONST.ts

@@ -724,6 +724,8 @@ const CONST = {
         REPORT_INITIAL_RENDER: 'report_initial_render',
         SWITCH_REPORT: 'switch_report',
         SIDEBAR_LOADED: 'sidebar_loaded',
+        OPEN_SEARCH: 'open_search',
+        LOAD_SEARCH_OPTIONS: 'load_search_options',
         COLD: 'cold',
         WARM: 'warm',
         REPORT_ACTION_ITEM_LAYOUT_DEBOUNCE_TIME: 1500,

src/components/OptionsList/BaseOptionsList.tsx

@@ -9,6 +9,8 @@ import SectionList from '@components/SectionList';
 import Text from '@components/Text';
 import usePrevious from '@hooks/usePrevious';
 import useThemeStyles from '@hooks/useThemeStyles';
+import Timing from '@libs/actions/Timing';
+import Performance from '@libs/Performance';
 import type {OptionData} from '@libs/ReportUtils';
 import StringUtils from '@libs/StringUtils';
 import variables from '@styles/variables';
@@ -108,6 +110,16 @@ function BaseOptionsList(
         flattenedData.current = buildFlatSectionArray();
     });
 
+    useEffect(() => {
+        if (isLoading) {
+            return;
+        }
+
+        // Mark the end of the search page load time. This data is collected only for Search page.
+        Timing.end(CONST.TIMING.OPEN_SEARCH);
+        Performance.markEnd(CONST.TIMING.OPEN_SEARCH);
+    }, [isLoading]);
+
     const onViewableItemsChanged = () => {
         if (didLayout.current || !onLayout) {
             return;

src/libs/OptionsListUtils.js

@@ -7,13 +7,15 @@ import Onyx from 'react-native-onyx';
 import _ from 'underscore';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import Timing from './actions/Timing';
 import * as CollectionUtils from './CollectionUtils';
 import * as ErrorUtils from './ErrorUtils';
 import * as LocalePhoneNumber from './LocalePhoneNumber';
 import * as Localize from './Localize';
 import * as LoginUtils from './LoginUtils';
 import ModifiedExpenseMessage from './ModifiedExpenseMessage';
 import Navigation from './Navigation/Navigation';
+import Performance from './Performance';
 import Permissions from './Permissions';
 import * as PersonalDetailsUtils from './PersonalDetailsUtils';
 import * as PhoneNumber from './PhoneNumber';
@@ -1651,7 +1653,9 @@ function getOptions(
  * @returns {Object}
  */
 function getSearchOptions(reports, personalDetails, searchValue = '', betas) {
-    return getOptions(reports, personalDetails, {
+    Timing.start(CONST.TIMING.LOAD_SEARCH_OPTIONS);
+    Performance.markStart(CONST.TIMING.LOAD_SEARCH_OPTIONS);
+    const options = getOptions(reports, personalDetails, {
         betas,
         searchInputValue: searchValue.trim(),
         includeRecentReports: true,
@@ -1666,6 +1670,10 @@ function getSearchOptions(reports, personalDetails, searchValue = '', betas) {
         includeMoneyRequests: true,
         includeTasks: true,
     });
+    Timing.end(CONST.TIMING.LOAD_SEARCH_OPTIONS);
+    Performance.markEnd(CONST.TIMING.LOAD_SEARCH_OPTIONS);
+
+    return options;
 }
 
 /**

src/pages/home/sidebar/SidebarLinks.js

@@ -17,9 +17,11 @@ import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import Timing from '@libs/actions/Timing';
 import KeyboardShortcut from '@libs/KeyboardShortcut';
 import Navigation from '@libs/Navigation/Navigation';
 import onyxSubscribe from '@libs/onyxSubscribe';
+import Performance from '@libs/Performance';
 import SidebarUtils from '@libs/SidebarUtils';
 import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu';
 import safeAreaInsetPropTypes from '@pages/safeAreaInsetPropTypes';
@@ -123,6 +125,10 @@ function SidebarLinks({onLinkClick, insets, optionListItems, isLoading, priority
             return;
         }
 
+        // Capture metric for opening the search page
+        Timing.start(CONST.TIMING.OPEN_SEARCH);
+        Performance.markStart(CONST.TIMING.OPEN_SEARCH);
+
         Navigation.navigate(ROUTES.SEARCH);
     }, [isCreateMenuOpen]);