diff --git a/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html b/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html
index 20dc22597f..67c785326c 100644
--- a/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html
+++ b/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html
@@ -177,6 +177,14 @@
         ></app-adjust-storage>
       </div>
     </ng-container>
+    <ng-container *ngIf="showAdjustSecretsManager">
+      <h3 bitTypography="h3" class="tw-mt-7">{{ "secretsManager" | i18n }}</h3>
+      <app-sm-adjust-subscription
+        [organizationId]="organizationId"
+        [options]="smOptions"
+        (onAdjusted)="subscriptionAdjusted()"
+      ></app-sm-adjust-subscription>
+    </ng-container>
   </ng-container>
 
   <h2 bitTypography="h2" class="tw-mt-7">{{ "selfHostingTitle" | i18n }}</h2>
diff --git a/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.ts b/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.ts
index 52245320fe..693700a6bc 100644
--- a/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.ts
+++ b/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.ts
@@ -21,6 +21,7 @@ import {
   BillingSyncApiKeyComponent,
   BillingSyncApiModalData,
 } from "./billing-sync-api-key.component";
+import { SecretsManagerSubscriptionOptions } from "./secrets-manager/sm-adjust-subscription.component";
 
 @Component({
   selector: "app-org-subscription-cloud",
@@ -36,6 +37,7 @@ export class OrganizationSubscriptionCloudComponent implements OnInit, OnDestroy
   adjustStorageAdd = true;
   showAdjustStorage = false;
   hasBillingSyncToken: boolean;
+  showAdjustSecretsManager = false;
 
   firstLoaded = false;
   loading: boolean;
@@ -105,6 +107,14 @@ export class OrganizationSubscriptionCloudComponent implements OnInit, OnDestroy
       (i) => i.keyType === OrganizationApiKeyType.BillingSync
     );
 
+    this.showAdjustSecretsManager =
+      this.userOrg.canEditSubscription &&
+      this.userOrg.useSecretsManager &&
+      this.sub.secretsManagerPlan != null &&
+      this.sub.secretsManagerPlan.hasAdditionalSeatsOption &&
+      !this.subscription.cancelled &&
+      !this.subscriptionMarkedForCancel;
+
     this.loading = false;
   }
 
@@ -153,6 +163,19 @@ export class OrganizationSubscriptionCloudComponent implements OnInit, OnDestroy
     return this.sub.seats;
   }
 
+  get smOptions(): SecretsManagerSubscriptionOptions {
+    return {
+      seatCount: this.sub.smSeats,
+      seatLimit: this.sub.maxAutoscaleSmSeats,
+      seatPrice: this.sub.secretsManagerPlan.seatPrice,
+      serviceAccountLimit: this.sub.maxAutoscaleSmServiceAccounts,
+      serviceAccountCount: this.sub.smServiceAccounts,
+      interval: this.billingInterval,
+      additionalServiceAccountPrice: this.sub.secretsManagerPlan.additionalPricePerServiceAccount,
+      baseServiceAccountCount: this.sub.secretsManagerPlan.baseServiceAccount,
+    };
+  }
+
   get maxAutoscaleSeats() {
     return this.sub.maxAutoscaleSeats;
   }