Upgrade to Angular 16

Merge `angular-update-16` into `dev` branch
This commit is contained in:
Adam Saghy
2025-05-23 18:47:20 +02:00
parent c7c2f60182
commit 19a14e5b5b
882 changed files with 14895 additions and 14340 deletions
@@ -2,8 +2,8 @@
<mat-card>
<form [formGroup]="userForm" (ngSubmit)="submit()">
<mat-card-content>
<div #userFormRef fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
<mat-form-field fxFlex="48%">
<div #userFormRef class="layout-row-wrap layout-lt-md-column gap-2percent">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Username' | translate }}</mat-label>
<input matInput required formControlName="username" />
<mat-error *ngIf="userForm.controls.username.hasError('required')">
@@ -12,7 +12,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Email' | translate }}</mat-label>
<input matInput [required]="userForm.controls.sendPasswordToEmail.value" formControlName="email" />
<mat-error *ngIf="userForm.controls.email.hasError('email')">
@@ -25,7 +25,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.First Name' | translate }}</mat-label>
<input matInput required formControlName="firstname" />
<mat-error *ngIf="userForm.controls.firstname.hasError('pattern')">
@@ -38,7 +38,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Last Name' | translate }}</mat-label>
<input matInput required formControlName="lastname" />
<mat-error *ngIf="userForm.controls.lastname.hasError('pattern')">
@@ -51,19 +51,19 @@
</mat-error>
</mat-form-field>
<div fxFlex="48%" class="password-never-expires-wrapper">
<div class="password-never-expires-wrapper flex-48">
<mat-checkbox labelPosition="before" formControlName="passwordNeverExpires">
{{ 'labels.inputs.Password never expires' | translate }}
</mat-checkbox>
</div>
<div fxFlex="48%" class="send-password-to-email-wrapper">
<div class="send-password-to-email-wrapper flex-48">
<mat-checkbox labelPosition="before" formControlName="sendPasswordToEmail">
{{ 'labels.inputs.Send password to email address' | translate }}
</mat-checkbox>
</div>
<mat-form-field fxFlex="48%" *ngIf="!userForm.controls.sendPasswordToEmail.value">
<mat-form-field class="flex-48" *ngIf="!userForm.controls.sendPasswordToEmail.value">
<mat-label>{{ 'labels.inputs.Password' | translate }}</mat-label>
<input matInput required type="password" formControlName="password" />
<mat-error *ngIf="userForm.controls.password.hasError('required')">
@@ -92,7 +92,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%" *ngIf="!userForm.controls.sendPasswordToEmail.value">
<mat-form-field class="flex-48" *ngIf="!userForm.controls.sendPasswordToEmail.value">
<mat-label>{{ 'labels.inputs.Repeat Password' | translate }}</mat-label>
<input matInput required type="password" formControlName="repeatPassword" />
<mat-error *ngIf="userForm.controls.repeatPassword.hasError('required')">
@@ -102,8 +102,7 @@
</mat-form-field>
<p
fxFlex="98%"
class="reset-password-error"
class="flex-98 reset-password-error"
*ngIf="
userForm.errors?.passwordsDoNotMatch &&
!userForm.controls.password.hasError('required') &&
@@ -113,7 +112,7 @@
{{ 'labels.inputs.Passwords' | translate }} <strong>{{ 'labels.commons.do not match' | translate }}</strong>
</p>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Office' | translate }}</mat-label>
<mat-select required formControlName="officeId">
<mat-option *ngFor="let office of officesData" [value]="office.id">
@@ -126,7 +125,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Staff' | translate }}</mat-label>
<mat-select formControlName="staffId">
<mat-option *ngFor="let staff of staffData" [value]="staff.id">
@@ -135,7 +134,7 @@
</mat-select>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Roles' | translate }}</mat-label>
<mat-select required formControlName="roles" multiple>
<mat-option *ngFor="let role of rolesData" [value]="role.id">
@@ -150,7 +149,7 @@
</div>
</mat-card-content>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -170,7 +169,7 @@
'labels.inputs.Users' | translate
}}</a>
</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -2,8 +2,8 @@
<mat-card>
<form [formGroup]="editUserForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
<mat-form-field fxFlex="48%">
<div class="layout-row-wrap gap-2px responsive-column">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Username' | translate }}</mat-label>
<input matInput required formControlName="username" />
<mat-error *ngIf="editUserForm.controls.username.hasError('required')">
@@ -12,7 +12,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Email' | translate }}</mat-label>
<input matInput required formControlName="email" />
<mat-error *ngIf="editUserForm.controls.email.hasError('email')">
@@ -25,7 +25,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.First Name' | translate }}</mat-label>
<input matInput required formControlName="firstname" />
<mat-error *ngIf="editUserForm.controls.firstname.hasError('pattern')">
@@ -38,7 +38,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Last Name' | translate }}</mat-label>
<input matInput required formControlName="lastname" />
<mat-error *ngIf="editUserForm.controls.lastname.hasError('pattern')">
@@ -51,13 +51,13 @@
</mat-error>
</mat-form-field>
<div class="password-never-expires-wrapper" fxFlex="48%">
<div class="password-never-expires-wrapper flex-48">
<mat-checkbox labelPosition="before" formControlName="passwordNeverExpires">
{{ 'labels.inputs.Password never expires' | translate }}
</mat-checkbox>
</div>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Office' | translate }}</mat-label>
<mat-select required formControlName="officeId" (selectionChange)="officeChanged($event.value)">
<mat-option *ngFor="let office of officesData" [value]="office.id">
@@ -70,7 +70,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Staff' | translate }}</mat-label>
<mat-select formControlName="staffId">
<mat-option *ngFor="let staff of staffData" [value]="staff.id">
@@ -79,7 +79,7 @@
</mat-select>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Roles' | translate }}</mat-label>
<mat-select required formControlName="roles" multiple>
<mat-option *ngFor="let role of rolesData" [value]="role.id">
@@ -94,7 +94,7 @@
</div>
</mat-card-content>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
+2 -2
View File
@@ -1,6 +1,6 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, Resolve } from '@angular/router';
import { ActivatedRouteSnapshot } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
@@ -12,7 +12,7 @@ import { UsersService } from './users.service';
* User data resolver.
*/
@Injectable()
export class UserResolver implements Resolve<Object> {
export class UserResolver {
/**
* @param {UsersService} usersService Users service.
*/
+1 -2
View File
@@ -1,6 +1,5 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { Resolve } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
@@ -12,7 +11,7 @@ import { UsersService } from './users.service';
* Users template data resolver.
*/
@Injectable()
export class UsersTemplateResolver implements Resolve<Object> {
export class UsersTemplateResolver {
/**
* @param {UsersService} usersService Users service.
*/
+6 -6
View File
@@ -1,4 +1,4 @@
<div class="container m-b-20" fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px">
<div class="container m-b-20 layout-row align-end gap-20px">
<div #buttonCreateUser class="in-block">
<button mat-raised-button color="primary" [routerLink]="['create']">
<fa-icon icon="plus" class="m-r-10"></fa-icon>
@@ -8,8 +8,8 @@
</div>
<div class="container">
<div #filter fxLayout="row" fxLayoutGap="20px">
<mat-form-field fxFlex>
<div #filter class="layout-row gap-20px">
<mat-form-field class="flex-fill">
<mat-label>{{ 'labels.inputs.Filter' | translate }}</mat-label>
<input matInput (keyup)="applyFilter($event.target.value)" />
</mat-form-field>
@@ -48,7 +48,7 @@
<ng-template #templateButtonCreateUser let-popover="popover">
<h2>{{ 'labels.buttons.Create User' | translate }}</h2>
<p class="mw300">{{ 'labels.text.This option allows you to create new users in your organization' | translate }}.</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -67,7 +67,7 @@
<ng-template #templateFilter let-popover="popover">
<h4>{{ 'labels.heading.Search bar to filter users' | translate }}.</h4>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -90,7 +90,7 @@
<ng-template #templateUsersTable let-popover="popover">
<h4>{{ 'labels.heading.List of Users with their details' | translate }}.</h4>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
+1 -2
View File
@@ -1,6 +1,5 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { Resolve } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
@@ -12,7 +11,7 @@ import { UsersService } from './users.service';
* Users data resolver.
*/
@Injectable()
export class UsersResolver implements Resolve<Object> {
export class UsersResolver {
/**
* @param {UsersService} usersService Users service.
*/
@@ -1,4 +1,4 @@
<div class="container m-b-20" fxLayout="row" fxLayout.lt-md="column" fxLayoutAlign="end" fxLayoutGap="2%">
<div class="container m-b-20 layout-row layout-lt-md-column align-end gap-2percent">
<button mat-raised-button color="primary" [routerLink]="['edit']">
<fa-icon icon="edit" class="m-r-10"></fa-icon>
{{ 'labels.buttons.Edit' | translate }}
@@ -16,59 +16,59 @@
<div class="container">
<mat-card>
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="50%" class="mat-body-strong">
<div class="layout-row-wrap">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Login Name' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ userData.username }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.First Name' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ userData.firstname }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Last Name' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ userData.lastname }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="userData.email">
<div class="flex-50 mat-body-strong" *ngIf="userData.email">
{{ 'labels.inputs.Email' | translate }}
</div>
<div fxFlex="50%" *ngIf="userData.email">
<div class="flex-50" *ngIf="userData.email">
{{ userData.email }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Office' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ userData.officeName }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Roles' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
<span *ngFor="let role of userData.selectedRoles">
{{ role.name }}
</span>
</div>
</div>
<div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row layout-align-center gap-2percent column-on-mobile">
<button type="button" mat-raised-button color="primary" [routerLink]="['../']">
{{ 'labels.buttons.Back' | translate }}
</button>