From 31bac5427d0b3f38fd1e6f85cf559ee5faf9a56e Mon Sep 17 00:00:00 2001 From: Jeeva Ramachandran <120017870+JeevaRamu0104@users.noreply.github.com> Date: Tue, 24 Dec 2024 12:58:41 +0530 Subject: [PATCH] chore: setup recon product (#1966) --- config/config.toml | 1 + src/{screens => }/APIUtils/APIUtils.res | 0 src/{screens => }/APIUtils/APIUtilsTypes.res | 0 src/entryPoints/FeatureFlagUtils.res | 2 + src/entryPoints/HSReconApp.res | 24 ++++ src/entryPoints/HSReconSidebarValues.res | 45 +++++++ src/entryPoints/HyperSwitchApp.res | 7 +- .../ReconAnalyticsContainer.res | 4 + src/reconContainer/ReconHomeContainer.res | 4 + .../ReconOnBoardingContainer.res | 4 + .../ReconAnalytics/ReconAnalytics.res | 4 + src/reconScreens/ReconHome/ReconHome.res | 4 + .../ReconOnboarding/RecoOnbdConfiguration.res | 1 + .../ReconOnboarding/ReconOnbdLanding.res | 4 + .../ReconOnboarding/ReconOnboarding.res | 6 + src/screens/Sidebar/Sidebar.res | 111 +++++++++++------- 16 files changed, 177 insertions(+), 44 deletions(-) rename src/{screens => }/APIUtils/APIUtils.res (100%) rename src/{screens => }/APIUtils/APIUtilsTypes.res (100%) create mode 100644 src/entryPoints/HSReconApp.res create mode 100644 src/entryPoints/HSReconSidebarValues.res create mode 100644 src/reconContainer/ReconAnalyticsContainer.res create mode 100644 src/reconContainer/ReconHomeContainer.res create mode 100644 src/reconContainer/ReconOnBoardingContainer.res create mode 100644 src/reconScreens/ReconAnalytics/ReconAnalytics.res create mode 100644 src/reconScreens/ReconHome/ReconHome.res create mode 100644 src/reconScreens/ReconOnboarding/RecoOnbdConfiguration.res create mode 100644 src/reconScreens/ReconOnboarding/ReconOnbdLanding.res create mode 100644 src/reconScreens/ReconOnboarding/ReconOnboarding.res diff --git a/config/config.toml b/config/config.toml index 15a622de5..f541028d9 100644 --- a/config/config.toml +++ b/config/config.toml @@ -52,6 +52,7 @@ tax_processor=true x_feature_route=false tenant_user=false dev_click_to_pay=false +dev_recon_v2_product=false [default.merchant_config] [default.merchant_config.new_analytics] org_ids=[] diff --git a/src/screens/APIUtils/APIUtils.res b/src/APIUtils/APIUtils.res similarity index 100% rename from src/screens/APIUtils/APIUtils.res rename to src/APIUtils/APIUtils.res diff --git a/src/screens/APIUtils/APIUtilsTypes.res b/src/APIUtils/APIUtilsTypes.res similarity index 100% rename from src/screens/APIUtils/APIUtilsTypes.res rename to src/APIUtils/APIUtilsTypes.res diff --git a/src/entryPoints/FeatureFlagUtils.res b/src/entryPoints/FeatureFlagUtils.res index c29c5dcde..49b7a0fb9 100644 --- a/src/entryPoints/FeatureFlagUtils.res +++ b/src/entryPoints/FeatureFlagUtils.res @@ -44,6 +44,7 @@ type featureFlag = { xFeatureRoute: bool, tenantUser: bool, clickToPay: bool, + devReconv2Product: bool, } let featureFlagType = (featureFlags: JSON.t) => { @@ -90,6 +91,7 @@ let featureFlagType = (featureFlags: JSON.t) => { taxProcessor: dict->getBool("tax_processor", false), xFeatureRoute: dict->getBool("x_feature_route", false), tenantUser: dict->getBool("tenant_user", false), + devReconv2Product: dict->getBool("dev_recon_v2_product", false), } } diff --git a/src/entryPoints/HSReconApp.res b/src/entryPoints/HSReconApp.res new file mode 100644 index 000000000..dc048c889 --- /dev/null +++ b/src/entryPoints/HSReconApp.res @@ -0,0 +1,24 @@ +@react.component +let make = () => { + open HSwitchUtils + open HyperswitchAtom + let pageViewEvent = MixpanelHook.usePageView() + let url = RescriptReactRouter.useUrl() + let featureFlagDetails = featureFlagAtom->Recoil.useRecoilValueFromAtom + let path = url.path->List.toArray->Array.joinWith("/") + React.useEffect(() => { + if featureFlagDetails.mixpanel { + pageViewEvent(~path)->ignore + } + None + }, (featureFlagDetails.mixpanel, path)) + + { + switch url.path->urlPath { + | list{"v2", "recon", "onboarding"} => + | list{"v2", "recon", "home"} => + | list{"v2", "recon", "analytics"} => + | _ => React.null + } + } +} diff --git a/src/entryPoints/HSReconSidebarValues.res b/src/entryPoints/HSReconSidebarValues.res new file mode 100644 index 000000000..fb12fa11d --- /dev/null +++ b/src/entryPoints/HSReconSidebarValues.res @@ -0,0 +1,45 @@ +open SidebarTypes + +let reconOnBoarding = { + SubLevelLink({ + name: "Profile Setup", + link: `v2/recon/onboarding`, + access: Access, + searchOptions: [("Recon onboarding", "")], + }) +} +let reconHome = { + SubLevelLink({ + name: "Home", + link: `v2/recon/home`, + access: Access, + searchOptions: [("Recon home", "")], + }) +} +let reconAnalytics = { + SubLevelLink({ + name: "Analytics", + link: `v2/recon/analytics`, + access: Access, + searchOptions: [("Recon analytics", "")], + }) +} + +let recon = () => { + let links = [reconOnBoarding, reconAnalytics] + Section({ + name: "Recon And Settlement", + icon: "v2/recon", + showSection: true, + links, + }) +} +let emptyComponent = CustomComponent({ + component: React.null, +}) + +let useGetReconSideBar = () => { + let {devReconv2Product} = HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom + let sidebar = [devReconv2Product ? recon() : emptyComponent] + sidebar +} diff --git a/src/entryPoints/HyperSwitchApp.res b/src/entryPoints/HyperSwitchApp.res index 88f1b56de..2ea787649 100644 --- a/src/entryPoints/HyperSwitchApp.res +++ b/src/entryPoints/HyperSwitchApp.res @@ -41,6 +41,7 @@ let make = () => { let isLiveUsersCounterEnabled = featureFlagDetails.liveUsersCounter let hyperSwitchAppSidebars = SidebarValues.useGetSidebarValues(~isReconEnabled) + let reconSidebars = HSReconSidebarValues.useGetReconSideBar() sessionExpired := false let setUpDashboard = async () => { @@ -102,7 +103,10 @@ let make = () => {
string)} + path={url.path} + sidebars={hyperSwitchAppSidebars} + key={(screenState :> string)} + productSiebars={reconSidebars} /> { className="p-6 md:px-16 md:pb-16 pt-[4rem] flex flex-col gap-10 max-w-fixedPageWidth"> {switch url.path->urlPath { + | list{"v2", "recon", ..._} => | list{"home", ..._} | list{"recon"} | list{"upload-files"} diff --git a/src/reconContainer/ReconAnalyticsContainer.res b/src/reconContainer/ReconAnalyticsContainer.res new file mode 100644 index 000000000..232b138c6 --- /dev/null +++ b/src/reconContainer/ReconAnalyticsContainer.res @@ -0,0 +1,4 @@ +@react.component +let make = () => { + +} diff --git a/src/reconContainer/ReconHomeContainer.res b/src/reconContainer/ReconHomeContainer.res new file mode 100644 index 000000000..9639da1fa --- /dev/null +++ b/src/reconContainer/ReconHomeContainer.res @@ -0,0 +1,4 @@ +@react.component +let make = () => { + +} diff --git a/src/reconContainer/ReconOnBoardingContainer.res b/src/reconContainer/ReconOnBoardingContainer.res new file mode 100644 index 000000000..d3b053134 --- /dev/null +++ b/src/reconContainer/ReconOnBoardingContainer.res @@ -0,0 +1,4 @@ +@react.component +let make = () => { + +} diff --git a/src/reconScreens/ReconAnalytics/ReconAnalytics.res b/src/reconScreens/ReconAnalytics/ReconAnalytics.res new file mode 100644 index 000000000..4f171ef28 --- /dev/null +++ b/src/reconScreens/ReconAnalytics/ReconAnalytics.res @@ -0,0 +1,4 @@ +@react.component +let make = () => { +
{"Analytics"->React.string}
+} diff --git a/src/reconScreens/ReconHome/ReconHome.res b/src/reconScreens/ReconHome/ReconHome.res new file mode 100644 index 000000000..781f1cb69 --- /dev/null +++ b/src/reconScreens/ReconHome/ReconHome.res @@ -0,0 +1,4 @@ +@react.component +let make = () => { +
{"Home"->React.string}
+} diff --git a/src/reconScreens/ReconOnboarding/RecoOnbdConfiguration.res b/src/reconScreens/ReconOnboarding/RecoOnbdConfiguration.res new file mode 100644 index 000000000..8b1378917 --- /dev/null +++ b/src/reconScreens/ReconOnboarding/RecoOnbdConfiguration.res @@ -0,0 +1 @@ + diff --git a/src/reconScreens/ReconOnboarding/ReconOnbdLanding.res b/src/reconScreens/ReconOnboarding/ReconOnbdLanding.res new file mode 100644 index 000000000..31dad2bf1 --- /dev/null +++ b/src/reconScreens/ReconOnboarding/ReconOnbdLanding.res @@ -0,0 +1,4 @@ +@react.component +let make = () => { +
{"OnBoarding"->React.string}
+} diff --git a/src/reconScreens/ReconOnboarding/ReconOnboarding.res b/src/reconScreens/ReconOnboarding/ReconOnboarding.res new file mode 100644 index 000000000..a6b1794cc --- /dev/null +++ b/src/reconScreens/ReconOnboarding/ReconOnboarding.res @@ -0,0 +1,6 @@ +@react.component +let make = () => { +
+ +
+} diff --git a/src/screens/Sidebar/Sidebar.res b/src/screens/Sidebar/Sidebar.res index f122dff03..ad5c758ab 100644 --- a/src/screens/Sidebar/Sidebar.res +++ b/src/screens/Sidebar/Sidebar.res @@ -448,6 +448,7 @@ let make = ( ~path, ~linkSelectionCheck=defaultLinkSelectionCheck, ~verticalOffset="120px", + ~productSiebars: array, ) => { open CommonAuthHooks let {globalUIConfig: {sidebarColor: {backgroundColor}}} = React.useContext( @@ -553,51 +554,75 @@ let make = ( className="h-full overflow-y-scroll transition-transform duration-1000 overflow-x-hidden sidebar-scrollbar" style={height: `calc(100vh - ${verticalOffset})`}> - {sidebars - ->Array.mapWithIndex((tabInfo, index) => { - switch tabInfo { - | RemoteLink(record) - | Link(record) => { - let isSelected = linkSelectionCheck(firstPart, record.link) - - } - - | LinkWithTag(record) => { - let isSelected = linkSelectionCheck(firstPart, record.link) - - } - - | Section(section) => - - + {sidebars + ->Array.mapWithIndex((tabInfo, index) => { + switch tabInfo { + | RemoteLink(record) + | Link(record) => { + let isSelected = linkSelectionCheck(firstPart, record.link) + + } + + | LinkWithTag(record) => { + let isSelected = linkSelectionCheck(firstPart, record.link) + + } + + | Section(section) => + + + + | Heading(headingOptions) => +
- - | Heading(headingOptions) => -
- {{isSidebarExpanded ? headingOptions.name : ""}->React.string} -
+ className={`text-xs font-semibold leading-5 text-[#5B6376] overflow-hidden border-l-2 rounded-sm border-transparent px-3 ${isSidebarExpanded + ? "mx-2" + : "mx-1"} mt-5 mb-3`}> + {{isSidebarExpanded ? headingOptions.name : ""}->React.string} +
- | CustomComponent(customComponentOptions) => - - customComponentOptions.component - - } - }) - ->React.array} + | CustomComponent(customComponentOptions) => + + customComponentOptions.component + + } + }) + ->React.array} +
+
+ {productSiebars + ->Array.mapWithIndex((tabInfo, index) => { + switch tabInfo { + | Section(section) => + + + + | _ => React.null + } + }) + ->React.array} +