From 4043928ed356a831f97a7a05027c765d453ac582 Mon Sep 17 00:00:00 2001
From: Elwin Schmitz <eschmitz@redcross.nl>
Date: Thu, 16 Jan 2025 10:20:36 +0100
Subject: [PATCH 1/2] fix: Make sure the env-specific icon is in the well-known
 place

AB#32732
---
 .github/actions/build-interface/action.yml                | 6 ++++++
 .github/workflows/deploy_client-demo_portalicious.yml     | 1 +
 .github/workflows/deploy_client-nlrc_portalicious.yml     | 1 +
 .github/workflows/deploy_client-training_portalicious.yml | 1 +
 .github/workflows/deploy_staging_portalicious.yml         | 1 +
 5 files changed, 10 insertions(+)

diff --git a/.github/actions/build-interface/action.yml b/.github/actions/build-interface/action.yml
index edb6c52cee..6d11a73775 100644
--- a/.github/actions/build-interface/action.yml
+++ b/.github/actions/build-interface/action.yml
@@ -90,6 +90,12 @@ runs:
         mv -f ./staticwebapp.config.override.json ./staticwebapp.config.json
         cat ./staticwebapp.config.json
 
+    - name: Add environment-specific icon in well-known location
+      shell: bash
+      working-directory: ${{ inputs.interfacePath }}
+      run: |
+        cp ${{ inputs.envIconPath }} www/favicon.ico
+
     - name: Add VERSION to deployment
       id: version
       shell: bash
diff --git a/.github/workflows/deploy_client-demo_portalicious.yml b/.github/workflows/deploy_client-demo_portalicious.yml
index a1915ed91e..3195ee77bc 100644
--- a/.github/workflows/deploy_client-demo_portalicious.yml
+++ b/.github/workflows/deploy_client-demo_portalicious.yml
@@ -45,6 +45,7 @@ jobs:
         with:
           interfacePath: ${{ env.workingDirectory }}
           envIcon: 'AAABAAEAEBAQAAEABAAoAQAAFgAAACgAAAAQAAAAIAAAAAEABAAAAAAAgAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAFCPkAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABERAAAAAAAAEREAAAAAAAAREQAAAAAAABERAAAAABEREREREQAAERERERERAAAREREREREAABEREREREQAAAAAREQAAAAAAABERAAAAAAAAEREAAAAAAAAREQAAAAAAAAAAAAAAAAAAAAAAAAD//wAA//8AAPw/AAD8PwAA/D8AAPw/AADAAwAAwAMAAMADAADAAwAA/D8AAPw/AAD8PwAA/D8AAP//AAD//wAA'
+          envIconPath: 'src/assets/favicon.ico'
           envContentSecurityPolicy: '' # Not used for Portalicious, the `build:deployment-configuration`-script is used.
 
       # More information on Static Web App workflow configurations,
diff --git a/.github/workflows/deploy_client-nlrc_portalicious.yml b/.github/workflows/deploy_client-nlrc_portalicious.yml
index 8f6bdba052..a4398af463 100644
--- a/.github/workflows/deploy_client-nlrc_portalicious.yml
+++ b/.github/workflows/deploy_client-nlrc_portalicious.yml
@@ -45,6 +45,7 @@ jobs:
         with:
           interfacePath: ${{ env.workingDirectory }}
           envIcon: 'AAABAAEAEBAQAAEABAAoAQAAFgAAACgAAAAQAAAAIAAAAAEABAAAAAAAgAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAA////ACgcrgCLRiEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzEREREREREREREREREREREREREREREREREREREREREREiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIgAAAAAAAAAAAAAAAAAAAAD//wAA//8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP//AAD//wAA'
+          envIconPath: 'src/assets/favicon.ico'
           envContentSecurityPolicy: '' # Not used for Portalicious, the `build:deployment-configuration`-script is used.
 
       # More information on Static Web App workflow configurations,
diff --git a/.github/workflows/deploy_client-training_portalicious.yml b/.github/workflows/deploy_client-training_portalicious.yml
index 8ae03b8d0a..1d7caf8318 100644
--- a/.github/workflows/deploy_client-training_portalicious.yml
+++ b/.github/workflows/deploy_client-training_portalicious.yml
@@ -45,6 +45,7 @@ jobs:
         with:
           interfacePath: ${{ env.workingDirectory }}
           envIcon: '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'
+          envIconPath: 'src/assets/favicon.ico'
           envContentSecurityPolicy: '' # Not used for Portalicious, the `build:deployment-configuration`-script is used.
 
       # More information on Static Web App workflow configurations,
diff --git a/.github/workflows/deploy_staging_portalicious.yml b/.github/workflows/deploy_staging_portalicious.yml
index 1e25524af4..6e2aaea7c9 100644
--- a/.github/workflows/deploy_staging_portalicious.yml
+++ b/.github/workflows/deploy_staging_portalicious.yml
@@ -45,6 +45,7 @@ jobs:
         with:
           interfacePath: ${{ env.workingDirectory }}
           envIcon: 'AAABAAEAEBAQAAEABAAoAQAAFgAAACgAAAAQAAAAIAAAAAEABAAAAAAAgAAAAAAAAAAAAAAAEAAAAAAAAAA3yPcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'
+          envIconPath: 'src/assets/favicon.ico'
           envContentSecurityPolicy: '' # Not used for Portalicious, the `build:deployment-configuration`-script is used.
 
       # More information on Static Web App workflow configurations,

From 1d73da70ed1c578d242f58a8210a04ff6cec05cc Mon Sep 17 00:00:00 2001
From: Elwin Schmitz <eschmitz@redcross.nl>
Date: Thu, 16 Jan 2025 12:08:05 +0100
Subject: [PATCH 2/2] feat: Add specific page-titles + ENV-name to show
 browser-tab/window

AB#32732
---
 interfaces/Portalicious/src/app/app.config.ts |  8 +++++-
 interfaces/Portalicious/src/app/app.routes.ts | 25 ++++++++++++++++++-
 .../src/app/app.title-strategy.ts             | 24 ++++++++++++++++++
 .../fullscreen-spinner.component.html         |  2 +-
 .../auth-callback/auth-callback.page.html     |  2 +-
 .../src/app/pages/login/login.page.html       |  2 +-
 .../custom-message-control.component.ts       |  2 +-
 .../custom-message-preview.component.ts       |  2 +-
 .../Portalicious/src/locale/messages.nl.xlf   | 13 +++++++---
 .../Portalicious/src/locale/messages.xlf      |  9 +++++--
 10 files changed, 77 insertions(+), 12 deletions(-)
 create mode 100644 interfaces/Portalicious/src/app/app.title-strategy.ts

diff --git a/interfaces/Portalicious/src/app/app.config.ts b/interfaces/Portalicious/src/app/app.config.ts
index d8cae09cfd..78cbc34458 100644
--- a/interfaces/Portalicious/src/app/app.config.ts
+++ b/interfaces/Portalicious/src/app/app.config.ts
@@ -9,7 +9,11 @@ import {
   provideExperimentalZonelessChangeDetection,
 } from '@angular/core';
 import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
-import { provideRouter, withComponentInputBinding } from '@angular/router';
+import {
+  provideRouter,
+  TitleStrategy,
+  withComponentInputBinding,
+} from '@angular/router';
 
 import {
   provideTanStackQuery,
@@ -19,6 +23,7 @@ import { providePrimeNG } from 'primeng/config';
 
 import { routes } from '~/app.routes';
 import AppTheme from '~/app.theme';
+import { CustomPageTitleStrategy } from '~/app.title-strategy';
 import { AuthService } from '~/services/auth.service';
 import { Locale } from '~/utils/locale';
 
@@ -64,6 +69,7 @@ export function getAppConfig(locale: Locale): ApplicationConfig {
         }),
       ),
       ...AuthService.APP_PROVIDERS,
+      { provide: TitleStrategy, useClass: CustomPageTitleStrategy },
       { provide: LOCALE_ID, useValue: locale },
     ],
   };
diff --git a/interfaces/Portalicious/src/app/app.routes.ts b/interfaces/Portalicious/src/app/app.routes.ts
index 4b81948604..a9319e3d1a 100644
--- a/interfaces/Portalicious/src/app/app.routes.ts
+++ b/interfaces/Portalicious/src/app/app.routes.ts
@@ -28,11 +28,13 @@ export enum AppRoutes {
 export const routes: Routes = [
   {
     path: AppRoutes.login,
+    title: $localize`:@@page-title-login:Log in`,
     loadComponent: () =>
       import('~/pages/login/login.page').then((x) => x.LoginPageComponent),
   },
   {
     path: AppRoutes.authCallback,
+    title: $localize`:@@generic-loading:Loading...`,
     loadComponent: () =>
       import('~/pages/auth-callback/auth-callback.page').then(
         (x) => x.AuthCallbackPageComponent,
@@ -40,7 +42,7 @@ export const routes: Routes = [
   },
   {
     path: AppRoutes.changePassword,
-    title: $localize`:Browser-tab-title@@page-title-change-password:Change password`,
+    title: $localize`:@@page-title-change-password:Change password`,
     loadComponent: () =>
       import('~/pages/change-password/change-password.page').then(
         (x) => x.ChangePasswordPageComponent,
@@ -55,6 +57,7 @@ export const routes: Routes = [
   },
   {
     path: AppRoutes.projects,
+    title: $localize`:@@page-title-all-projects:All projects`,
     loadComponent: () =>
       import('~/pages/projects-overview/projects-overview.page').then(
         (x) => x.ProjectsOverviewPageComponent,
@@ -63,6 +66,7 @@ export const routes: Routes = [
   },
   {
     path: AppRoutes.users,
+    title: $localize`:@@page-title-users:Users`,
     loadComponent: () =>
       import('~/pages/users/users.page').then((x) => x.UsersPageComponent),
     canActivate: [
@@ -72,6 +76,7 @@ export const routes: Routes = [
   },
   {
     path: AppRoutes.userRoles,
+    title: $localize`:@@page-title-user-roles:User roles`,
     loadComponent: () =>
       import('~/pages/user-roles/user-roles.page').then(
         (x) => x.UserRolesPageComponent,
@@ -87,6 +92,7 @@ export const routes: Routes = [
     children: [
       {
         path: AppRoutes.projectMonitoring,
+        title: $localize`:@@page-title-project-monitoring:Monitoring`,
         loadComponent: () =>
           import('~/pages/project-monitoring/project-monitoring.page').then(
             (x) => x.ProjectMonitoringPageComponent,
@@ -97,6 +103,7 @@ export const routes: Routes = [
       },
       {
         path: AppRoutes.projectTeam,
+        title: $localize`:@@page-title-project-team:Team`,
         loadComponent: () =>
           import('~/pages/project-team/project-team.page').then(
             (x) => x.ProjectTeamPageComponent,
@@ -110,6 +117,7 @@ export const routes: Routes = [
         children: [
           {
             path: ``,
+            title: $localize`:@@page-title-project-registrations:Registrations`,
             loadComponent: () =>
               import(
                 '~/pages/project-registrations/project-registrations.page'
@@ -117,10 +125,15 @@ export const routes: Routes = [
           },
           {
             path: `:registrationId`,
+            title: $localize`:@@page-title-project-registration-details:Registration details`,
             canActivate: [foundResourceGuard('registration')],
             children: [
               {
                 path: AppRoutes.projectRegistrationActivityLog,
+                title:
+                  $localize`:@@page-title-project-registrations-activity-log:Activity log` +
+                  ' | ' +
+                  $localize`:@@page-title-project-registration-details:Registration details`,
                 loadComponent: () =>
                   import(
                     '~/pages/project-registration-activity-log/project-registration-activity-log.page'
@@ -128,6 +141,10 @@ export const routes: Routes = [
               },
               {
                 path: AppRoutes.projectRegistrationPersonalInformation,
+                title:
+                  $localize`:@@page-title-project-registrations-personal-information:Personal information` +
+                  ' | ' +
+                  $localize`:@@page-title-project-registration-details:Registration details`,
                 canDeactivate: [pendingChangesGuard],
                 loadComponent: () =>
                   import(
@@ -139,6 +156,10 @@ export const routes: Routes = [
               },
               {
                 path: AppRoutes.projectRegistrationDebitCards,
+                title:
+                  $localize`:@@page-title-project-registrations-debit-cards:Debit cards` +
+                  ' | ' +
+                  $localize`:@@page-title-project-registration-details:Registration details`,
                 loadComponent: () =>
                   import(
                     '~/pages/project-registration-debit-cards/project-registration-debit-cards.page'
@@ -158,6 +179,7 @@ export const routes: Routes = [
         children: [
           {
             path: ``,
+            title: $localize`:@@page-title-project-payments:Payments`,
             loadComponent: () =>
               import('~/pages/project-payments/project-payments.page').then(
                 (x) => x.ProjectPaymentsPageComponent,
@@ -165,6 +187,7 @@ export const routes: Routes = [
           },
           {
             path: `:paymentId`,
+            title: $localize`:@@page-title-project-payment:Payment`,
             pathMatch: 'full',
             canActivate: [foundResourceGuard('payment')],
             loadComponent: () =>
diff --git a/interfaces/Portalicious/src/app/app.title-strategy.ts b/interfaces/Portalicious/src/app/app.title-strategy.ts
new file mode 100644
index 0000000000..f6b5ab02c7
--- /dev/null
+++ b/interfaces/Portalicious/src/app/app.title-strategy.ts
@@ -0,0 +1,24 @@
+import { Injectable } from '@angular/core';
+import { Title } from '@angular/platform-browser';
+import { RouterStateSnapshot, TitleStrategy } from '@angular/router';
+
+import { environment } from '~environment';
+
+@Injectable({ providedIn: 'root' })
+export class CustomPageTitleStrategy extends TitleStrategy {
+  constructor(private readonly title: Title) {
+    super();
+  }
+  override updateTitle(routerState: RouterStateSnapshot) {
+    const title = this.buildTitle(routerState);
+
+    const envName = environment.envName ? ` [ ${environment.envName} ]` : '';
+    const appTitle = `121 Portal ${envName}`;
+
+    if (title) {
+      this.title.setTitle(`${title} | ${appTitle}`);
+    } else {
+      this.title.setTitle(appTitle);
+    }
+  }
+}
diff --git a/interfaces/Portalicious/src/app/components/fullscreen-spinner/fullscreen-spinner.component.html b/interfaces/Portalicious/src/app/components/fullscreen-spinner/fullscreen-spinner.component.html
index 3c1980c42d..6c217d1ccf 100644
--- a/interfaces/Portalicious/src/app/components/fullscreen-spinner/fullscreen-spinner.component.html
+++ b/interfaces/Portalicious/src/app/components/fullscreen-spinner/fullscreen-spinner.component.html
@@ -1,6 +1,6 @@
 <p-blockUI [blocked]="loading()">
   <p-progressSpinner
     ariaLabel="Loading..."
-    i18n-ariaLabel="@@loading"
+    i18n-ariaLabel="@@generic-loading"
   />
 </p-blockUI>
diff --git a/interfaces/Portalicious/src/app/pages/auth-callback/auth-callback.page.html b/interfaces/Portalicious/src/app/pages/auth-callback/auth-callback.page.html
index ef8f27aadc..fe43559fb1 100644
--- a/interfaces/Portalicious/src/app/pages/auth-callback/auth-callback.page.html
+++ b/interfaces/Portalicious/src/app/pages/auth-callback/auth-callback.page.html
@@ -2,7 +2,7 @@
   <div class="flex w-full flex-col items-center justify-center">
     <p-progressSpinner
       ariaLabel="Loading..."
-      i18n-ariaLabel="@@loading"
+      i18n-ariaLabel="@@generic-loading"
     />
   </div>
 </app-page-layout>
diff --git a/interfaces/Portalicious/src/app/pages/login/login.page.html b/interfaces/Portalicious/src/app/pages/login/login.page.html
index c33b981538..1db1c45c03 100644
--- a/interfaces/Portalicious/src/app/pages/login/login.page.html
+++ b/interfaces/Portalicious/src/app/pages/login/login.page.html
@@ -9,7 +9,7 @@
       class="flex w-full shrink-0 flex-col gap-6 bg-white px-4 py-8 md:w-1/3"
     >
       <div class="grow">
-        <h1 i18n>Log in</h1>
+        <h1 i18n="@@page-title-login">Log in</h1>
         <p
           i18n
           class="my-6"
diff --git a/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-control/custom-message-control.component.ts b/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-control/custom-message-control.component.ts
index 32a67d9412..7fc8a64106 100644
--- a/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-control/custom-message-control.component.ts
+++ b/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-control/custom-message-control.component.ts
@@ -86,7 +86,7 @@ export class CustomMessageControlComponent implements ControlValueAccessor {
 
     return [
       {
-        label: $localize`:@@loading:Loading...`,
+        label: $localize`:@@generic-loading:Loading...`,
       },
     ];
   });
diff --git a/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-preview/custom-message-preview.component.ts b/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-preview/custom-message-preview.component.ts
index e49378cf85..79254b02ff 100644
--- a/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-preview/custom-message-preview.component.ts
+++ b/interfaces/Portalicious/src/app/pages/project-registrations/components/custom-message-preview/custom-message-preview.component.ts
@@ -46,7 +46,7 @@ export class CustomMessagePreviewComponent {
 
   messageText = computed(() =>
     this.messagePreview.isPending()
-      ? $localize`:@@loading:Loading...`
+      ? $localize`:@@generic-loading:Loading...`
       : this.messagePreview.data(),
   );
 }
diff --git a/interfaces/Portalicious/src/locale/messages.nl.xlf b/interfaces/Portalicious/src/locale/messages.nl.xlf
index b9b0705b82..3be5be8da6 100644
--- a/interfaces/Portalicious/src/locale/messages.nl.xlf
+++ b/interfaces/Portalicious/src/locale/messages.nl.xlf
@@ -1147,7 +1147,7 @@
         <target>Account</target>
         <note priority="1" from="description">Top-right user-menu</note>
       </trans-unit>
-      <trans-unit id="loading" datatype="html">
+      <trans-unit id="generic-loading" datatype="html">
         <source>Loading...</source>
         <target>Bezig met laden...</target>
       </trans-unit>
@@ -1230,7 +1230,6 @@
       <trans-unit id="page-title-change-password" datatype="html">
         <source>Change password</source>
         <target>Change password</target>
-        <note priority="1" from="description">Browser-tab-title</note>
       </trans-unit>
       <trans-unit id="page-title-project-monitoring" datatype="html">
         <source>Monitoring</source>
@@ -1828,6 +1827,14 @@
         <source>When you receive a task, any information linked to the person&apos;s phone number found in active programs in the 121 Platform will appear here.</source>
         <target state="new">When you receive a task, any information linked to the person&apos;s phone number found in active programs in the 121 Platform will appear here.</target>
       </trans-unit>
+      <trans-unit id="page-title-login" datatype="html">
+        <source>Log in</source>
+        <target>Log in</target>
+      </trans-unit>
+      <trans-unit id="page-title-project-registration-details" datatype="html">
+        <source>Registration details</source>
+        <target>Registratie details</target>
+      </trans-unit>
     </body>
   </file>
-</xliff>
\ No newline at end of file
+</xliff>
diff --git a/interfaces/Portalicious/src/locale/messages.xlf b/interfaces/Portalicious/src/locale/messages.xlf
index 62b40b17df..86dcf86fc8 100644
--- a/interfaces/Portalicious/src/locale/messages.xlf
+++ b/interfaces/Portalicious/src/locale/messages.xlf
@@ -4,7 +4,6 @@
     <body>
       <trans-unit id="page-title-change-password" datatype="html">
         <source>Change password</source>
-        <note priority="1" from="description">Browser-tab-title</note>
       </trans-unit>
       <trans-unit id="generic-not-available" datatype="html">
         <source>Not available</source>
@@ -584,7 +583,7 @@
       <trans-unit id="4026691210548476882" datatype="html">
         <source>Failed to load options</source>
       </trans-unit>
-      <trans-unit id="loading" datatype="html">
+      <trans-unit id="generic-loading" datatype="html">
         <source>Loading...</source>
       </trans-unit>
       <trans-unit id="3082094200535618477" datatype="html">
@@ -1373,6 +1372,12 @@
       <trans-unit id="8209340100752123472" datatype="html">
         <source>When you receive a task, any information linked to the person&apos;s phone number found in active programs in the 121 Platform will appear here.</source>
       </trans-unit>
+      <trans-unit id="page-title-login" datatype="html">
+        <source>Log in</source>
+      </trans-unit>
+      <trans-unit id="page-title-project-registration-details" datatype="html">
+        <source>Registration details</source>
+      </trans-unit>
     </body>
   </file>
 </xliff>
\ No newline at end of file