[Diff] Atualização do Angular (13 > 14)

angular.json

@@ -128,6 +128,5 @@
         }
       }
     }
-  },
-  "defaultProject": "querido-diario"
+  }
 }

package.json

@@ -17,18 +17,18 @@
     "npm": "7.24.0"
   },
   "dependencies": {
-    "@angular/animations": "~13.4.0",
-    "@angular/cdk": "^13.3.9",
-    "@angular/common": "~13.4.0",
-    "@angular/compiler": "~13.4.0",
-    "@angular/core": "~13.4.0",
+    "@angular/animations": "^14.3.0",
+    "@angular/cdk": "^14.2.7",
+    "@angular/common": "^14.3.0",
+    "@angular/compiler": "^14.3.0",
+    "@angular/core": "^14.3.0",
     "@angular/flex-layout": "12.0.0-beta.34",
-    "@angular/forms": "~13.4.0",
-    "@angular/material": "^13.3.9",
-    "@angular/material-moment-adapter": "^13.3.9",
-    "@angular/platform-browser": "~13.4.0",
-    "@angular/platform-browser-dynamic": "~13.4.0",
-    "@angular/router": "~13.4.0",
+    "@angular/forms": "^14.3.0",
+    "@angular/material": "^14.2.7",
+    "@angular/material-moment-adapter": "^14.2.7",
+    "@angular/platform-browser": "^14.3.0",
+    "@angular/platform-browser-dynamic": "^14.3.0",
+    "@angular/router": "^14.3.0",
     "@datorama/akita": "^7.1.1",
     "angular-responsive-carousel": "^2.0.2",
     "express": "^4.17.1",
@@ -43,9 +43,9 @@
     "zone.js": "~0.11.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~13.3.11",
-    "@angular/cli": "~13.3.11",
-    "@angular/compiler-cli": "~13.4.0",
+    "@angular-devkit/build-angular": "^14.2.13",
+    "@angular/cli": "^14.2.13",
+    "@angular/compiler-cli": "^14.3.0",
     "@types/jasmine": "~3.6.0",
     "@types/node": "^12.11.1",
     "autoprefixer": "^10.4.7",

src/app/modules/components/date-picker-range/date-picker-range.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, Output, EventEmitter } from '@angular/core';
-import { FormControl, FormGroup } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 import {
   MAT_MOMENT_DATE_ADAPTER_OPTIONS,
   MomentDateAdapter,
@@ -44,7 +44,7 @@ export class DatePickerRangeComponent implements OnInit {
     start: Moment;
     end: Moment;
   }>();
-  range: FormGroup = new FormGroup({});
+  range: UntypedFormGroup = new UntypedFormGroup({});
   maxDate: Date = new Date();
   subscriptions: Subscription[] = [];
 
@@ -53,9 +53,9 @@ export class DatePickerRangeComponent implements OnInit {
   ngOnInit(): void {
     this.subscriptions.push(
       this.route.queryParams.subscribe((params) => {
-        this.range = new FormGroup({
-          start: new FormControl(params.since),
-          end: new FormControl(params.until),
+        this.range = new UntypedFormGroup({
+          start: new UntypedFormControl(params.since),
+          end: new UntypedFormControl(params.until),
         });
       })
     );

src/app/modules/components/period-picker/period-picker.component.ts

@@ -1,5 +1,5 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { FormControl, FormGroup } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 import {
   MAT_MOMENT_DATE_ADAPTER_OPTIONS,
   MomentDateAdapter,
@@ -37,14 +37,14 @@ export class PeriodPickerComponent implements OnInit {
     to: '',
   };
   @Output() rangeSelected: EventEmitter<PeriodRange> = new EventEmitter();
-  range: FormGroup = new FormGroup({});
+  range: UntypedFormGroup = new UntypedFormGroup({});
 
   constructor() {}
 
   ngOnInit(): void {
-    this.range = new FormGroup({
-      start: new FormControl(new Date(this.initialValue.from) || ''),
-      end: new FormControl(new Date(this.initialValue.to) || ''),
+    this.range = new UntypedFormGroup({
+      start: new UntypedFormControl(new Date(this.initialValue.from) || ''),
+      end: new UntypedFormControl(new Date(this.initialValue.to) || ''),
     });
   }
 

src/app/modules/components/search-form/search-form.component.ts

@@ -1,6 +1,6 @@
 import { Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
 import { Meta, Title } from '@angular/platform-browser';
-import { FormControl } from '@angular/forms';
+import { UntypedFormControl } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Moment } from 'moment';
 import { Observable, Subscription } from 'rxjs';
@@ -17,7 +17,7 @@ import { DownloadCSVService } from './../../../services/download-csv/download-cs
   styleUrls: ['./search-form.component.sass'],
 })
 export class SearchFormComponent implements OnInit {
-  termControl = new FormControl();
+  termControl = new UntypedFormControl();
 
   @Input()
   form: any;
@@ -34,7 +34,7 @@ export class SearchFormComponent implements OnInit {
 
   filteredOptions: Observable<string[]> = new Observable();
 
-  cityControl = new FormControl();
+  cityControl = new UntypedFormControl();
   territories: Territory[] = [];
   selectedCities: Territory[] = [];
   territory: string[] = [];

src/app/modules/components/select/select.component.ts

@@ -5,7 +5,7 @@ import {
   OnInit,
   Output,
 } from '@angular/core';
-import { FormControl } from '@angular/forms';
+import { UntypedFormControl } from '@angular/forms';
 import { Option } from 'src/app/interfaces/option';
 
 @Component({
@@ -28,7 +28,7 @@ export class SelectComponent implements OnInit {
   @Input()
   selected: any;
 
-  selectControl = new FormControl({});
+  selectControl = new UntypedFormControl({});
 
   constructor() {}
 
@@ -42,7 +42,7 @@ export class SelectComponent implements OnInit {
 
   ngOnInit(): void {
     if (this.selected) {
-      this.selectControl = new FormControl(this.selected);
+      this.selectControl = new UntypedFormControl(this.selected);
     }
   }
 

src/app/modules/pages/area-education/header/login-form/login-form.component.ts

@@ -1,5 +1,5 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { LoginService } from 'src/app/services/login/login.service';
 import { UserService } from 'src/app/stores/user/user.service';
@@ -16,7 +16,7 @@ export class LoginFormComponent implements OnInit {
   @Output() onShowResetForm: EventEmitter<boolean> = new EventEmitter();
   @Output() onLoggedIn: EventEmitter<boolean> = new EventEmitter();
   @Output() onSetEmail: EventEmitter<string> = new EventEmitter();
-  formGroup: FormGroup = {} as FormGroup;
+  formGroup: UntypedFormGroup = {} as UntypedFormGroup;
   loading = false;
   showPass = false;
   errorMessage = '';
@@ -28,9 +28,9 @@ export class LoginFormComponent implements OnInit {
   ) { }
 
   ngOnInit(): void {
-    this.formGroup = new FormGroup({
-      password: new FormControl(null, [Validators.required]),
-      email: new FormControl(null, [Validators.required, Validators.maxLength(100), Validators.email]),
+    this.formGroup = new UntypedFormGroup({
+      password: new UntypedFormControl(null, [Validators.required]),
+      email: new UntypedFormControl(null, [Validators.required, Validators.maxLength(100), Validators.email]),
     });
   }
 

src/app/modules/pages/area-education/header/reset-pass-modal/reset-pass-modal.component.ts

@@ -1,5 +1,5 @@
 import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms';
 import { LoginService } from 'src/app/services/login/login.service';
 
 @Component({
@@ -11,7 +11,7 @@ export class ResetPassModalComponent implements OnInit, OnChanges {
   @Input() showForm = false;
   @Input() email = '';
   @Output() onHideForm: EventEmitter<boolean> = new EventEmitter();
-  formGroup: FormGroup = {} as FormGroup;
+  formGroup: UntypedFormGroup = {} as UntypedFormGroup;
   loading = false;
   errorMessage = '';
 
@@ -20,8 +20,8 @@ export class ResetPassModalComponent implements OnInit, OnChanges {
   ) { }
 
   ngOnInit(): void {
-    this.formGroup = new FormGroup({
-      email: new FormControl(null, [Validators.required, Validators.maxLength(100), Validators.email]),
+    this.formGroup = new UntypedFormGroup({
+      email: new UntypedFormControl(null, [Validators.required, Validators.maxLength(100), Validators.email]),
     });
   }
 

src/app/modules/pages/area-education/pass-reset/pass-reset.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { LoginService } from 'src/app/services/login/login.service';
 
@@ -9,7 +9,7 @@ import { LoginService } from 'src/app/services/login/login.service';
   styleUrls: ['./pass-reset.component.sass']
 })
 export class PassResetComponent implements OnInit {
-  formGroup: FormGroup = {} as FormGroup;
+  formGroup: UntypedFormGroup = {} as UntypedFormGroup;
   errorMessage = '';
   loading = false;
   isSent = false;
@@ -30,8 +30,8 @@ export class PassResetComponent implements OnInit {
   ) { }
 
   ngOnInit(): void {
-    this.formGroup = new FormGroup({
-      password: new FormControl(null, [Validators.required, Validators.minLength(8)]),
+    this.formGroup = new UntypedFormGroup({
+      password: new UntypedFormControl(null, [Validators.required, Validators.minLength(8)]),
     });
 
     this.route.queryParams

src/app/modules/pages/area-education/request-analysis-form/request-analysis-form.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 import { MatSnackBar } from '@angular/material/snack-bar';
 import { City } from 'src/app/interfaces/city';
@@ -15,7 +15,7 @@ import { EducationQuotationService } from 'src/app/services/educationQuotation/e
   styleUrls: ['./request-analysis-form.component.sass'],
 })
 export class RequestAnalysisFormComponent implements OnInit {
-  form: FormGroup = this.formBuilder.group({});
+  form: UntypedFormGroup = this.formBuilder.group({});
   cities: City[] = [];
   themes: string[] = [];
   locations: string[] = [];
@@ -26,7 +26,7 @@ export class RequestAnalysisFormComponent implements OnInit {
   loading = false;
 
   constructor(
-    private formBuilder: FormBuilder,
+    private formBuilder: UntypedFormBuilder,
     private citiesService: CitiesService,
     private searchService: EducationGazettesService,
     private educationQuotationService: EducationQuotationService,

src/app/modules/pages/area-education/search/filters/period-filter/period-filter.component.ts

@@ -1,5 +1,5 @@
 import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
-import { FormControl, FormGroup } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 import { MAT_MOMENT_DATE_ADAPTER_OPTIONS, MomentDateAdapter } from '@angular/material-moment-adapter';
 import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
 import { Moment } from 'moment';
@@ -30,7 +30,7 @@ export class PeriodFilterComponent implements OnInit {
   @Output() changeDates: EventEmitter<GazetteFilters> = new EventEmitter();
   activeTab = 0;
   period: number = 1;
-  range: FormGroup = new FormGroup({});
+  range: UntypedFormGroup = new UntypedFormGroup({});
 
   constructor() { }
 
@@ -44,9 +44,9 @@ export class PeriodFilterComponent implements OnInit {
       this.setPeriod(1);
     }
 
-    this.range = new FormGroup({
-      start: new FormControl(new Date(this.initialValue.published_since) || ''),
-      end: new FormControl(new Date(this.initialValue.until) || ''),
+    this.range = new UntypedFormGroup({
+      start: new UntypedFormControl(new Date(this.initialValue.published_since) || ''),
+      end: new UntypedFormControl(new Date(this.initialValue.until) || ''),
     });
   }
 

src/app/modules/pages/area-education/signup/signup.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { City } from 'src/app/interfaces/city';
 import { Territory } from 'src/app/interfaces/territory';
@@ -23,7 +23,7 @@ interface ErrorsModel {
 })
 export class SignupComponent implements OnInit {
   showPass = false;
-  formGroup: FormGroup = {} as FormGroup;
+  formGroup: UntypedFormGroup = {} as UntypedFormGroup;
   loading = false;
   emailLoading = false;
   emailExists = false;
@@ -50,13 +50,13 @@ export class SignupComponent implements OnInit {
   ) { }
 
   ngOnInit(): void {
-    this.formGroup = new FormGroup({
-      name: new FormControl(null, [Validators.required, Validators.minLength(8)]),
-      password: new FormControl(null, [Validators.required]),
-      email: new FormControl(null, [Validators.required, Validators.maxLength(100), Validators.email]),
-      city: new FormControl(null, [Validators.required, Validators.minLength(8)]),
-      area: new FormControl(null, [Validators.required]),
-      state: new FormControl(null, []),
+    this.formGroup = new UntypedFormGroup({
+      name: new UntypedFormControl(null, [Validators.required, Validators.minLength(8)]),
+      password: new UntypedFormControl(null, [Validators.required]),
+      email: new UntypedFormControl(null, [Validators.required, Validators.maxLength(100), Validators.email]),
+      city: new UntypedFormControl(null, [Validators.required, Validators.minLength(8)]),
+      area: new UntypedFormControl(null, [Validators.required]),
+      state: new UntypedFormControl(null, []),
     });
 
     this.formGroup.controls.email.valueChanges.subscribe(value => {

src/app/modules/pages/suggestion/suggestion.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 import { SuggestionService } from 'src/app/services/suggestion/suggestion.service';
 import { FormSentComponent } from '../../components/form-sent/form-sent.component';
@@ -10,13 +10,13 @@ import { FormSentComponent } from '../../components/form-sent/form-sent.componen
   styleUrls: ['./suggestion.component.sass'],
 })
 export class SuggestionComponent implements OnInit {
-  suggestionForm = new FormGroup({
-    name: new FormControl(null, Validators.required),
-    email_address: new FormControl(null, [
+  suggestionForm = new UntypedFormGroup({
+    name: new UntypedFormControl(null, Validators.required),
+    email_address: new UntypedFormControl(null, [
       Validators.required,
       Validators.email,
     ]),
-    content: new FormControl(null, Validators.required),
+    content: new UntypedFormControl(null, Validators.required),
   });
 
   error: string | null = null;

tsconfig.json

@@ -16,7 +16,7 @@
     "experimentalDecorators": true,
     "moduleResolution": "node",
     "importHelpers": true,
-    "target": "es2015",
+    "target": "es2020",
     "module": "es2020",
     "lib": [
       "es2018",