From 28e63d564a7e25d44e9969aa1af7b4f10cb84649 Mon Sep 17 00:00:00 2001
From: Stephon Brown <sbrown@livefront.com>
Date: Tue, 27 Jan 2026 13:45:17 -0500
Subject: [PATCH] fix(billing): update unified dialog logic and re-add comments

---
 .../unified-upgrade-dialog.component.ts       | 21 ++++++++++++++++---
 .../upgrade-payment.component.ts              |  3 +++
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/app/billing/individual/upgrade/unified-upgrade-dialog/unified-upgrade-dialog.component.ts b/apps/web/src/app/billing/individual/upgrade/unified-upgrade-dialog/unified-upgrade-dialog.component.ts
index 2bfd3fd3312..84ef426ffff 100644
--- a/apps/web/src/app/billing/individual/upgrade/unified-upgrade-dialog/unified-upgrade-dialog.component.ts
+++ b/apps/web/src/app/billing/individual/upgrade/unified-upgrade-dialog/unified-upgrade-dialog.component.ts
@@ -17,6 +17,7 @@ import { BillingAccountProfileStateService } from "@bitwarden/common/billing/abs
 import {
   BusinessSubscriptionPricingTierId,
   PersonalSubscriptionPricingTierId,
+  PersonalSubscriptionPricingTierIds,
 } from "@bitwarden/common/billing/types/subscription-pricing-tier";
 import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
 import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
@@ -123,10 +124,24 @@ export class UnifiedUpgradeDialogComponent implements OnInit {
   protected readonly showPremiumOrgFlow = computed(
     () => this.hasPremiumPersonally() && this.premiumToOrganizationUpgradeEnabled(),
   );
-  // Type-narrowed computed signal for app-upgrade-payment
-  // When hasPremiumPersonally is false, selectedPlan will only contain PersonalSubscriptionPricingTierId
+  /**
+   * Type-safe computed signal for app-upgrade-payment component.
+   * Returns the selected plan only when it's a personal plan (Premium or Families).
+   * When showPremiumOrgFlow is true, this will be null since business plans are handled separately.
+   */
   protected readonly selectedPersonalPlanId = computed<PersonalSubscriptionPricingTierId | null>(
-    () => this.selectedPlan() as PersonalSubscriptionPricingTierId | null,
+    () => {
+      const plan = this.selectedPlan();
+      // When showing premium org flow, user is selecting business plans (Teams/Enterprise)
+      // Standard flow uses personal plans (Premium/Families)
+      if (
+        plan === PersonalSubscriptionPricingTierIds.Premium ||
+        plan === PersonalSubscriptionPricingTierIds.Families
+      ) {
+        return plan;
+      }
+      return null;
+    },
   );
 
   protected readonly PaymentStep = UnifiedUpgradeDialogStep.Payment;
diff --git a/apps/web/src/app/billing/individual/upgrade/upgrade-payment/upgrade-payment.component.ts b/apps/web/src/app/billing/individual/upgrade/upgrade-payment/upgrade-payment.component.ts
index 19f55cc00b9..3993243dcac 100644
--- a/apps/web/src/app/billing/individual/upgrade/upgrade-payment/upgrade-payment.component.ts
+++ b/apps/web/src/app/billing/individual/upgrade/upgrade-payment/upgrade-payment.component.ts
@@ -59,6 +59,9 @@ import {
   UpgradePaymentService,
 } from "./services/upgrade-payment.service";
 
+/**
+ * Status types for upgrade payment dialog
+ */
 export const UpgradePaymentStatus = {
   Closed: "closed",
   UpgradedToPremium: "upgradedToPremium",