fix(admin-ui): Correctly handle defaults for configurable operations

packages/admin-ui/src/app/common/utilities/get-default-config-arg-value.ts

@@ -0,0 +1,23 @@
+import { ConfigArgType } from 'shared/shared-types';
+import { assertNever } from 'shared/shared-utils';
+
+import { ConfigArg, ConfigArgDefinition } from '../generated-types';
+
+export function getDefaultConfigArgValue(arg: ConfigArg | ConfigArgDefinition): any {
+    const type = arg.type as ConfigArgType;
+    switch (type) {
+        case 'boolean':
+            return false;
+        case 'int':
+        case 'float':
+            return '0';
+        case 'facetValueIds':
+            return [];
+        case 'string':
+            return '';
+        case 'datetime':
+            return new Date();
+        default:
+            assertNever(type);
+    }
+}

packages/admin-ui/src/app/marketing/components/promotion-detail/promotion-detail.component.ts

@@ -16,6 +16,7 @@ import {
     Promotion,
     UpdatePromotionInput,
 } from '../../../common/generated-types';
+import { getDefaultConfigArgValue } from '../../../common/utilities/get-default-config-arg-value';
 import { _ } from '../../../core/providers/i18n/mark-for-extraction';
 import { NotificationService } from '../../../core/providers/notification/notification.service';
 import { DataService } from '../../../data/providers/data.service';
@@ -233,7 +234,7 @@ export class PromotionDetailComponent extends BaseDetailComponent<Promotion.Frag
             const argsHash = operation.args.reduce(
                 (output, arg) => ({
                     ...output,
-                    [arg.name]: arg.value,
+                    [arg.name]: getDefaultConfigArgValue(arg),
                 }),
                 {},
             );

packages/admin-ui/src/app/settings/components/shipping-method-detail/shipping-method-detail.component.html

@@ -7,7 +7,7 @@
             class="btn btn-primary"
             *ngIf="isNew$ | async; else updateButton"
             (click)="create()"
-            [disabled]="detailForm.pristine || detailForm.invalid"
+            [disabled]="detailForm.pristine || detailForm.invalid || !selectedChecker || !selectedCalculator"
         >
             {{ 'common.create' | translate }}
         </button>
@@ -16,7 +16,7 @@
                 class="btn btn-primary"
                 (click)="save()"
                 *vdrIfPermissions="'UpdateSettings'"
-                [disabled]="detailForm.pristine || detailForm.invalid"
+                [disabled]="detailForm.pristine || detailForm.invalid || !selectedChecker || !selectedCalculator"
             >
                 {{ 'common.update' | translate }}
             </button>

packages/admin-ui/src/app/settings/components/shipping-method-detail/shipping-method-detail.component.ts

@@ -7,7 +7,6 @@ import { normalizeString } from 'shared/normalize-string';
 
 import { BaseDetailComponent } from '../../../common/base-detail.component';
 import {
-    ConfigArg,
     ConfigurableOperation,
     ConfigurableOperationDefinition,
     ConfigurableOperationInput,
@@ -18,6 +17,7 @@ import {
     TestShippingMethodResult,
     UpdateShippingMethodInput,
 } from '../../../common/generated-types';
+import { getDefaultConfigArgValue } from '../../../common/utilities/get-default-config-arg-value';
 import { _ } from '../../../core/providers/i18n/mark-for-extraction';
 import { NotificationService } from '../../../core/providers/notification/notification.service';
 import { DataService } from '../../../data/providers/data.service';
@@ -133,11 +133,21 @@ export class ShippingMethodDetailComponent extends BaseDetailComponent<ShippingM
     selectChecker(checker: ConfigurableOperationDefinition) {
         this.selectedCheckerDefinition = checker;
         this.selectedChecker = this.configurableDefinitionToInstance(checker);
+        const formControl = this.detailForm.get('checker');
+        if (formControl) {
+            formControl.patchValue(this.selectedChecker);
+        }
+        this.detailForm.markAsDirty();
     }
 
     selectCalculator(calculator: ConfigurableOperationDefinition) {
         this.selectedCalculatorDefinition = calculator;
         this.selectedCalculator = this.configurableDefinitionToInstance(calculator);
+        const formControl = this.detailForm.get('calculator');
+        if (formControl) {
+            formControl.patchValue(this.selectedCalculator);
+        }
+        this.detailForm.markAsDirty();
     }
 
     private configurableDefinitionToInstance(def: ConfigurableOperationDefinition): ConfigurableOperation {
@@ -146,7 +156,7 @@ export class ShippingMethodDetailComponent extends BaseDetailComponent<ShippingM
             args: def.args.map(arg => {
                 return {
                     ...arg,
-                    value: '',
+                    value: getDefaultConfigArgValue(arg),
                 };
             }),
         } as ConfigurableOperation;

packages/admin-ui/src/app/shared/components/configurable-input/configurable-input.component.ts

@@ -23,6 +23,7 @@ import {
 import { Subscription } from 'rxjs';
 import { StringFieldOption } from 'shared/generated-types';
 import { ConfigArgType } from 'shared/shared-types';
+import { assertNever } from 'shared/shared-utils';
 
 import {
     ConfigArg,
@@ -31,6 +32,7 @@ import {
     FacetWithValues,
     GetActiveChannel,
 } from '../../../common/generated-types';
+import { getDefaultConfigArgValue } from '../../../common/utilities/get-default-config-arg-value';
 import { interpolateDescription } from '../../../common/utilities/interpolate-description';
 
 /**
@@ -178,8 +180,12 @@ export class ConfigurableInputComponent implements OnChanges, OnDestroy, Control
         if (this.operation.args) {
             for (const arg of this.operation.args) {
                 let value: any = arg.value;
-                if (arg.type === 'boolean') {
-                    value = arg.value === 'true';
+                if (value === undefined) {
+                    value = getDefaultConfigArgValue(arg);
+                } else {
+                    if (arg.type === 'boolean') {
+                        value = arg.value === 'true';
+                    }
                 }
                 this.form.addControl(arg.name, new FormControl(value, Validators.required));
             }