From b4061a5266cc855b94257d02023e8d80a14366cd Mon Sep 17 00:00:00 2001
From: Michael Bromley <michael@michaelbromley.co.uk>
Date: Tue, 26 May 2020 10:46:30 +0200
Subject: [PATCH] fix(admin-ui): Fix error updating PaymentMethod config
 parameters

Fixes #345
---
 .../payment-method-detail.component.html                 | 2 +-
 .../payment-method-detail.component.ts                   | 9 +++++++++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.html b/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.html
index bdf36721af..a73d656770 100644
--- a/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.html
+++ b/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.html
@@ -46,7 +46,7 @@
         </clr-toggle-wrapper>
     </vdr-form-field>
 
-    <div class="clr-row" formGroupName="configArgs" *ngIf="(entity$ | async)?.configArgs?.length">
+    <div class="clr-row" formGroupName="configArgs" *ngIf="(entity$ | async)?.configArgs?.length && configArgsIsPopulated()">
         <div class="clr-col">
             <label>{{ 'settings.payment-method-config-options' | translate }}</label>
             <section class="form-block" *ngFor="let arg of (entity$ | async)?.configArgs">
diff --git a/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.ts b/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.ts
index 85170688a4..12b0a6ccb3 100644
--- a/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.ts
+++ b/packages/admin-ui/src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.ts
@@ -49,6 +49,14 @@ export class PaymentMethodDetailComponent extends BaseDetailComponent<PaymentMet
         return arg.type as any;
     }
 
+    configArgsIsPopulated(): boolean {
+        const configArgsGroup = this.detailForm.get('configArgs') as FormGroup | undefined;
+        if (!configArgsGroup) {
+            return false;
+        }
+        return 0 < Object.keys(configArgsGroup.controls).length;
+    }
+
     save() {
         this.entity$
             .pipe(
@@ -100,6 +108,7 @@ export class PaymentMethodDetailComponent extends BaseDetailComponent<PaymentMet
                 }
             }
         }
+        this.changeDetector.markForCheck();
     }
 
     private parseArgValue(arg: ConfigArg): string | number | boolean {