Skip to content

Commit

Permalink
refactor: implement requested changes
Browse files Browse the repository at this point in the history
  • Loading branch information
fgiesske-intershop committed Apr 24, 2024
1 parent f33651e commit 104422d
Show file tree
Hide file tree
Showing 34 changed files with 567 additions and 401 deletions.
10 changes: 4 additions & 6 deletions src/app/extensions/wishlists/facades/wishlists.facade.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,10 @@ import {
getSelectedWishlistDetails,
getWishlistsError,
getWishlistsLoading,
loadSharedWishlist,
moveItemToWishlist,
removeItemFromWishlist,
shareWishlist,
unshareWishlist,
updateWishlist,
wishlistActions,
} from '../store/wishlist';

/* eslint-disable @typescript-eslint/member-ordering */
Expand Down Expand Up @@ -92,14 +90,14 @@ export class WishlistsFacade {
}

shareWishlist(wishlistId: string, wishlistSharing: WishlistSharing): void {
this.store.dispatch(shareWishlist({ wishlistId, wishlistSharing }));
this.store.dispatch(wishlistActions.shareWishlist({ wishlistId, wishlistSharing }));
}

unshareWishlist(wishlistId: string): void {
this.store.dispatch(unshareWishlist({ wishlistId }));
this.store.dispatch(wishlistActions.unshareWishlist({ wishlistId }));
}

loadSharedWishlist(id: string, owner: string, secureCode: string) {
this.store.dispatch(loadSharedWishlist({ id, owner, secureCode }));
this.store.dispatch(wishlistActions.loadSharedWishlist({ wishlistId: id, owner, secureCode }));
}
}
27 changes: 27 additions & 0 deletions src/app/extensions/wishlists/guards/fetch-shared-wishlist.guard.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import { inject } from '@angular/core';
import { ActivatedRouteSnapshot } from '@angular/router';
import { Store } from '@ngrx/store';
import { Observable } from 'rxjs';
import { map, tap } from 'rxjs/operators';

import { wishlistActions } from '../store/wishlist';

/**
* Fetch the shared wishlist
*/
export function fetchSharedWishlist(route: ActivatedRouteSnapshot): boolean | Observable<boolean> {
const store = inject(Store);

return store.pipe(
tap(() => {
store.dispatch(
wishlistActions.loadSharedWishlist({
wishlistId: route.params.wishlistId,
owner: route.queryParams.owner,
secureCode: route.queryParams.secureCode,
})
);
}),
map(() => true)
);
}
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
export interface WishlistSharing {
name: string;
recipients: string;
message: string;
sender: string;
}

export interface WishlistSharingResponse {
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -15,38 +15,44 @@
/></a>
</div>

<button
type="button"
(click)="editWishlistDialog.show()"
class="btn-tool btn-link float-right"
[title]="'account.wishlist.header.edit_wishlist.label' | translate"
data-testing-id="wishlist-details-edit"
>
<fa-icon icon="pencil-alt" />
</button>
<ul class="share-tools">
<li>
<button
type="button"
*ngIf="wishlist.shared"
(click)="unshareWishlist(wishlist.id)"
class="btn-tool btn-link float-right"
data-testing-id="wishlist-stop-sharing"
>
<fa-icon icon="pause" />
<span class="share-label">{{ 'account.wishlist.header.stop_wishlist_sharing.label' | translate }}</span>
</button>
</li>

<ng-container>
<button
type="button"
(click)="shareWishlistDialog.show()"
class="btn-tool btn-link float-right ml-0 mr-4"
[title]="'account.wishlist.header.send_wishlist.label' | translate"
data-testing-id="wishlist-sharing"
>
<fa-icon icon="paper-plane" />
</button>
<li>
<button
type="button"
(click)="shareWishlistDialog.show()"
class="btn-tool btn-link float-right"
data-testing-id="wishlist-sharing"
>
<fa-icon icon="paper-plane" />
<span class="share-label">{{ 'account.wishlist.header.send_wishlist.label' | translate }}</span>
</button>
</li>

<button
type="button"
*ngIf="wishlist.shared"
(click)="unshareWishlist(wishlist.id)"
class="btn-tool btn-link float-right ml-0 mr-4"
[title]="'account.wishlist.header.stop_wishlist_sharing.label' | translate"
data-testing-id="wishlist-stop-sharing"
>
<fa-icon icon="pause" />
</button>
</ng-container>
<li>
<button
type="button"
(click)="editWishlistDialog.show()"
class="btn-tool btn-link float-right"
data-testing-id="wishlist-details-edit"
>
<fa-icon icon="pencil-alt" />
<span class="share-label">{{ 'account.wishlist.header.edit_wishlist.label' | translate }}</span>
</button>
</li>
</ul>

<h1>{{ wishlist?.title }}</h1>

Expand All @@ -57,15 +63,15 @@ <h1>{{ wishlist?.title }}</h1>
<div class="container">
<ng-container *ngIf="wishlist.itemsCount && wishlist.itemsCount > 0; else noItems">
<div class="list-header row">
<div class="col-3 col-sm-3 list-header-item">{{ 'account.wishlist.table.header.item' | translate }}</div>
<div class="col-3 col-sm-3 list-header-item">{{ 'wishlist.table.header.item' | translate }}</div>
<div class="col-sm-9 col-9 list-header-item column-price">
{{ 'account.wishlist.table.header.price' | translate }}
{{ 'wishlist.table.header.price' | translate }}
</div>
</div>
<div class="list-body">
<ng-container *ngFor="let item of wishlist.items; trackBy: trackByFn">
<div class="list-item-row">
<ish-account-wishlist-detail-line-item
<ish-wishlist-line-item
ishProductContext
[sku]="item.sku"
[wishlistItemData]="item"
Expand All @@ -90,7 +96,7 @@ <h1>{{ wishlist?.title }}</h1>
<ish-wishlist-sharing-dialog
#shareWishlistDialog
[wishlist]="wishlist"
(submitWishlistSharing)="shareWishlist($event, wishlist)"
(submitWishlistSharing)="shareWishlist($event, wishlist.id)"
/>
</ng-container>

Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { ChangeDetectionStrategy, Component, OnDestroy, OnInit } from '@angular/core';
import { ChangeDetectionStrategy, Component, DestroyRef, OnInit, inject } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { TranslateService } from '@ngx-translate/core';
import { Observable, Subject, filter, take, takeUntil } from 'rxjs';
import { Observable, filter, take } from 'rxjs';

import { HttpError } from 'ish-core/models/http-error/http-error.model';

Expand All @@ -13,12 +14,12 @@ import { Wishlist, WishlistItem } from '../../models/wishlist/wishlist.model';
templateUrl: './account-wishlist-detail-page.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class AccountWishlistDetailPageComponent implements OnDestroy, OnInit {
export class AccountWishlistDetailPageComponent implements OnInit {
wishlist$: Observable<Wishlist>;
wishlistError$: Observable<HttpError>;
wishlistLoading$: Observable<boolean>;

private destroy = new Subject<void>();
private destroyedRef = inject(DestroyRef);

constructor(private wishlistsFacade: WishlistsFacade, private translate: TranslateService) {}

Expand All @@ -39,22 +40,22 @@ export class AccountWishlistDetailPageComponent implements OnDestroy, OnInit {
this.wishlistsFacade.unshareWishlist(wishlistId);
}

shareWishlist(wishlistSharing: WishlistSharing, wishlist: Wishlist) {
this.wishlistsFacade.shareWishlist(wishlist.id, wishlistSharing);
shareWishlist(wishlistSharing: WishlistSharing, wishlistId: string) {
this.wishlistsFacade.shareWishlist(wishlistId, wishlistSharing);

// ensure owner and secureCode are in the store
this.wishlistsFacade.currentWishlist$
this.wishlist$
.pipe(
filter(updatedWishlist => !!updatedWishlist?.owner && !!updatedWishlist?.secureCode),
take(1),
takeUntil(this.destroy)
takeUntilDestroyed(this.destroyedRef)
)
.subscribe(updatedWishlist => {
this.sendEmail(wishlistSharing, updatedWishlist);
});
}

sendEmail(wishlistSharing: WishlistSharing, wishlist: Wishlist) {
private sendEmail(wishlistSharing: WishlistSharing, wishlist: Wishlist) {
const emailSubject = this.translate.instant('email.wishlist_sharing.heading');
const defaultText = this.translate.instant('email.wishlist_sharing.text');

Expand All @@ -72,9 +73,4 @@ export class AccountWishlistDetailPageComponent implements OnDestroy, OnInit {
trackByFn(_: number, item: WishlistItem) {
return item.id;
}

ngOnDestroy() {
this.destroy.next();
this.destroy.complete();
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import { SharedModule } from 'ish-shared/shared.module';

import { WishlistsModule } from '../../wishlists.module';

import { AccountWishlistDetailLineItemComponent } from './account-wishlist-detail-line-item/account-wishlist-detail-line-item.component';
import { AccountWishlistDetailPageComponent } from './account-wishlist-detail-page.component';

const accountWishlistDetailPageRoutes: Routes = [
Expand All @@ -17,6 +16,6 @@ const accountWishlistDetailPageRoutes: Routes = [

@NgModule({
imports: [RouterModule.forChild(accountWishlistDetailPageRoutes), SharedModule, WishlistsModule],
declarations: [AccountWishlistDetailLineItemComponent, AccountWishlistDetailPageComponent],
declarations: [AccountWishlistDetailPageComponent],
})
export class AccountWishlistDetailPageModule {}
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
<!-- Error message -->
<ish-error-message [error]="wishlistError$ | async" />

<ng-container *ngIf="wishlist$ | async as wishlist">
<div class="col-9">
<h1>{{ wishlist.title }}</h1>

<div class="container">
<ng-container *ngIf="wishlist.itemsCount; else noItems">
<div class="list-header row">
<div class="col-3 col-sm-3 list-header-item">{{ 'wishlist.table.header.item' | translate }}</div>
<div class="col-sm-9 col-9 list-header-item column-price">
{{ 'wishlist.table.header.price' | translate }}
</div>
</div>
<div class="list-body">
<ng-container *ngFor="let item of wishlist.items; trackBy: trackByFn">
<div class="list-item-row">
<ish-wishlist-line-item
ishProductContext
[sku]="item.sku"
[wishlistItemData]="item"
[currentWishlist]="wishlist"
[readOnly]="true"
/>
</div>
</ng-container>
</div>
</ng-container>
</div>

<ng-template #noItems>
<p>{{ 'wishlist.no_entries' | translate }}</p>
</ng-template>
</div>
</ng-container>

<ish-loading *ngIf="wishlistLoading$ | async" />
Original file line number Diff line number Diff line change
Expand Up @@ -7,16 +7,16 @@ import { ErrorMessageComponent } from 'ish-shared/components/common/error-messag

import { WishlistsFacade } from '../../facades/wishlists.facade';

import { WishlistPageComponent } from './wishlist-page.component';
import { SharedWishlistPageComponent } from './shared-wishlist-page.component';

describe('Wishlist Page Component', () => {
let component: WishlistPageComponent;
let fixture: ComponentFixture<WishlistPageComponent>;
describe('Shared Wishlist Page Component', () => {
let component: SharedWishlistPageComponent;
let fixture: ComponentFixture<SharedWishlistPageComponent>;
let element: HTMLElement;

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [MockComponent(ErrorMessageComponent), WishlistPageComponent],
declarations: [MockComponent(ErrorMessageComponent), SharedWishlistPageComponent],
providers: [
{
provide: ActivatedRoute,
Expand All @@ -41,7 +41,7 @@ describe('Wishlist Page Component', () => {
});

beforeEach(() => {
fixture = TestBed.createComponent(WishlistPageComponent);
fixture = TestBed.createComponent(SharedWishlistPageComponent);
component = fixture.componentInstance;
element = fixture.nativeElement;
});
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs';

import { HttpError } from 'ish-core/models/http-error/http-error.model';

import { WishlistsFacade } from '../../facades/wishlists.facade';
import { Wishlist, 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 {
wishlistId: string;
owner: string;
secureCode: string;
wishlist$: Observable<Wishlist>;
wishlistError$: Observable<HttpError>;
wishlistLoading$: Observable<boolean>;

constructor(private wishlistsFacade: WishlistsFacade) {}

ngOnInit(): void {
this.wishlist$ = this.wishlistsFacade.currentWishlist$;
this.wishlistError$ = this.wishlistsFacade.wishlistError$;
this.wishlistLoading$ = this.wishlistsFacade.wishlistLoading$;
}

trackByFn(_: number, item: WishlistItem) {
return item.id;
}
}
Loading

0 comments on commit 104422d

Please sign in to comment.