Merge pull request #1451 from josehernandezfintecheandomx/enhancement/upgrade_angular11

Upgrade to Angular 11

angular.json

@@ -23,7 +23,6 @@
             "main": "src/main.ts",
             "tsConfig": "src/tsconfig.app.json",
             "polyfills": "src/polyfills.ts",
-            "extractCss": true,
             "assets": [
               "src/favicon.ico",
               "src/robots.txt",
@@ -32,31 +31,7 @@
             ],
             "styles": [
               "node_modules/font-awesome/css/font-awesome.css",
-              "src/main.scss",
+              "src/main.scss"
-              {"inject":false,
-                "input": "src/theme/deeppurple-amber.scss",
-                "bundleName": "theme/deeppurple-amber"
-},
-              {"inject":false,
-                "input": "src/theme/indigo-pink.scss",
-                "bundleName": "theme/indigo-pink"
-},
-              {"inject":false,
-                "input": "src/theme/pink-bluegrey.scss",
-                "bundleName": "theme/pink-bluegrey"
-},
-              {"inject":false,
-                "input": "src/theme/purple-green.scss",
-                "bundleName": "theme/purple-green"
-},
-              {"inject":false,
-                "input": "src/theme/custom/denim-yellowgreen.scss",
-                "bundleName": "theme/denim-yellowgreen"
-},
-              {"inject":false,
-                "input": "src/theme/custom/pictonblue-yellowgreen.scss",
-                "bundleName": "theme/pictonblue-yellowgreen"
-}
             ],
             "scripts": [],
             "allowedCommonJsDependencies": [
@@ -75,7 +50,6 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,

package.json

@@ -26,29 +26,30 @@
     "postinstall": "ngcc"
   },
   "dependencies": {
-    "@angular/animations": "10.2.5",
+    "@angular/animations": "11.2.14",
-    "@angular/cdk": "10.2.7",
+    "@angular/cdk": "11.2.13",
-    "@angular/common": "10.2.5",
+    "@angular/common": "11.2.14",
-    "@angular/compiler": "10.2.5",
+    "@angular/compiler": "11.2.14",
-    "@angular/core": "10.2.5",
+    "@angular/core": "11.2.14",
-    "@angular/flex-layout": "10.0.0-beta.32",
+    "@angular/flex-layout": "11.0.0-beta.33",
-    "@angular/forms": "10.2.5",
+    "@angular/forms": "11.2.14",
-    "@angular/localize": "10.2.5",
+    "@angular/localize": "11.2.14",
-    "@angular/material": "10.2.7",
+    "@angular/material": "11.2.13",
-    "@angular/platform-browser": "10.2.5",
+    "@angular/platform-browser": "11.2.14",
-    "@angular/platform-browser-dynamic": "10.2.5",
+    "@angular/platform-browser-dynamic": "11.2.14",
-    "@angular/router": "10.2.5",
+    "@angular/router": "11.2.14",
-    "@angular/service-worker": "10.2.5",
+    "@angular/service-worker": "11.2.14",
     "@ckeditor/ckeditor5-angular": "1.2.3",
     "@ckeditor/ckeditor5-build-classic": "21.0.0",
-    "@fortawesome/angular-fontawesome": "0.6.1",
+    "@fortawesome/angular-fontawesome": "^0.8.2",
-    "@fortawesome/fontawesome-svg-core": "1.2.18",
+    "@fortawesome/fontawesome-svg-core": "^1.2.32",
     "@fortawesome/free-solid-svg-icons": "5.8.2",
-    "@ngx-translate/core": "11.0.1",
+    "@ngx-translate/core": "13.0.0",
     "@ngx-translate/http-loader": "^6.0.0",
     "chart.js": "3.0.0-alpha",
     "core-js": "2.5.0",
     "font-awesome": "^4.7.0",
+    "install": "^0.13.0",
     "lodash": "4.17.21",
     "moment": "^2.29.3",
     "rxjs": "6.6.2",
@@ -56,23 +57,23 @@
     "zone.js": "0.10.3"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "0.1002.4",
+    "@angular-devkit/build-angular": "0.1102.19",
-    "@angular/cli": "10.2.4",
+    "@angular/cli": "11.2.19",
-    "@angular/compiler-cli": "10.2.5",
+    "@angular/compiler-cli": "11.2.14",
-    "@angular/language-service": "10.2.5",
+    "@angular/language-service": "11.2.14",
-    "@biesbjerg/ngx-translate-extract": "2.3.4",
+    "@biesbjerg/ngx-translate-extract": "^7.0.4",
     "@ngx-rocket/scripts": "3.0.3",
     "@types/jasmine": "3.3.13",
     "@types/jasminewd2": "2.0.6",
     "@types/lodash": "4.14.132",
     "@types/node": "12.11.1",
-    "codelyzer": "5.1.2",
+    "codelyzer": "6.0.0",
-    "hads": "1.7.3",
+    "hads": "^3.0.3",
     "htmlhint": "0.11.0",
     "https-proxy-agent": "2.2.1",
     "jasmine-core": "~3.5.0",
     "jasmine-spec-reporter": "~5.0.0",
-    "karma": "~5.0.0",
+    "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.1.0",
     "karma-cli": "2.0.0",
     "karma-coverage-istanbul-reporter": "~3.0.2",

src/app/deposits/fixed-deposits/create-fixed-deposit-account/create-fixed-deposit-account.component.ts

@@ -1,7 +1,6 @@
 /** Angular Imports */
 import { Component, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { FixedDepositsService } from '../fixed-deposits.service';
@@ -13,6 +12,7 @@ import { FixedDepositAccountCurrencyStepComponent } from '../fixed-deposit-accou
 import { FixedDepositAccountTermsStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-terms-step/fixed-deposit-account-terms-step.component';
 import { FixedDepositAccountSettingsStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-settings-step/fixed-deposit-account-settings-step.component';
 import { FixedDepositAccountChargesStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-charges-step/fixed-deposit-account-charges-step.component';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Create Fixed Deposit Account Component
@@ -44,13 +44,13 @@ export class CreateFixedDepositAccountComponent {
    * Fetches FD account template from `resolve`
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
-   * @param {DatePipe} datePipe Date Utils
+   * @param {Dates} dateUtils Date Utils
    * @param {FixedDepositsService} fixedDepositsService Fixed Deposits Service
    * @param {SettingsService} settingsService Settings Service
    */
   constructor(private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private fixedDepositsService: FixedDepositsService,
               private settingsService: SettingsService) {
     this.route.data.subscribe((data: { fixedDepositsAccountTemplate: any }) => {
@@ -130,11 +130,11 @@ export class CreateFixedDepositAccountComponent {
       charges: this.fixedDepositAccount.charges.map((charge: any) => ({
         chargeId: charge.id,
         amount: charge.amount,
-        dueDate: charge.dueDate && this.datePipe.transform(charge.dueDate, dateFormat),
+        dueDate: charge.dueDate && this.dateUtils.formatDate(charge.dueDate, dateFormat),
-        feeOnMonthDay: charge.feeOnMonthDay && this.datePipe.transform([2000].concat(charge.feeOnMonthDay), monthDayFormat),
+        feeOnMonthDay: charge.feeOnMonthDay && this.dateUtils.formatDate([2000].concat(charge.feeOnMonthDay), monthDayFormat),
         feeInterval: charge.feeInterval
       })),
-      submittedOnDate: this.datePipe.transform(this.fixedDepositAccount.submittedOnDate, dateFormat),
+      submittedOnDate: this.dateUtils.formatDate(this.fixedDepositAccount.submittedOnDate, dateFormat),
       charts: [{chartSlabs: this.fixedDepositsAccountProductTemplate.accountChart.chartSlabs}],
       dateFormat,
       monthDayFormat,

src/app/deposits/fixed-deposits/edit-fixed-deposit-account/edit-fixed-deposit-account.component.ts

@@ -1,7 +1,6 @@
 /** Angular Imports */
 import { Component, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { FixedDepositsService } from '../fixed-deposits.service';
@@ -13,6 +12,7 @@ import { FixedDepositAccountCurrencyStepComponent } from '../fixed-deposit-accou
 import { FixedDepositAccountTermsStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-terms-step/fixed-deposit-account-terms-step.component';
 import { FixedDepositAccountSettingsStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-settings-step/fixed-deposit-account-settings-step.component';
 import { FixedDepositAccountChargesStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-charges-step/fixed-deposit-account-charges-step.component';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Edit Fixed Deposit Account Component
@@ -44,13 +44,13 @@ export class EditFixedDepositAccountComponent {
    * Fetches FD account template from `resolve`
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
-   * @param {DatePipe} datePipe Date Utils
+   * @param {Dates} dateUtils Date Utils
    * @param {FixedDepositsService} fixedDepositsService Fixed Deposits Service
    * @param {SettingsService} settingsService Settings Service
    */
   constructor(private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private fixedDepositsService: FixedDepositsService,
               private settingsService: SettingsService) {
     this.route.data.subscribe((data: { fixedDepositsAccountAndTemplate: any }) => {
@@ -136,11 +136,11 @@ export class EditFixedDepositAccountComponent {
       charges: this.fixedDepositAccount.charges.map((charge: any) => ({
         chargeId: charge.id,
         amount: charge.amount,
-        dueDate: charge.dueDate && this.datePipe.transform(charge.dueDate, dateFormat),
+        dueDate: charge.dueDate && this.dateUtils.formatDate(charge.dueDate, dateFormat),
-        feeOnMonthDay: charge.feeOnMonthDay && this.datePipe.transform([2000].concat(charge.feeOnMonthDay), monthDayFormat),
+        feeOnMonthDay: charge.feeOnMonthDay && this.dateUtils.formatDate([2000].concat(charge.feeOnMonthDay), monthDayFormat),
         feeInterval: charge.feeInterval
       })),
-      submittedOnDate: this.datePipe.transform(this.fixedDepositAccount.submittedOnDate, dateFormat),
+      submittedOnDate: this.dateUtils.formatDate(this.fixedDepositAccount.submittedOnDate, dateFormat),
       charts: [{chartSlabs: this.fixedDepositsAccountProductTemplate.accountChart.chartSlabs}],
       dateFormat,
       monthDayFormat,