From 2e53a645c90aabc7cc74026bf2a238a07df5b123 Mon Sep 17 00:00:00 2001
From: Shane Melton <smelton@bitwarden.com>
Date: Tue, 3 Dec 2024 11:25:02 -0800
Subject: [PATCH] [PM-15520] Move organizationPaymentStatus$ out of page setup
 flow and tweak it to avoid hanging when user is not an owner (#12224)

---
 .../individual-vault/vault.component.html     |  4 +-
 .../vault/individual-vault/vault.component.ts | 65 +++++++++----------
 2 files changed, 34 insertions(+), 35 deletions(-)

diff --git a/apps/web/src/app/vault/individual-vault/vault.component.html b/apps/web/src/app/vault/individual-vault/vault.component.html
index 679d2ce6f7..75332dcf72 100644
--- a/apps/web/src/app/vault/individual-vault/vault.component.html
+++ b/apps/web/src/app/vault/individual-vault/vault.component.html
@@ -1,4 +1,6 @@
-<app-vault-banners [organizationsPaymentStatus]="organizationsPaymentStatus"></app-vault-banners>
+<app-vault-banners
+  [organizationsPaymentStatus]="organizationsPaymentStatus$ | async"
+></app-vault-banners>
 
 <app-vault-header
   [filter]="filter"
diff --git a/apps/web/src/app/vault/individual-vault/vault.component.ts b/apps/web/src/app/vault/individual-vault/vault.component.ts
index 9d235784d0..5f66bb49af 100644
--- a/apps/web/src/app/vault/individual-vault/vault.component.ts
+++ b/apps/web/src/app/vault/individual-vault/vault.component.ts
@@ -181,7 +181,6 @@ export class VaultComponent implements OnInit, OnDestroy {
   protected canCreateCollections = false;
   protected currentSearchText$: Observable<string>;
   private activeUserId: UserId;
-  protected organizationsPaymentStatus: FreeTrial[] = [];
   private searchText$ = new Subject<string>();
   private refresh$ = new BehaviorSubject<void>(null);
   private destroy$ = new Subject<void>();
@@ -209,6 +208,37 @@ export class VaultComponent implements OnInit, OnDestroy {
     ),
   );
 
+  protected organizationsPaymentStatus$: Observable<FreeTrial[]> = combineLatest([
+    this.organizationService.organizations$.pipe(
+      map((organizations) => organizations?.filter((org) => org.isOwner) ?? []),
+    ),
+    this.hasSubscription$,
+  ]).pipe(
+    switchMap(([ownerOrgs, hasSubscription]) => {
+      if (!ownerOrgs || ownerOrgs.length === 0 || !hasSubscription) {
+        return of([]);
+      }
+      return combineLatest(
+        ownerOrgs.map((org) =>
+          combineLatest([
+            this.organizationApiService.getSubscription(org.id),
+            this.organizationBillingService.getPaymentSource(org.id),
+          ]).pipe(
+            map(([subscription, paymentSource]) => {
+              return this.trialFlowService.checkForOrgsWithUpcomingPaymentIssues(
+                org,
+                subscription,
+                paymentSource,
+              );
+            }),
+          ),
+        ),
+      );
+    }),
+    map((results) => results.filter((result) => result.shownBanner)),
+    shareReplay({ refCount: false, bufferSize: 1 }),
+  );
+
   constructor(
     private syncService: SyncService,
     private route: ActivatedRoute,
@@ -425,36 +455,6 @@ export class VaultComponent implements OnInit, OnDestroy {
 
     this.unpaidSubscriptionDialog$.pipe(takeUntil(this.destroy$)).subscribe();
 
-    const organizationsPaymentStatus$ = combineLatest([
-      this.organizationService.organizations$,
-      this.hasSubscription$,
-    ]).pipe(
-      switchMap(([allOrganizations, hasSubscription]) => {
-        if (!allOrganizations || allOrganizations.length === 0 || !hasSubscription) {
-          return of([]);
-        }
-        return combineLatest(
-          allOrganizations
-            .filter((org) => org.isOwner && hasSubscription)
-            .map((org) =>
-              combineLatest([
-                this.organizationApiService.getSubscription(org.id),
-                this.organizationBillingService.getPaymentSource(org.id),
-              ]).pipe(
-                map(([subscription, paymentSource]) => {
-                  return this.trialFlowService.checkForOrgsWithUpcomingPaymentIssues(
-                    org,
-                    subscription,
-                    paymentSource,
-                  );
-                }),
-              ),
-            ),
-        );
-      }),
-      map((results) => results.filter((result) => result.shownBanner)),
-    );
-
     firstSetup$
       .pipe(
         switchMap(() => this.refresh$),
@@ -468,7 +468,6 @@ export class VaultComponent implements OnInit, OnDestroy {
             ciphers$,
             collections$,
             selectedCollection$,
-            organizationsPaymentStatus$,
           ]),
         ),
         takeUntil(this.destroy$),
@@ -482,7 +481,6 @@ export class VaultComponent implements OnInit, OnDestroy {
           ciphers,
           collections,
           selectedCollection,
-          organizationsPaymentStatus,
         ]) => {
           this.filter = filter;
           this.canAccessPremium = canAccessPremium;
@@ -498,7 +496,6 @@ export class VaultComponent implements OnInit, OnDestroy {
 
           this.showBulkMove = filter.type !== "trash";
           this.isEmpty = collections?.length === 0 && ciphers?.length === 0;
-          this.organizationsPaymentStatus = organizationsPaymentStatus;
           this.performingInitialLoad = false;
           this.refreshing = false;
         },