fix: Prevent blank order history page when using new tab component

SAP · Nov 13, 2024 · 06eac48 · 06eac48
1 parent ff6ce9f
commit 06eac48
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 16 deletions.
diff --git a/feature-libs/cart/base/components/add-to-cart/add-to-cart.component.ts b/feature-libs/cart/base/components/add-to-cart/add-to-cart.component.ts
@@ -245,19 +245,22 @@ export class AddToCartComponent implements OnInit, OnDestroy {
 
   onPickupOptionsCompLoaded() {
     if (this.featureConfigService.isEnabled('a11yPickupOptionsTabs')) {
-      this.subscription.add(
-        this.pickupOptionCompRef.instance.intendedPickupChange.subscribe(
-          (
-            intendedPickupLocation:
-              | { pickupOption?: 'pickup' | 'delivery'; displayName?: string }
-              | undefined
-          ) => {
-            this.disabled =
-              intendedPickupLocation?.pickupOption === 'pickup' &&
-              !intendedPickupLocation.displayName;
-          }
-        )
-      );
+      // Nesting this `if` statement for keeping feature flag check separately for easier removing
+      if (this.pickupOptionCompRef instanceof ComponentRef) {
+        this.subscription.add(
+          this.pickupOptionCompRef.instance.intendedPickupChange.subscribe(
+            (
+              intendedPickupLocation:
+                | { pickupOption?: 'pickup' | 'delivery'; displayName?: string }
+                | undefined
+            ) => {
+              this.disabled =
+                intendedPickupLocation?.pickupOption === 'pickup' &&
+                !intendedPickupLocation.displayName;
+            }
+          )
+        );
+      }
     }
   }
 

diff --git a/projects/storefrontapp/src/app/spartacus/spartacus-features.module.ts b/projects/storefrontapp/src/app/spartacus/spartacus-features.module.ts
@@ -353,7 +353,7 @@ if (environment.cpq) {
         a11yEmptyWishlistHeading: true,
         a11yScreenReaderBloatFix: true,
         a11yUseButtonsForBtnLinks: true,
-        a11yTabComponent: false,
+        a11yTabComponent: true,
         a11yCarouselArrowKeysNavigation: true,
         a11yPickupOptionsTabs: true,
         a11yNotificationsOnConsentChange: true,

diff --git a/...ntlib/cms-components/content/tab-paragraph-container/tab-paragraph-container.component.ts b/...ntlib/cms-components/content/tab-paragraph-container/tab-paragraph-container.component.ts
@@ -19,7 +19,13 @@ import {
   WindowRef,
 } from '@spartacus/core';
 import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
-import { distinctUntilChanged, map, switchMap, tap } from 'rxjs/operators';
+import {
+  distinctUntilChanged,
+  map,
+  startWith,
+  switchMap,
+  tap,
+} from 'rxjs/operators';
 import { ComponentWrapperDirective } from '../../../cms-structure/page/component/component-wrapper.directive';
 import { CmsComponentData } from '../../../cms-structure/page/model/index';
 import { BREAKPOINT } from '../../../layout/config/layout-config';
@@ -144,7 +150,10 @@ export class TabParagraphContainerComponent implements AfterViewInit, OnInit {
     }
 
     // Render the tabs after the templates have completed loading in the view.
-    this.tabs$ = combineLatest([this.components$, this.tabRefs.changes]).pipe(
+    this.tabs$ = combineLatest([
+      this.components$,
+      this.tabRefs.changes.pipe(startWith(this.tabRefs)),
+    ]).pipe(
       map(([components, refs]) =>
         components.map((component, index) => ({
           headerKey: component.title,