Merge pull request Expensify#86289 from Expensify/marcochavezf/610149-rhp-home-page-variant

[Payment due @thesahindia] Add rhpHomePage variant to onboarding A/B/C/D test

Author: deetergp

src/CONST/index.ts

@@ -6533,6 +6533,7 @@ const CONST = {
     ONBOARDING_RHP_VARIANT: {
         RHP_CONCIERGE_DM: 'rhpConciergeDm',
         RHP_ADMINS_ROOM: 'rhpAdminsRoom',
+        RHP_HOME_PAGE: 'rhpHomePage',
         CONTROL: 'control',
     },
     ACTIONABLE_TRACK_EXPENSE_WHISPER_MESSAGE: 'What would you like to do with this expense?',

src/components/SidePanel/RHPVariantTest/index.ts

@@ -34,18 +34,25 @@ const shouldOpenRHPVariant: ShouldOpenRHPVariant = () => {
     const isMicroCompany = onboardingCompanySize === CONST.ONBOARDING_COMPANY_SIZE.MICRO;
     const isRHPConciergeDM = onboardingRHPVariant === CONST.ONBOARDING_RHP_VARIANT.RHP_CONCIERGE_DM;
     const isRHPAdminsRoom = onboardingRHPVariant === CONST.ONBOARDING_RHP_VARIANT.RHP_ADMINS_ROOM;
+    const isRHPHomePage = onboardingRHPVariant === CONST.ONBOARDING_RHP_VARIANT.RHP_HOME_PAGE;
 
-    return isMicroCompany && (isRHPConciergeDM || isRHPAdminsRoom);
+    return isMicroCompany && (isRHPConciergeDM || isRHPAdminsRoom || isRHPHomePage);
 };
 
 /**
- * Handles navigation for RHP experiment:
- * - Control: navigate to the last accessed report on small screens, do not open side panel
- * - RHP Concierge DM: navigate to the workspace overview and open the side panel with the Concierge DM
- * - RHP Admins Room: navigate to the workspace overview and open the side panel with the Admins Room
+ * Handles navigation for RHP experiment variants (B/C/D):
+ * Variants B and C navigate to the workspace overview, Variant D navigates to home.
+ * All variants open the side panel without overlay.
+ * The control variant is handled separately in navigateAfterOnboarding.
  */
 const handleRHPVariantNavigation: HandleRHPVariantNavigation = (onboardingPolicyID) => {
-    Navigation.navigate(ROUTES.WORKSPACE_OVERVIEW.getRoute(onboardingPolicyID));
+    const isRHPHomePage = onboardingRHPVariant === CONST.ONBOARDING_RHP_VARIANT.RHP_HOME_PAGE;
+
+    if (isRHPHomePage) {
+        Navigation.navigate(ROUTES.HOME);
+    } else {
+        Navigation.navigate(ROUTES.WORKSPACE_OVERVIEW.getRoute(onboardingPolicyID));
+    }
     SidePanelActions.openSidePanel(true);
 };
 

src/components/SidePanel/SidePanelContextProvider.tsx

@@ -28,7 +28,6 @@ type SidePanelStateContextProps = {
     sidePanelOffset: RefObject<Animated.Value>;
     sidePanelTranslateX: RefObject<Animated.Value>;
     sidePanelNVP?: SidePanel;
-    reportID?: string;
     sessionStartTime: string | null;
 };
 
@@ -49,6 +48,8 @@ const SidePanelStateContext = createContext<SidePanelStateContextProps>({
     sessionStartTime: null,
 });
 
+const SidePanelReportIDContext = createContext<string | undefined>(undefined);
+
 const SidePanelActionsContext = createContext<SidePanelActionsContextProps>({
     openSidePanel: () => {},
     closeSidePanel: () => {},
@@ -80,11 +81,12 @@ function SidePanelContextProvider({children}: PropsWithChildren) {
     });
 
     const isRHPAdminsRoom = onboardingRHPVariant === CONST.ONBOARDING_RHP_VARIANT.RHP_ADMINS_ROOM;
+    const isRHPHomePage = onboardingRHPVariant === CONST.ONBOARDING_RHP_VARIANT.RHP_HOME_PAGE;
     const isUserAdmin = isPolicyAdmin(activePolicy, sessionEmail);
     const isPolicyActive = shouldShowPolicy(activePolicy, false, sessionEmail ?? '');
     const adminsChatReportID = activePolicy?.chatReportIDAdmins?.toString();
 
-    const reportID = isRHPAdminsRoom && isUserAdmin && isPolicyActive && adminsChatReportID ? adminsChatReportID : conciergeReportID;
+    const reportID = (isRHPAdminsRoom || isRHPHomePage) && isUserAdmin && isPolicyActive && adminsChatReportID ? adminsChatReportID : conciergeReportID;
 
     const [sessionStartTime, setSessionStartTime] = useState<string | null>(null);
     const [prevShouldHideSidePanel, setPrevShouldHideSidePanel] = useState(shouldHideSidePanel);
@@ -145,7 +147,6 @@ function SidePanelContextProvider({children}: PropsWithChildren) {
         sidePanelOffset,
         sidePanelTranslateX,
         sidePanelNVP,
-        reportID,
         sessionStartTime,
     };
 
@@ -158,10 +159,12 @@ function SidePanelContextProvider({children}: PropsWithChildren) {
 
     return (
         <SidePanelStateContext.Provider value={stateValue}>
-            <SidePanelActionsContext.Provider value={actionsValue}>{children}</SidePanelActionsContext.Provider>
+            <SidePanelReportIDContext.Provider value={reportID}>
+                <SidePanelActionsContext.Provider value={actionsValue}>{children}</SidePanelActionsContext.Provider>
+            </SidePanelReportIDContext.Provider>
         </SidePanelStateContext.Provider>
     );
 }
 
 export default SidePanelContextProvider;
-export {SidePanelStateContext, SidePanelActionsContext};
+export {SidePanelStateContext, SidePanelReportIDContext, SidePanelActionsContext};

src/components/SidePanel/index.tsx

@@ -1,13 +1,15 @@
 import React from 'react';
 import useSidePanelActions from '@hooks/useSidePanelActions';
+import useSidePanelReportID from '@hooks/useSidePanelReportID';
 import useSidePanelState from '@hooks/useSidePanelState';
 import type {ExtraContentProps} from '@libs/Navigation/PlatformStackNavigation/types';
 import SidePanelModal from './SidePanelModal';
 import SidePanelReport from './SidePanelReport';
 import useSyncSidePanelWithHistory from './useSyncSidePanelWithHistory';
 
 function SidePanel({navigation}: Pick<ExtraContentProps, 'navigation'>) {
-    const {sidePanelNVP, isSidePanelTransitionEnded, shouldHideSidePanel, sidePanelTranslateX, shouldHideSidePanelBackdrop, reportID} = useSidePanelState();
+    const {sidePanelNVP, isSidePanelTransitionEnded, shouldHideSidePanel, sidePanelTranslateX, shouldHideSidePanelBackdrop} = useSidePanelState();
+    const reportID = useSidePanelReportID();
     const {closeSidePanel} = useSidePanelActions();
 
     // Hide side panel once animation ends

src/hooks/useSidePanelReportID.tsx

@@ -0,0 +1,11 @@
+import {useContext} from 'react';
+import {SidePanelReportIDContext} from '@components/SidePanel/SidePanelContextProvider';
+
+/**
+ * Hook to get the reportID used by the Side Panel.
+ * Separated from useSidePanelState to avoid re-rendering components
+ * that don't need reportID when it changes.
+ */
+const useSidePanelReportID = () => useContext(SidePanelReportIDContext);
+
+export default useSidePanelReportID;

src/types/onyx/OnboardingRHPVariant.ts

@@ -1,9 +1,10 @@
 /**
- * The variant of the onboarding RHP for A/B/C testing
+ * The variant of the onboarding RHP for A/B/C/D testing
  * @description 'control' - The variant with the Concierge DM
  * @description 'rhpConciergeDm' - Admin of workspace with Concierge DM
  * @description 'rhpAdminsRoom' - Admin of workspace with the admins room
+ * @description 'rhpHomePage' - Navigate to Home page with Concierge Anywhere accessible in #admins room
  */
-type OnboardingRHPVariant = 'rhpConciergeDm' | 'rhpAdminsRoom' | 'control';
+type OnboardingRHPVariant = 'rhpConciergeDm' | 'rhpAdminsRoom' | 'rhpHomePage' | 'control';
 
 export default OnboardingRHPVariant;