fix: issues after review

src/app/extensions/wishlists/facades/wishlists.facade.ts

@@ -17,8 +17,6 @@ import {
   getPreferredWishlist,
   getSelectedWishlistDetails,
   getSharedWishlist,
-  getSharedWishlistError,
-  getSharedWishlistLoading,
   getWishlistsError,
   getWishlistsLoading,
   moveItemToWishlist,
@@ -39,8 +37,6 @@ export class WishlistsFacade {
   wishlistLoading$: Observable<boolean> = this.store.pipe(select(getWishlistsLoading));
   wishlistError$: Observable<HttpError> = this.store.pipe(select(getWishlistsError));
   sharedWishlist$: Observable<Wishlist> = this.store.pipe(select(getSharedWishlist));
-  sharedWishlistLoading$: Observable<boolean> = this.store.pipe(select(getSharedWishlistLoading));
-  sharedWishlistError$: Observable<HttpError> = this.store.pipe(select(getSharedWishlistError));
 
   wishlistSelectOptions$(filterCurrent = true) {
     return this.wishlists$.pipe(

src/app/extensions/wishlists/guards/fetch-shared-wishlist.guard.ts

@@ -1,10 +1,9 @@
 import { inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
-import { Store, select } from '@ngrx/store';
+import { Store } from '@ngrx/store';
 import { Observable, of } from 'rxjs';
-import { map, switchMap, tap } from 'rxjs/operators';
 
-import { isSharedWishlistLoaded, isSharedWishlistLoading, wishlistActions } from '../store/wishlist';
+import { wishlistActions } from '../store/wishlist';
 
 /**
  * Fetch the shared wishlist
@@ -15,28 +14,12 @@ export function fetchSharedWishlistGuard(route: ActivatedRouteSnapshot): boolean
   const owner = route.queryParams.owner;
   const secureCode = route.queryParams.secureCode;
 
-  return store.pipe(
-    select(isSharedWishlistLoaded(wishlistId)),
-    switchMap(loaded => {
-      if (loaded) {
-        return of(true);
-      }
-
-      return store.pipe(
-        select(isSharedWishlistLoading(wishlistId)),
-        tap(loading => {
-          if (!loading) {
-            store.dispatch(
-              wishlistActions.loadSharedWishlist({
-                wishlistId,
-                owner,
-                secureCode,
-              })
-            );
-          }
-        }),
-        map(() => true)
-      );
+  store.dispatch(
+    wishlistActions.loadSharedWishlist({
+      wishlistId,
+      owner,
+      secureCode,
     })
   );
+  return of(true);
 }

src/app/extensions/wishlists/pages/account-wishlist-detail/account-wishlist-detail-page.component.html

@@ -20,12 +20,12 @@ <h1 class="col">{{ wishlist?.title }}</h1>
     <ul class="col list-unstyled d-flex justify-content-end mb-0">
       <li class="p-2">
         <button
-          type="button"
           *ngIf="wishlist.shared"
-          (click)="unshareWishlist(wishlist.id)"
+          type="button"
           class="btn-tool btn-link"
-          data-testing-id="wishlist-stop-sharing"
           title="{{ 'account.wishlist.header.stop_wishlist_sharing.label' | translate }}"
+          (click)="unshareWishlist(wishlist.id)"
+          data-testing-id="wishlist-stop-sharing"
         >
           <fa-icon [icon]="['fas', 'pause']" />
         </button>
@@ -34,10 +34,10 @@ <h1 class="col">{{ wishlist?.title }}</h1>
       <li class="p-2">
         <button
           type="button"
-          (click)="shareWishlistDialog.show()"
           class="btn-tool btn-link"
-          data-testing-id="wishlist-sharing"
           title="{{ 'account.wishlist.header.send_wishlist.label' | translate }}"
+          (click)="shareWishlistDialog.show()"
+          data-testing-id="wishlist-sharing"
         >
           <fa-icon [icon]="['fas', 'paper-plane']" />
         </button>
@@ -46,10 +46,10 @@ <h1 class="col">{{ wishlist?.title }}</h1>
       <li class="p-2">
         <button
           type="button"
-          (click)="editWishlistDialog.show()"
           class="btn-tool btn-link"
-          data-testing-id="wishlist-details-edit"
           title="{{ 'account.wishlist.header.edit_wishlist.label' | translate }}"
+          (click)="editWishlistDialog.show()"
+          data-testing-id="wishlist-details-edit"
         >
           <fa-icon [icon]="['fas', 'pencil-alt']" />
         </button>

src/app/extensions/wishlists/pages/account-wishlist-detail/account-wishlist-detail-page.component.spec.ts

@@ -1,3 +1,4 @@
+import { APP_BASE_HREF } from '@angular/common';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { MockComponent } from 'ng-mocks';
@@ -18,7 +19,10 @@ describe('Account Wishlist Detail Page Component', () => {
     await TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot()],
       declarations: [AccountWishlistDetailPageComponent, MockComponent(ErrorMessageComponent)],
-      providers: [{ provide: WishlistsFacade, useFactory: () => instance(mock(WishlistsFacade)) }],
+      providers: [
+        { provide: APP_BASE_HREF, useValue: '/' },
+        { provide: WishlistsFacade, useFactory: () => instance(mock(WishlistsFacade)) },
+      ],
     }).compileComponents();
   });
 

src/app/extensions/wishlists/pages/account-wishlist-detail/account-wishlist-detail-page.component.ts

@@ -1,4 +1,5 @@
-import { ChangeDetectionStrategy, Component, DestroyRef, OnInit, inject } from '@angular/core';
+import { APP_BASE_HREF } from '@angular/common';
+import { ChangeDetectionStrategy, Component, DestroyRef, Inject, OnInit, inject } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { TranslateService } from '@ngx-translate/core';
 import { Observable, filter, take } from 'rxjs';
@@ -21,7 +22,11 @@ export class AccountWishlistDetailPageComponent implements OnInit {
 
   private destroyedRef = inject(DestroyRef);
 
-  constructor(private wishlistsFacade: WishlistsFacade, private translate: TranslateService) {}
+  constructor(
+    private wishlistsFacade: WishlistsFacade,
+    private translate: TranslateService,
+    @Inject(APP_BASE_HREF) private baseHref: string
+  ) {}
 
   ngOnInit() {
     this.wishlist$ = this.wishlistsFacade.currentWishlist$;
@@ -59,8 +64,7 @@ export class AccountWishlistDetailPageComponent implements OnInit {
     const emailSubject = this.translate.instant('email.wishlist_sharing.heading');
     const defaultText = this.translate.instant('email.wishlist_sharing.text');
 
-    // get the base url, but consider multi-channel baseHref configurations
-    const baseUrl = window.location.origin + window.location.pathname.split('/').slice(0, -3).join('/');
+    const baseUrl = `${location.origin}${this.baseHref}`;
     const emailBody = `${wishlistSharing.message || defaultText} ${wishlist.title}\n${baseUrl}/wishlists/${
       wishlist.id
     }?owner=${wishlist.owner}&secureCode=${wishlist.secureCode}`;

src/app/extensions/wishlists/pages/account-wishlist/account-wishlist-list/account-wishlist-list.component.html

@@ -18,10 +18,12 @@
       ><span *ngIf="wishlist.preferred" class="input-help pl-3">{{
         'account.wishlists.table.preferred' | translate
       }}</span>
-      <span *ngIf="wishlist.preferred && wishlist.shared" class="input-help p-1">|</span>
-      <span *ngIf="wishlist.shared" class="input-help" [ngClass]="{ 'pl-3': !wishlist.preferred }">{{
-        'account.wishlists.table.shared' | translate
-      }}</span>
+      <span
+        *ngIf="wishlist.shared"
+        class="input-help"
+        [ngClass]="{ 'link-separator': wishlist.preferred && wishlist.shared, 'pl-3': !wishlist.preferred }"
+        >{{ 'account.wishlists.table.shared' | translate }}</span
+      >
     </div>
     <div class="col-2 list-item">
       {{ 'account.wishlists.items' | translate : { '0': wishlist.itemsCount } }}

src/app/extensions/wishlists/pages/shared-wishlist/shared-wishlist-page.component.html

@@ -1,6 +1,3 @@
-<!-- Error message -->
-<ish-error-message [error]="wishlistError$ | async" />
-
 <div *ngIf="wishlist$ | async as wishlist" class="col-9" data-testing-id="shared-wishlist">
   <h1>{{ wishlist.title }}</h1>
 

src/app/extensions/wishlists/pages/shared-wishlist/shared-wishlist-page.component.ts

@@ -1,29 +1,19 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
-import { Observable } from 'rxjs';
-
-import { HttpError } from 'ish-core/models/http-error/http-error.model';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
 
 import { WishlistsFacade } from '../../facades/wishlists.facade';
-import { Wishlist, WishlistItem } from '../../models/wishlist/wishlist.model';
+import { WishlistItem } from '../../models/wishlist/wishlist.model';
 
 @Component({
   selector: 'ish-wishlist-page',
   templateUrl: './shared-wishlist-page.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class SharedWishlistPageComponent implements OnInit {
-  wishlist$: Observable<Wishlist>;
-  wishlistError$: Observable<HttpError>;
-  wishlistLoading$: Observable<boolean>;
+export class SharedWishlistPageComponent {
+  wishlist$ = this.wishlistsFacade.sharedWishlist$;
+  wishlistLoading$ = this.wishlistsFacade.wishlistLoading$;
 
   constructor(private wishlistsFacade: WishlistsFacade) {}
 
-  ngOnInit() {
-    this.wishlist$ = this.wishlistsFacade.sharedWishlist$;
-    this.wishlistError$ = this.wishlistsFacade.sharedWishlistError$;
-    this.wishlistLoading$ = this.wishlistsFacade.sharedWishlistLoading$;
-  }
-
   trackByFn(_: number, item: WishlistItem) {
     return item.id;
   }

src/app/extensions/wishlists/store/wishlist/wishlist.effects.ts

@@ -3,9 +3,9 @@ import { Router } from '@angular/router';
 import { Actions, concatLatestFrom, createEffect, ofType } from '@ngrx/effects';
 import { routerNavigatedAction } from '@ngrx/router-store';
 import { Store, select } from '@ngrx/store';
-import { from } from 'rxjs';
-import { concatMap, debounceTime, filter, map, mergeMap, switchMap, take } from 'rxjs/operators';
+import { debounceTime, filter, map, mergeMap, switchMap } from 'rxjs/operators';
 
+import { businessError } from 'ish-core/store/core/error';
 import { displaySuccessMessage } from 'ish-core/store/core/messages';
 import { ofUrl, selectRouteParam } from 'ish-core/store/core/router';
 import { setBreadcrumbData } from 'ish-core/store/core/viewconf';
@@ -288,7 +288,6 @@ export class WishlistEffects {
       mapToPayload(),
       mergeMap(payload =>
         this.wishlistService.getSharedWishlist(payload.wishlistId, payload.owner, payload.secureCode).pipe(
-          take(1),
           map(wishlist => wishlistApiActions.loadSharedWishlistSuccess({ wishlist })),
           mapErrorToAction(wishlistApiActions.loadSharedWishlistFail)
         )
@@ -299,12 +298,7 @@ export class WishlistEffects {
   loadSharedWishlistFailed$ = createEffect(() =>
     this.actions$.pipe(
       ofType(wishlistApiActions.loadSharedWishlistFail),
-      mapToPayloadProperty('error'),
-      concatMap(() =>
-        from(this.router.navigate(['/error'])).pipe(
-          map(() => ({ type: '[Wishlist API] Navigation Success' })) // No-op action
-        )
-      )
+      map(() => businessError({ error: 'account.wishlists.shared_wishlist.error' }))
     )
   );
 }

src/app/extensions/wishlists/store/wishlist/wishlist.reducer.ts

@@ -33,8 +33,6 @@ export interface WishlistState extends EntityState<Wishlist> {
   selected: string;
   error: HttpError;
   sharedWishlist: Wishlist;
-  sharedWishlistLoading: boolean;
-  sharedWishlistError: HttpError;
 }
 
 export const wishlistsAdapter = createEntityAdapter<Wishlist>({
@@ -46,8 +44,6 @@ export const initialState: WishlistState = wishlistsAdapter.getInitialState({
   selected: undefined,
   error: undefined,
   sharedWishlist: undefined,
-  sharedWishlistLoading: false,
-  sharedWishlistError: undefined,
 });
 
 export const wishlistReducer = createReducer(
@@ -67,6 +63,7 @@ export const wishlistReducer = createReducer(
     deleteWishlistFail,
     createWishlistFail,
     updateWishlistFail,
+    wishlistApiActions.loadSharedWishlistFail,
     wishlistApiActions.shareWishlistFail,
     wishlistApiActions.unshareWishlistFail
   ),
@@ -145,15 +142,6 @@ export const wishlistReducer = createReducer(
     (state, action): WishlistState => ({
       ...state,
       sharedWishlist: action.payload.wishlist,
-      sharedWishlistLoading: false,
-    })
-  ),
-  on(
-    wishlistApiActions.loadSharedWishlistFail,
-    (state, action): WishlistState => ({
-      ...state,
-      sharedWishlistLoading: false,
-      sharedWishlistError: action.payload.error,
     })
   )
 );

src/app/extensions/wishlists/store/wishlist/wishlist.selectors.ts

@@ -41,19 +41,3 @@ export const getAllWishlistsItemsSkus = createSelectorFactory<object, string[]>(
 );
 
 export const getSharedWishlist = createSelector(getWishlistState, (state: WishlistState) => state.sharedWishlist);
-
-export const getSharedWishlistLoading = createSelector(
-  getWishlistState,
-  (state: WishlistState) => state.sharedWishlistLoading
-);
-
-export const getSharedWishlistError = createSelector(
-  getWishlistState,
-  (state: WishlistState) => state.sharedWishlistError
-);
-
-export const isSharedWishlistLoading = (wishlistId: string) =>
-  createSelector(getWishlistState, (state: WishlistState) => state.loading && state.selected === wishlistId);
-
-export const isSharedWishlistLoaded = (wishlistId: string) =>
-  createSelector(selectEntities, entities => !!entities[wishlistId]);

src/assets/i18n/de_DE.json

@@ -565,6 +565,7 @@
   "account.wishlists.new_wishlist_form.create_button.text": "Anlegen",
   "account.wishlists.no_items": "Sie haben keine verfügbaren Artikel zu Ihrer Wunschliste hinzugefügt.",
   "account.wishlists.no_wishlists": "Derzeit haben Sie keine Wunschlisten.",
+  "account.wishlists.shared_wishlist.error": "Die Wunschliste konnte nicht geteilt werden. Bitte versuchen Sie es später erneut.",
   "account.wishlists.table.preferred": "Bevorzugt",
   "account.wishlists.table.shared": "Freigegeben",
   "account.wishlists.widget.heading": "Artikel auf Ihrer Wunschliste",

src/assets/i18n/en_US.json

@@ -565,6 +565,7 @@
   "account.wishlists.new_wishlist_form.create_button.text": "Create",
   "account.wishlists.no_items": "You have not added any available items to your wish list.",
   "account.wishlists.no_wishlists": "Currently you don’t have any wish lists.",
+  "account.wishlists.shared_wishlist.error": "The wish list could not be shared. Please try again later.",
   "account.wishlists.table.preferred": "Preferred",
   "account.wishlists.table.shared": "Shared",
   "account.wishlists.widget.heading": "Your wish list items",

src/assets/i18n/fr_FR.json

@@ -565,6 +565,7 @@
   "account.wishlists.new_wishlist_form.create_button.text": "Créer",
   "account.wishlists.no_items": "Vous n’avez ajouté aucun article disponible à votre liste de souhaits.",
   "account.wishlists.no_wishlists": "Actuellement vous n’avez aucune liste de souhaits.",
+  "account.wishlists.shared_wishlist.error": "La liste de souhaits n’a pas pu être partagée. Veuillez réessayer.",
   "account.wishlists.table.preferred": "Préférée",
   "account.wishlists.table.shared": "Partagée",
   "account.wishlists.widget.heading": "Articles sur votre liste de souhaits",