Updated to angular 11

Now compiling with strict mode in typescript
Need to error checking now

bookie/src/app/sales/receive-payment/receive-payment.component.ts

@@ -3,7 +3,9 @@ import { FormArray, FormBuilder, FormGroup } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { distinctUntilChanged } from 'rxjs/operators';
 
-import { PrintType } from '../bills/print-type';
+import { ReceivePaymentItem } from '../../core/receive-payment-item';
+import { ReceivePaymentList } from '../../core/receive-payment-list';
+import { VoucherType } from '../bills/voucher-type';
 
 import { ReceivePaymentDatasource } from './receive-payment-datasource';
 
@@ -13,7 +15,7 @@ import { ReceivePaymentDatasource } from './receive-payment-datasource';
   styleUrls: ['./receive-payment.component.css'],
 })
 export class ReceivePaymentComponent {
-  choices = {
+  choices: ReceivePaymentList = {
     REGULAR_BILL: [
       {
         id: 2,
@@ -52,7 +54,7 @@ export class ReceivePaymentComponent {
     ],
   };
 
-  type: PrintType;
+  type: VoucherType;
   amount: number;
   balance: number;
   form: FormGroup;
@@ -63,16 +65,18 @@ export class ReceivePaymentComponent {
   constructor(
     public dialogRef: MatDialogRef<ReceivePaymentComponent>,
     private fb: FormBuilder,
-    @Inject(MAT_DIALOG_DATA) public data: { type: PrintType; amount: number },
+    @Inject(MAT_DIALOG_DATA) public data: { type: VoucherType; amount: number },
   ) {
-    this.createForm();
+    this.form = this.fb.group({
+      amounts: '',
+    });
     this.type = data.type;
     this.amount = data.amount;
     this.balance = data.amount;
     this.form.setControl(
       'amounts',
       this.fb.array(
-        this.choices[this.type].map((x) =>
+        this.choices[this.type].map((x: ReceivePaymentItem) =>
           this.fb.group({
             name: [x.name],
             amount: [''],
@@ -84,17 +88,11 @@ export class ReceivePaymentComponent {
     this.listenToAmountChange();
   }
 
-  createForm() {
-    this.form = this.fb.group({
-      amounts: '',
-    });
-  }
-
   listenToAmountChange() {
     const array = this.form.get('amounts') as FormArray;
     this.choices[this.type].forEach((z, i) =>
       array.controls[i].valueChanges.pipe(distinctUntilChanged()).subscribe((x) => {
-        this.choices[this.type].find((s) => s.name === x.name).amount =
+        (this.choices[this.type].find((s) => s.name === x.name) as ReceivePaymentItem).amount =
           x.amount === '' ? 0 : parseInt(x.amount, 10);
         this.balance = this.amount - this.choices[this.type].reduce((a, c) => a + c.amount, 0);
       }),