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,7 +2,7 @@
<mat-dialog-content>
<form [formGroup]="eventForm">
<div fxLayout="column">
<div class="layout-column">
<mat-form-field>
<mat-label>{{ 'labels.inputs.Select Grouping' | translate }}</mat-label>
<mat-select required formControlName="grouping">
@@ -2,8 +2,8 @@
<mat-card>
<form [formGroup]="hookForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="row wrap" fxLayout.lt-md="column" fxLayoutGap="4%">
<mat-form-field fxFlex="40%">
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-40">
<mat-label>{{ 'labels.inputs.Hook Template' | translate }}</mat-label>
<mat-select required formControlName="name">
<mat-option *ngFor="let hookTemplate of hooksTemplateData.templates" [value]="hookTemplate.name">
@@ -16,7 +16,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="40%">
<mat-form-field class="flex-40">
<mat-label>{{ 'labels.inputs.Display Name' | translate }}</mat-label>
<input matInput required formControlName="displayName" />
<mat-error *ngIf="hookForm.controls.displayName.hasError('required')">
@@ -26,14 +26,14 @@
</mat-form-field>
<div class="is-active-wrapper">
<mat-checkbox class="is-active" fxFlex="10%" labelPosition="before" formControlName="isActive">
<mat-checkbox class="is-active flex-10" labelPosition="before" formControlName="isActive">
{{ 'labels.inputs.Is Active' | translate }}?
</mat-checkbox>
</div>
</div>
<div fxLayout="row wrap" fxLayout.lt-md="column" fxLayoutGap="4%">
<mat-form-field fxFlex="40%" *ngIf="hookForm.controls.name.value === 'Web'">
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-40" *ngIf="hookForm.controls.name.value === 'Web'">
<mat-label>{{ 'labels.inputs.Content Type' | translate }}</mat-label>
<mat-select required formControlName="contentType">
<mat-option [value]="'json'">
@@ -49,7 +49,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="40%" *ngIf="hookForm.controls.name.value === 'SMS Bridge'">
<mat-form-field class="flex-fill flex-40" *ngIf="hookForm.controls.name.value === 'SMS Bridge'">
<mat-label>{{ 'labels.inputs.Phone Number' | translate }}</mat-label>
<input matInput type="tel" #input maxlength="10" required formControlName="phoneNumber" />
<mat-hint align="end">{{ input.value?.length || 0 }}/10</mat-hint>
@@ -59,7 +59,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="40%">
<mat-form-field class="flex-40">
<mat-label>{{ 'labels.inputs.Payload URL' | translate }}</mat-label>
<input matInput required formControlName="payloadUrl" />
<mat-error *ngIf="hookForm.controls.payloadUrl.hasError('required')">
@@ -70,12 +70,10 @@
</div>
<div
fxLayout="row wrap"
fxLayout.lt-md="column"
fxLayoutGap="4%"
class="layout-row-wrap responsive-column gap-4percent"
*ngIf="hookForm.controls.name.value === 'SMS Bridge'"
>
<mat-form-field fxFlex="30%">
<mat-form-field class="flex-30">
<mat-label>{{ 'labels.inputs.SMS Provider' | translate }}</mat-label>
<input matInput required formControlName="smsProvider" />
<mat-error *ngIf="hookForm.controls.smsProvider.hasError('required')">
@@ -84,7 +82,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="30%">
<mat-form-field class="flex-30">
<mat-label>{{ 'labels.inputs.SMS Provider Account ID' | translate }}</mat-label>
<input matInput required formControlName="smsProviderAccountId" />
<mat-error *ngIf="hookForm.controls.smsProviderAccountId.hasError('required')">
@@ -93,7 +91,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="30%">
<mat-form-field class="flex-30">
<mat-label>{{ 'labels.inputs.SMS Provider Token' | translate }}</mat-label>
<input matInput required formControlName="smsProviderToken" />
<mat-error *ngIf="hookForm.controls.smsProviderToken.hasError('required')">
@@ -109,19 +107,10 @@
<br />
<div fxLayout="row wrap" fxLayout.lt-md="column">
<p fxFlex="20%" class="mat-title">
{{ 'labels.inputs.Events' | translate }}<span style="color: red">*</span>
</p>
<div class="layout-row-wrap responsive-column">
<p class="mat-title flex-20">{{ 'labels.inputs.Events' | translate }}<span style="color: red">*</span></p>
<button
mat-raised-button
class="AddEventButton"
fxFlex="20%"
type="button"
color="primary"
(click)="addEvent()"
>
<button mat-raised-button class="AddEventButton flex-20" type="button" color="primary" (click)="addEvent()">
<fa-icon icon="plus" class="m-r-10"></fa-icon>
{{ 'labels.buttons.Add' | translate }} {{ 'labels.inputs.Events' | translate }}
</button>
@@ -142,8 +131,8 @@
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Actions' | translate }}</th>
<td mat-cell *matCellDef="let i = index" fxLayoutGap="15%">
<button type="button" fxFlex="8%" color="warn" mat-icon-button (click)="deleteEvent(i)">
<td mat-cell *matCellDef="let i = index" class="gap-15percent">
<button type="button" class="flex-8" color="warn" mat-icon-button (click)="deleteEvent(i)">
<fa-icon icon="trash" size="lg"></fa-icon>
</button>
</td>
@@ -154,7 +143,7 @@
</table>
</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,8 +2,8 @@
<mat-card>
<form [formGroup]="hookForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="row wrap" fxLayout.lt-md="column" fxLayoutGap="4%">
<mat-form-field fxFlex="40%">
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-40">
<mat-label>{{ 'labels.inputs.Hook Template' | translate }}</mat-label>
<mat-select required formControlName="name">
<mat-option *ngFor="let hookTemplate of hooksTemplateData.templates" [value]="hookTemplate.name">
@@ -16,7 +16,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="40%">
<mat-form-field class="flex-40">
<mat-label>{{ 'labels.inputs.Display Name' | translate }}</mat-label>
<input matInput required formControlName="displayName" />
<mat-error *ngIf="hookForm.controls.displayName.hasError('required')">
@@ -26,14 +26,14 @@
</mat-form-field>
<div class="is-active-wrapper">
<mat-checkbox class="is-active" fxFlex="10%" labelPosition="before" formControlName="isActive">
<mat-checkbox class="is-active flex-10" labelPosition="before" formControlName="isActive">
{{ 'labels.inputs.Is Active' | translate }}?
</mat-checkbox>
</div>
</div>
<div fxLayout="row wrap" fxLayout.lt-md="column" fxLayoutGap="4%">
<mat-form-field fxFlex="40%" *ngIf="hookForm.controls.name.value === 'Web'">
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-fill flex-40" *ngIf="hookForm.controls.name.value === 'Web'">
<mat-label>{{ 'labels.inputs.Content Type' | translate }}</mat-label>
<mat-select required formControlName="contentType">
<mat-option [value]="'json'">
@@ -49,7 +49,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="40%" *ngIf="hookForm.controls.name.value === 'SMS Bridge'">
<mat-form-field class="flex-fill flex-40" *ngIf="hookForm.controls.name.value === 'SMS Bridge'">
<mat-label>{{ 'labels.inputs.Phone Number' | translate }}</mat-label>
<input matInput type="tel" #input maxlength="10" required formControlName="phoneNumber" />
<mat-hint align="end">{{ input.value?.length || 0 }}/10</mat-hint>
@@ -59,7 +59,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="40%">
<mat-form-field class="flex-40">
<mat-label>{{ 'labels.inputs.Payload URL' | translate }}</mat-label>
<input matInput required formControlName="payloadUrl" />
<mat-error *ngIf="hookForm.controls.payloadUrl.hasError('required')">
@@ -70,12 +70,10 @@
</div>
<div
fxLayout="row wrap"
fxLayout.lt-md="column"
fxLayoutGap="4%"
class="layout-row-wrap responsive-column gap-4percent"
*ngIf="hookForm.controls.name.value === 'SMS Bridge'"
>
<mat-form-field fxFlex="30%">
<mat-form-field class="flex-30">
<mat-label>{{ 'labels.inputs.SMS Provider' | translate }}</mat-label>
<input matInput required formControlName="smsProvider" />
<mat-error *ngIf="hookForm.controls.smsProvider.hasError('required')">
@@ -84,7 +82,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="30%">
<mat-form-field class="flex-30">
<mat-label>{{ 'labels.inputs.SMS Provider Account ID' | translate }}</mat-label>
<input matInput required formControlName="smsProviderAccountId" />
<mat-error *ngIf="hookForm.controls.smsProviderAccountId.hasError('required')">
@@ -93,7 +91,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="30%">
<mat-form-field class="flex-30">
<mat-label>{{ 'labels.inputs.SMS Provider Token' | translate }}</mat-label>
<input matInput required formControlName="smsProviderToken" />
<mat-error *ngIf="hookForm.controls.smsProviderToken.hasError('required')">
@@ -109,19 +107,10 @@
<br />
<div fxLayout="row wrap" fxLayout.lt-md="column">
<p fxFlex="20%" class="mat-title">
{{ 'labels.inputs.Events' | translate }} <span style="color: red">*</span>
</p>
<div class="layout-row-wrap responsive-column">
<p class="mat-title flex-20">{{ 'labels.inputs.Events' | translate }} <span style="color: red">*</span></p>
<button
mat-raised-button
class="AddEventButton"
fxFlex="20%"
type="button"
color="primary"
(click)="addEvent()"
>
<button mat-raised-button class="AddEventButton flex-20" type="button" color="primary" (click)="addEvent()">
<fa-icon icon="plus" class="m-r-10"></fa-icon>
{{ 'labels.buttons.Add' | translate }} {{ 'labels.inputs.Events' | translate }}
</button>
@@ -158,7 +147,7 @@
</table>
</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>
@@ -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 { SystemService } from '../system.service';
* Hooks template data resolver.
*/
@Injectable()
export class HooksTemplateResolver implements Resolve<Object> {
export class HooksTemplateResolver {
/**
* @param {SystemService} systemService System service.
*/
@@ -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">
<button mat-raised-button color="primary" [routerLink]="['create']" *mifosxHasPermission="'CREATE_HOOK'">
<fa-icon icon="plus" class="m-r-10"></fa-icon>
{{ 'labels.buttons.Create Hook' | translate }}
@@ -6,8 +6,8 @@
</div>
<div class="container">
<div fxLayout="row" fxLayoutGap="20px">
<mat-form-field fxFlex>
<div 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>
@@ -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 { SystemService } from '../system.service';
* Manage hooks data resolver.
*/
@Injectable()
export class ManageHooksResolver implements Resolve<Object> {
export class ManageHooksResolver {
/**
* @param {SystemService} systemService System service.
*/
@@ -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 { SystemService } from '../../system.service';
* Hook data resolver.
*/
@Injectable()
export class HookResolver implements Resolve<Object> {
export class HookResolver {
/**
* @param {SystemService} systemService System service.
*/
@@ -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">
<button mat-raised-button color="primary" [routerLink]="['edit']" *mifosxHasPermission="'UPDATE_HOOK'">
<fa-icon icon="edit" class="m-r-10"></fa-icon>
{{ 'labels.buttons.Edit' | translate }}
@@ -13,34 +13,34 @@
<div class="container">
<mat-card>
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="50%" class="mat-body-strong">{{ 'labels.inputs.Hook Name' | translate }}:</div>
<div class="layout-row-wrap">
<div class="flex-50 mat-body-strong">{{ 'labels.inputs.Hook Name' | translate }}:</div>
<div fxFlex="50%">
<div class="flex-50">
{{ hookData.displayName }}
</div>
<div fxFlex="50%" class="mat-body-strong">{{ 'labels.inputs.Status' | translate }}:</div>
<div class="flex-50 mat-body-strong">{{ 'labels.inputs.Status' | translate }}:</div>
<div fxFlex="50%">
<div class="flex-50">
{{ hookData.isActive ? ('labels.inputs.Active' | translate) : ('labels.catalogs.Inactive' | translate) }}
</div>
<div fxFlex="50%" class="mat-body-strong">{{ 'labels.inputs.Activation Date' | translate }}:</div>
<div class="flex-50 mat-body-strong">{{ 'labels.inputs.Activation Date' | translate }}:</div>
<div fxFlex="50%">
<div class="flex-50">
{{ hookData.createdAt | dateFormat }}
</div>
<div fxFlex="50%" class="mat-body-strong">{{ 'labels.inputs.Updated on' | translate }}:</div>
<div class="flex-50 mat-body-strong">{{ 'labels.inputs.Updated on' | translate }}:</div>
<div fxFlex="50%">
<div class="flex-50">
{{ hookData.updatedAt | dateFormat }}
</div>
<div fxFlex="50%" class="mat-body-strong">{{ 'labels.inputs.Events' | translate }}:</div>
<div class="flex-50 mat-body-strong">{{ 'labels.inputs.Events' | translate }}:</div>
<div fxFlex="50%">
<div class="flex-50">
<mat-label *ngFor="let event of hookData.events">
{{ event.actionName + ' - ' + event.entityName }}
@@ -48,53 +48,53 @@
</mat-label>
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="hookData.name === 'Web'">
<div class="flex-50 mat-body-strong" *ngIf="hookData.name === 'Web'">
{{ 'labels.inputs.Content Type' | translate }}:
</div>
<div fxFlex="50%" *ngIf="hookData.name === 'Web'">
<div class="flex-50" *ngIf="hookData.name === 'Web'">
{{ hookData.config[0].fieldValue }}
</div>
<div fxFlex="50%" class="mat-body-strong">{{ 'labels.inputs.Payload URL' | translate }}:</div>
<div class="flex-50 mat-body-strong">{{ 'labels.inputs.Payload URL' | translate }}:</div>
<div fxFlex="50%" *ngIf="hookData.name === 'Web'">
<div class="flex-50" *ngIf="hookData.name === 'Web'">
{{ hookData.config[1].fieldValue }}
</div>
<div fxFlex="50%" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50" *ngIf="hookData.name === 'SMS Bridge'">
{{ hookData.config[0].fieldValue }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50 mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
{{ 'labels.inputs.Phone Number' | translate }}:
</div>
<div fxFlex="50%" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50" *ngIf="hookData.name === 'SMS Bridge'">
{{ hookData.config[1].fieldValue }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50 mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
{{ 'labels.inputs.SMS Provider' | translate }}:
</div>
<div fxFlex="50%" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50" *ngIf="hookData.name === 'SMS Bridge'">
{{ hookData.config[2].fieldValue }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50 mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
{{ 'labels.inputs.SMS Provider Account ID' | translate }}:
</div>
<div fxFlex="50%" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50" *ngIf="hookData.name === 'SMS Bridge'">
{{ hookData.config[3].fieldValue }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50 mat-body-strong" *ngIf="hookData.name === 'SMS Bridge'">
{{ 'labels.inputs.SMS Provider Token' | translate }}:
</div>
<div fxFlex="50%" *ngIf="hookData.name === 'SMS Bridge'">
<div class="flex-50" *ngIf="hookData.name === 'SMS Bridge'">
{{ hookData.config[4].fieldValue }}
</div>
</div>