Merged PR 1807: #4825 Refactor article-details.component.ts to format and display the publica...

#4825 Refactor article-details.component.ts to format and display the publication date of an article

Related work items: #4825

apps/page/catalog/src/lib/article-details/article-details.component.ts

@@ -23,6 +23,7 @@ import { EnvironmentService } from '@core/environment';
 import { CheckoutNavigationService, ProductCatalogNavigationService, CustomerSearchNavigation } from '@shared/services';
 import { DomainCheckoutService } from '@domain/checkout';
 import { Store } from '@ngrx/store';
+import moment from 'moment';
 
 @Component({
   selector: 'page-article-details',
@@ -91,16 +92,39 @@ export class ArticleDetailsComponent implements OnInit, OnDestroy {
 
   contributors$ = this.store.item$.pipe(map((item) => item?.product?.contributors?.split(';').map((m) => m.trim())));
 
+  /**
+   * Ein Observable, das das Veröffentlichungsdatum eines Artikels formatiert.
+   *
+   * Dieses Observable filtert die Artikel, um sicherzustellen, dass ein Veröffentlichungsdatum vorhanden ist,
+   * und formatiert dann das Datum basierend auf der Verfügbarkeit im Katalog oder dem Veröffentlichungsdatum des Produkts.
+   *
+   * - Wenn das erste Verkaufsdatum im Katalog gültig ist, wird es im Format 'DD. MMMM y' zurückgegeben.
+   * - Wenn das Veröffentlichungsdatum des Produkts gültig ist und es sich um den Jahresanfang handelt, wird nur das Jahr zurückgegeben.
+   * - Andernfalls wird das Veröffentlichungsdatum im Format 'DD. MMMM y' zurückgegeben.
+   * - Wenn kein gültiges Datum gefunden wird, wird ein leerer String zurückgegeben.
+   *
+   * @observable publicationDate$
+   */
   publicationDate$ = this.store.item$.pipe(
     filter((item) => !!item?.product?.publicationDate),
     map((item) => {
-      const date = this._dateAdapter.parseDate(item.product.publicationDate);
+      const catalogAvailability = moment(item.catalogAvailability.firstDayOfSale);
 
-      if (this._dateAdapter.getDate(date) === 1 && this._dateAdapter.getMonth(date) === 0) {
-        return this._datePipe.transform(date, 'y');
+      if (catalogAvailability.isValid()) {
+        return catalogAvailability.format('DD. MMMM y');
       }
 
-      return this._datePipe.transform(date, 'dd. MMMM y');
+      const publicationDate = moment(item.product.publicationDate);
+
+      if (publicationDate.isValid()) {
+        if (publicationDate.clone().startOf('year').isSame(publicationDate, 'day')) {
+          return publicationDate.format('y');
+        }
+
+        return publicationDate.format('DD. MMMM y');
+      }
+
+      return '';
     }),
   );