feat: ISREST-1006 adjust payment component structure

intershop · Mar 30, 2020 · 04f4efb · 04f4efb
1 parent a2f7e65
commit 04f4efb
Show file tree

Hide file tree

Showing 12 changed files with 57 additions and 52 deletions.
diff --git a/src/app/core/models/payment-method/payment-method.mapper.ts b/src/app/core/models/payment-method/payment-method.mapper.ts
@@ -199,20 +199,19 @@ export class PaymentMethodMapper {
   private static mapSEPAMandateInformation(
     hostedPaymentPageParameters: { name: string; value: string }[]
   ): { name: string; value: string }[] {
-    hostedPaymentPageParameters
-      .filter(hppp => hppp.name === 'Concardis_SEPA_Mandate')
-      .forEach(mandateEntry => {
-        if (typeof mandateEntry.value !== 'string') {
-          const sepaMandateArray = mandateEntry.value as {
-            mandateId: string;
-            mandateText: string;
-            directDebitType: string;
-          };
-          hostedPaymentPageParameters.push({ name: 'mandateId', value: sepaMandateArray.mandateId });
-          hostedPaymentPageParameters.push({ name: 'mandateText', value: sepaMandateArray.mandateText });
-          hostedPaymentPageParameters.push({ name: 'directDebitType', value: sepaMandateArray.directDebitType });
-        }
-      });
+    const mandateEntry = hostedPaymentPageParameters.find(hppp => hppp.name === 'Concardis_SEPA_Mandate');
+
+    if (typeof mandateEntry.value !== 'string') {
+      const sepaMandateArray = mandateEntry.value as {
+        mandateId: string;
+        mandateText: string;
+        directDebitType: string;
+      };
+      hostedPaymentPageParameters.push({ name: 'mandateId', value: sepaMandateArray.mandateId });
+      hostedPaymentPageParameters.push({ name: 'mandateText', value: sepaMandateArray.mandateText });
+      hostedPaymentPageParameters.push({ name: 'directDebitType', value: sepaMandateArray.directDebitType });
+    }
+
     return hostedPaymentPageParameters;
   }
 }
diff --git a/src/app/pages/checkout-payment/checkout-payment-page.module.ts b/src/app/pages/checkout-payment/checkout-payment-page.module.ts
@@ -4,9 +4,9 @@ import { SharedModule } from 'ish-shared/shared.module';
 
 import { CheckoutPaymentPageComponent } from './checkout-payment-page.component';
 import { CheckoutPaymentComponent } from './checkout-payment/checkout-payment.component';
-import { PaymentConcardisCreditcardComponent } from './checkout-payment/payment-concardis/payment-concardis-creditcard/payment-concardis-creditcard.component';
-import { PaymentConcardisDirectdebitComponent } from './checkout-payment/payment-concardis/payment-concardis-directdebit/payment-concardis-directdebit.component';
-import { PaymentConcardisComponent } from './checkout-payment/payment-concardis/payment-concardis.component';
+import { PaymentConcardisCreditcardComponent } from './payment-concardis-creditcard/payment-concardis-creditcard.component';
+import { PaymentConcardisDirectdebitComponent } from './payment-concardis-directdebit/payment-concardis-directdebit.component';
+import { PaymentConcardisComponent } from './payment-concardis/payment-concardis.component';
 
 @NgModule({
   imports: [SharedModule],

diff --git a/src/app/pages/checkout-payment/checkout-payment/checkout-payment.component.spec.ts b/src/app/pages/checkout-payment/checkout-payment/checkout-payment.component.spec.ts
@@ -21,9 +21,10 @@ import { ErrorMessageComponent } from 'ish-shared/components/common/error-messag
 import { ModalDialogLinkComponent } from 'ish-shared/components/common/modal-dialog-link/modal-dialog-link.component';
 import { CheckboxComponent } from 'ish-shared/forms/components/checkbox/checkbox.component';
 
+import { PaymentConcardisCreditcardComponent } from '../payment-concardis-creditcard/payment-concardis-creditcard.component';
+import { PaymentConcardisDirectdebitComponent } from '../payment-concardis-directdebit/payment-concardis-directdebit.component';
+
 import { CheckoutPaymentComponent } from './checkout-payment.component';
-import { PaymentConcardisCreditcardComponent } from './payment-concardis/payment-concardis-creditcard/payment-concardis-creditcard.component';
-import { PaymentConcardisDirectdebitComponent } from './payment-concardis/payment-concardis-directdebit/payment-concardis-directdebit.component';
 
 describe('Checkout Payment Component', () => {
   let component: CheckoutPaymentComponent;

diff --git a/...yment-concardis-creditcard.component.html → ...yment-concardis-creditcard.component.html b/...yment-concardis-creditcard.component.html → ...yment-concardis-creditcard.component.html
diff --git a/...nt-concardis-creditcard.component.spec.ts → ...nt-concardis-creditcard.component.spec.ts b/...nt-concardis-creditcard.component.spec.ts → ...nt-concardis-creditcard.component.spec.ts
diff --git a/...payment-concardis-creditcard.component.ts → ...payment-concardis-creditcard.component.ts b/...payment-concardis-creditcard.component.ts → ...payment-concardis-creditcard.component.ts
@@ -1,11 +1,10 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
 import { takeUntil } from 'rxjs/operators';
 
 import { ScriptLoaderService } from 'ish-core/utils/script-loader/script-loader.service';
 import { markAsDirtyRecursive } from 'ish-shared/forms/utils/form-utils';
 
-import { PaymentConcardisComponent } from '../payment-concardis.component';
+import { PaymentConcardisComponent } from '../payment-concardis/payment-concardis.component';
 
 // allows access to concardis js functionality
 // tslint:disable-next-line:no-any
@@ -28,7 +27,7 @@ declare var PayEngine: any;
   changeDetection: ChangeDetectionStrategy.Default,
 })
 // tslint:disable-next-line:ccp-no-intelligence-in-components
-export class PaymentConcardisCreditcardComponent extends PaymentConcardisComponent implements OnInit {
+export class PaymentConcardisCreditcardComponent extends PaymentConcardisComponent {
   constructor(protected scriptLoader: ScriptLoaderService, protected cd: ChangeDetectorRef) {
     super(scriptLoader, cd);
   }
@@ -39,17 +38,6 @@ export class PaymentConcardisCreditcardComponent extends PaymentConcardisCompone
     verificationIframeName: string;
   };
 
-  /**
-   * initialize parameter form on init
-   */
-  ngOnInit() {
-    this.parameterForm = new FormGroup({
-      expirationMonth: new FormControl('', [Validators.required, Validators.pattern('[0-9]{2}')]),
-      expirationYear: new FormControl('', [Validators.required, Validators.pattern('[0-9]{2}')]),
-      saveForLater: new FormControl(true),
-    });
-  }
-
   /* ---------------------------------------- load concardis script if component is visible ------------------------------------------- */
   loadScript() {
     // load script only once if component becomes visible

diff --git a/...ment-concardis-directdebit.component.html → ...ment-concardis-directdebit.component.html b/...ment-concardis-directdebit.component.html → ...ment-concardis-directdebit.component.html
diff --git a/...t-concardis-directdebit.component.spec.ts → ...t-concardis-directdebit.component.spec.ts b/...t-concardis-directdebit.component.spec.ts → ...t-concardis-directdebit.component.spec.ts
@@ -79,7 +79,7 @@ describe('Payment Concardis Directdebit Component', () => {
     verify(emitter.emit(anything())).once();
   });
 
-  /**it('should show an error if submit call back returns with an error', () => {
+  it('should show an error if submit call back returns with an error', () => {
     const errorMessage = 'field is required';
 
     fixture.detectChanges();
@@ -89,7 +89,7 @@ describe('Payment Concardis Directdebit Component', () => {
     );
 
     expect(component.errorMessage.iban.message).toEqual(errorMessage);
-  });**/
+  });
 
   it('should emit cancel event when cancelNewPaymentInstrument is triggered', () => {
     fixture.detectChanges();

diff --git a/...ayment-concardis-directdebit.component.ts → ...ayment-concardis-directdebit.component.ts b/...ayment-concardis-directdebit.component.ts → ...ayment-concardis-directdebit.component.ts
@@ -1,12 +1,12 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
-import { FormGroup, Validators } from '@angular/forms';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
+import { Validators } from '@angular/forms';
 import { FormlyFieldConfig } from '@ngx-formly/core';
 import { takeUntil } from 'rxjs/operators';
 
 import { ScriptLoaderService } from 'ish-core/utils/script-loader/script-loader.service';
 import { markAsDirtyRecursive } from 'ish-shared/forms/utils/form-utils';
 
-import { PaymentConcardisComponent } from '../payment-concardis.component';
+import { PaymentConcardisComponent } from '../payment-concardis/payment-concardis.component';
 
 // allows access to concardis js functionality
 // tslint:disable-next-line:no-any
@@ -29,22 +29,16 @@ declare var PayEngine: any;
   changeDetection: ChangeDetectionStrategy.Default,
 })
 // tslint:disable-next-line:ccp-no-intelligence-in-components
-export class PaymentConcardisDirectdebitComponent extends PaymentConcardisComponent implements OnInit {
+export class PaymentConcardisDirectdebitComponent extends PaymentConcardisComponent {
   constructor(protected scriptLoader: ScriptLoaderService, protected cd: ChangeDetectorRef) {
     super(scriptLoader, cd);
   }
 
-  /**
-   * initialize parameter form on init
-   */
-  ngOnInit() {
-    this.parameterForm = new FormGroup({});
-  }
-
   handleErrors(controlName: string, message: string) {
-    this.parameterForm.controls[controlName].markAsDirty();
-    this.parameterForm.controls[controlName].markAsTouched();
-    this.parameterForm.controls[controlName].setErrors({ customError: message });
+    if (this.parameterForm.controls[controlName]) {
+      this.parameterForm.controls[controlName].markAsDirty();
+      this.parameterForm.controls[controlName].setErrors({ customError: message });
+    }
   }
 
   /* ---------------------------------------- load concardis script if component is visible ------------------------------------------- */

diff --git a/...oncardis/payment-concardis.component.html → ...oncardis/payment-concardis.component.html b/...oncardis/payment-concardis.component.html → ...oncardis/payment-concardis.component.html
diff --git a/...ardis/payment-concardis.component.spec.ts → ...ardis/payment-concardis.component.spec.ts b/...ardis/payment-concardis.component.spec.ts → ...ardis/payment-concardis.component.spec.ts
@@ -2,6 +2,8 @@ import { ComponentFixture, TestBed, async } from '@angular/core/testing';
 import { ReactiveFormsModule } from '@angular/forms';
 import { TranslateModule } from '@ngx-translate/core';
 
+import { PaymentMethod } from 'ish-core/models/payment-method/payment-method.model';
+
 import { PaymentConcardisComponent } from './payment-concardis.component';
 
 describe('Payment Concardis Component', () => {
@@ -20,6 +22,11 @@ describe('Payment Concardis Component', () => {
     fixture = TestBed.createComponent(PaymentConcardisComponent);
     component = fixture.componentInstance;
     element = fixture.nativeElement;
+
+    component.paymentMethod = {
+      id: 'Concardis_CreditCard',
+      saveAllowed: false,
+    } as PaymentMethod;
   });
 
   it('should be created', () => {

diff --git a/...-concardis/payment-concardis.component.ts → ...-concardis/payment-concardis.component.ts b/...-concardis/payment-concardis.component.ts → ...-concardis/payment-concardis.component.ts
@@ -6,9 +6,10 @@ import {
   Input,
   OnChanges,
   OnDestroy,
+  OnInit,
   Output,
 } from '@angular/core';
-import { FormGroup } from '@angular/forms';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { FormlyFormOptions } from '@ngx-formly/core';
 import { Subject } from 'rxjs';
 
@@ -21,7 +22,7 @@ import { ScriptLoaderService } from 'ish-core/utils/script-loader/script-loader.
   templateUrl: './payment-concardis.component.html',
   changeDetection: ChangeDetectionStrategy.Default,
 })
-export class PaymentConcardisComponent implements OnChanges, OnDestroy {
+export class PaymentConcardisComponent implements OnInit, OnChanges, OnDestroy {
   constructor(protected scriptLoader: ScriptLoaderService, protected cd: ChangeDetectorRef) {}
   /**
    * concardis payment method, needed to get configuration parameters
@@ -62,6 +63,21 @@ export class PaymentConcardisComponent implements OnChanges, OnDestroy {
       : 'https://pptest.payengine.de/bridge/1.0/payengine.min.js';
   }
 
+  /**
+   * initialize parameter form on init
+   */
+  ngOnInit() {
+    this.parameterForm = new FormGroup(
+      this.paymentMethod.id === 'Concardis_CreditCard'
+        ? {
+            expirationMonth: new FormControl('', [Validators.required, Validators.pattern('[0-9]{2}')]),
+            expirationYear: new FormControl('', [Validators.required, Validators.pattern('[0-9]{2}')]),
+            saveForLater: new FormControl(true),
+          }
+        : {}
+    );
+  }
+
   /**
    * load concardis script if component is shown
    */