@spartacus/storefront
Version:
Spartacus Storefront is a package that you can include in your application, which allows you to add default storefront features.
49 lines • 12.3 kB
JavaScript
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { isNotNullable, } from '@spartacus/core';
import { filter, map, tap } from 'rxjs/operators';
import { ICON_TYPE } from '../../../cms-components/misc/icon/icon.model';
import * as i0 from "@angular/core";
import * as i1 from "@spartacus/core";
import * as i2 from "../../product/current-product.service";
import * as i3 from "../../misc/icon/icon.component";
import * as i4 from "@angular/common";
import * as i5 from "@angular/router";
export class AddToWishListComponent {
constructor(wishListService, currentProductService, authService) {
this.wishListService = wishListService;
this.currentProductService = currentProductService;
this.authService = authService;
this.product$ = this.currentProductService.getProduct().pipe(filter(isNotNullable), tap((product) => this.setStockInfo(product)));
this.wishListEntries$ = this.wishListService
.getWishList()
.pipe(filter((wishlist) => Boolean(wishlist)), map((wishList) => wishList.entries));
this.userLoggedIn$ = this.authService.isUserLoggedIn();
this.loading$ = this.wishListService.getWishListLoading();
this.hasStock = false;
this.iconTypes = ICON_TYPE;
}
add(product) {
this.wishListService.addEntry(product.code);
}
remove(entry) {
this.wishListService.removeEntry(entry);
}
getProductInWishList(product, entries) {
const item = entries.find((entry) => entry.product.code === product.code);
return item;
}
setStockInfo(product) {
this.hasStock = Boolean(product.stock && product.stock.stockLevelStatus !== 'outOfStock');
}
}
AddToWishListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: AddToWishListComponent, deps: [{ token: i1.WishListService }, { token: i2.CurrentProductService }, { token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
AddToWishListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: AddToWishListComponent, selector: "cx-add-to-wishlist", ngImport: i0, template: "<ng-container *ngIf=\"product$ | async as product\">\n <ng-container *ngIf=\"userLoggedIn$ | async; else loginPrompt\">\n <ng-container *ngIf=\"wishListEntries$ | async as entries\">\n <ng-container *ngIf=\"hasStock\">\n <div\n *ngIf=\"getProductInWishList(product, entries) as entry; else addItem\"\n >\n <button\n class=\"btn btn-link button-remove cx-action-link\"\n (click)=\"remove(entry)\"\n [disabled]=\"loading$ | async\"\n >\n <cx-icon [type]=\"iconTypes.HEART\"></cx-icon>\n <span class=\"button-text\">{{\n 'addToWishList.remove' | cxTranslate\n }}</span>\n </button>\n </div>\n <ng-template #addItem>\n <button\n class=\"btn btn-link button-add cx-action-link\"\n (click)=\"add(product)\"\n [disabled]=\"loading$ | async\"\n >\n <cx-icon [type]=\"iconTypes.EMPTY_HEART\"></cx-icon>\n <span class=\"button-text\">{{\n 'addToWishList.add' | cxTranslate\n }}</span>\n </button>\n </ng-template>\n </ng-container>\n </ng-container>\n </ng-container>\n</ng-container>\n\n<ng-template #loginPrompt>\n <ng-container *ngIf=\"hasStock\">\n <a\n class=\"btn btn-link button-add-link cx-action-link\"\n [routerLink]=\"{ cxRoute: 'login' } | cxUrl\"\n >\n <cx-icon [type]=\"iconTypes.EMPTY_HEART\"></cx-icon>\n <span class=\"button-text\">{{\n 'addToWishList.anonymous' | cxTranslate\n }}</span>\n </a>\n </ng-container>\n</ng-template>\n", components: [{ type: i3.IconComponent, selector: "cx-icon,[cxIcon]", inputs: ["cxIcon", "type"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], pipes: { "async": i4.AsyncPipe, "cxTranslate": i1.TranslatePipe, "cxUrl": i1.UrlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: AddToWishListComponent, decorators: [{
type: Component,
args: [{
selector: 'cx-add-to-wishlist',
templateUrl: './add-to-wish-list.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
}]
}], ctorParameters: function () { return [{ type: i1.WishListService }, { type: i2.CurrentProductService }, { type: i1.AuthService }]; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWRkLXRvLXdpc2gtbGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zdG9yZWZyb250bGliL2Ntcy1jb21wb25lbnRzL2NhcnQvYWRkLXRvLXdpc2hsaXN0L2FkZC10by13aXNoLWxpc3QuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc3RvcmVmcm9udGxpYi9jbXMtY29tcG9uZW50cy9jYXJ0L2FkZC10by13aXNobGlzdC9hZGQtdG8td2lzaC1saXN0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbkUsT0FBTyxFQUVMLGFBQWEsR0FJZCxNQUFNLGlCQUFpQixDQUFDO0FBRXpCLE9BQU8sRUFBRSxNQUFNLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ2xELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4Q0FBOEMsQ0FBQzs7Ozs7OztBQVF6RSxNQUFNLE9BQU8sc0JBQXNCO0lBbUJqQyxZQUNZLGVBQWdDLEVBQ2hDLHFCQUE0QyxFQUM1QyxXQUF3QjtRQUZ4QixvQkFBZSxHQUFmLGVBQWUsQ0FBaUI7UUFDaEMsMEJBQXFCLEdBQXJCLHFCQUFxQixDQUF1QjtRQUM1QyxnQkFBVyxHQUFYLFdBQVcsQ0FBYTtRQXJCcEMsYUFBUSxHQUF3QixJQUFJLENBQUMscUJBQXFCLENBQUMsVUFBVSxFQUFFLENBQUMsSUFBSSxDQUMxRSxNQUFNLENBQUMsYUFBYSxDQUFDLEVBQ3JCLEdBQUcsQ0FBQyxDQUFDLE9BQU8sRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUM3QyxDQUFDO1FBRUYscUJBQWdCLEdBQTZCLElBQUksQ0FBQyxlQUFlO2FBQzlELFdBQVcsRUFBRTthQUNiLElBQUksQ0FDSCxNQUFNLENBQUMsQ0FBQyxRQUFRLEVBQUUsRUFBRSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsQ0FBQyxFQUN2QyxHQUFHLENBQUMsQ0FBQyxRQUFRLEVBQUUsRUFBRSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsQ0FDcEMsQ0FBQztRQUVKLGtCQUFhLEdBQXdCLElBQUksQ0FBQyxXQUFXLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDdkUsYUFBUSxHQUF3QixJQUFJLENBQUMsZUFBZSxDQUFDLGtCQUFrQixFQUFFLENBQUM7UUFFMUUsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUNqQixjQUFTLEdBQUcsU0FBUyxDQUFDO0lBTW5CLENBQUM7SUFFSixHQUFHLENBQUMsT0FBZ0I7UUFDbEIsSUFBSSxDQUFDLGVBQWUsQ0FBQyxRQUFRLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzlDLENBQUM7SUFFRCxNQUFNLENBQUMsS0FBaUI7UUFDdEIsSUFBSSxDQUFDLGVBQWUsQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDMUMsQ0FBQztJQUVELG9CQUFvQixDQUFDLE9BQWdCLEVBQUUsT0FBcUI7UUFDMUQsTUFBTSxJQUFJLEdBQUcsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDLEtBQUssRUFBRSxFQUFFLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxJQUFJLEtBQUssT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQzFFLE9BQU8sSUFBSSxDQUFDO0lBQ2QsQ0FBQztJQUVTLFlBQVksQ0FBQyxPQUFnQjtRQUNyQyxJQUFJLENBQUMsUUFBUSxHQUFHLE9BQU8sQ0FDckIsT0FBTyxDQUFDLEtBQUssSUFBSSxPQUFPLENBQUMsS0FBSyxDQUFDLGdCQUFnQixLQUFLLFlBQVksQ0FDakUsQ0FBQztJQUNKLENBQUM7O21IQTFDVSxzQkFBc0I7dUdBQXRCLHNCQUFzQiwwRENsQm5DLHluREFnREE7MkZEOUJhLHNCQUFzQjtrQkFMbEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsb0JBQW9CO29CQUM5QixXQUFXLEVBQUUsbUNBQW1DO29CQUNoRCxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtpQkFDaEQiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1xuICBBdXRoU2VydmljZSxcbiAgaXNOb3ROdWxsYWJsZSxcbiAgT3JkZXJFbnRyeSxcbiAgUHJvZHVjdCxcbiAgV2lzaExpc3RTZXJ2aWNlLFxufSBmcm9tICdAc3BhcnRhY3VzL2NvcmUnO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgZmlsdGVyLCBtYXAsIHRhcCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcbmltcG9ydCB7IElDT05fVFlQRSB9IGZyb20gJy4uLy4uLy4uL2Ntcy1jb21wb25lbnRzL21pc2MvaWNvbi9pY29uLm1vZGVsJztcbmltcG9ydCB7IEN1cnJlbnRQcm9kdWN0U2VydmljZSB9IGZyb20gJy4uLy4uL3Byb2R1Y3QvY3VycmVudC1wcm9kdWN0LnNlcnZpY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjeC1hZGQtdG8td2lzaGxpc3QnLFxuICB0ZW1wbGF0ZVVybDogJy4vYWRkLXRvLXdpc2gtbGlzdC5jb21wb25lbnQuaHRtbCcsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBBZGRUb1dpc2hMaXN0Q29tcG9uZW50IHtcbiAgcHJvZHVjdCQ6IE9ic2VydmFibGU8UHJvZHVjdD4gPSB0aGlzLmN1cnJlbnRQcm9kdWN0U2VydmljZS5nZXRQcm9kdWN0KCkucGlwZShcbiAgICBmaWx0ZXIoaXNOb3ROdWxsYWJsZSksXG4gICAgdGFwKChwcm9kdWN0KSA9PiB0aGlzLnNldFN0b2NrSW5mbyhwcm9kdWN0KSlcbiAgKTtcblxuICB3aXNoTGlzdEVudHJpZXMkOiBPYnNlcnZhYmxlPE9yZGVyRW50cnlbXT4gPSB0aGlzLndpc2hMaXN0U2VydmljZVxuICAgIC5nZXRXaXNoTGlzdCgpXG4gICAgLnBpcGUoXG4gICAgICBmaWx0ZXIoKHdpc2hsaXN0KSA9PiBCb29sZWFuKHdpc2hsaXN0KSksXG4gICAgICBtYXAoKHdpc2hMaXN0KSA9PiB3aXNoTGlzdC5lbnRyaWVzKVxuICAgICk7XG5cbiAgdXNlckxvZ2dlZEluJDogT2JzZXJ2YWJsZTxib29sZWFuPiA9IHRoaXMuYXV0aFNlcnZpY2UuaXNVc2VyTG9nZ2VkSW4oKTtcbiAgbG9hZGluZyQ6IE9ic2VydmFibGU8Ym9vbGVhbj4gPSB0aGlzLndpc2hMaXN0U2VydmljZS5nZXRXaXNoTGlzdExvYWRpbmcoKTtcblxuICBoYXNTdG9jayA9IGZhbHNlO1xuICBpY29uVHlwZXMgPSBJQ09OX1RZUEU7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJvdGVjdGVkIHdpc2hMaXN0U2VydmljZTogV2lzaExpc3RTZXJ2aWNlLFxuICAgIHByb3RlY3RlZCBjdXJyZW50UHJvZHVjdFNlcnZpY2U6IEN1cnJlbnRQcm9kdWN0U2VydmljZSxcbiAgICBwcm90ZWN0ZWQgYXV0aFNlcnZpY2U6IEF1dGhTZXJ2aWNlXG4gICkge31cblxuICBhZGQocHJvZHVjdDogUHJvZHVjdCk6IHZvaWQge1xuICAgIHRoaXMud2lzaExpc3RTZXJ2aWNlLmFkZEVudHJ5KHByb2R1Y3QuY29kZSk7XG4gIH1cblxuICByZW1vdmUoZW50cnk6IE9yZGVyRW50cnkpOiB2b2lkIHtcbiAgICB0aGlzLndpc2hMaXN0U2VydmljZS5yZW1vdmVFbnRyeShlbnRyeSk7XG4gIH1cblxuICBnZXRQcm9kdWN0SW5XaXNoTGlzdChwcm9kdWN0OiBQcm9kdWN0LCBlbnRyaWVzOiBPcmRlckVudHJ5W10pOiBPcmRlckVudHJ5IHtcbiAgICBjb25zdCBpdGVtID0gZW50cmllcy5maW5kKChlbnRyeSkgPT4gZW50cnkucHJvZHVjdC5jb2RlID09PSBwcm9kdWN0LmNvZGUpO1xuICAgIHJldHVybiBpdGVtO1xuICB9XG5cbiAgcHJvdGVjdGVkIHNldFN0b2NrSW5mbyhwcm9kdWN0OiBQcm9kdWN0KTogdm9pZCB7XG4gICAgdGhpcy5oYXNTdG9jayA9IEJvb2xlYW4oXG4gICAgICBwcm9kdWN0LnN0b2NrICYmIHByb2R1Y3Quc3RvY2suc3RvY2tMZXZlbFN0YXR1cyAhPT0gJ291dE9mU3RvY2snXG4gICAgKTtcbiAgfVxufVxuIiwiPG5nLWNvbnRhaW5lciAqbmdJZj1cInByb2R1Y3QkIHwgYXN5bmMgYXMgcHJvZHVjdFwiPlxuICA8bmctY29udGFpbmVyICpuZ0lmPVwidXNlckxvZ2dlZEluJCB8IGFzeW5jOyBlbHNlIGxvZ2luUHJvbXB0XCI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIndpc2hMaXN0RW50cmllcyQgfCBhc3luYyBhcyBlbnRyaWVzXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiaGFzU3RvY2tcIj5cbiAgICAgICAgPGRpdlxuICAgICAgICAgICpuZ0lmPVwiZ2V0UHJvZHVjdEluV2lzaExpc3QocHJvZHVjdCwgZW50cmllcykgYXMgZW50cnk7IGVsc2UgYWRkSXRlbVwiXG4gICAgICAgID5cbiAgICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICBjbGFzcz1cImJ0biBidG4tbGluayBidXR0b24tcmVtb3ZlIGN4LWFjdGlvbi1saW5rXCJcbiAgICAgICAgICAgIChjbGljayk9XCJyZW1vdmUoZW50cnkpXCJcbiAgICAgICAgICAgIFtkaXNhYmxlZF09XCJsb2FkaW5nJCB8IGFzeW5jXCJcbiAgICAgICAgICA+XG4gICAgICAgICAgICA8Y3gtaWNvbiBbdHlwZV09XCJpY29uVHlwZXMuSEVBUlRcIj48L2N4LWljb24+XG4gICAgICAgICAgICA8c3BhbiBjbGFzcz1cImJ1dHRvbi10ZXh0XCI+e3tcbiAgICAgICAgICAgICAgJ2FkZFRvV2lzaExpc3QucmVtb3ZlJyB8IGN4VHJhbnNsYXRlXG4gICAgICAgICAgICB9fTwvc3Bhbj5cbiAgICAgICAgICA8L2J1dHRvbj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxuZy10ZW1wbGF0ZSAjYWRkSXRlbT5cbiAgICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICBjbGFzcz1cImJ0biBidG4tbGluayBidXR0b24tYWRkIGN4LWFjdGlvbi1saW5rXCJcbiAgICAgICAgICAgIChjbGljayk9XCJhZGQocHJvZHVjdClcIlxuICAgICAgICAgICAgW2Rpc2FibGVkXT1cImxvYWRpbmckIHwgYXN5bmNcIlxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxjeC1pY29uIFt0eXBlXT1cImljb25UeXBlcy5FTVBUWV9IRUFSVFwiPjwvY3gtaWNvbj5cbiAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwiYnV0dG9uLXRleHRcIj57e1xuICAgICAgICAgICAgICAnYWRkVG9XaXNoTGlzdC5hZGQnIHwgY3hUcmFuc2xhdGVcbiAgICAgICAgICAgIH19PC9zcGFuPlxuICAgICAgICAgIDwvYnV0dG9uPlxuICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgPC9uZy1jb250YWluZXI+XG4gIDwvbmctY29udGFpbmVyPlxuPC9uZy1jb250YWluZXI+XG5cbjxuZy10ZW1wbGF0ZSAjbG9naW5Qcm9tcHQ+XG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCJoYXNTdG9ja1wiPlxuICAgIDxhXG4gICAgICBjbGFzcz1cImJ0biBidG4tbGluayBidXR0b24tYWRkLWxpbmsgY3gtYWN0aW9uLWxpbmtcIlxuICAgICAgW3JvdXRlckxpbmtdPVwieyBjeFJvdXRlOiAnbG9naW4nIH0gfCBjeFVybFwiXG4gICAgPlxuICAgICAgPGN4LWljb24gW3R5cGVdPVwiaWNvblR5cGVzLkVNUFRZX0hFQVJUXCI+PC9jeC1pY29uPlxuICAgICAgPHNwYW4gY2xhc3M9XCJidXR0b24tdGV4dFwiPnt7XG4gICAgICAgICdhZGRUb1dpc2hMaXN0LmFub255bW91cycgfCBjeFRyYW5zbGF0ZVxuICAgICAgfX08L3NwYW4+XG4gICAgPC9hPlxuICA8L25nLWNvbnRhaW5lcj5cbjwvbmctdGVtcGxhdGU+XG4iXX0=