diff --git a/src/entryPoints/hyperswitch/HyperSwitchApp.res b/src/entryPoints/hyperswitch/HyperSwitchApp.res
index 8f90ad3b9..929e51945 100644
--- a/src/entryPoints/hyperswitch/HyperSwitchApp.res
+++ b/src/entryPoints/hyperswitch/HyperSwitchApp.res
@@ -361,11 +361,11 @@ let make = () => {
                           />
                         </AccessControl>
                       | list{"recon"} =>
-                        <AccessControl isEnabled=featureFlagDetails.recon>
+                        <AccessControl isEnabled=featureFlagDetails.recon permission=Access>
                           <Recon />
                         </AccessControl>
                       | list{"sdk"} =>
-                        <AccessControl isEnabled={!featureFlagDetails.isLiveMode}>
+                        <AccessControl isEnabled={!featureFlagDetails.isLiveMode} permission=Access>
                           <SDKPage />
                         </AccessControl>
                       | list{"3ds"} =>
@@ -397,7 +397,8 @@ let make = () => {
                           <BusinessDetails />
                         </AccessControl>
                       | list{"business-profiles"} =>
-                        <AccessControl isEnabled=featureFlagDetails.businessProfile>
+                        <AccessControl
+                          isEnabled=featureFlagDetails.businessProfile permission=Access>
                           <BusinessProfile />
                         </AccessControl>
                       | list{"quick-start"} => determineQuickStartPageState()
diff --git a/src/screens/HyperSwitch/Developer/APIKeys/KeyManagement.res b/src/screens/HyperSwitch/Developer/APIKeys/KeyManagement.res
index 0300a362c..5e332e724 100644
--- a/src/screens/HyperSwitch/Developer/APIKeys/KeyManagement.res
+++ b/src/screens/HyperSwitch/Developer/APIKeys/KeyManagement.res
@@ -177,19 +177,21 @@ module ApiKeyAddBtn = {
   @react.component
   let make = (~getAPIKeyDetails) => {
     let mixpanelEvent = MixpanelHook.useSendEvent()
+    let userPermissionJson = Recoil.useRecoilValueFromAtom(HyperswitchAtom.userPermissionAtom)
     let (showModal, setShowModal) = React.useState(_ => false)
     let initialValues = Dict.make()
     initialValues->Dict.set("expiration", Never->getStringFromRecordType->Js.Json.string)
 
     <>
       <ApiEditModal showModal setShowModal initialValues getAPIKeyDetails />
-      <Button
+      <ACLButton
+        text="Create New API Key"
         leftIcon={CustomIcon(
           <Icon
             name="plus" size=12 className="jp-gray-900 fill-opacity-50 dark:jp-gray-text_darktheme"
           />,
         )}
-        text="Create New API Key"
+        access=userPermissionJson.apiKeyWrite
         buttonType=Secondary
         buttonSize=Small
         onClick={_ => {
diff --git a/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsList.res b/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsList.res
index 530bf8614..94569b1a4 100644
--- a/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsList.res
+++ b/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsList.res
@@ -6,6 +6,7 @@ let make = (
 ) => {
   open PaymentSettingsListEntity
   let (offset, setOffset) = React.useState(_ => 0)
+  let userPermissionJson = Recoil.useRecoilValueFromAtom(HyperswitchAtom.userPermissionAtom)
 
   let businessProfileValues =
     HyperswitchAtom.businessProfilesAtom
@@ -20,11 +21,11 @@ let make = (
           subTitle="Set up and monitor transaction webhooks for real-time notifications."
         />
         <LoadedTable
-          title="Payment settings"
+          title=" "
           hideTitle=true
           resultsPerPage=7
           visibleColumns
-          entity={webhookProfileTableEntity}
+          entity={webhookProfileTableEntity(~permission=userPermissionJson.merchantAccountWrite)}
           showSerialNumber=true
           actualData={businessProfileValues->Array.map(Js.Nullable.return)}
           totalResults={businessProfileValues->Array.length}
diff --git a/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsListEntity.res b/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsListEntity.res
index be453e52a..06b21a352 100644
--- a/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsListEntity.res
+++ b/src/screens/HyperSwitch/Developer/PaymentSettings/PaymentSettingsListEntity.res
@@ -46,16 +46,17 @@ let getItems: Js.Json.t => array<profileEntity> = json => {
   LogicUtils.getArrayDataFromJson(json, itemToObjMapper)
 }
 
-let webhookProfileTableEntity = EntityType.makeEntity(
-  ~uri="",
-  ~getObjects=getItems,
-  ~defaultColumns,
-  ~allColumns,
-  ~getHeading,
-  ~dataKey="",
-  ~getCell,
-  ~getShowLink={
-    profile => `/payment-settings/${profile.profile_id}`
-  },
-  (),
-)
+let webhookProfileTableEntity = (~permission: AuthTypes.authorization) =>
+  EntityType.makeEntity(
+    ~uri="",
+    ~getObjects=getItems,
+    ~defaultColumns,
+    ~allColumns,
+    ~getHeading,
+    ~dataKey="",
+    ~getCell,
+    ~getShowLink={
+      profile => permission === Access ? `/payment-settings/${profile.profile_id}` : ""
+    },
+    (),
+  )
diff --git a/src/screens/HyperSwitch/Settings/BusinessMapping/BusinessProfile.res b/src/screens/HyperSwitch/Settings/BusinessMapping/BusinessProfile.res
index b1ef4381d..4373014ef 100644
--- a/src/screens/HyperSwitch/Settings/BusinessMapping/BusinessProfile.res
+++ b/src/screens/HyperSwitch/Settings/BusinessMapping/BusinessProfile.res
@@ -25,6 +25,7 @@ module AddEntryBtn = {
       [
         ("profile_name", `default${list->Array.length->string_of_int}`->Js.Json.string),
       ]->Dict.fromArray
+    let userPermissionJson = Recoil.useRecoilValueFromAtom(HyperswitchAtom.userPermissionAtom)
     let modalBody =
       <div>
         {switch modalState {
@@ -88,8 +89,9 @@ module AddEntryBtn = {
 
     <div>
       <UIUtils.RenderIf condition=isFromSettings>
-        <Button
+        <ACLButton
           text="Add"
+          access={userPermissionJson.merchantAccountWrite}
           buttonSize=Small
           buttonType={Primary}
           rightIcon={FontAwesome("plus")}
diff --git a/src/screens/HyperSwitch/Surcharge/Surcharge.res b/src/screens/HyperSwitch/Surcharge/Surcharge.res
index 6e4157b8f..02e3cbffb 100644
--- a/src/screens/HyperSwitch/Surcharge/Surcharge.res
+++ b/src/screens/HyperSwitch/Surcharge/Surcharge.res
@@ -105,6 +105,7 @@ let make = () => {
   let (pageView, setPageView) = React.useState(_ => LANDING)
   let showPopUp = PopUpState.useShowPopUp()
   let (showWarning, setShowWarning) = React.useState(_ => true)
+  let userPermissionJson = Recoil.useRecoilValueFromAtom(HyperswitchAtom.userPermissionAtom)
 
   let getWasm = async () => {
     try {
@@ -275,11 +276,12 @@ let make = () => {
             <p className="text-base font-normal text-grey-700 opacity-50">
               {"Create advanced rules using various payment parameters like amount, currency,payment method etc to enforce a surcharge on your payments"->React.string}
             </p>
-            <Button
+            <ACLButton
               text="Create New"
-              buttonType={Primary}
+              access=userPermissionJson.surchargeDecisionManagerWrite
+              buttonType=Primary
               customButtonStyle="!w-1/6"
-              leftIcon={FontAwesome("plus")}
+              leftIcon=FontAwesome("plus")
               onClick={_ => handleCreateNew()}
             />
           </div>
diff --git a/src/screens/HyperSwitch/ThreeDSFlow/HSwitchThreeDS.res b/src/screens/HyperSwitch/ThreeDSFlow/HSwitchThreeDS.res
index 0f4f6e459..9bf3a79de 100644
--- a/src/screens/HyperSwitch/ThreeDSFlow/HSwitchThreeDS.res
+++ b/src/screens/HyperSwitch/ThreeDSFlow/HSwitchThreeDS.res
@@ -111,6 +111,7 @@ let make = () => {
   let (pageView, setPageView) = React.useState(_ => NEW)
   let showPopUp = PopUpState.useShowPopUp()
   let (showWarning, setShowWarning) = React.useState(_ => true)
+  let userPermissionJson = Recoil.useRecoilValueFromAtom(HyperswitchAtom.userPermissionAtom)
 
   let getWasm = async () => {
     try {
@@ -295,11 +296,12 @@ let make = () => {
             <p className="text-base font-normal text-grey-700 opacity-50">
               {"Create advanced rules using various payment parameters like amount, currency,payment method etc to enforce 3DS authentication for specific payments to reduce fraudulent transactions"->React.string}
             </p>
-            <Button
+            <ACLButton
               text="Create New"
-              buttonType={Primary}
+              access=userPermissionJson.threeDsDecisionManagerWrite
+              buttonType=Primary
               customButtonStyle="!w-1/6"
-              leftIcon={FontAwesome("plus")}
+              leftIcon=FontAwesome("plus")
               onClick={_ => handleCreateNew()}
             />
           </div>
diff --git a/src/utils/AccessControl.res b/src/utils/AccessControl.res
index 9e4f772e4..23705a541 100644
--- a/src/utils/AccessControl.res
+++ b/src/utils/AccessControl.res
@@ -1,6 +1,6 @@
 open AuthTypes
 @react.component
-let make = (~isEnabled=true, ~permission=NoAccess, ~children) => {
+let make = (~isEnabled=true, ~permission, ~children) => {
   let isAccessAllowed = permission === Access
   isEnabled && isAccessAllowed ? children : <UnauthorizedPage />
 }