diff --git a/src/pages/settings/CashfreeIntegrationDetails.tsx b/src/pages/settings/CashfreeIntegrationDetails.tsx
index f30d54c5d..39f268e5a 100644
--- a/src/pages/settings/CashfreeIntegrationDetails.tsx
+++ b/src/pages/settings/CashfreeIntegrationDetails.tsx
@@ -119,13 +119,12 @@ const CashfreeIntegrationDetails = () => {
 
   return (
     <div>
-      <PageHeader withSide>
-        <div className="flex items-center">
+      <PageHeader.Wrapper withSide>
+        <PageHeader.Group>
           <ButtonLink
             to={generatePath(CASHFREE_INTEGRATION_ROUTE, {
               integrationGroup: IntegrationsTabsOptionsEnum.Community,
             })}
-            className="mr-3"
             type="button"
             buttonProps={{ variant: 'quaternary', icon: 'arrow-left' }}
           />
@@ -136,7 +135,7 @@ const CashfreeIntegrationDetails = () => {
               {cashfreePaymentProvider?.name}
             </Typography>
           )}
-        </div>
+        </PageHeader.Group>
         {(canEditIntegration || canDeleteIntegration) && (
           <Popper
             PopperProps={{ placement: 'bottom-end' }}
@@ -186,7 +185,7 @@ const CashfreeIntegrationDetails = () => {
             )}
           </Popper>
         )}
-      </PageHeader>
+      </PageHeader.Wrapper>
       <div className="flex items-center px-4 py-8 md:px-12">
         {loading ? (
           <>
diff --git a/src/pages/settings/CashfreeIntegrations.tsx b/src/pages/settings/CashfreeIntegrations.tsx
index 2c8967bed..e523c0ffd 100644
--- a/src/pages/settings/CashfreeIntegrations.tsx
+++ b/src/pages/settings/CashfreeIntegrations.tsx
@@ -91,13 +91,12 @@ const CashfreeIntegrations = () => {
 
   return (
     <>
-      <PageHeader withSide>
-        <div className="flex items-center">
+      <PageHeader.Wrapper withSide>
+        <PageHeader.Group>
           <ButtonLink
             to={generatePath(INTEGRATIONS_ROUTE, {
               integrationGroup: IntegrationsTabsOptionsEnum.Community,
             })}
-            className="mr-3"
             type="button"
             buttonProps={{ variant: 'quaternary', icon: 'arrow-left' }}
           />
@@ -108,7 +107,7 @@ const CashfreeIntegrations = () => {
               {translate('text_1727619878796wmgcntkfycn')}
             </Typography>
           )}
-        </div>
+        </PageHeader.Group>
 
         {canCreateIntegration && (
           <Button
@@ -120,7 +119,7 @@ const CashfreeIntegrations = () => {
             {translate('text_65846763e6140b469140e235')}
           </Button>
         )}
-      </PageHeader>
+      </PageHeader.Wrapper>
       <div className="flex items-center px-4 py-8 md:px-12">
         {loading ? (
           <>