Merge pull request #361 from peter-szrnka/360-gms-181-replace-all-mes…

…sages-with-the-new-component GMS-181 replace all messages with the new component
peter-szrnka · Dec 13, 2024 · e9316d4 · e9316d4
2 parents 188ccb4 + 1aee5e4
commit e9316d4
Show file tree

Hide file tree

Showing 33 changed files with 87 additions and 98 deletions.
diff --git a/code/gms-frontend/src/app/app.module.ts b/code/gms-frontend/src/app/app.module.ts
@@ -9,7 +9,6 @@ import { AppComponent } from './app.component';
 // Material Modules
 import { MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material/snack-bar';
 import { AngularMaterialModule } from './angular-material-module';
-import { GmsComponentsModule } from './common/components/gms-components-module';
 import { AuthInterceptor } from './common/interceptor/auth-interceptor';
 import { MockInterceptor } from './common/interceptor/mock-interceptor';
 import { ServiceModule } from './common/service/service-module';
@@ -51,7 +50,6 @@ export const ENV_CONFIG = new InjectionToken('gmsEnvConfig');
             // or after 30 seconds (whichever comes first).
             registrationStrategy: 'registerWhenStable:30000'
         }),
-        GmsComponentsModule,
         // Main application modules
         NavMenuModule,
         HomeModule,

diff --git a/code/gms-frontend/src/app/common/components/gms-components-module.ts b/code/gms-frontend/src/app/common/components/gms-components-module.ts
@@ -9,17 +9,16 @@ import { InfoDialog } from "./info-dialog/info-dialog.component";
 import { MomentPipe } from "./pipes/date-formatter.pipe";
 import { NavButtonVisibilityPipe } from "./pipes/nav-button-visibility.pipe";
 import { TranslatorModule } from "./pipes/translator/translator.module";
-import { InformationMessageComponent } from "./information-message/information-message.component";
 
 /**
  * @author Peter Szrnka
  */
 @NgModule({
     declarations: [
-        ConfirmDeleteDialog, InfoDialog, InformationMessageComponent
+        ConfirmDeleteDialog, InfoDialog
     ],
     exports: [
-        ConfirmDeleteDialog, InfoDialog, InformationMessageComponent
+        ConfirmDeleteDialog, InfoDialog
     ],
     schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
     imports: [

diff --git a/...ntend/src/app/common/components/information-message/information-message.component.spec.ts b/...ntend/src/app/common/components/information-message/information-message.component.spec.ts
@@ -15,8 +15,7 @@ describe('InformationMessageComponent', () => {
 
     beforeEach(() => {
         TestBed.configureTestingModule({
-            imports : [MatDialogModule, TranslatorModule ],
-            declarations : [InformationMessageComponent],
+            imports : [MatDialogModule, TranslatorModule, InformationMessageComponent ],
             schemas : [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
             providers: [
             ]

diff --git a/...s-frontend/src/app/common/components/information-message/information-message.component.ts b/...s-frontend/src/app/common/components/information-message/information-message.component.ts
@@ -1,4 +1,6 @@
+import { NgClass } from "@angular/common";
 import { Component, Input, OnInit } from "@angular/core";
+import { MatIconModule } from "@angular/material/icon";
 
 const SETTINGS_MAP: any = {
   'success': { icon: 'check_circle', iconColor: 'green', styleClass: 'success' },
@@ -10,7 +12,8 @@ const SETTINGS_MAP: any = {
  * @author Peter Szrnka
  */
 @Component({
-
+  standalone: true,
+  imports: [MatIconModule, NgClass],
   selector: 'information-message',
   templateUrl: './information-message.component.html',
   styleUrls: ['./information-message.component.scss']

diff --git a/code/gms-frontend/src/app/components/announcement/announcement-detail.component.html b/code/gms-frontend/src/app/components/announcement/announcement-detail.component.html
@@ -3,7 +3,7 @@
   <nav-back [buttonConfig]="[{url:'/announcement/list', label:'navback.back2List', primary : true}]"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <form #form="ngForm">

diff --git a/code/gms-frontend/src/app/components/announcement/announcement-list.component.html b/code/gms-frontend/src/app/components/announcement/announcement-list.component.html
@@ -4,7 +4,7 @@ <h2>{{ 'announcements.title' | translate }}</h2>
   <nav-back [buttonConfig]="[{url:'/announcement/new', label:'navback.create', primary : true}]"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/announcement/announcement-module.ts b/code/gms-frontend/src/app/components/announcement/announcement-module.ts
@@ -4,15 +4,16 @@ import { FormsModule } from "@angular/forms";
 import { BrowserModule } from "@angular/platform-browser";
 import { AngularMaterialModule } from "../../angular-material-module";
 import { AppRoutingModule } from "../../app-routing.module";
+import { InformationMessageComponent } from "../../common/components/information-message/information-message.component";
 import { NavBackComponent } from "../../common/components/nav-back/nav-back.component";
 import { MomentPipe } from "../../common/components/pipes/date-formatter.pipe";
 import { NavButtonVisibilityPipe } from "../../common/components/pipes/nav-button-visibility.pipe";
+import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
 import { AnnouncementDetailComponent } from "./announcement-detail.component";
 import { AnnouncementListComponent } from "./announcement-list.component";
 import { AnnouncementDetailResolver } from "./resolver/announcement-detail.resolver";
 import { AnnouncementListResolver } from "./resolver/announcement-list.resolver";
 import { AnnouncementService } from "./service/announcement-service";
-import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
 
 /**
  * @author Peter Szrnka
@@ -21,15 +22,16 @@ import { TranslatorModule } from "../../common/components/pipes/translator/trans
         AnnouncementListComponent, AnnouncementDetailComponent
     ],
     schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
-        AngularMaterialModule,
-        FormsModule,
-        BrowserModule,
-        AppRoutingModule,
-        MomentPipe,
-        NavBackComponent,
-        NavButtonVisibilityPipe,
-        TranslatorModule
-    ], providers: [
+    AngularMaterialModule,
+    FormsModule,
+    BrowserModule,
+    AppRoutingModule,
+    MomentPipe,
+    NavBackComponent,
+    NavButtonVisibilityPipe,
+    InformationMessageComponent,
+    TranslatorModule
+], providers: [
         AnnouncementService, AnnouncementListResolver, AnnouncementDetailResolver,
         provideHttpClient(withInterceptorsFromDi())
     ] })

diff --git a/code/gms-frontend/src/app/components/api_testing/api-testing.component.html b/code/gms-frontend/src/app/components/api_testing/api-testing.component.html
@@ -6,7 +6,7 @@ <h2>{{ 'apitesting.title' | translate }}</h2>
   <form #form="ngForm" novalidate class="form-control">
     <mat-card class="margin-top">
       <mat-card-content>
-        <div class="information">{{ 'apitesting.description' | translate }}</div>
+        <information-message severity="information">{{ 'apitesting.description' | translate }}</information-message>
 
         <p>
           <mat-form-field appearance="fill" class="full-width">

diff --git a/code/gms-frontend/src/app/components/apikey/apikey-detail.component.html b/code/gms-frontend/src/app/components/apikey/apikey-detail.component.html
@@ -2,7 +2,7 @@
   <nav-back [buttonConfig]="buttonConfig"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <form #form="ngForm" class="form-control">

diff --git a/code/gms-frontend/src/app/components/apikey/apikey-list.component.html b/code/gms-frontend/src/app/components/apikey/apikey-list.component.html
@@ -4,7 +4,7 @@ <h2>{{ 'sidemenu.apiKeys' | translate }}</h2>
   <nav-back [buttonConfig]="[{url:'/apikey/new', label:'navback.create', primary : true}]"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/event/event-list.component.html b/code/gms-frontend/src/app/components/event/event-list.component.html
@@ -4,7 +4,7 @@ <h2>{{ 'event.title' | translate }}</h2>
   <nav-back></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/help/help.component.html b/code/gms-frontend/src/app/components/help/help.component.html
@@ -1,7 +1,7 @@
 <mat-card class="help-card">
     <mat-card-title>{{ 'help.errorCodes.title' | translate }}</mat-card-title>
     <mat-card-content>
-        <div class="information">{{ 'help.errorCodes' | translate }}</div>
+        <information-message severity="information">{{ 'help.errorCodes' | translate }}</information-message>
 
         <table mat-table [dataSource]="datasource" (load)="true">
             <tr mat-header-row *matHeaderRowDef="columns"></tr>

diff --git a/code/gms-frontend/src/app/components/help/help.compontent.ts b/code/gms-frontend/src/app/components/help/help.compontent.ts
@@ -2,15 +2,16 @@ import { ArrayDataSource } from "@angular/cdk/collections";
 import { Component, OnInit } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 import { AngularMaterialModule } from "../../angular-material-module";
-import { ErrorCode } from "./model/error-code.model";
+import { InformationMessageComponent } from "../../common/components/information-message/information-message.component";
 import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
+import { ErrorCode } from "./model/error-code.model";
 
 /**
  * @author Peter Szrnka
  */
 @Component({
     standalone: true,
-    imports: [ AngularMaterialModule, TranslatorModule ],
+    imports: [ AngularMaterialModule, TranslatorModule, InformationMessageComponent ],
     selector: 'help',
     templateUrl: './help.component.html',
     styleUrls: ['./help.component.scss']

diff --git a/code/gms-frontend/src/app/components/home/home-module.ts b/code/gms-frontend/src/app/components/home/home-module.ts
@@ -4,10 +4,11 @@ import { BrowserModule } from "@angular/platform-browser";
 import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
 import { AngularMaterialModule } from "../../angular-material-module";
 import { AppRoutingModule } from "../../app-routing.module";
+import { InformationMessageComponent } from "../../common/components/information-message/information-message.component";
 import { MomentPipe } from "../../common/components/pipes/date-formatter.pipe";
+import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
 import { HomeComponent } from "./home.component";
 import { HomeService } from "./service/home.service";
-import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
 
 /**
  * @author Peter Szrnka
@@ -20,6 +21,7 @@ import { TranslatorModule } from "../../common/components/pipes/translator/trans
         BrowserAnimationsModule,
         AppRoutingModule,
         MomentPipe,
+        InformationMessageComponent,
         TranslatorModule
     ], providers: [HomeService, provideHttpClient(withInterceptorsFromDi())] })
   export class HomeModule { }
diff --git a/code/gms-frontend/src/app/components/home/home.component.html b/code/gms-frontend/src/app/components/home/home.component.html
@@ -1,5 +1,5 @@
 @if (pageStatus === 2) {
-  <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+  <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
 }
 
 @if (pageStatus === 0) {
@@ -38,7 +38,7 @@
             @if (data.announcements.resultList.length === 0) {
               <mat-card class="gms-card-right">
                 <mat-card-content>
-                  <div class="information">{{ 'home.noAnnouncements' | translate }}</div>
+                  <information-message severity="information">{{ 'home.noAnnouncements' | translate }}</information-message>
                 </mat-card-content>
               </mat-card>
             }
@@ -70,9 +70,7 @@
               <mat-card-title>{{ 'home.users' | translate }}</mat-card-title>
               <mat-card-subtitle>{{ 'home.users.subtitle' | translate }}</mat-card-subtitle>
               @if (data.userCount === 0) {
-                <div class="warning">
-                  <b>{{ 'label.warning' | translate }}:</b> {{ 'home.noUsersRegistered' | translate }}
-                </div>
+                <information-message severity="warning"><b>{{ 'label.warning' | translate }}:</b> {{ 'home.noUsersRegistered' | translate }}</information-message>
               }
               @if (data.userCount > 0) {
                 <p>

diff --git a/code/gms-frontend/src/app/components/ip_restriction/ip-restriction-detail.component.html b/code/gms-frontend/src/app/components/ip_restriction/ip-restriction-detail.component.html
@@ -2,7 +2,7 @@
   <nav-back [buttonConfig]="buttonConfig"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <form #form="ngForm" class="form-control">

diff --git a/code/gms-frontend/src/app/components/ip_restriction/ip-restriction-list.component.html b/code/gms-frontend/src/app/components/ip_restriction/ip-restriction-list.component.html
@@ -4,7 +4,7 @@ <h2>{{ 'sidemenu.ipRestrictions' | translate }}</h2>
   <nav-back [buttonConfig]="[{url:'/ip_restriction/new', label:'navback.create', primary : true}]"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/job/job-detail-list.component.html b/code/gms-frontend/src/app/components/job/job-detail-list.component.html
@@ -5,7 +5,7 @@ <h2>{{ 'job.title' | translate }}</h2>
 
   <mat-card class="margin-top">
     <mat-card-content>
-      <div class="information">{{ 'job.execution.info' | translate }}</div>
+      <information-message severity="information">{{ 'job.execution.info' | translate }}</information-message>
       @for (item of job_execution_config; track $index) {
       <button mat-button mat-raised-button color="primary" (click)="executeJob(item.url)" class="margin-r10">{{item.label | translate}}</button>
       }
@@ -17,7 +17,7 @@ <h2>{{ 'job.title' | translate }}</h2>
   </mat-card>
 
   @if (error) {
-  <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+  <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
   <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/job/job-detail-list.component.ts b/code/gms-frontend/src/app/components/job/job-detail-list.component.ts
@@ -5,6 +5,7 @@ import { MatTableDataSource } from "@angular/material/table";
 import { ActivatedRoute, Router } from "@angular/router";
 import { catchError, Observable } from "rxjs";
 import { AngularMaterialModule } from "../../angular-material-module";
+import { InformationMessageComponent } from "../../common/components/information-message/information-message.component";
 import { NavBackComponent } from "../../common/components/nav-back/nav-back.component";
 import { MomentPipe } from "../../common/components/pipes/date-formatter.pipe";
 import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
@@ -28,7 +29,7 @@ const MANUAL_JOB_EXECUTION_CONFIG = [
  */
 @Component({
     standalone: true,
-    imports: [AngularMaterialModule, CommonModule, NavBackComponent, MomentPipe, TranslatorModule],
+    imports: [AngularMaterialModule, CommonModule, NavBackComponent, MomentPipe, TranslatorModule, InformationMessageComponent],
     selector: 'job-detail-list',
     templateUrl: './job-detail-list.component.html'
 })

diff --git a/code/gms-frontend/src/app/components/keystore/keystore-detail.component.html b/code/gms-frontend/src/app/components/keystore/keystore-detail.component.html
@@ -2,7 +2,7 @@
   <nav-back [buttonConfig]="[{ primary: true, label : 'navback.back2List', url : '/keystore/list' }]"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <form #form="ngForm" novalidate class="example-form" autocomplete="off">
@@ -29,9 +29,7 @@
                 }
               }
               @if (data.generated === true) {
-                <div class="information">
-                  {{ 'keystores.newInfo' | translate }}
-                </div>
+                <information-message severity="information">{{ 'keystores.newInfo' | translate }}</information-message>
               }
             </mat-card-content>
           </mat-card>
@@ -68,9 +66,7 @@
                   <button mat-button mat-raised-button color="primary" (click)="addNewAlias()">{{ 'keystores.addNewAlias' | translate }}</button>
                 }
                 @if (allAliasesAreValid === false) {
-                  <div class="warning">
-                    {{ 'keystores.aliasWarning' | translate }}
-                  </div>
+                  <information-message severity="warning">{{ 'keystores.aliasWarning' | translate }}</information-message>
                 }
                 <table mat-table [dataSource]="datasource" class="mat-elevation-z1 full-width">
                   <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>

diff --git a/code/gms-frontend/src/app/components/keystore/keystore-list.component.html b/code/gms-frontend/src/app/components/keystore/keystore-list.component.html
@@ -4,7 +4,7 @@ <h2>{{ 'sidemenu.keystores' | translate }}</h2>
   <nav-back [buttonConfig]="[{url:'/keystore/new', label:'navback.create', primary : true}]"></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/messages/message-list.component.html b/code/gms-frontend/src/app/components/messages/message-list.component.html
@@ -4,7 +4,7 @@ <h2>{{ 'messages.title' | translate }}</h2>
   <nav-back></nav-back>
 
   @if (error) {
-    <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+    <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
   }
   @if (!error) {
     <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/secret/secret-list.component.html b/code/gms-frontend/src/app/components/secret/secret-list.component.html
@@ -5,7 +5,7 @@ <h2>{{ 'sidemenu.secrets' | translate }}</h2>
     <nav-back [buttonConfig]="[{url:'/secret/new', label:'navback.create', primary : true}]"></nav-back>
 
     @if (error) {
-      <div class="warning"><b>{{ 'messages.error' | translate }}:</b> {{error}}</div>
+      <information-message severity="warning">{{ 'messages.error' | translate }}: {{error}}</information-message>
     }
     @if (!error) {
       <mat-card class="margin-top">

diff --git a/code/gms-frontend/src/app/components/secret/secret-list.component.spec.ts b/code/gms-frontend/src/app/components/secret/secret-list.component.spec.ts
@@ -10,16 +10,16 @@ import { AppRoutingModule } from "../../app-routing.module";
 import { NavBackComponent } from "../../common/components/nav-back/nav-back.component";
 import { MomentPipe } from "../../common/components/pipes/date-formatter.pipe";
 import { NavButtonVisibilityPipe } from "../../common/components/pipes/nav-button-visibility.pipe";
+import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
 import { SplashComponent } from "../../common/components/splash/splash.component";
 import { StatusToggleComponent } from "../../common/components/status-toggle/status-toggle.component";
 import { ClipboardService } from "../../common/service/clipboard-service";
+import { DialogService } from "../../common/service/dialog-service";
 import { ServiceModule } from "../../common/service/service-module";
 import { SharedDataService } from "../../common/service/shared-data-service";
 import { User } from "../user/model/user.model";
 import { COPY_SECRET_ID_MESSAGE, SecretListComponent } from "./secret-list.component";
 import { SecretService } from "./service/secret-service";
-import { DialogService } from "../../common/service/dialog-service";
-import { TranslatorModule } from "../../common/components/pipes/translator/translator.module";
 
 /**
  * @author Peter Szrnka
@@ -53,7 +53,8 @@ describe('SecretListComponent', () => {
                 NavButtonVisibilityPipe,
                 StatusToggleComponent,
                 ServiceModule,
-                TranslatorModule ],
+                TranslatorModule
+            ],
             declarations : [SecretListComponent],
             schemas : [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
             providers: [