From 432a51aee5ef4078df37007ba99d555a7176a826 Mon Sep 17 00:00:00 2001
From: Michael Bromley <michael@michaelbromley.co.uk>
Date: Mon, 8 Feb 2021 11:29:10 +0100
Subject: [PATCH] fix(admin-ui): Make order modification note not required

Relates to #688
---
 .../order-editor/order-editor.component.html  | 35 ++++++++++---------
 .../order-editor/order-editor.component.ts    | 13 ++++---
 2 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.html b/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.html
index ffdb5c3587..e6b8b7f624 100644
--- a/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.html
+++ b/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.html
@@ -108,10 +108,7 @@
                                 <clr-icon shape="trash"></clr-icon>
                             </button>
                         </td>
-                        <td
-                            *ngIf="orderLineCustomFields.length"
-                            class="order-line-custom-field align-middle"
-                        >
+                        <td *ngIf="orderLineCustomFields.length" class="order-line-custom-field align-middle">
                             <ng-container *ngFor="let customField of orderLineCustomFields">
                                 <vdr-custom-field-control
                                     [customField]="customField"
@@ -193,13 +190,21 @@ <h4 class="mb2">{{ 'order.modifications' | translate }}</h4>
                         <vdr-product-selector class="mb4" (productSelected)="addItemSelectedVariant = $event">
                         </vdr-product-selector>
                         <div *ngIf="addItemSelectedVariant" class="flex mb4">
-                            <img *ngIf="addItemSelectedVariant.productAsset as asset" [src]="asset | assetPreview: 'tiny'" class="mr4" />
+                            <img
+                                *ngIf="addItemSelectedVariant.productAsset as asset"
+                                [src]="asset | assetPreview: 'tiny'"
+                                class="mr4"
+                            />
                             <div>
                                 <strong class="mr4">{{ addItemSelectedVariant.productVariantName }}</strong>
                                 <small>{{ addItemSelectedVariant.sku }}</small>
-                                <div>{{ getSelectedItemPrice(addItemSelectedVariant) | localeCurrency: order.currencyCode }}</div>
+                                <div>
+                                    {{
+                                        getSelectedItemPrice(addItemSelectedVariant)
+                                            | localeCurrency: order.currencyCode
+                                    }}
+                                </div>
                             </div>
-
                         </div>
                         <ng-container *ngFor="let customField of orderLineCustomFields">
                             <vdr-custom-field-control
@@ -225,10 +230,7 @@ <h4 class="mb2">{{ 'order.modifications' | translate }}</h4>
                     <clr-accordion-content *clrIfExpanded>
                         <form [formGroup]="surchargeForm" (submit)="addSurcharge(surchargeForm.value)">
                             <vdr-form-field [label]="'common.description' | translate" for="description"
-                                ><input
-                                    id="description"
-                                    type="text"
-                                    formControlName="description"
+                                ><input id="description" type="text" formControlName="description"
                             /></vdr-form-field>
                             <vdr-form-field [label]="'order.product-sku' | translate" for="sku"
                                 ><input id="sku" type="text" formControlName="sku"
@@ -262,14 +264,15 @@ <h4 class="mb2">{{ 'order.modifications' | translate }}</h4>
                                         formControlName="taxRate" /></vdr-affixed-input
                             ></vdr-form-field>
                             <vdr-form-field [label]="'order.tax-description' | translate" for="taxDescription"
-                                ><input
-                                    id="taxDescription"
-                                    type="text"
-                                    formControlName="taxDescription"
+                                ><input id="taxDescription" type="text" formControlName="taxDescription"
                             /></vdr-form-field>
                             <button
                                 class="btn btn-secondary"
-                                [disabled]="surchargeForm.invalid || surchargeForm.pristine || surchargeForm.get('price')?.value === 0"
+                                [disabled]="
+                                    surchargeForm.invalid ||
+                                    surchargeForm.pristine ||
+                                    surchargeForm.get('price')?.value === 0
+                                "
                             >
                                 {{ 'order.add-surcharge' | translate }}
                             </button>
diff --git a/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.ts b/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.ts
index 045bf7e9a5..c25cd502f8 100644
--- a/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.ts
+++ b/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.ts
@@ -212,12 +212,11 @@ export class OrderEditorComponent
     canPreviewChanges(): boolean {
         const { addItems, adjustOrderLines, surcharges } = this.modifyOrderInput;
         return (
-            (!!addItems?.length ||
-                !!surcharges?.length ||
-                !!adjustOrderLines?.length ||
-                (this.shippingAddressForm.dirty && this.shippingAddressForm.valid) ||
-                (this.billingAddressForm.dirty && this.billingAddressForm.valid)) &&
-            this.note !== ''
+            !!addItems?.length ||
+            !!surcharges?.length ||
+            !!adjustOrderLines?.length ||
+            (this.shippingAddressForm.dirty && this.shippingAddressForm.valid) ||
+            (this.billingAddressForm.dirty && this.billingAddressForm.valid)
         );
     }
 
@@ -350,7 +349,7 @@ export class OrderEditorComponent
                 ? { updateShippingAddress: this.shippingAddressForm.value }
                 : {}),
             dryRun: true,
-            note: this.note,
+            note: this.note ?? '',
             options: {
                 recalculateShipping: this.recalculateShipping,
             },