frontend: upgrade Angular dependencies to version 20.x

This commit is contained in:
Carlos Santos 2025-10-03 14:17:33 +02:00
parent e8a76d52d3
commit c43af5c469
15 changed files with 2754 additions and 2454 deletions

View File

@ -185,5 +185,31 @@
}
}
}
}
},
"schematics": {
"@schematics/angular:component": {
"type": "component"
},
"@schematics/angular:directive": {
"type": "directive"
},
"@schematics/angular:service": {
"type": "service"
},
"@schematics/angular:guard": {
"typeSeparator": "."
},
"@schematics/angular:interceptor": {
"typeSeparator": "."
},
"@schematics/angular:module": {
"typeSeparator": "."
},
"@schematics/angular:pipe": {
"typeSeparator": "."
},
"@schematics/angular:resolver": {
"typeSeparator": "."
}
}
}

File diff suppressed because it is too large Load Diff

View File

@ -23,46 +23,46 @@
"format:code": "prettier --ignore-path ../gitignore . --write"
},
"dependencies": {
"@angular/animations": "19.2.15",
"@angular/cdk": "19.2.19",
"@angular/common": "19.2.15",
"@angular/compiler": "19.2.15",
"@angular/core": "19.2.15",
"@angular/forms": "19.2.15",
"@angular/material": "19.2.19",
"@angular/platform-browser": "19.2.15",
"@angular/platform-browser-dynamic": "19.2.15",
"@angular/router": "19.2.15",
"core-js": "3.38.1",
"@angular/animations": "20.3.3",
"@angular/cdk": "20.2.7",
"@angular/common": "20.3.3",
"@angular/compiler": "20.3.3",
"@angular/core": "20.3.3",
"@angular/forms": "20.3.3",
"@angular/material": "20.2.7",
"@angular/platform-browser": "20.3.3",
"@angular/platform-browser-dynamic": "20.3.3",
"@angular/router": "20.3.3",
"core-js": "3.45.1",
"jwt-decode": "4.0.0",
"openvidu-components-angular": "3.4.0",
"rxjs": "7.8.1",
"tslib": "2.3.0",
"openvidu-components-angular": "file:openvidu-components-angular-3.4.0.tgz",
"rxjs": "7.8.2",
"tslib": "2.8.1",
"unique-names-generator": "4.7.1",
"zone.js": "0.15.1"
},
"devDependencies": {
"@angular-builders/custom-webpack": "19.0.1",
"@angular-devkit/build-angular": "19.2.17",
"@angular-eslint/builder": "19.8.1",
"@angular-eslint/eslint-plugin": "19.8.1",
"@angular-eslint/eslint-plugin-template": "19.8.1",
"@angular-eslint/schematics": "19.8.1",
"@angular-eslint/template-parser": "19.8.1",
"@angular/cli": "19.2.17",
"@angular/compiler-cli": "19.2.15",
"@types/chai": "4.3.19",
"@angular-builders/custom-webpack": "20.0.0",
"@angular-devkit/build-angular": "20.3.4",
"@angular-eslint/builder": "20.3.0",
"@angular-eslint/eslint-plugin": "20.3.0",
"@angular-eslint/eslint-plugin-template": "20.3.0",
"@angular-eslint/schematics": "20.3.0",
"@angular-eslint/template-parser": "20.3.0",
"@angular/cli": "20.3.4",
"@angular/compiler-cli": "20.3.3",
"@types/chai": "4.3.20",
"@types/fluent-ffmpeg": "2.1.27",
"@types/jasmine": "5.1.7",
"@types/jasmine": "5.1.9",
"@types/mocha": "9.1.1",
"@types/node": "20.19.19",
"@types/node": "22.18.8",
"@types/pixelmatch": "5.2.6",
"@types/pngjs": "6.0.5",
"@types/selenium-webdriver": "4.1.26",
"@types/selenium-webdriver": "4.35.1",
"@typescript-eslint/eslint-plugin": "7.18.0",
"@typescript-eslint/parser": "7.18.0",
"chai": "4.3.10",
"chromedriver": "132.0.0",
"chai": "4.5.0",
"chromedriver": "141.0.0",
"cross-env": "7.0.3",
"eslint": "8.57.1",
"eslint-config-prettier": "9.1.0",
@ -75,7 +75,7 @@
"karma-jasmine": "5.1.0",
"karma-jasmine-html-reporter": "2.1.0",
"mocha": "10.7.3",
"ng-packagr": "19.2.2",
"ng-packagr": "20.3.0",
"prettier": "3.3.3",
"selenium-webdriver": "4.25.0",
"ts-node": "10.9.2",

View File

@ -11,7 +11,7 @@ export const httpInterceptor: HttpInterceptorFn = (req: HttpRequest<unknown>, ne
const participantTokenService = inject(ParticipantService);
const recordingService = inject(RecordingService);
const pageUrl = router.getCurrentNavigation()?.finalUrl?.toString() || router.url;
const pageUrl = router.currentNavigation()?.finalUrl?.toString() || router.url;
const requestUrl = req.url;
req = req.clone({

View File

@ -1,4 +1,4 @@
import { CommonModule } from '@angular/common';
import { Component, OnInit } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
@ -18,7 +18,7 @@ interface OverviewStats {
@Component({
selector: 'ov-overview',
imports: [CommonModule, MatCardModule, MatButtonModule, MatIconModule, MatGridListModule],
imports: [MatCardModule, MatButtonModule, MatIconModule, MatGridListModule],
templateUrl: './overview.component.html',
styleUrl: './overview.component.scss'
})

View File

@ -28,14 +28,17 @@
.step-content {
@include design-tokens.ov-section-card;
width: 100%;
max-width: 600px;
min-height: 450px;
max-height: 450px;
overflow-y: auto;
display: flex;
flex-direction: column;
justify-content: flex-start;
& {
width: 100%;
max-width: 600px;
min-height: 450px;
max-height: 450px;
flex-direction: column;
justify-content: flex-start;
display: flex;
overflow-y: auto;
}
}
.step-content > :first-child {
@ -100,11 +103,11 @@
// Slide toggle customization
.ov-slide-toggle-success {
.mat-mdc-slide-toggle {
--mdc-switch-selected-track-color: var(--ov-meet-color-success);
--mdc-switch-selected-handle-color: var(--ov-meet-color-success);
--mdc-switch-selected-hover-handle-color: var(--ov-meet-color-success);
--mdc-switch-selected-focus-handle-color: var(--ov-meet-color-success);
--mdc-switch-selected-pressed-handle-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-track-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-handle-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-hover-handle-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-focus-handle-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-pressed-handle-color: var(--ov-meet-color-success);
}
}

View File

@ -1,4 +1,4 @@
import { CommonModule } from '@angular/common';
import { Component, computed, OnInit, Signal, signal } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
@ -19,20 +19,19 @@ import { RoomWizardRoomDetailsComponent } from './steps/room-details/room-detail
@Component({
selector: 'ov-room-wizard',
imports: [
CommonModule,
StepIndicatorComponent,
WizardNavComponent,
MatButtonModule,
MatIconModule,
MatProgressSpinnerModule,
MatSlideToggleModule,
RoomBasicCreationComponent,
RoomWizardRoomDetailsComponent,
RecordingConfigComponent,
RecordingTriggerComponent,
RecordingLayoutComponent,
RoomConfigComponent
],
StepIndicatorComponent,
WizardNavComponent,
MatButtonModule,
MatIconModule,
MatProgressSpinnerModule,
MatSlideToggleModule,
RoomBasicCreationComponent,
RoomWizardRoomDetailsComponent,
RecordingConfigComponent,
RecordingTriggerComponent,
RecordingLayoutComponent,
RoomConfigComponent
],
templateUrl: './room-wizard.component.html',
styleUrl: './room-wizard.component.scss'
})

View File

@ -1,4 +1,4 @@
import { CommonModule } from '@angular/common';
import { Component, OnDestroy } from '@angular/core';
import { FormGroup, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
@ -20,16 +20,15 @@ interface RecordingAccessOption {
@Component({
selector: 'ov-recording-config',
imports: [
CommonModule,
ReactiveFormsModule,
MatButtonModule,
MatIconModule,
MatCardModule,
MatRadioModule,
MatSelectModule,
MatFormFieldModule,
SelectableCardComponent
],
ReactiveFormsModule,
MatButtonModule,
MatIconModule,
MatCardModule,
MatRadioModule,
MatSelectModule,
MatFormFieldModule,
SelectableCardComponent
],
templateUrl: './recording-config.component.html',
styleUrl: './recording-config.component.scss'
})

View File

@ -1,4 +1,4 @@
import { CommonModule } from '@angular/common';
import { Component, OnDestroy } from '@angular/core';
import { FormGroup, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
@ -12,14 +12,13 @@ import { Subject, takeUntil } from 'rxjs';
@Component({
selector: 'ov-recording-layout',
imports: [
CommonModule,
ReactiveFormsModule,
MatButtonModule,
MatIconModule,
MatCardModule,
MatRadioModule,
SelectableCardComponent
],
ReactiveFormsModule,
MatButtonModule,
MatIconModule,
MatCardModule,
MatRadioModule,
SelectableCardComponent
],
templateUrl: './recording-layout.component.html',
styleUrl: './recording-layout.component.scss'
})

View File

@ -1,4 +1,4 @@
import { CommonModule } from '@angular/common';
import { Component, OnDestroy } from '@angular/core';
import { FormGroup, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
@ -12,14 +12,13 @@ import { Subject, takeUntil } from 'rxjs';
@Component({
selector: 'ov-recording-trigger',
imports: [
CommonModule,
ReactiveFormsModule,
MatButtonModule,
MatIconModule,
MatCardModule,
MatRadioModule,
SelectableCardComponent
],
ReactiveFormsModule,
MatButtonModule,
MatIconModule,
MatCardModule,
MatRadioModule,
SelectableCardComponent
],
templateUrl: './recording-trigger.component.html',
styleUrl: './recording-trigger.component.scss'
})

View File

@ -92,7 +92,6 @@
margin-top: var(--ov-meet-spacing-md);
.primary-button {
@include design-tokens.ov-button-base;
width: 100%;
padding: var(--ov-meet-spacing-md);
font-size: var(--ov-meet-font-size-md);

View File

@ -1,4 +1,4 @@
import { CommonModule } from '@angular/common';
import { Component, OnInit } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
@ -9,7 +9,7 @@ import { LeftEventReason } from '@lib/typings/ce';
@Component({
selector: 'ov-end-meeting',
imports: [CommonModule, MatCardModule, MatButtonModule, MatIconModule],
imports: [MatCardModule, MatButtonModule, MatIconModule],
templateUrl: './end-meeting.component.html',
styleUrl: './end-meeting.component.scss'
})

View File

@ -1,5 +1,5 @@
import { DOCUMENT } from '@angular/common';
import { computed, Inject, Injectable, signal } from '@angular/core';
import { computed, Inject, Injectable, signal, DOCUMENT } from '@angular/core';
import { OpenViduThemeMode, OpenViduThemeService } from 'openvidu-components-angular';
export type Theme = 'light' | 'dark';

View File

@ -25,7 +25,7 @@
.primary-button {
@include components.ov-button-base;
background-color: var(--ov-meet-color-secondary);
background-color: var(--ov-meet-color-secondary) !important;
color: var(--ov-meet-text-on-secondary) !important;
&.mat-mdc-button-disabled {
@ -158,17 +158,17 @@
}
// Selected state styling with success color
--mdc-switch-selected-handle-color: var(--ov-meet-surface-color);
--mdc-switch-selected-pressed-handle-color: var(--ov-meet-surface-color);
--mdc-switch-selected-hover-handle-color: var(--ov-meet-surface-color);
--mdc-switch-selected-focus-handle-color: var(--ov-meet-surface-color);
--mdc-switch-selected-track-color: var(--ov-meet-color-success);
--mdc-switch-selected-pressed-track-color: var(--ov-meet-color-success);
--mdc-switch-selected-hover-track-color: var(--ov-meet-color-success);
--mdc-switch-selected-focus-track-color: var(--ov-meet-color-success);
--mdc-switch-selected-pressed-state-layer-color: var(--ov-meet-color-success);
--mdc-switch-selected-hover-state-layer-color: var(--ov-meet-surface-color);
--mdc-switch-selected-focus-state-layer-color: var(--ov-meet-surface-color);
--mat-slide-toggle-selected-handle-color: var(--ov-meet-surface-color);
--mat-slide-toggle-selected-pressed-handle-color: var(--ov-meet-surface-color);
--mat-slide-toggle-selected-hover-handle-color: var(--ov-meet-surface-color);
--mat-slide-toggle-selected-focus-handle-color: var(--ov-meet-surface-color);
--mat-slide-toggle-selected-track-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-pressed-track-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-hover-track-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-focus-track-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-pressed-state-layer-color: var(--ov-meet-color-success);
--mat-slide-toggle-selected-hover-state-layer-color: var(--ov-meet-surface-color);
--mat-slide-toggle-selected-focus-state-layer-color: var(--ov-meet-surface-color);
}
// Material Navigation List - Clean borders

View File

@ -1,39 +1,50 @@
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"resolveJsonModule": true,
"typeRoots": ["node_modules/@types"],
"outDir": "./dist/out-tsc",
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"skipLibCheck": true,
"isolatedModules": true,
"esModuleInterop": true,
"sourceMap": true,
"declaration": false,
"experimentalDecorators": true,
"paths": {
"core-js/es7/reflect": ["./node_modules/core-js/proposals/reflect-metadata"],
"@environment/*": ["src/environments/*"],
"@app/*": ["src/app/*"],
"@lib/*": ["projects/shared-meet-components/src/lib/*"],
"@typings-ce": ["projects/shared-meet-components/src/lib/typings/ce/index.ts"],
// "@services/*": ["src/app/services/*"],
// "@models/*": ["src/app/models/*"],
// "@guards/*": ["src/app/guards/*"],
// "@pages/*": ["src/app/pages/*"],
},
"importHelpers": true,
"target": "ES2022",
"module": "ES2022",
"lib": ["ES2022", "dom"]
},
"baseUrl": "./",
"moduleResolution": "bundler",
"emitDecoratorMetadata": false,
"resolveJsonModule": true,
"typeRoots": [
"node_modules/@types"
],
"outDir": "./dist/out-tsc",
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"skipLibCheck": true,
"isolatedModules": true,
"esModuleInterop": true,
"sourceMap": true,
"declaration": false,
"experimentalDecorators": true,
"paths": {
"core-js/es7/reflect": [
"./node_modules/core-js/proposals/reflect-metadata"
],
"@environment/*": [
"src/environments/*"
],
"@app/*": [
"src/app/*"
],
"@lib/*": [
"projects/shared-meet-components/src/lib/*"
],
"@typings-ce": [
"projects/shared-meet-components/src/lib/typings/ce/index.ts"
]
},
"importHelpers": true,
"target": "ES2022",
"module": "ES2022",
"lib": [
"ES2022",
"dom"
]
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,