refactor: make config signal

Author: Sobyt483

projects/wc/src/app/components/error/error.component.html

@@ -1,13 +1,14 @@
-@if (config.scene) {
+@let configVM = config();
+@if (configVM.scene) {
     <div class="page">
       <div class="container">
-        <ui5-illustrated-message [name]="config.scene">
-          <ui5-title slot="title" level="H1">{{config.illustratedMessageTitle}}</ui5-title>
+        <ui5-illustrated-message [name]="configVM.scene">
+          <ui5-title slot="title" level="H1">{{configVM.illustratedMessageTitle}}</ui5-title>
           <div slot="subtitle">
-            <p>{{config.illustratedMessageText}}</p>
+            <p>{{configVM.illustratedMessageText}}</p>
           </div>
           <div>
-              @for (button of config.buttons; track button.url) {
+              @for (button of configVM.buttons; track button.url) {
                   <ui5-button
                     design="Transparent"
                     (click)="goTo(button)"

projects/wc/src/app/components/error/error.component.spec.ts

@@ -79,10 +79,10 @@ describe('ErrorComponent', () => {
       fixture.componentRef.setInput('context', testContext);
 
       await component.ngOnInit();
-      expect(component.config.scene).toBe('NoEntries');
-      expect(component.config.illustratedMessageTitle).toBe('translated text');
-      expect(component.config.illustratedMessageText).toBe('translated text');
-      expect(component.config.buttons).toBeDefined();
+      expect(component.config().scene).toBe('NoEntries');
+      expect(component.config().illustratedMessageTitle).toBe('translated text');
+      expect(component.config().illustratedMessageText).toBe('translated text');
+      expect(component.config().buttons).toBeDefined();
     });
 
     it('should set 403 config', async () => {
@@ -94,11 +94,11 @@ describe('ErrorComponent', () => {
       fixture.componentRef.setInput('context', testContext);
 
       await component.ngOnInit();
-      expect(component.config.scene).toBe('tnt/UnsuccessfulAuth');
-      expect(component.config.illustratedMessageTitle).toBe('');
-      expect(component.config.illustratedMessageText).toBe('translated text');
-      expect(component.config.buttons).toBeDefined();
-      expect(component.config.buttons?.length).toBe(2);
+      expect(component.config().scene).toBe('tnt/UnsuccessfulAuth');
+      expect(component.config().illustratedMessageTitle).toBe('');
+      expect(component.config().illustratedMessageText).toBe('translated text');
+      expect(component.config().buttons).toBeDefined();
+      expect(component.config().buttons?.length).toBe(2);
     });
 
     it('should set default error config for unknown error code', async () => {
@@ -110,11 +110,10 @@ describe('ErrorComponent', () => {
       fixture.componentRef.setInput('context', testContext);
 
       await component.ngOnInit();
-      expect(component.config.scene).toBe('UnableToLoad');
-      expect(component.config.illustratedMessageTitle).toBe('translated text');
-      expect(component.config.illustratedMessageText).toBe('');
-      expect(component.config.buttons).toBeDefined();
-      expect(component.config.buttons?.length).toBe(0);
+      expect(component.config().scene).toBe('UnableToLoad');
+      expect(component.config().illustratedMessageTitle).toBe('translated text');
+      expect(component.config().illustratedMessageText).toBe('');
+      expect(component.config().buttons).toBeDefined();
     });
   });
 });

projects/wc/src/app/components/error/error.component.ts

@@ -7,6 +7,7 @@ import {
   ViewEncapsulation,
   inject,
   input,
+  signal,
 } from '@angular/core';
 import { I18nService, LuigiCoreService } from '@openmfp/portal-ui-lib';
 import '@ui5/webcomponents-fiori/dist/illustrations/NoEntries.js';
@@ -33,12 +34,12 @@ export class ErrorComponent implements OnInit {
 
   public context = input.required<any>();
 
-  config: ErrorConfig = {
+  config = signal<ErrorConfig>({
     scene: 'UnableToLoad',
     illustratedMessageTitle: '',
     illustratedMessageText: '',
     buttons: [],
-  };
+  });
 
   async ngOnInit() {
     await this.setSceneConfig();
@@ -56,15 +57,15 @@ export class ErrorComponent implements OnInit {
     const nodeContext = this.context();
     switch (+nodeContext.id) {
       case 403: {
-        this.config = await this.getError403Config();
+        this.config.set(await this.getError403Config());
         break;
       }
       case 404: {
-        this.config = await this.getError404Config();
+        this.config.set(await this.getError404Config());
         break;
       }
       default: {
-        this.config = await this.getErrorDefaultConfig();
+        this.config.set(await this.getErrorDefaultConfig());
       }
     }