diff --git a/projects/requisition-management/src/app/pages/requisition-detail/requisition-detail-page.component.spec.ts b/projects/requisition-management/src/app/pages/requisition-detail/requisition-detail-page.component.spec.ts
index f03f173ca7..d048731632 100644
--- a/projects/requisition-management/src/app/pages/requisition-detail/requisition-detail-page.component.spec.ts
+++ b/projects/requisition-management/src/app/pages/requisition-detail/requisition-detail-page.component.spec.ts
@@ -13,6 +13,7 @@ import { AddressComponent } from 'ish-shared/components/address/address/address.
import { BasketCostSummaryComponent } from 'ish-shared/components/basket/basket-cost-summary/basket-cost-summary.component';
import { BasketMerchantMessageViewComponent } from 'ish-shared/components/basket/basket-merchant-message-view/basket-merchant-message-view.component';
import { BasketShippingMethodComponent } from 'ish-shared/components/basket/basket-shipping-method/basket-shipping-method.component';
+import { BasketCustomFieldsViewComponent } from 'ish-shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component';
import { ErrorMessageComponent } from 'ish-shared/components/common/error-message/error-message.component';
import { InfoBoxComponent } from 'ish-shared/components/common/info-box/info-box.component';
@@ -38,6 +39,7 @@ describe('Requisition Detail Page Component', () => {
declarations: [
MockComponent(AddressComponent),
MockComponent(BasketCostSummaryComponent),
+ MockComponent(BasketCustomFieldsViewComponent),
MockComponent(BasketMerchantMessageViewComponent),
MockComponent(BasketShippingMethodComponent),
MockComponent(ErrorMessageComponent),
@@ -80,6 +82,7 @@ describe('Requisition Detail Page Component', () => {
"ish-requisition-summary",
"ish-requisition-cost-center-approval",
"ish-basket-merchant-message-view",
+ "ish-basket-custom-fields-view",
"ish-info-box",
"ish-address",
"ish-info-box",
diff --git a/src/app/pages/account-order/account-order/account-order.component.html b/src/app/pages/account-order/account-order/account-order.component.html
index 7297728ad3..5ca4f43571 100644
--- a/src/app/pages/account-order/account-order/account-order.component.html
+++ b/src/app/pages/account-order/account-order/account-order.component.html
@@ -53,6 +53,8 @@ {{ 'account.orderdetails.heading.default' | translate }}
+
+
diff --git a/src/app/pages/account-order/account-order/account-order.component.spec.ts b/src/app/pages/account-order/account-order/account-order.component.spec.ts
index 35e6e8a919..60abdb2ab0 100644
--- a/src/app/pages/account-order/account-order/account-order.component.spec.ts
+++ b/src/app/pages/account-order/account-order/account-order.component.spec.ts
@@ -10,6 +10,7 @@ import { AddressComponent } from 'ish-shared/components/address/address/address.
import { BasketCostSummaryComponent } from 'ish-shared/components/basket/basket-cost-summary/basket-cost-summary.component';
import { BasketMerchantMessageViewComponent } from 'ish-shared/components/basket/basket-merchant-message-view/basket-merchant-message-view.component';
import { BasketShippingMethodComponent } from 'ish-shared/components/basket/basket-shipping-method/basket-shipping-method.component';
+import { BasketCustomFieldsViewComponent } from 'ish-shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component';
import { InfoBoxComponent } from 'ish-shared/components/common/info-box/info-box.component';
import { LineItemListComponent } from 'ish-shared/components/line-item/line-item-list/line-item-list.component';
@@ -26,6 +27,7 @@ describe('Account Order Component', () => {
AccountOrderComponent,
MockComponent(AddressComponent),
MockComponent(BasketCostSummaryComponent),
+ MockComponent(BasketCustomFieldsViewComponent),
MockComponent(BasketMerchantMessageViewComponent),
MockComponent(BasketShippingMethodComponent),
MockComponent(FaIconComponent),
diff --git a/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.html b/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.html
index cff39d2093..709372ea8c 100644
--- a/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.html
+++ b/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.html
@@ -15,6 +15,8 @@
+
+
diff --git a/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.spec.ts b/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.spec.ts
index 501e36091a..25f38fcb9c 100644
--- a/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.spec.ts
+++ b/src/app/pages/checkout-receipt/checkout-receipt/checkout-receipt.component.spec.ts
@@ -10,6 +10,7 @@ import { AddressComponent } from 'ish-shared/components/address/address/address.
import { BasketCostSummaryComponent } from 'ish-shared/components/basket/basket-cost-summary/basket-cost-summary.component';
import { BasketMerchantMessageViewComponent } from 'ish-shared/components/basket/basket-merchant-message-view/basket-merchant-message-view.component';
import { BasketShippingMethodComponent } from 'ish-shared/components/basket/basket-shipping-method/basket-shipping-method.component';
+import { BasketCustomFieldsViewComponent } from 'ish-shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component';
import { InfoBoxComponent } from 'ish-shared/components/common/info-box/info-box.component';
import { LineItemListComponent } from 'ish-shared/components/line-item/line-item-list/line-item-list.component';
@@ -26,6 +27,7 @@ describe('Checkout Receipt Component', () => {
CheckoutReceiptComponent,
MockComponent(AddressComponent),
MockComponent(BasketCostSummaryComponent),
+ MockComponent(BasketCustomFieldsViewComponent),
MockComponent(BasketMerchantMessageViewComponent),
MockComponent(BasketShippingMethodComponent),
MockComponent(FaIconComponent),
@@ -64,6 +66,7 @@ describe('Checkout Receipt Component', () => {
expect(findAllCustomElements(element)).toMatchInlineSnapshot(`
[
"ish-basket-merchant-message-view",
+ "ish-basket-custom-fields-view",
"ish-info-box",
"ish-address",
"ish-info-box",
diff --git a/src/app/pages/checkout-review/checkout-review/checkout-review.component.html b/src/app/pages/checkout-review/checkout-review/checkout-review.component.html
index 773b551cad..95470c2ce0 100644
--- a/src/app/pages/checkout-review/checkout-review/checkout-review.component.html
+++ b/src/app/pages/checkout-review/checkout-review/checkout-review.component.html
@@ -44,6 +44,9 @@
+
+
+
{
MockComponent(AddressComponent),
MockComponent(BasketApprovalInfoComponent),
MockComponent(BasketCostSummaryComponent),
+ MockComponent(BasketCustomFieldsViewComponent),
MockComponent(BasketMerchantMessageViewComponent),
MockComponent(BasketShippingMethodComponent),
MockComponent(BasketValidationResultsComponent),
@@ -113,6 +115,7 @@ describe('Checkout Review Component', () => {
"ish-error-message",
"ish-basket-validation-results",
"ish-basket-merchant-message-view",
+ "ish-basket-custom-fields-view",
"ish-info-box",
"ish-address",
"ish-info-box",
diff --git a/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.html b/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.html
new file mode 100644
index 0000000000..8e785add8d
--- /dev/null
+++ b/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.html
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
diff --git a/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.spec.ts b/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.spec.ts
new file mode 100644
index 0000000000..15836ae1f8
--- /dev/null
+++ b/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.spec.ts
@@ -0,0 +1,35 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { EMPTY } from 'rxjs';
+import { instance, mock, when } from 'ts-mockito';
+
+import { AppFacade } from 'ish-core/facades/app.facade';
+
+import { BasketCustomFieldsViewComponent } from './basket-custom-fields-view.component';
+
+describe('Basket Custom Fields View Component', () => {
+ let component: BasketCustomFieldsViewComponent;
+ let fixture: ComponentFixture;
+ let element: HTMLElement;
+
+ beforeEach(async () => {
+ const appFacade = mock(AppFacade);
+ when(appFacade.customFieldsForScope$('Basket')).thenReturn(EMPTY);
+
+ await TestBed.configureTestingModule({
+ declarations: [BasketCustomFieldsViewComponent],
+ providers: [{ provide: AppFacade, useFactory: () => instance(appFacade) }],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(BasketCustomFieldsViewComponent);
+ component = fixture.componentInstance;
+ element = fixture.nativeElement;
+ });
+
+ it('should be created', () => {
+ expect(component).toBeTruthy();
+ expect(element).toBeTruthy();
+ expect(() => fixture.detectChanges()).not.toThrow();
+ });
+});
diff --git a/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.ts b/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.ts
new file mode 100644
index 0000000000..111e559a06
--- /dev/null
+++ b/src/app/shared/components/checkout/basket-custom-fields-view/basket-custom-fields-view.component.ts
@@ -0,0 +1,37 @@
+import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
+import { Observable, ReplaySubject, combineLatest, map } from 'rxjs';
+
+import { AppFacade } from 'ish-core/facades/app.facade';
+import { CustomFields, CustomFieldsComponentInput } from 'ish-core/models/custom-field/custom-field.model';
+
+@Component({
+ selector: 'ish-basket-custom-fields-view',
+ templateUrl: './basket-custom-fields-view.component.html',
+ changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class BasketCustomFieldsViewComponent implements OnInit {
+ @Input() set data(val: { customFields?: CustomFields }) {
+ this._customFields.next(val.customFields || {});
+ }
+ @Input() editRouterLink: string;
+
+ private _customFields = new ReplaySubject(1);
+
+ fields$: Observable;
+ visible$: Observable;
+
+ constructor(private appFacade: AppFacade) {}
+
+ ngOnInit(): void {
+ this.fields$ = combineLatest([
+ this._customFields.asObservable(),
+ this.appFacade.customFieldsForScope$('Basket'),
+ ]).pipe(
+ map(([customFields, customFieldsForScope]) =>
+ customFieldsForScope.map(({ name, editable }) => ({ name, value: customFields[name], editable }))
+ )
+ );
+
+ this.visible$ = this.fields$.pipe(map(fields => fields.some(field => field.value)));
+ }
+}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index d8c0fe2b85..7ae553a28d 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -79,6 +79,7 @@ import { BasketValidationItemsComponent } from './components/basket/basket-valid
import { BasketValidationProductsComponent } from './components/basket/basket-validation-products/basket-validation-products.component';
import { BasketValidationResultsComponent } from './components/basket/basket-validation-results/basket-validation-results.component';
import { MiniBasketContentComponent } from './components/basket/mini-basket-content/mini-basket-content.component';
+import { BasketCustomFieldsViewComponent } from './components/checkout/basket-custom-fields-view/basket-custom-fields-view.component';
import { BasketInvoiceAddressWidgetComponent } from './components/checkout/basket-invoice-address-widget/basket-invoice-address-widget.component';
import { BasketShippingAddressWidgetComponent } from './components/checkout/basket-shipping-address-widget/basket-shipping-address-widget.component';
import { AccordionItemComponent } from './components/common/accordion-item/accordion-item.component';
@@ -301,6 +302,7 @@ const exportedComponents = [
CustomFieldsFormlyComponent,
LineItemCustomFieldsComponent,
CustomFieldsViewComponent,
+ BasketCustomFieldsViewComponent,
PromotionDetailsComponent,
PromotionRemoveComponent,
SearchBoxComponent,
diff --git a/src/assets/i18n/en_US.json b/src/assets/i18n/en_US.json
index 8df71bf677..80bb417379 100644
--- a/src/assets/i18n/en_US.json
+++ b/src/assets/i18n/en_US.json
@@ -816,6 +816,7 @@
"checkout.widget.buyer.costcenter": "Cost Center",
"checkout.widget.buyer.heading": "Buyer",
"checkout.widget.buyer.orderReferenceId": "Customer Order ID",
+ "checkout.widget.custom_fields": "Custom Fields",
"checkout.widget.message_to_merchant": "Message to Merchant",
"checkout.widget.payment_method.heading": "Payment Method",
"checkout.widget.promotion.discount": "Discount",