fix: open product description tab by default when navigating between …

…product detail pages (#1263)

Co-authored-by: Marcel Eisentraut <meisentraut@intershop.de>

src/app/pages/product/product-detail-info/product-detail-info.component.spec.ts

@@ -21,6 +21,7 @@ describe('Product Detail Info Component', () => {
   beforeEach(async () => {
     context = mock(ProductContextFacade);
     when(context.select('product')).thenReturn(of({ sku: '123' } as ProductView));
+    when(context.select('sku')).thenReturn(of('123'));
     when(context.select('variationCount')).thenReturn(of(0));
 
     await TestBed.configureTestingModule({

src/app/pages/product/product-detail-info/product-detail-info.component.ts

@@ -1,5 +1,5 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
-import { Observable, map } from 'rxjs';
+import { ChangeDetectionStrategy, Component, OnDestroy, OnInit } from '@angular/core';
+import { Observable, Subject, map, takeUntil } from 'rxjs';
 
 import { ProductContextDisplayProperties, ProductContextFacade } from 'ish-core/facades/product-context.facade';
 import { ProductView } from 'ish-core/models/product-view/product-view.model';
@@ -9,19 +9,33 @@ import { ProductView } from 'ish-core/models/product-view/product-view.model';
   templateUrl: './product-detail-info.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class ProductDetailInfoComponent implements OnInit {
+export class ProductDetailInfoComponent implements OnInit, OnDestroy {
   product$: Observable<ProductView>;
   isVariationMaster$: Observable<boolean>;
-  active = 'DESCRIPTION';
+  active = 'DESCRIPTION'; // default product tab
+
+  private destroy$ = new Subject<void>();
 
   constructor(private context: ProductContextFacade) {}
 
   ngOnInit() {
     this.product$ = this.context.select('product');
+
+    // when routing between products reset the opened product tab to the default tab
+    this.context
+      .select('sku')
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(() => (this.active = 'DESCRIPTION'));
+
     this.isVariationMaster$ = this.context.select('variationCount').pipe(map(variationCount => !!variationCount));
   }
 
   configuration$(key: keyof ProductContextDisplayProperties) {
     return this.context.select('displayProperties', key);
   }
+
+  ngOnDestroy(): void {
+    this.destroy$.next();
+    this.destroy$.complete();
+  }
 }