Merge branch 'main' into recovery-gateways

src/entryPoints/HyperSwitchApp.res

@@ -13,6 +13,8 @@ let make = () => {
     setShowFeedbackModal,
     dashboardPageState,
     setDashboardPageState,
+    currentProduct,
+    setDefaultProductToSessionStorage,
   } = React.useContext(GlobalProvider.defaultContext)
   let (screenState, setScreenState) = React.useState(_ => PageLoaderWrapper.Loading)
   let merchantDetailsTypedValue = Recoil.useRecoilValueFromAtom(merchantDetailsValueAtom)
@@ -43,14 +45,16 @@ let make = () => {
   }, [merchantDetailsTypedValue.merchant_id])
 
   let maintainenceAlert = featureFlagDetails.maintainenceAlert
-  let hyperSwitchAppSidebars = SidebarValues.useGetSidebarValues(~isReconEnabled)
-  let productSidebars = ProductsSidebarValues.useGetSideBarValues()
+  let hyperSwitchAppSidebars = SidebarValues.useGetSidebarValuesForCurrentActive(~isReconEnabled)
+  let productSidebars = ProductsSidebarValues.useGetProductSideBarValues(~currentProduct)
   sessionExpired := false
+
   let applyTheme = async () => {
     if devThemeFeature || themeId->LogicUtils.isNonEmptyString {
       let _ = await getThemesJson(themeId, JSON.Encode.null, devThemeFeature)
     }
   }
+
   let setUpDashboard = async () => {
     try {
       // NOTE: Treat groupACL map similar to screenstate
@@ -59,6 +63,7 @@ let make = () => {
       Window.connectorWasmInit()->ignore
       let _ = await fetchMerchantSpecificConfig()
       let _ = await fetchUserGroupACL()
+      setDefaultProductToSessionStorage()
       switch url.path->urlPath {
       | list{"unauthorized"} => RescriptReactRouter.push(appendDashboardPath(~url="/home"))
       | _ => ()

src/entryPoints/ProductTypes.res

@@ -0,0 +1 @@
+type productTypes = Orchestrator | Recon | Recovery

src/entryPoints/ProductUtils.res

@@ -0,0 +1,14 @@
+open ProductTypes
+let getVariantFromString = product =>
+  switch product {
+  | "Recon" => Recon
+  | "Recovery" => Recovery
+  | _ => Orchestrator
+  }
+
+let getStringFromVariant = product =>
+  switch product {
+  | Recon => "Recon"
+  | Recovery => "Recovery"
+  | Orchestrator => "Orchestrator"
+  }

src/entryPoints/ProductsSidebarValues.res

@@ -18,3 +18,50 @@ let useGetSideBarValues = () => {
 
   sideBarValues
 }
+
+let useGetProductSideBarValues = (~currentProduct: ProductTypes.productTypes) => {
+  open ProductUtils
+  let {devReconv2Product, devRecoveryV2Product} =
+    HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom
+
+  let sideBarValues = [
+    Link({
+      name: Orchestrator->getStringFromVariant,
+      icon: "home",
+      link: "/home",
+      access: Access,
+    }),
+  ]
+
+  if devReconv2Product {
+    sideBarValues->Array.push(
+      Link({
+        name: Recon->getStringFromVariant,
+        icon: "recon-home",
+        link: "/v2/recon/onboarding",
+        access: Access,
+      }),
+    )
+  }
+
+  if devRecoveryV2Product {
+    sideBarValues->Array.push(
+      Link({
+        name: Recovery->getStringFromVariant,
+        icon: "recovery-home",
+        link: "/v2/recovery",
+        access: Access,
+      }),
+    )
+  }
+
+  let productName = currentProduct->ProductUtils.getStringFromVariant
+
+  sideBarValues->Array.filter(topLevelItem =>
+    switch topLevelItem {
+    | Link(optionType) => optionType.name != productName
+
+    | _ => true
+    }
+  )
+}

src/entryPoints/Provider/GlobalProvider.res

@@ -15,6 +15,9 @@ let defaultValue = {
   setPermissionInfo: _ => (),
   isProdIntentCompleted: None,
   setIsProdIntentCompleted: _ => (),
+  currentProduct: Orchestrator,
+  setCurrentProductValue: _ => (),
+  setDefaultProductToSessionStorage: _ => (),
 }
 
 let defaultContext = React.createContext(defaultValue)
@@ -25,16 +28,34 @@ module Provider = {
 
 @react.component
 let make = (~children) => {
+  open SessionStorage
+  open ProductTypes
   let (showFeedbackModal, setShowFeedbackModal) = React.useState(_ => false)
   let (showProdIntentForm, setShowProdIntentForm) = React.useState(_ => false)
   let (dashboardPageState, setDashboardPageState) = React.useState(_ => #DEFAULT)
   let (permissionInfo, setPermissionInfo) = React.useState(_ => [])
   let (isProdIntentCompleted, setIsProdIntentCompleted) = React.useState(_ => None)
-
+  let (currentProduct, setCurrentProduct) = React.useState(_ => Orchestrator)
   let (integrationDetails, setIntegrationDetails) = React.useState(_ =>
     Dict.make()->JSON.Encode.object->ProviderHelper.getIntegrationDetails
   )
 
+  let setCurrentProductValue = product => {
+    setCurrentProduct(_ => product)
+    sessionStorage.setItem("product", product->ProductUtils.getStringFromVariant)
+  }
+
+  let setDefaultProductToSessionStorage = () => {
+    open ProductUtils
+    let currentSessionData = sessionStorage.getItem("product")->Nullable.toOption
+    let data = switch currentSessionData {
+    | Some(sessionData) => sessionData->getVariantFromString
+    | None => Orchestrator
+    }
+
+    setCurrentProductValue(data)
+  }
+
   <Provider
     value={
       showFeedbackModal,
@@ -49,6 +70,9 @@ let make = (~children) => {
       setPermissionInfo,
       isProdIntentCompleted,
       setIsProdIntentCompleted,
+      currentProduct,
+      setCurrentProductValue,
+      setDefaultProductToSessionStorage,
     }>
     children
   </Provider>

src/entryPoints/Provider/ProviderTypes.res

@@ -15,6 +15,7 @@ type integrationDetailsType = {
   integration_checklist: integration,
   account_activation: integration,
 }
+
 type contextType = {
   showFeedbackModal: bool,
   setShowFeedbackModal: (bool => bool) => unit,
@@ -30,6 +31,9 @@ type contextType = {
   ) => unit,
   isProdIntentCompleted: option<bool>,
   setIsProdIntentCompleted: (option<bool> => option<bool>) => unit,
+  currentProduct: ProductTypes.productTypes,
+  setCurrentProductValue: ProductTypes.productTypes => unit,
+  setDefaultProductToSessionStorage: unit => unit,
 }
 
 type sidebarContextType = {

src/entryPoints/SidebarValues.res

@@ -21,7 +21,7 @@ module GetProductionAccess = {
     switch isProdIntentCompleted {
     | Some(_) =>
       <div
-        className={`flex items-center gap-2 ${backgroundColor} ${cursorStyles} px-4 py-3 m-2 ml-2 mb-3 !mx-4 whitespace-nowrap rounded`}
+        className={`flex items-center gap-2 ${backgroundColor} ${cursorStyles} px-4 py-3 whitespace-nowrap rounded`}
         onClick={_ => {
           isProdIntent
             ? ()
@@ -45,6 +45,16 @@ module GetProductionAccess = {
   }
 }
 
+module ProductHeaderComponent = {
+  @react.component
+  let make = () => {
+    let {currentProduct} = React.useContext(GlobalProvider.defaultContext)
+
+    <div className={`text-sm font-semibold px-3 pt-6 pb-2 text-nd_gray-400`}>
+      {React.string(currentProduct->ProductUtils.getStringFromVariant->String.toUpperCase)}
+    </div>
+  }
+}
 let emptyComponent = CustomComponent({
   component: React.null,
 })
@@ -67,7 +77,7 @@ let home = isHomeEnabled =>
   isHomeEnabled
     ? Link({
         name: "Home",
-        icon: "hswitch-home",
+        icon: "nd-home",
         link: "/home",
         access: Access,
       })
@@ -138,7 +148,7 @@ let operations = (isOperationsEnabled, ~userHasResourceAccess, ~isPayoutsEnabled
   isOperationsEnabled
     ? Section({
         name: "Operations",
-        icon: "hswitch-operations",
+        icon: "nd-operations",
         showSection: true,
         links,
       })
@@ -250,7 +260,7 @@ let connectors = (
   isConnectorsEnabled
     ? Section({
         name: "Connectors",
-        icon: "connectors",
+        icon: "nd-connectors",
         showSection: true,
         links: connectorLinkArray,
       })
@@ -327,7 +337,7 @@ let analytics = (
   isAnalyticsEnabled
     ? Section({
         name: "Analytics",
-        icon: "analytics",
+        icon: "nd-analytics",
         showSection: userHasResourceAccess(~resourceAccess=Analytics) === CommonAuthTypes.Access,
         links,
       })
@@ -406,7 +416,7 @@ let workflow = (
   isWorkflowEnabled
     ? Section({
         name: "Workflow",
-        icon: "3ds",
+        icon: "nd-workflow",
         showSection: true,
         links: defaultWorkFlow,
       })
@@ -476,7 +486,7 @@ let settings = (~isConfigurePmtsEnabled, ~userHasResourceAccess, ~complianceCert
 
   Section({
     name: "Settings",
-    icon: "hswitch-settings",
+    icon: "nd-settings",
     showSection: true,
     links: settingsLinkArray,
   })
@@ -514,7 +524,7 @@ let developers = (isDevelopersEnabled, ~userHasResourceAccess, ~checkUserEntity)
   isDevelopersEnabled
     ? Section({
         name: "Developers",
-        icon: "developer",
+        icon: "nd-developers",
         showSection: true,
         links: defaultDevelopersOptions,
       })
@@ -618,9 +628,8 @@ let reconAndSettlement = (recon, isReconEnabled, checkUserEntity, userHasResourc
   }
 }
 
-let useGetSidebarValues = (~isReconEnabled: bool) => {
+let useGetHsSidebarValues = (~isReconEnabled: bool) => {
   let featureFlagDetails = HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom
-  let {userHasAccess, hasAnyGroupAccess} = GroupACLHooks.useUserGroupACLHook()
   let {userHasResourceAccess} = GroupACLHooks.useUserGroupACLHook()
   let {userInfo: {userEntity}, checkUserEntity} = React.useContext(UserInfoProvider.defaultContext)
   let {
@@ -647,7 +656,6 @@ let useGetSidebarValues = (~isReconEnabled: bool) => {
   let isNewAnalyticsEnable =
     newAnalytics && useIsFeatureEnabledForMerchant(merchantSpecificConfig.newAnalytics)
   let sidebar = [
-    productionAccessComponent(!isLiveMode, userHasAccess, hasAnyGroupAccess),
     default->home,
     default->operations(~userHasResourceAccess, ~isPayoutsEnabled=payOut, ~userEntity),
     default->connectors(
@@ -679,3 +687,24 @@ let useGetSidebarValues = (~isReconEnabled: bool) => {
 
   sidebar
 }
+
+let useGetSidebarValuesForCurrentActive = (~isReconEnabled) => {
+  let {currentProduct} = React.useContext(GlobalProvider.defaultContext)
+  let featureFlagDetails = HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom
+  let {userHasAccess, hasAnyGroupAccess} = GroupACLHooks.useUserGroupACLHook()
+  let {isLiveMode} = featureFlagDetails
+
+  let hsSidebars = useGetHsSidebarValues(~isReconEnabled)
+  let defaultSidebar = [
+    productionAccessComponent(!isLiveMode, userHasAccess, hasAnyGroupAccess),
+    CustomComponent({
+      component: <ProductHeaderComponent />,
+    }),
+  ]
+  let sidebarValuesForProduct = switch currentProduct {
+  | Orchestrator => hsSidebars
+  | Recon => [ReconSidebarValues.reconSidebars]
+  | Recovery => [RevenueRecoverySidebarValues.recoverySidebars]
+  }
+  defaultSidebar->Array.concat(sidebarValuesForProduct)
+}

src/screens/Analytics/GlobalSearch/GlobalSearchBar.res

@@ -24,7 +24,7 @@ let make = () => {
   let (searchResults, setSearchResults) = React.useState(_ => [])
   let merchentDetails = HSwitchUtils.useMerchantDetailsValue()
   let isReconEnabled = merchentDetails.recon_status === Active
-  let hswitchTabs = SidebarValues.useGetSidebarValues(~isReconEnabled)
+  let hswitchTabs = SidebarValues.useGetHsSidebarValues(~isReconEnabled)
   let loader = LottieFiles.useLottieJson("loader-circle.json")
   let {globalSearch, globalSearchFilters} =
     HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom

src/screens/Analytics/GlobalSearchResults/SearchResultsPage.res

@@ -90,7 +90,7 @@ let make = () => {
   let globalSearchResult = HyperswitchAtom.globalSeacrchAtom->Recoil.useRecoilValueFromAtom
   let merchentDetails = HSwitchUtils.useMerchantDetailsValue()
   let isReconEnabled = merchentDetails.recon_status === Active
-  let hswitchTabs = SidebarValues.useGetSidebarValues(~isReconEnabled)
+  let hswitchTabs = SidebarValues.useGetHsSidebarValues(~isReconEnabled)
   let query = UrlUtils.useGetFilterDictFromUrl("")->getString("query", "")
   let {globalSearch} = HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom
   let {userHasAccess} = GroupACLHooks.useUserGroupACLHook()