add warnings to header

Author: konrad2002

src/app/core/model/meeting/meeting.model.ts

@@ -26,6 +26,7 @@ export interface Meeting {
     series: MeetingSeries;
     iteration: number;
     subtitles: string[];
+    warnings: string[];
     meet_id: string;
     state: MeetingStates;
     unpublished: boolean;
@@ -43,6 +44,7 @@ export class MeetingImpl implements Meeting {
     series: MeetingSeries = {} as MeetingSeries;
     iteration: number = 1;
     subtitles: string[] = [];
+    warnings: string[] = [];
     meet_id: string = "";
     state: MeetingStates = MeetingStates.HIDDEN;
     data: MeetingData = {} as MeetingData;
@@ -60,6 +62,7 @@ export class MeetingImpl implements Meeting {
             this.series = meeting.series;
             this.iteration = meeting.iteration;
             this.subtitles = meeting.subtitles;
+            this.warnings = meeting.warnings;
             this.meet_id = meeting.meet_id;
             this.data = meeting.data;
             this.layout = meeting.layout;

src/app/shared/layout/header/header.component.html

@@ -41,3 +41,13 @@
     }
 </sr-panel>
 
+@if (meeting && meeting.warnings && meeting.warnings.length > 0) {
+    <sr-panel class="header-warnings">
+        @for (warning of meeting.warnings; track warning) {
+            <div class="header-warning">
+                <mat-icon>info</mat-icon> <span>{{warning}}</span>
+            </div>
+        }
+    </sr-panel>
+}
+

src/app/shared/layout/header/header.component.scss

@@ -48,6 +48,22 @@
     }
 }
 
+.header-warnings {
+    color: red;
+    font-weight: bold;
+    margin-top: 12px;
+
+    .header-warning {
+        .mat-icon, span {
+            vertical-align: middle;
+        }
+
+        .mat-icon {
+            margin-right: 4px;
+        }
+    }
+}
+
 @media only screen and (max-width: 1050px) {
     .header .title-box {
         display: none;

src/app/shared/layout/header/header.component.ts

@@ -5,12 +5,13 @@ import {SidebarMenuService} from "../../../core/service/sidebar-menu.service";
 import {PanelComponent} from '../../elements/panel/panel.component';
 import {IconPanelComponent} from '../../elements/icon-panel/icon-panel.component';
 import {HeaderButtonsComponent} from './header-buttons/header-buttons.component';
+import {MatIcon} from "@angular/material/icon";
 
 @Component({
     selector: 'sr-header',
     templateUrl: './header.component.html',
     styleUrls: ['./header.component.scss'],
-    imports: [PanelComponent, IconPanelComponent, HeaderButtonsComponent]
+    imports: [PanelComponent, IconPanelComponent, HeaderButtonsComponent, MatIcon]
 })
 export class HeaderComponent {
   private routeService = inject(RouteService);