Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | 2x 2x 2x 2x 2x 2x 6x 6x 6x 6x 20x 20x 6x 6x 5x | import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { Observable, combineLatest, debounce, map } from 'rxjs';
import { CheckoutFacade } from 'ish-core/facades/checkout.facade';
import { CustomFieldsComponentInput } from 'ish-core/models/custom-field/custom-field.model';
import { whenFalsy } from 'ish-core/utils/operators';
/**
* The Basket Custom Fields Component displays the basket attribute values. If editable it shows a link to add/edit these attributes.
*/
@Component({
selector: 'ish-basket-custom-fields',
templateUrl: './basket-custom-fields.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class BasketCustomFieldsComponent implements OnInit {
customFields$: Observable<CustomFieldsComponentInput[]>;
visible$: Observable<boolean>;
editMode$: Observable<'edit' | 'add'>;
collapsed = true;
form = new FormGroup({});
constructor(private checkoutFacade: CheckoutFacade) {}
ngOnInit(): void {
this.customFields$ = combineLatest([
this.checkoutFacade.customFieldsForScope$('Basket'),
this.checkoutFacade.basket$.pipe(debounce(() => this.checkoutFacade.basketLoading$.pipe(whenFalsy()))),
]).pipe(
map(([customFields, basket]) =>
customFields.map(customField => ({ ...customField, value: basket.customFields?.[customField.name] }))
)
);
this.visible$ = this.customFields$.pipe(map(fields => fields.length > 0));
this.editMode$ = this.customFields$.pipe(
map(fields => (fields.length > 0 && fields.every(field => !field.value) ? 'add' : 'edit'))
);
}
submit() {
this.checkoutFacade.setBasketCustomFields(this.form.value);
this.collapsed = true;
}
cancel() {
this.collapsed = true;
this.form.reset();
}
}
|