chore: Moved Connector and Business Profile API call to SDK Page (#2016)

juspay · Jan 7, 2025 · 57a8ea4 · 57a8ea4
1 parent 602a787
commit 57a8ea4
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 15 deletions.
diff --git a/src/container/MerchantAccountContainer.res b/src/container/MerchantAccountContainer.res
@@ -14,8 +14,6 @@ let make = (~setAppScreenState) => {
     userHasResourceAccess,
   } = GroupACLHooks.useUserGroupACLHook()
   let featureFlagDetails = featureFlagAtom->Recoil.useRecoilValueFromAtom
-  let fetchConnectorListResponse = ConnectorListHook.useFetchConnectorList()
-  let fetchBusinessProfiles = BusinessProfileHook.useFetchBusinessProfiles()
   let fetchMerchantAccountDetails = MerchantDetailsHook.useFetchMerchantDetails()
   let (screenState, setScreenState) = React.useState(_ => PageLoaderWrapper.Loading)
   let {checkUserEntity} = React.useContext(UserInfoProvider.defaultContext)
@@ -26,12 +24,6 @@ let make = (~setAppScreenState) => {
       if !checkUserEntity([#Profile]) {
         let _ = await fetchMerchantAccountDetails()
       }
-      if userHasAccess(~groupAccess=ConnectorsView) === Access {
-        if !featureFlagDetails.isLiveMode {
-          let _ = await fetchConnectorListResponse()
-          let _ = await fetchBusinessProfiles()
-        }
-      }
       setScreenState(_ => PageLoaderWrapper.Success)
     } catch {
     | _ => setScreenState(_ => PageLoaderWrapper.Error(""))
@@ -42,11 +34,11 @@ let make = (~setAppScreenState) => {
     setUpConnectoreContainer()->ignore
     None
   }, [])
+
   <div>
     <PageLoaderWrapper screenState={screenState} sectionHeight="!h-screen" showLogoutButton=true>
       {switch url.path->urlPath {
       | list{"home"} => <Home setAppScreenState />
-
       | list{"recon"} =>
         <AccessControl
           isEnabled={featureFlagDetails.recon && !checkUserEntity([#Profile])}

diff --git a/src/screens/Home/HomeUtils.res b/src/screens/Home/HomeUtils.res
@@ -103,7 +103,8 @@ let isDefaultBusinessProfile = details => details->Array.length === 1
 
 module MerchantAuthInfo = {
   @react.component
-  let make = (~merchantDetailsValue: HSwitchSettingTypes.merchantPayload) => {
+  let make = () => {
+    let merchantDetailsValue = useMerchantDetailsValue()
     let dataDict =
       [
         ("merchant_id", merchantDetailsValue.merchant_id->JSON.Encode.string),
@@ -207,7 +208,6 @@ module CheckoutCard = {
 module ControlCenter = {
   @react.component
   let make = () => {
-    let merchantDetailsValue = useMerchantDetailsValue()
     let {isLiveMode} = HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom
     let {checkUserEntity} = React.useContext(UserInfoProvider.defaultContext)
 
@@ -250,7 +250,7 @@ module ControlCenter = {
               leftIcon=Some("merchantInfo")
               customSubHeadingStyle="w-full max-w-none"
             />
-            <MerchantAuthInfo merchantDetailsValue />
+            <MerchantAuthInfo />
             <CardFooter>
               <Button
                 text="Go to API keys"

diff --git a/src/screens/SDKPayment/SDKPage.res b/src/screens/SDKPayment/SDKPage.res
@@ -78,6 +78,7 @@ module SDKConfiguarationFields = {
 @react.component
 let make = () => {
   open MerchantAccountUtils
+  open HyperswitchAtom
   let url = RescriptReactRouter.useUrl()
   let filtersFromUrl = url.search->LogicUtils.getDictFromUrlSearchParams
   let (isSDKOpen, setIsSDKOpen) = React.useState(_ => false)
@@ -88,9 +89,13 @@ let make = () => {
     defaultBusinessProfile->SDKPaymentUtils.initialValueForForm
   )
   let connectorList = HyperswitchAtom.connectorListAtom->Recoil.useRecoilValueFromAtom
-
+  let featureFlagDetails = featureFlagAtom->Recoil.useRecoilValueFromAtom
+  let {userHasAccess} = GroupACLHooks.useUserGroupACLHook()
+  let fetchConnectorListResponse = ConnectorListHook.useFetchConnectorList()
+  let fetchBusinessProfiles = BusinessProfileHook.useFetchBusinessProfiles()
   let paymentConnectorList =
     connectorList->RoutingUtils.filterConnectorList(~retainInList=PaymentConnector)
+  let (screenState, setScreenState) = React.useState(_ => PageLoaderWrapper.Loading)
 
   React.useEffect(() => {
     let paymentIntentOptional = filtersFromUrl->Dict.get("payment_intent_client_secret")
@@ -105,6 +110,26 @@ let make = () => {
     None
   }, [defaultBusinessProfile.profile_id])
 
+  let setUpConnectoreContainer = async () => {
+    try {
+      setScreenState(_ => PageLoaderWrapper.Loading)
+      if userHasAccess(~groupAccess=ConnectorsView) === Access {
+        if !featureFlagDetails.isLiveMode {
+          let _ = await fetchBusinessProfiles()
+          let _ = await fetchConnectorListResponse()
+        }
+      }
+      setScreenState(_ => PageLoaderWrapper.Success)
+    } catch {
+    | _ => setScreenState(_ => PageLoaderWrapper.Error(""))
+    }
+  }
+
+  React.useEffect(() => {
+    setUpConnectoreContainer()->ignore
+    None
+  }, [])
+
   let onProceed = async (~paymentId) => {
     switch paymentId {
     | Some(val) =>
@@ -121,7 +146,7 @@ let make = () => {
     Nullable.null->Promise.resolve
   }
 
-  <>
+  <PageLoaderWrapper screenState={screenState}>
     <BreadCrumbNavigation
       path=[{title: "Home", link: `/home`}] currentPageTitle="Explore Demo Checkout Experience"
     />
@@ -173,5 +198,5 @@ let make = () => {
         }}
       </div>
     </div>
-  </>
+  </PageLoaderWrapper>
 }