feat: update to Angular 14 (#5973)

* fix: fix issues after updates to Angular 13 in rooms component and country orders component * feat: update to Angular 14 (#1) * fix(angular 13): fix issues after updates to Angular 13 in rooms component and country orders component (#5965) * feat: update to Angular 14 * feat: update angular eslint packages eslint * feat: update nebular to 10 version * feat: update style import, remove ~
akveo · Mar 7, 2023 · b1a9a68 · b1a9a68
1 parent 384b841
commit b1a9a68
Show file tree

Hide file tree

Showing 38 changed files with 2,931 additions and 3,045 deletions.
diff --git a/angular.json b/angular.json
@@ -173,7 +173,6 @@
       }
     }
   },
-  "defaultProject": "ngx-admin-demo",
   "schematics": {
     "@schematics/angular:component": {
       "prefix": "ngx",

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -30,21 +30,21 @@
     "postinstall": "ngcc --properties es2015 es5 browser module main --first-only --create-ivy-entry-points --tsconfig \"./src/tsconfig.app.json\""
   },
   "dependencies": {
-    "@angular/animations": "^13.3.12",
+    "@angular/animations": "^14.2.12",
     "@angular/cdk": "12.1.0",
-    "@angular/common": "^13.3.12",
-    "@angular/compiler": "^13.3.12",
-    "@angular/core": "^13.3.12",
-    "@angular/forms": "^13.3.12",
+    "@angular/common": "^14.2.12",
+    "@angular/compiler": "^14.2.12",
+    "@angular/core": "^14.2.12",
+    "@angular/forms": "^14.2.12",
     "@angular/google-maps": "^12.2.13",
-    "@angular/platform-browser": "^13.3.12",
-    "@angular/platform-browser-dynamic": "^13.3.12",
-    "@angular/router": "^13.3.12",
+    "@angular/platform-browser": "^14.2.12",
+    "@angular/platform-browser-dynamic": "^14.2.12",
+    "@angular/router": "^14.2.12",
     "@asymmetrik/ngx-leaflet": "3.0.1",
-    "@nebular/auth": "9.1.0-rc.8",
-    "@nebular/eva-icons": "9.1.0-rc.8",
-    "@nebular/security": "9.1.0-rc.8",
-    "@nebular/theme": "9.1.0-rc.8",
+    "@nebular/auth": "10.0.0",
+    "@nebular/eva-icons": "10.0.0",
+    "@nebular/security": "10.0.0",
+    "@nebular/theme": "10.0.0",
     "@swimlane/ngx-charts": "^14.0.0",
     "angular2-chartjs": "0.4.1",
     "bootstrap": "4.3.1",
@@ -77,27 +77,27 @@
     "zone.js": "~0.11.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^13.3.10",
-    "@angular-eslint/builder": "13.5.0",
-    "@angular-eslint/eslint-plugin": "13.5.0",
-    "@angular-eslint/eslint-plugin-template": "13.5.0",
-    "@angular-eslint/schematics": "13.5.0",
-    "@angular-eslint/template-parser": "13.5.0",
-    "@angular/cli": "^13.3.10",
-    "@angular/compiler-cli": "^13.3.12",
-    "@angular/language-service": "13.3.12",
+    "@angular-devkit/build-angular": "^14.2.10",
+    "@angular-eslint/builder": "14.4.0",
+    "@angular-eslint/eslint-plugin": "14.4.0",
+    "@angular-eslint/eslint-plugin-template": "14.4.0",
+    "@angular-eslint/schematics": "14.4.0",
+    "@angular-eslint/template-parser": "14.4.0",
+    "@angular/cli": "^14.2.10",
+    "@angular/compiler-cli": "^14.2.12",
+    "@angular/language-service": "14.2.12",
     "@compodoc/compodoc": "1.0.1",
     "@fortawesome/fontawesome-free": "^5.2.0",
     "@types/d3-color": "1.0.5",
     "@types/jasmine": "~3.3.0",
     "@types/jasminewd2": "2.0.3",
     "@types/leaflet": "1.2.3",
     "@types/node": "^12.12.70",
-    "@typescript-eslint/eslint-plugin": "5.27.1",
-    "@typescript-eslint/parser": "5.27.1",
+    "@typescript-eslint/eslint-plugin": "^5.36.2",
+    "@typescript-eslint/parser": "^5.36.2",
     "codelyzer": "^6.0.2",
     "conventional-changelog-cli": "1.3.4",
-    "eslint": "^8.17.0",
+    "eslint": "^8.23.0",
     "husky": "0.13.3",
     "jasmine-core": "~3.6.0",
     "jasmine-spec-reporter": "~5.0.0",

diff --git a/src/app/@theme/components/footer/footer.component.scss b/src/app/@theme/components/footer/footer.component.scss
@@ -1,6 +1,6 @@
 @import '../../styles/themes';
-@import '~@nebular/theme/styles/global/breakpoints';
-@import '~bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
 
 @include nb-install-component() {
   width: 100%;

diff --git a/src/app/@theme/components/header/header.component.scss b/src/app/@theme/components/header/header.component.scss
@@ -1,5 +1,5 @@
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 @import '../../styles/themes';
 
 @include nb-install-component() {

diff --git a/src/app/@theme/layouts/one-column/one-column.layout.scss b/src/app/@theme/layouts/one-column/one-column.layout.scss
@@ -1,6 +1,6 @@
 @import '../../styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   .menu-sidebar ::ng-deep .scrollable {

diff --git a/src/app/@theme/layouts/three-columns/three-columns.layout.scss b/src/app/@theme/layouts/three-columns/three-columns.layout.scss
@@ -1,6 +1,6 @@
 @import '../../styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   .menu-sidebar ::ng-deep .scrollable {

diff --git a/src/app/@theme/layouts/two-columns/two-columns.layout.scss b/src/app/@theme/layouts/two-columns/two-columns.layout.scss
@@ -1,6 +1,6 @@
 @import '../../styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   .menu-sidebar ::ng-deep .scrollable {

diff --git a/src/app/@theme/styles/styles.scss b/src/app/@theme/styles/styles.scss
@@ -4,13 +4,13 @@
 @import 'themes';
 
 // framework component themes (styles tied to theme variables)
-@import '~@nebular/theme/styles/globals';
-@import '~@nebular/auth/styles/globals';
+@import '@nebular/theme/styles/globals';
+@import '@nebular/auth/styles/globals';
 
-@import '~bootstrap/scss/functions';
-@import '~bootstrap/scss/variables';
-@import '~bootstrap/scss/mixins';
-@import '~bootstrap/scss/grid';
+@import 'bootstrap/scss/functions';
+@import 'bootstrap/scss/variables';
+@import 'bootstrap/scss/mixins';
+@import 'bootstrap/scss/grid';
 
 // loading progress bar theme
 @import './pace.theme';

diff --git a/src/app/@theme/styles/themes.scss b/src/app/@theme/styles/themes.scss
@@ -1,7 +1,7 @@
 // @nebular theming framework
-@import '~@nebular/theme/styles/theming';
+@import '@nebular/theme/styles/theming';
 // @nebular out of the box themes
-@import '~@nebular/theme/styles/themes';
+@import '@nebular/theme/styles/themes';
 
 $nb-themes: nb-register-theme((
   layout-padding-top: 2.25rem,

diff --git a/src/app/pages/dashboard/dashboard.component.scss b/src/app/pages/dashboard/dashboard.component.scss
@@ -1,6 +1,6 @@
 @import '../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   .solar-card nb-card-header {

diff --git a/src/app/pages/dashboard/electricity/electricity.component.scss b/src/app/pages/dashboard/electricity/electricity.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
 

diff --git a/src/app/pages/dashboard/rooms/player/player.component.scss b/src/app/pages/dashboard/rooms/player/player.component.scss
@@ -1,6 +1,6 @@
 @import '../../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   height: 100%;

diff --git a/src/app/pages/dashboard/rooms/rooms.component.scss b/src/app/pages/dashboard/rooms/rooms.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   ngx-room-selector {

diff --git a/src/app/pages/dashboard/security-cameras/security-cameras.component.scss b/src/app/pages/dashboard/security-cameras/security-cameras.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~@nebular/theme/styles/global/breakpoints';
-@import '~bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
 
 @include nb-install-component() {
 

diff --git a/src/app/pages/dashboard/solar/solar.component.scss b/src/app/pages/dashboard/solar/solar.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~@nebular/theme/styles/global/breakpoints';
-@import '~bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
 
 @include nb-install-component() {
 

diff --git a/src/app/pages/dashboard/temperature/temperature.component.scss b/src/app/pages/dashboard/temperature/temperature.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
 

diff --git a/src/app/pages/e-commerce/charts-panel/chart-panel-header/chart-panel-header.component.scss b/src/app/pages/e-commerce/charts-panel/chart-panel-header/chart-panel-header.component.scss
@@ -1,6 +1,6 @@
 @import '../../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   padding: 1.5rem 4.5rem;

diff --git a/src/app/pages/e-commerce/country-orders/chart/country-orders-chart.component.scss b/src/app/pages/e-commerce/country-orders/chart/country-orders-chart.component.scss
@@ -1,6 +1,6 @@
 @import '../../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   display: flex;

diff --git a/src/app/pages/e-commerce/country-orders/country-orders.component.scss b/src/app/pages/e-commerce/country-orders/country-orders.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
 

diff --git a/src/app/pages/e-commerce/country-orders/map/country-orders-map.component.scss b/src/app/pages/e-commerce/country-orders/map/country-orders-map.component.scss
@@ -1,6 +1,6 @@
 @import '../../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
 

diff --git a/src/app/pages/e-commerce/earning-card/back-side/earning-card-back.component.scss b/src/app/pages/e-commerce/earning-card/back-side/earning-card-back.component.scss
@@ -1,6 +1,6 @@
 @import '../../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   ngx-earning-pie-chart,

diff --git a/src/app/pages/e-commerce/earning-card/front-side/earning-card-front.component.scss b/src/app/pages/e-commerce/earning-card/front-side/earning-card-front.component.scss
@@ -1,5 +1,5 @@
 @import '../../../../@theme/styles/themes';
-@import '~@nebular/theme/styles/global/typography/typography';
+@import '@nebular/theme/styles/global/typography/typography';
 
 @include nb-install-component() {
   display: flex;

diff --git a/src/app/pages/e-commerce/legend-chart/legend-chart.component.scss b/src/app/pages/e-commerce/legend-chart/legend-chart.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   display: flex;

diff --git a/src/app/pages/e-commerce/slide-out/slide-out.component.scss b/src/app/pages/e-commerce/slide-out/slide-out.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   $slide-out-container-width: 40%;

diff --git a/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.scss b/src/app/pages/e-commerce/traffic-reveal-card/front-side/traffic-front-card.component.scss
@@ -1,5 +1,5 @@
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 @import '../../../../@theme/styles/themes';
 
 @include nb-install-component() {

diff --git a/src/app/pages/e-commerce/visitors-analytics/visitors-analytics.component.scss b/src/app/pages/e-commerce/visitors-analytics/visitors-analytics.component.scss
@@ -1,6 +1,6 @@
 @import '../../../@theme/styles/themes';
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @include nb-install-component() {
   position: relative;

diff --git a/src/app/pages/extra-components/calendar-kit/calendar-kit.component.ts b/src/app/pages/extra-components/calendar-kit/calendar-kit.component.ts
@@ -2,10 +2,9 @@ import { Component } from '@angular/core';
 import { CalendarKitMonthCellComponent } from './month-cell/month-cell.component';
 
 @Component({
-  selector: 'ngx-calendar-kit',
-  templateUrl: 'calendar-kit.component.html',
-  styleUrls: ['calendar-kit.component.scss'],
-  entryComponents: [CalendarKitMonthCellComponent],
+    selector: 'ngx-calendar-kit',
+    templateUrl: 'calendar-kit.component.html',
+    styleUrls: ['calendar-kit.component.scss'],
 })
 export class CalendarKitFullCalendarShowcaseComponent {
   month = new Date();

diff --git a/src/app/pages/extra-components/calendar/calendar.component.scss b/src/app/pages/extra-components/calendar/calendar.component.scss
@@ -1,5 +1,5 @@
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 @import '../../../@theme/styles/themes';
 
 @include nb-install-component() {

diff --git a/src/app/pages/extra-components/calendar/calendar.component.ts b/src/app/pages/extra-components/calendar/calendar.component.ts
@@ -3,10 +3,9 @@ import { NbCalendarRange, NbDateService } from '@nebular/theme';
 import { DayCellComponent } from './day-cell/day-cell.component';
 
 @Component({
-  selector: 'ngx-calendar',
-  templateUrl: 'calendar.component.html',
-  styleUrls: ['calendar.component.scss'],
-  entryComponents: [DayCellComponent],
+    selector: 'ngx-calendar',
+    templateUrl: 'calendar.component.html',
+    styleUrls: ['calendar.component.scss'],
 })
 export class CalendarComponent {
 

diff --git a/src/app/pages/extra-components/chat/chat.component.scss b/src/app/pages/extra-components/chat/chat.component.scss
@@ -1,5 +1,5 @@
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @import '../../../@theme/styles/themes';
 

diff --git a/src/app/pages/layout/stepper/stepper.component.ts b/src/app/pages/layout/stepper/stepper.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';
 
 @Component({
   selector: 'ngx-stepper',
@@ -8,11 +8,11 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 })
 export class StepperComponent implements OnInit {
 
-  firstForm: FormGroup;
-  secondForm: FormGroup;
-  thirdForm: FormGroup;
+  firstForm: UntypedFormGroup;
+  secondForm: UntypedFormGroup;
+  thirdForm: UntypedFormGroup;
 
-  constructor(private fb: FormBuilder) {
+  constructor(private fb: UntypedFormBuilder) {
   }
 
   ngOnInit() {

diff --git a/src/app/pages/modal-overlays/dialog/dialog.component.scss b/src/app/pages/modal-overlays/dialog/dialog.component.scss
@@ -1,5 +1,5 @@
-@import '~bootstrap/scss/mixins/breakpoints';
-@import '~@nebular/theme/styles/global/breakpoints';
+@import 'bootstrap/scss/mixins/breakpoints';
+@import '@nebular/theme/styles/global/breakpoints';
 
 @import '../../../@theme/styles/themes';