Merged PR 1991: ✨ feat(navigation): implement title management and enhance tab system

✨ feat(navigation): implement title management and enhance tab system This commit introduces a comprehensive title management system and extends the tab functionality with subtitle support, improving navigation clarity and user experience across the application. Key changes: Title Management System: - Add @isa/common/title-management library with dual approach: - IsaTitleStrategy for route-based static titles - usePageTitle() for component-based dynamic titles - Implement TitleRegistryService for nested component hierarchies - Automatic ISA prefix addition and TabService integration - Comprehensive test coverage (1,158 lines of tests) Tab System Enhancement: - Add subtitle field to tab schema for additional context - Update TabService API (addTab, patchTab) to support subtitles - Extend Zod schemas with subtitle validation - Update documentation with usage examples Routing Modernization: - Consolidate route guards using ActivateProcessIdWithConfigKeyGuard - Replace 4+ specific guards with generic config-key-based approach - Add title attributes to 100+ routes across all modules - Remove deprecated ProcessIdGuard in favor of ActivateProcessIdGuard Code Cleanup: - Remove deprecated preview component and related routes - Clean up unused imports and exports - Update TypeScript path aliases Dependencies: - Update package.json and package-lock.json - Add @isa/common/title-management to tsconfig path mappings Refs: #5351, #5418, #5419, #5420
2025-12-28 22:42:11 +01:00 · 2025-12-02 12:38:28 +00:00
parent 0670dbfdb1
commit 68f50b911d
51 changed files with 3642 additions and 1148 deletions
--- a/apps/isa-app/src/app/app-routing.module.ts
+++ b/apps/isa-app/src/app/app-routing.module.ts
@@ -1,4 +1,4 @@
-import { isDevMode, NgModule } from '@angular/core';
+import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import {
  CanActivateCartGuard,
@@ -7,23 +7,17 @@ import {
  CanActivateCustomerOrdersGuard,
  CanActivateCustomerOrdersWithProcessIdGuard,
  CanActivateCustomerWithProcessIdGuard,
-  CanActivateGoodsInGuard,
  CanActivateProductGuard,
  CanActivateProductWithProcessIdGuard,
-  CanActivateTaskCalendarGuard,
  IsAuthenticatedGuard,
 } from './guards';
-import { CanActivateAssortmentGuard } from './guards/can-activate-assortment.guard';
-import { CanActivatePackageInspectionGuard } from './guards/can-activate-package-inspection.guard';
 import { MainComponent } from './main.component';
-import { PreviewComponent } from './preview';
 import {
  BranchSectionResolver,
  CustomerSectionResolver,
  ProcessIdResolver,
 } from './resolvers';
 import { TokenLoginComponent, TokenLoginModule } from './token-login';
-import { ProcessIdGuard } from './guards/process-id.guard';
 import {
  ActivateProcessIdGuard,
  ActivateProcessIdWithConfigKeyGuard,
@@ -74,8 +68,12 @@ const routes: Routes = [
            loadChildren: () =>
              import('@page/catalog').then((m) => m.PageCatalogModule),
            canActivate: [CanActivateProductWithProcessIdGuard],
-            resolve: { processId: ProcessIdResolver },
+            resolve: {
+              processId: ProcessIdResolver,
+            },
          },
+          // TODO: Check if order and :processId/order is still being used
+          // If not, remove these routes and the related guards and resolvers
          {
            path: 'order',
            loadChildren: () =>
@@ -87,7 +85,9 @@ const routes: Routes = [
            loadChildren: () =>
              import('@page/customer-order').then((m) => m.CustomerOrderModule),
            canActivate: [CanActivateCustomerOrdersWithProcessIdGuard],
-            resolve: { processId: ProcessIdResolver },
+            resolve: {
+              processId: ProcessIdResolver,
+            },
          },
          {
            path: 'customer',
@@ -100,7 +100,9 @@ const routes: Routes = [
            loadChildren: () =>
              import('@page/customer').then((m) => m.CustomerModule),
            canActivate: [CanActivateCustomerWithProcessIdGuard],
-            resolve: { processId: ProcessIdResolver },
+            resolve: {
+              processId: ProcessIdResolver,
+            },
          },
          {
            path: 'cart',
@@ -113,10 +115,13 @@ const routes: Routes = [
            loadChildren: () =>
              import('@page/checkout').then((m) => m.PageCheckoutModule),
            canActivate: [CanActivateCartWithProcessIdGuard],
+            resolve: {
+              processId: ProcessIdResolver,
+            },
          },
          {
            path: 'pickup-shelf',
-            canActivate: [ProcessIdGuard],
+            canActivate: [ActivateProcessIdGuard],
            // NOTE: This is a workaround for the canActivate guard not being called
            loadChildren: () =>
              import('@page/pickup-shelf').then((m) => m.PickupShelfOutModule),
@@ -126,6 +131,9 @@ const routes: Routes = [
            canActivate: [ActivateProcessIdGuard],
            loadChildren: () =>
              import('@page/pickup-shelf').then((m) => m.PickupShelfOutModule),
+            resolve: {
+              processId: ProcessIdResolver,
+            },
          },
          { path: '**', redirectTo: 'dashboard', pathMatch: 'full' },
        ],
@@ -141,7 +149,7 @@ const routes: Routes = [
              import('@page/task-calendar').then(
                (m) => m.PageTaskCalendarModule,
              ),
-            canActivate: [CanActivateTaskCalendarGuard],
+            canActivate: [ActivateProcessIdWithConfigKeyGuard('taskCalendar')],
          },
          {
            path: 'pickup-shelf',
@@ -154,27 +162,23 @@ const routes: Routes = [
            path: 'goods/in',
            loadChildren: () =>
              import('@page/goods-in').then((m) => m.GoodsInModule),
-            canActivate: [CanActivateGoodsInGuard],
+            canActivate: [ActivateProcessIdWithConfigKeyGuard('goodsIn')],
          },
-          // {
-          //   path: 'remission',
-          //   loadChildren: () =>
-          //     import('@page/remission').then((m) => m.PageRemissionModule),
-          //   canActivate: [CanActivateRemissionGuard],
-          // },
          {
            path: 'package-inspection',
            loadChildren: () =>
              import('@page/package-inspection').then(
                (m) => m.PackageInspectionModule,
              ),
-            canActivate: [CanActivatePackageInspectionGuard],
+            canActivate: [
+              ActivateProcessIdWithConfigKeyGuard('packageInspection'),
+            ],
          },
          {
            path: 'assortment',
            loadChildren: () =>
              import('@page/assortment').then((m) => m.AssortmentModule),
-            canActivate: [CanActivateAssortmentGuard],
+            canActivate: [ActivateProcessIdWithConfigKeyGuard('assortment')],
          },
          { path: '**', redirectTo: 'task-calendar', pathMatch: 'full' },
        ],
@@ -243,13 +247,6 @@ const routes: Routes = [
  },
 ];

-if (isDevMode()) {
-  routes.unshift({
-    path: 'preview',
-    component: PreviewComponent,
-  });
-}
-
@NgModule({
  imports: [
    RouterModule.forRoot(routes, {
--- a/apps/isa-app/src/app/app.module.ts
+++ b/apps/isa-app/src/app/app.module.ts
@@ -1,4 +1,5 @@
 import { version } from '../../../../package.json';
+import { IsaTitleStrategy } from '@isa/common/title-management';
 import {
  HTTP_INTERCEPTORS,
  provideHttpClient,
@@ -56,7 +57,6 @@ import {
  ScanditScanAdapterModule,
 } from '@adapter/scan';
 import * as Commands from './commands';
-import { PreviewComponent } from './preview';
 import { NativeContainerService } from '@external/native-container';
 import { ShellModule } from '@shared/shell';
 import { MainComponent } from './main.component';
@@ -87,6 +87,7 @@ import {
 import { Store } from '@ngrx/store';
 import { OAuthService } from 'angular-oauth2-oidc';
 import z from 'zod';
+import { TitleStrategy } from '@angular/router';
 import { TabNavigationService } from '@isa/core/tabs';

 registerLocaleData(localeDe, localeDeExtra);
@@ -270,7 +271,6 @@ const USER_SUB_FACTORY = () => {
    CoreCommandModule.forRoot(Object.values(Commands)),
    CoreLoggerModule.forRoot(),
    AppStoreModule,
-    PreviewComponent,
    AuthModule.forRoot(),
    CoreApplicationModule.forRoot(),
    UiModalModule.forRoot(),
@@ -330,6 +330,7 @@ const USER_SUB_FACTORY = () => {
      useValue: 'EUR',
    },
    provideUserSubFactory(USER_SUB_FACTORY),
+    { provide: TitleStrategy, useClass: IsaTitleStrategy },
  ],
 })
 export class AppModule {}
--- a/apps/isa-app/src/app/guards/activate-process-id.guard.ts
+++ b/apps/isa-app/src/app/guards/activate-process-id.guard.ts
@@ -1,47 +1,82 @@
-import { inject } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivateFn, RouterStateSnapshot } from '@angular/router';
-import { ApplicationService } from '@core/application';
-import { Config } from '@core/config';
-import { take } from 'rxjs/operators';
-
-export const ActivateProcessIdGuard: CanActivateFn = async (
-  route: ActivatedRouteSnapshot,
-  state: RouterStateSnapshot,
-) => {
-  const application = inject(ApplicationService);
-
-  const processIdStr = route.params.processId;
-
-  if (!processIdStr) {
-    return false;
-  }
-
-  const processId = Number(processIdStr);
-
-  // Check if Process already exists
-  const process = await application.getProcessById$(processId).pipe(take(1)).toPromise();
-
-  if (!process) {
-    application.createCustomerProcess(processId);
-  }
-
-  application.activateProcess(processId);
-
-  return true;
-};
-
-export const ActivateProcessIdWithConfigKeyGuard: (key: string) => CanActivateFn =
-  (key) => async (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => {
-    const application = inject(ApplicationService);
-    const config = inject(Config);
-
-    const processId = config.get(`process.ids.${key}`);
-
-    if (isNaN(processId)) {
-      return false;
-    }
-
-    application.activateProcess(processId);
-
-    return true;
-  };
+import { inject } from '@angular/core';
+import {
+  ActivatedRouteSnapshot,
+  CanActivateFn,
+  RouterStateSnapshot,
+} from '@angular/router';
+import { ApplicationService } from '@core/application';
+import { Config } from '@core/config';
+import { take } from 'rxjs/operators';
+import z from 'zod';
+
+export const ActivateProcessIdGuard: CanActivateFn = async (
+  route: ActivatedRouteSnapshot,
+  state: RouterStateSnapshot,
+) => {
+  const application = inject(ApplicationService);
+
+  const processIdStr = route.params.processId;
+
+  if (!processIdStr) {
+    return false;
+  }
+
+  const processId = Number(processIdStr);
+
+  // Check if Process already exists
+  const process = await application
+    .getProcessById$(processId)
+    .pipe(take(1))
+    .toPromise();
+
+  if (!process) {
+    application.createProcess({
+      id: processId,
+      type: 'cart',
+      section: 'customer',
+      name: `Vorgang ${processId}`,
+    });
+  }
+
+  application.activateProcess(processId);
+
+  return true;
+};
+
+export const ActivateProcessIdWithConfigKeyGuard: (
+  key: string,
+) => CanActivateFn =
+  (key) =>
+  async (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => {
+    const application = inject(ApplicationService);
+    const config = inject(Config);
+
+    const processId = config.get(`process.ids.${key}`, z.coerce.number());
+
+    if (typeof processId !== 'number' || isNaN(processId)) {
+      return false;
+    }
+
+    const processTitle = config.get(
+      `process.titles.${key}`,
+      z.string().default(key),
+    );
+
+    const process = await application
+      .getProcessById$(processId)
+      .pipe(take(1))
+      .toPromise();
+
+    if (!process) {
+      await application.createProcess({
+        id: processId,
+        type: key,
+        section: 'customer', // Not important anymore
+        name: processTitle,
+      });
+    }
+
+    application.activateProcess(processId);
+
+    return true;
+  };
--- a/apps/isa-app/src/app/guards/can-activate-goods-in.guard.ts
+++ b/apps/isa-app/src/app/guards/can-activate-goods-in.guard.ts
@@ -1,34 +1,34 @@
-import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
-import { ApplicationService } from '@core/application';
-import { Config } from '@core/config';
-import { first } from 'rxjs/operators';
-import { z } from 'zod';
-
-@Injectable({ providedIn: 'root' })
-export class CanActivateGoodsInGuard {
-  constructor(
-    private readonly _applicationService: ApplicationService,
-    private readonly _config: Config,
-  ) {}
-
-  async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
-    const pid = this._config.get('process.ids.goodsIn', z.number());
-    const process = await this._applicationService
-      .getProcessById$(pid)
-      .pipe(first())
-      .toPromise();
-    if (!process) {
-      await this._applicationService.createProcess({
-        id: this._config.get('process.ids.goodsIn'),
-        type: 'goods-in',
-        section: 'branch',
-        name: '',
-      });
-    }
-    this._applicationService.activateProcess(
-      this._config.get('process.ids.goodsIn'),
-    );
-    return true;
-  }
-}
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
+import { ApplicationService } from '@core/application';
+import { Config } from '@core/config';
+import { first } from 'rxjs/operators';
+import { z } from 'zod';
+
+@Injectable({ providedIn: 'root' })
+export class CanActivateGoodsInGuard {
+  constructor(
+    private readonly _applicationService: ApplicationService,
+    private readonly _config: Config,
+  ) {}
+
+  async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
+    const pid = this._config.get('process.ids.goodsIn', z.number());
+    const process = await this._applicationService
+      .getProcessById$(pid)
+      .pipe(first())
+      .toPromise();
+    if (!process) {
+      await this._applicationService.createProcess({
+        id: this._config.get('process.ids.goodsIn'),
+        type: 'goods-in',
+        section: 'branch',
+        name: 'Abholfach',
+      });
+    }
+    this._applicationService.activateProcess(
+      this._config.get('process.ids.goodsIn'),
+    );
+    return true;
+  }
+}
--- a/apps/isa-app/src/app/preview/index.ts
+++ b/apps/isa-app/src/app/preview/index.ts
@@ -1,3 +0,0 @@
-// start:ng42.barrel
-export * from './preview.component';
-// end:ng42.barrel
--- a/apps/isa-app/src/app/preview/preview.component.css
+++ b/apps/isa-app/src/app/preview/preview.component.css
@@ -1,3 +0,0 @@
-:host {
-  @apply grid min-h-screen content-center justify-center;
-}
--- a/apps/isa-app/src/app/preview/preview.component.html
+++ b/apps/isa-app/src/app/preview/preview.component.html
@@ -1,10 +0,0 @@
-<h1>Platform: {{ platform | json }}</h1>
-<br />
-<h1>{{ appVersion }}</h1>
-<br />
-<h1>{{ userAgent }}</h1>
-<br />
-<h1>Navigator: {{ navigator | json }}</h1>
-<br />
-<br />
-<h1>Device: {{ device }}</h1>
--- a/apps/isa-app/src/app/preview/preview.component.ts
+++ b/apps/isa-app/src/app/preview/preview.component.ts
@@ -1,56 +0,0 @@
-import { Platform, PlatformModule } from '@angular/cdk/platform';
-import { CommonModule } from '@angular/common';
-import { Component } from '@angular/core';
-import { BranchDTO } from '@generated/swagger/checkout-api';
-import { BehaviorSubject } from 'rxjs';
-
-@Component({
-  selector: 'app-preview',
-  templateUrl: 'preview.component.html',
-  styleUrls: ['preview.component.css'],
-  imports: [CommonModule, PlatformModule],
-})
-export class PreviewComponent {
-  selectedBranch$ = new BehaviorSubject<BranchDTO>({});
-
-  get appVersion() {
-    return 'App Version: ' + (window.navigator as any).appVersion;
-  }
-
-  get userAgent() {
-    return 'User Agent: ' + (window.navigator as any).userAgent;
-  }
-
-  get navigator() {
-    const nav = {};
-    for (const i in window.navigator) nav[i] = navigator[i];
-    return nav;
-  }
-
-  get platform() {
-    return this._platform;
-  }
-
-  get device() {
-    const isIpadNative = this._platform.IOS && !this._platform.SAFARI;
-    const isIpadMini6Native = window?.navigator?.userAgent?.includes('Macintosh') && !this._platform.SAFARI;
-    const isNative = isIpadNative || isIpadMini6Native;
-    const isPWA = this._platform.IOS && this._platform.SAFARI;
-    const isDesktop = !isNative && !isPWA;
-    if (isNative) {
-      if (isIpadMini6Native) {
-        return 'IPAD mini 6 Native App';
-      } else if (isIpadNative) {
-        return 'IPAD mini 2 Native App or IPAD mini 5 Native App';
-      }
-    } else if (isPWA) {
-      return 'IPAD Safari PWA';
-    } else if (isDesktop) return 'Desktop or Macintosh';
-  }
-
-  constructor(private readonly _platform: Platform) {}
-
-  setNewBranch(branch: BranchDTO) {
-    this.selectedBranch$.next(branch);
-  }
-}
--- a/apps/isa-app/src/app/resolvers/index.ts
+++ b/apps/isa-app/src/app/resolvers/index.ts
@@ -1,4 +1,2 @@
-// start:ng42.barrel
-export * from './process-id.resolver';
-export * from './section.resolver';
-// end:ng42.barrel
+export * from './process-id.resolver';
+export * from './section.resolver';
--- a/apps/isa-app/src/config/config.json
+++ b/apps/isa-app/src/config/config.json
@@ -1,87 +1,86 @@
-{
-  "title": "ISA - Local",
-  "silentRefresh": {
-    "interval": 300000
-  },
-  "debug": true,
-  "dev-scanner": true,
-  "@cdn/product-image": {
-    "url": "https://produktbilder.paragon-data.net"
-  },
-  "@core/auth": {
-    "issuer": "https://sso-test.paragon-data.de",
-    "clientId": "isa-client",
-    "responseType": "code",
-    "scope": "openid profile cmf_user isa-isa-webapi isa-checkout-webapi isa-cat-webapi isa-ava-webapi isa-crm-webapi isa-review-webapi isa-kpi-webapi isa-oms-webapi isa-nbo-webapi isa-print-webapi eis-service isa-inv-webapi isa-wws-webapi",
-    "showDebugInformation": true
-  },
-  "@core/logger": {
-    "logLevel": "debug"
-  },
-  "@swagger/isa": {
-    "rootUrl": "https://isa-test.paragon-data.net/isa/v1"
-  },
-  "@swagger/cat": {
-    "rootUrl": "https://isa-test.paragon-data.net/catsearch/v6"
-  },
-  "@swagger/av": {
-    "rootUrl": "https://isa-test.paragon-data.net/ava/v6"
-  },
-  "@swagger/checkout": {
-    "rootUrl": "https://isa-test.paragon-data.net/checkout/v6"
-  },
-  "@swagger/crm": {
-    "rootUrl": "https://isa-test.paragon-data.net/crm/v6"
-  },
-  "@swagger/oms": {
-    "rootUrl": "https://isa-test.paragon-data.net/oms/v6"
-  },
-  "@swagger/print": {
-    "rootUrl": "https://isa-test.paragon-data.net/print/v1"
-  },
-  "@swagger/eis": {
-    "rootUrl": "https://filialinformationsystem-test.paragon-systems.de/eiswebapi/v1"
-  },
-  "@swagger/remi": {
-    "rootUrl": "https://isa-test.paragon-data.net/inv/v6"
-  },
-  "@swagger/wws": {
-    "rootUrl": "https://isa-test.paragon-data.net/wws/v1"
-  },
-  "@domain/checkout": {
-    "olaExpiration": "5m"
-  },
-  "hubs": {
-    "notifications": {
-      "url": "https://isa-test.paragon-data.net/isa/v1/rt",
-      "enableAutomaticReconnect": false,
-      "httpOptions": {
-        "transport": 1,
-        "logMessageContent": true,
-        "skipNegotiation": true
-      }
-    }
-  },
-  "process": {
-    "ids": {
-      "goodsOut": 1000,
-      "goodsIn": 2000,
-      "taskCalendar": 3000,
-      "remission": 4000,
-      "packageInspection": 5000,
-      "assortment": 6000,
-      "pickupShelf": 7000
-    }
-  },
-  "checkForUpdates": 3600000,
-  "licence": {
-    "scandit": "Ae8F2Wx2RMq5Lvn7UUAlWzVFZTt2+ubMAF8XtDpmPlNkBeG/LWs1M7AbgDW0LQqYLnszClEENaEHS56/6Ts2vrJ1Ux03CXUjK3jUvZpF5OchXR1CpnmpepJ6WxPCd7LMVHUGG1BbwPLDTFjP3y8uT0caTSmmGrYQWAs4CZcEF+ZBabP0z7vfm+hCZF/ebj9qqCJZcW8nH/n19hohshllzYBjFXjh87P2lIh1s6yZS3OaQWWXo/o0AKdxx7T6CVyR0/G5zq6uYJWf6rs3euUBEhpzOZHbHZK86Lvy2AVBEyVkkcttlDW1J2fA4l1W1JV/Xibz8AQV6kG482EpGF42KEoK48paZgX3e1AQsqUtmqzw294dcP4zMVstnw5/WrwKKi/5E/nOOJT2txYP1ZufIjPrwNFsqTlv7xCQlHjMzFGYwT816yD5qLRLbwOtjrkUPXNZLZ06T4upvWwJDmm8XgdeoDqMjHdcO4lwji1bl9EiIYJ/2qnsk9yZ2FqSaHzn4cbiL0f5u2HFlNAP0GUujGRlthGhHi6o4dFU+WAxKsFMKVt+SfoQUazNKHFVQgiAklTIZxIc/HUVzRvOLMxf+wFDerraBtcqGJg+g/5mrWYqeDBGhCBHtKiYf6244IJ4afzNTiH1/30SJcRzXwbEa3A7q1fJTx9/nLTOfVPrJKBQs7f/OQs2dA7LDCel8mzXdbjvsNQaeU5+iCIAq6zbTNKy1xT8wwj+VZrQmtNJs+qeznD+u29nCM24h8xCmRpvNPo4/Mww/lrTNrrNwLBSn1pMIwsH7yS9hH0v0oNAM3A6bVtk1D9qEkbyw+xZa+MZGpMP0D0CdcsqHalPcm5r/Ik="
-  },
-  "gender": {
-    "0": "Keine Anrede",
-    "1": "Enby",
-    "2": "Herr",
-    "4": "Frau"
-  },
-  "@shared/icon": "/assets/icons.json"
-}
+{
+  "title": "ISA - Local",
+  "silentRefresh": {
+    "interval": 300000
+  },
+  "debug": true,
+  "dev-scanner": true,
+  "@cdn/product-image": {
+    "url": "https://produktbilder.paragon-data.net"
+  },
+  "@core/auth": {
+    "issuer": "https://sso-test.paragon-data.de",
+    "clientId": "isa-client",
+    "responseType": "code",
+    "scope": "openid profile cmf_user isa-isa-webapi isa-checkout-webapi isa-cat-webapi isa-ava-webapi isa-crm-webapi isa-review-webapi isa-kpi-webapi isa-oms-webapi isa-nbo-webapi isa-print-webapi eis-service isa-inv-webapi isa-wws-webapi",
+    "showDebugInformation": true
+  },
+  "@core/logger": {
+    "logLevel": "debug"
+  },
+  "@swagger/isa": {
+    "rootUrl": "https://isa-test.paragon-data.net/isa/v1"
+  },
+  "@swagger/cat": {
+    "rootUrl": "https://isa-test.paragon-data.net/catsearch/v6"
+  },
+  "@swagger/av": {
+    "rootUrl": "https://isa-test.paragon-data.net/ava/v6"
+  },
+  "@swagger/checkout": {
+    "rootUrl": "https://isa-test.paragon-data.net/checkout/v6"
+  },
+  "@swagger/crm": {
+    "rootUrl": "https://isa-test.paragon-data.net/crm/v6"
+  },
+  "@swagger/oms": {
+    "rootUrl": "https://isa-test.paragon-data.net/oms/v6"
+  },
+  "@swagger/print": {
+    "rootUrl": "https://isa-test.paragon-data.net/print/v1"
+  },
+  "@swagger/eis": {
+    "rootUrl": "https://filialinformationsystem-test.paragon-systems.de/eiswebapi/v1"
+  },
+  "@swagger/remi": {
+    "rootUrl": "https://isa-test.paragon-data.net/inv/v6"
+  },
+  "@swagger/wws": {
+    "rootUrl": "https://isa-test.paragon-data.net/wws/v1"
+  },
+  "@domain/checkout": {
+    "olaExpiration": "5m"
+  },
+  "hubs": {
+    "notifications": {
+      "url": "https://isa-test.paragon-data.net/isa/v1/rt",
+      "enableAutomaticReconnect": false,
+      "httpOptions": {
+        "transport": 1,
+        "logMessageContent": true,
+        "skipNegotiation": true
+      }
+    }
+  },
+  "process": {
+    "ids": {
+      "goodsOut": 1000,
+      "goodsIn": 2000,
+      "taskCalendar": 3000,
+      "packageInspection": 5000,
+      "assortment": 6000,
+      "pickupShelf": 2000
+    }
+  },
+  "checkForUpdates": 3600000,
+  "licence": {
+    "scandit": "Ae8F2Wx2RMq5Lvn7UUAlWzVFZTt2+ubMAF8XtDpmPlNkBeG/LWs1M7AbgDW0LQqYLnszClEENaEHS56/6Ts2vrJ1Ux03CXUjK3jUvZpF5OchXR1CpnmpepJ6WxPCd7LMVHUGG1BbwPLDTFjP3y8uT0caTSmmGrYQWAs4CZcEF+ZBabP0z7vfm+hCZF/ebj9qqCJZcW8nH/n19hohshllzYBjFXjh87P2lIh1s6yZS3OaQWWXo/o0AKdxx7T6CVyR0/G5zq6uYJWf6rs3euUBEhpzOZHbHZK86Lvy2AVBEyVkkcttlDW1J2fA4l1W1JV/Xibz8AQV6kG482EpGF42KEoK48paZgX3e1AQsqUtmqzw294dcP4zMVstnw5/WrwKKi/5E/nOOJT2txYP1ZufIjPrwNFsqTlv7xCQlHjMzFGYwT816yD5qLRLbwOtjrkUPXNZLZ06T4upvWwJDmm8XgdeoDqMjHdcO4lwji1bl9EiIYJ/2qnsk9yZ2FqSaHzn4cbiL0f5u2HFlNAP0GUujGRlthGhHi6o4dFU+WAxKsFMKVt+SfoQUazNKHFVQgiAklTIZxIc/HUVzRvOLMxf+wFDerraBtcqGJg+g/5mrWYqeDBGhCBHtKiYf6244IJ4afzNTiH1/30SJcRzXwbEa3A7q1fJTx9/nLTOfVPrJKBQs7f/OQs2dA7LDCel8mzXdbjvsNQaeU5+iCIAq6zbTNKy1xT8wwj+VZrQmtNJs+qeznD+u29nCM24h8xCmRpvNPo4/Mww/lrTNrrNwLBSn1pMIwsH7yS9hH0v0oNAM3A6bVtk1D9qEkbyw+xZa+MZGpMP0D0CdcsqHalPcm5r/Ik="
+  },
+  "gender": {
+    "0": "Keine Anrede",
+    "1": "Enby",
+    "2": "Herr",
+    "4": "Frau"
+  },
+  "@shared/icon": "/assets/icons.json"
+}
--- a/apps/isa-app/src/core/application/application.service.ts
+++ b/apps/isa-app/src/core/application/application.service.ts
@@ -1,174 +1,196 @@
-import { Injectable } from '@angular/core';
-import { Store } from '@ngrx/store';
-import { BranchDTO } from '@generated/swagger/checkout-api';
-import { isBoolean, isNumber } from '@utils/common';
-import { BehaviorSubject, Observable } from 'rxjs';
-import { first, map, switchMap } from 'rxjs/operators';
-import { ApplicationProcess } from './defs';
-import {
-  removeProcess,
-  selectSection,
-  selectProcesses,
-  setSection,
-  addProcess,
-  setActivatedProcess,
-  selectActivatedProcess,
-  patchProcess,
-  patchProcessData,
-  selectTitle,
-  setTitle,
-} from './store';
-
-@Injectable()
-export class ApplicationService {
-  private activatedProcessIdSubject = new BehaviorSubject<number>(undefined);
-
-  get activatedProcessId() {
-    return this.activatedProcessIdSubject.value;
-  }
-
-  get activatedProcessId$() {
-    return this.activatedProcessIdSubject.asObservable();
-  }
-
-  constructor(private store: Store) {}
-
-  getProcesses$(section?: 'customer' | 'branch') {
-    const processes$ = this.store.select(selectProcesses);
-    return processes$.pipe(
-      map((processes) => processes.filter((process) => (section ? process.section === section : true))),
-    );
-  }
-
-  getProcessById$(processId: number): Observable<ApplicationProcess> {
-    return this.getProcesses$().pipe(map((processes) => processes.find((process) => process.id === processId)));
-  }
-
-  getSection$() {
-    return this.store.select(selectSection);
-  }
-
-  getTitle$() {
-    return this.getSection$().pipe(
-      map((section) => {
-        return section === 'customer' ? 'Kundenbereich' : 'Filialbereich';
-      }),
-    );
-  }
-
-  /** @deprecated */
-  getActivatedProcessId$() {
-    return this.store.select(selectActivatedProcess).pipe(map((process) => process?.id));
-  }
-
-  activateProcess(activatedProcessId: number) {
-    this.store.dispatch(setActivatedProcess({ activatedProcessId }));
-    this.activatedProcessIdSubject.next(activatedProcessId);
-  }
-
-  removeProcess(processId: number) {
-    this.store.dispatch(removeProcess({ processId }));
-  }
-
-  patchProcess(processId: number, changes: Partial<ApplicationProcess>) {
-    this.store.dispatch(patchProcess({ processId, changes }));
-  }
-
-  patchProcessData(processId: number, data: Record<string, any>) {
-    this.store.dispatch(patchProcessData({ processId, data }));
-  }
-
-  getSelectedBranch$(processId?: number): Observable<BranchDTO> {
-    if (!processId) {
-      return this.activatedProcessId$.pipe(
-        switchMap((processId) => this.getProcessById$(processId).pipe(map((process) => process?.data?.selectedBranch))),
-      );
-    }
-
-    return this.getProcessById$(processId).pipe(map((process) => process?.data?.selectedBranch));
-  }
-
-  readonly REGEX_PROCESS_NAME = /^Vorgang \d+$/;
-
-  async createCustomerProcess(processId?: number): Promise<ApplicationProcess> {
-    const processes = await this.getProcesses$('customer').pipe(first()).toPromise();
-
-    const processIds = processes.filter((x) => this.REGEX_PROCESS_NAME.test(x.name)).map((x) => +x.name.split(' ')[1]);
-
-    const maxId = processIds.length > 0 ? Math.max(...processIds) : 0;
-
-    const process: ApplicationProcess = {
-      id: processId ?? Date.now(),
-      type: 'cart',
-      name: `Vorgang ${maxId + 1}`,
-      section: 'customer',
-      closeable: true,
-    };
-
-    await this.createProcess(process);
-
-    return process;
-  }
-
-  async createProcess(process: ApplicationProcess) {
-    const existingProcess = await this.getProcessById$(process?.id).pipe(first()).toPromise();
-    if (existingProcess?.id === process?.id) {
-      throw new Error('Process Id existiert bereits');
-    }
-
-    if (!isNumber(process.id)) {
-      throw new Error('Process Id nicht gesetzt');
-    }
-
-    if (!isBoolean(process.closeable)) {
-      process.closeable = true;
-    }
-
-    if (!isBoolean(process.confirmClosing)) {
-      process.confirmClosing = true;
-    }
-
-    process.created = this._createTimestamp();
-    process.activated = 0;
-    this.store.dispatch(addProcess({ process }));
-  }
-
-  setSection(section: 'customer' | 'branch') {
-    this.store.dispatch(setSection({ section }));
-  }
-
-  getLastActivatedProcessWithSectionAndType$(
-    section: 'customer' | 'branch',
-    type: string,
-  ): Observable<ApplicationProcess> {
-    return this.getProcesses$(section).pipe(
-      map((processes) =>
-        processes
-          ?.filter((process) => process.type === type)
-          ?.reduce((latest, current) => {
-            if (!latest) {
-              return current;
-            }
-            return latest?.activated > current?.activated ? latest : current;
-          }, undefined),
-      ),
-    );
-  }
-
-  getLastActivatedProcessWithSection$(section: 'customer' | 'branch'): Observable<ApplicationProcess> {
-    return this.getProcesses$(section).pipe(
-      map((processes) =>
-        processes?.reduce((latest, current) => {
-          if (!latest) {
-            return current;
-          }
-          return latest?.activated > current?.activated ? latest : current;
-        }, undefined),
-      ),
-    );
-  }
-
-  private _createTimestamp() {
-    return Date.now();
-  }
-}
+import { Injectable } from '@angular/core';
+import { Store } from '@ngrx/store';
+import { BranchDTO } from '@generated/swagger/checkout-api';
+import { isBoolean, isNumber } from '@utils/common';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { first, map, switchMap } from 'rxjs/operators';
+import { ApplicationProcess } from './defs';
+import {
+  removeProcess,
+  selectSection,
+  selectProcesses,
+  setSection,
+  addProcess,
+  setActivatedProcess,
+  selectActivatedProcess,
+  patchProcess,
+  patchProcessData,
+  selectTitle,
+  setTitle,
+} from './store';
+
+@Injectable()
+export class ApplicationService {
+  private activatedProcessIdSubject = new BehaviorSubject<number>(undefined);
+
+  get activatedProcessId() {
+    return this.activatedProcessIdSubject.value;
+  }
+
+  get activatedProcessId$() {
+    return this.activatedProcessIdSubject.asObservable();
+  }
+
+  constructor(private store: Store) {}
+
+  getProcesses$(section?: 'customer' | 'branch') {
+    const processes$ = this.store.select(selectProcesses);
+    return processes$.pipe(
+      map((processes) =>
+        processes.filter((process) =>
+          section ? process.section === section : true,
+        ),
+      ),
+    );
+  }
+
+  getProcessById$(processId: number): Observable<ApplicationProcess> {
+    return this.getProcesses$().pipe(
+      map((processes) => processes.find((process) => process.id === processId)),
+    );
+  }
+
+  getSection$() {
+    return this.store.select(selectSection);
+  }
+
+  getTitle$() {
+    return this.getSection$().pipe(
+      map((section) => {
+        return section === 'customer' ? 'Kundenbereich' : 'Filialbereich';
+      }),
+    );
+  }
+
+  /** @deprecated */
+  getActivatedProcessId$() {
+    return this.store
+      .select(selectActivatedProcess)
+      .pipe(map((process) => process?.id));
+  }
+
+  activateProcess(activatedProcessId: number) {
+    this.store.dispatch(setActivatedProcess({ activatedProcessId }));
+    this.activatedProcessIdSubject.next(activatedProcessId);
+  }
+
+  removeProcess(processId: number) {
+    this.store.dispatch(removeProcess({ processId }));
+  }
+
+  patchProcess(processId: number, changes: Partial<ApplicationProcess>) {
+    this.store.dispatch(patchProcess({ processId, changes }));
+  }
+
+  patchProcessData(processId: number, data: Record<string, any>) {
+    this.store.dispatch(patchProcessData({ processId, data }));
+  }
+
+  getSelectedBranch$(processId?: number): Observable<BranchDTO> {
+    if (!processId) {
+      return this.activatedProcessId$.pipe(
+        switchMap((processId) =>
+          this.getProcessById$(processId).pipe(
+            map((process) => process?.data?.selectedBranch),
+          ),
+        ),
+      );
+    }
+
+    return this.getProcessById$(processId).pipe(
+      map((process) => process?.data?.selectedBranch),
+    );
+  }
+
+  readonly REGEX_PROCESS_NAME = /^Vorgang \d+$/;
+
+  async createCustomerProcess(processId?: number): Promise<ApplicationProcess> {
+    const processes = await this.getProcesses$('customer')
+      .pipe(first())
+      .toPromise();
+
+    const processIds = processes
+      .filter((x) => this.REGEX_PROCESS_NAME.test(x.name))
+      .map((x) => +x.name.split(' ')[1]);
+
+    const maxId = processIds.length > 0 ? Math.max(...processIds) : 0;
+
+    const process: ApplicationProcess = {
+      id: processId ?? Date.now(),
+      type: 'cart',
+      name: `Vorgang ${maxId + 1}`,
+      section: 'customer',
+      closeable: true,
+    };
+
+    await this.createProcess(process);
+
+    return process;
+  }
+
+  async createProcess(process: ApplicationProcess) {
+    const existingProcess = await this.getProcessById$(process?.id)
+      .pipe(first())
+      .toPromise();
+    if (existingProcess?.id === process?.id) {
+      throw new Error('Process Id existiert bereits');
+    }
+
+    if (!isNumber(process.id)) {
+      throw new Error('Process Id nicht gesetzt');
+    }
+
+    if (!isBoolean(process.closeable)) {
+      process.closeable = true;
+    }
+
+    if (!isBoolean(process.confirmClosing)) {
+      process.confirmClosing = true;
+    }
+
+    process.created = this._createTimestamp();
+    process.activated = 0;
+    this.store.dispatch(addProcess({ process }));
+  }
+
+  setSection(section: 'customer' | 'branch') {
+    this.store.dispatch(setSection({ section }));
+  }
+
+  getLastActivatedProcessWithSectionAndType$(
+    section: 'customer' | 'branch',
+    type: string,
+  ): Observable<ApplicationProcess> {
+    return this.getProcesses$(section).pipe(
+      map((processes) =>
+        processes
+          ?.filter((process) => process.type === type)
+          ?.reduce((latest, current) => {
+            if (!latest) {
+              return current;
+            }
+            return latest?.activated > current?.activated ? latest : current;
+          }, undefined),
+      ),
+    );
+  }
+
+  getLastActivatedProcessWithSection$(
+    section: 'customer' | 'branch',
+  ): Observable<ApplicationProcess> {
+    return this.getProcesses$(section).pipe(
+      map((processes) =>
+        processes?.reduce((latest, current) => {
+          if (!latest) {
+            return current;
+          }
+          return latest?.activated > current?.activated ? latest : current;
+        }, undefined),
+      ),
+    );
+  }
+
+  private _createTimestamp() {
+    return Date.now();
+  }
+}
--- a/apps/isa-app/src/domain/checkout/store/domain-checkout.reducer.ts
+++ b/apps/isa-app/src/domain/checkout/store/domain-checkout.reducer.ts
@@ -35,7 +35,7 @@ const _domainCheckoutReducer = createReducer(

      const now = Date.now();

-      for (let shoppingCartItem of addedShoppingCartItems) {
+      for (const shoppingCartItem of addedShoppingCartItems) {
        if (shoppingCartItem.features?.orderType) {
          entity.itemAvailabilityTimestamp[
            `${shoppingCartItem.id}_${shoppingCartItem.features.orderType}`
@@ -275,7 +275,7 @@ function getOrCreateCheckoutEntity({
  entities: Dictionary<CheckoutEntity>;
  processId: number;
 }): CheckoutEntity {
-  let entity = entities[processId];
+  const entity = entities[processId];

  if (isNullOrUndefined(entity)) {
    return {
--- a/apps/isa-app/src/page/assortment/routes.ts
+++ b/apps/isa-app/src/page/assortment/routes.ts
@@ -1,14 +1,19 @@
-import { Routes } from '@angular/router';
-import { AssortmentComponent } from './assortment.component';
-import { PriceUpdateComponent } from './price-update/price-update.component';
-
-export const routes: Routes = [
-  {
-    path: '',
-    component: AssortmentComponent,
-    children: [
-      { path: 'price-update', component: PriceUpdateComponent },
-      { path: '**', redirectTo: 'price-update' },
-    ],
-  },
-];
+import { Routes } from '@angular/router';
+import { AssortmentComponent } from './assortment.component';
+import { PriceUpdateComponent } from './price-update/price-update.component';
+
+export const routes: Routes = [
+  {
+    path: '',
+    component: AssortmentComponent,
+    title: 'Sortiment',
+    children: [
+      {
+        path: 'price-update',
+        component: PriceUpdateComponent,
+        title: 'Sortiment - Preisänderung',
+      },
+      { path: '**', redirectTo: 'price-update' },
+    ],
+  },
+];
--- a/apps/isa-app/src/page/catalog/page-catalog-routing.module.ts
+++ b/apps/isa-app/src/page/catalog/page-catalog-routing.module.ts
@@ -1,125 +1,135 @@
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { ArticleDetailsComponent } from './article-details/article-details.component';
-import { ArticleSearchComponent } from './article-search/article-search.component';
-import { ArticleSearchFilterComponent } from './article-search/search-filter/search-filter.component';
-import { ArticleSearchMainComponent } from './article-search/search-main/search-main.component';
-import { ArticleSearchResultsComponent } from './article-search/search-results/search-results.component';
-import { PageCatalogComponent } from './page-catalog.component';
-import { MatomoRouteData } from 'ngx-matomo-client';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: PageCatalogComponent,
-    data: {
-      matomo: {
-        title: 'Artikelsuche',
-      } as MatomoRouteData,
-    },
-    children: [
-      {
-        path: 'filter',
-        component: ArticleSearchFilterComponent,
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Filter',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'filter/:id',
-        component: ArticleSearchFilterComponent,
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Filter',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'search',
-        component: ArticleSearchComponent,
-        outlet: 'side',
-        data: {
-          matomo: {
-            title: 'Artikelsuche',
-          } as MatomoRouteData,
-        },
-        children: [
-          {
-            path: '',
-            component: ArticleSearchMainComponent,
-          },
-        ],
-      },
-      {
-        path: 'results',
-        component: ArticleSearchResultsComponent,
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Trefferliste',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'results',
-        component: ArticleSearchResultsComponent,
-        outlet: 'side',
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Trefferliste',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'results/:id',
-        component: ArticleSearchResultsComponent,
-        outlet: 'side',
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Artikeldetails',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'results/:ean/ean',
-        component: ArticleSearchResultsComponent,
-        outlet: 'side',
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Artikeldetails (EAN)',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'details/:id',
-        component: ArticleDetailsComponent,
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Artikeldetails (ID)',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'details/:ean/ean',
-        component: ArticleDetailsComponent,
-        data: {
-          matomo: {
-            title: 'Artikelsuche - Artikeldetails (EAN)',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: '',
-        pathMatch: 'full',
-        redirectTo: 'filter',
-      },
-    ],
-  },
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule],
-})
-export class PageCatalogRoutingModule {}
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { ArticleDetailsComponent } from './article-details/article-details.component';
+import { ArticleSearchComponent } from './article-search/article-search.component';
+import { ArticleSearchFilterComponent } from './article-search/search-filter/search-filter.component';
+import { ArticleSearchMainComponent } from './article-search/search-main/search-main.component';
+import { ArticleSearchResultsComponent } from './article-search/search-results/search-results.component';
+import { PageCatalogComponent } from './page-catalog.component';
+import { MatomoRouteData } from 'ngx-matomo-client';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: PageCatalogComponent,
+    title: 'Artikelsuche',
+    data: {
+      matomo: {
+        title: 'Artikelsuche',
+      } as MatomoRouteData,
+    },
+    children: [
+      {
+        path: 'filter',
+        component: ArticleSearchFilterComponent,
+        title: 'Artikelsuche - Filter',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Filter',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'filter/:id',
+        component: ArticleSearchFilterComponent,
+        title: 'Artikelsuche - Filter',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Filter',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'search',
+        component: ArticleSearchComponent,
+        outlet: 'side',
+        title: 'Artikelsuche',
+        data: {
+          matomo: {
+            title: 'Artikelsuche',
+          } as MatomoRouteData,
+        },
+        children: [
+          {
+            path: '',
+            component: ArticleSearchMainComponent,
+          },
+        ],
+      },
+      {
+        path: 'results',
+        component: ArticleSearchResultsComponent,
+        title: 'Artikelsuche - Trefferliste',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Trefferliste',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'results',
+        component: ArticleSearchResultsComponent,
+        outlet: 'side',
+        title: 'Artikelsuche - Trefferliste',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Trefferliste',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'results/:id',
+        component: ArticleSearchResultsComponent,
+        outlet: 'side',
+        title: 'Artikelsuche - Artikeldetails',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Artikeldetails',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'results/:ean/ean',
+        component: ArticleSearchResultsComponent,
+        outlet: 'side',
+        title: 'Artikelsuche - Artikeldetails (EAN)',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Artikeldetails (EAN)',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'details/:id',
+        component: ArticleDetailsComponent,
+        title: 'Artikelsuche - Artikeldetails (ID)',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Artikeldetails (ID)',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'details/:ean/ean',
+        component: ArticleDetailsComponent,
+        title: 'Artikelsuche - Artikeldetails (EAN)',
+        data: {
+          matomo: {
+            title: 'Artikelsuche - Artikeldetails (EAN)',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: '',
+        pathMatch: 'full',
+        redirectTo: 'filter',
+      },
+    ],
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class PageCatalogRoutingModule {}
--- a/apps/isa-app/src/page/checkout/page-checkout-routing.module.ts
+++ b/apps/isa-app/src/page/checkout/page-checkout-routing.module.ts
@@ -14,20 +14,24 @@ const routes: Routes = [
      {
        path: 'details',
        component: CheckoutReviewDetailsComponent,
+        title: 'Bestelldetails',
        outlet: 'side',
      },
      {
        path: 'review',
        component: CheckoutReviewComponent,
+        title: 'Bestellung überprüfen',
      },
      {
        path: 'summary',
        component: CheckoutSummaryComponent,
+        title: 'Bestellübersicht',
        canDeactivate: [canDeactivateTabCleanup],
      },
      {
        path: 'summary/:orderIds',
        component: CheckoutSummaryComponent,
+        title: 'Bestellübersicht',
        canDeactivate: [canDeactivateTabCleanup],
      },
      { path: '', pathMatch: 'full', redirectTo: 'review' },
--- a/apps/isa-app/src/page/customer/routes.ts
+++ b/apps/isa-app/src/page/customer/routes.ts
@@ -1,170 +1,187 @@
-import { Routes } from '@angular/router';
-import { CustomerComponent } from './customer-page.component';
-import { CustomerSearchComponent } from './customer-search/customer-search.component';
-import { CustomerResultsMainViewComponent } from './customer-search/results-main-view/results-main-view.component';
-import { CustomerDetailsViewMainComponent } from './customer-search/details-main-view/details-main-view.component';
-import { CustomerHistoryMainViewComponent } from './customer-search/history-main-view/history-main-view.component';
-import { CustomerFilterMainViewComponent } from './customer-search/filter-main-view/filter-main-view.component';
-import { CustomerCreateGuard } from './guards/customer-create.guard';
-import {
-  CreateB2BCustomerComponent,
-  CreateGuestCustomerComponent,
-  // CreateP4MCustomerComponent,
-  CreateStoreCustomerComponent,
-  CreateWebshopCustomerComponent,
-} from './create-customer';
-// import { UpdateP4MWebshopCustomerComponent } from './create-customer/update-p4m-webshop-customer';
-import { CreateCustomerComponent } from './create-customer/create-customer.component';
-import { CustomerDataEditB2BComponent } from './customer-search/edit-main-view/customer-data-edit-b2b.component';
-import { CustomerDataEditB2CComponent } from './customer-search/edit-main-view/customer-data-edit-b2c.component';
-import { AddBillingAddressMainViewComponent } from './customer-search/add-billing-address-main-view/add-billing-address-main-view.component';
-import { AddShippingAddressMainViewComponent } from './customer-search/add-shipping-address-main-view/add-shipping-address-main-view.component';
-import { EditBillingAddressMainViewComponent } from './customer-search/edit-billing-address-main-view/edit-billing-address-main-view.component';
-import { EditShippingAddressMainViewComponent } from './customer-search/edit-shipping-address-main-view/edit-shipping-address-main-view.component';
-import { CustomerOrdersMainViewComponent } from './customer-search/orders-main-view/orders-main-view.component';
-import { OrderDetailsMainViewComponent } from './customer-search/order-details-main-view/order-details-main-view.component';
-import { KundenkarteMainViewComponent } from './customer-search/kundenkarte-main-view/kundenkarte-main-view.component';
-import { CustomerOrderDetailsHistoryMainViewComponent } from './customer-search/order-details-history-main-view/order-details-history-main-view.component';
-import { CustomerMainViewComponent } from './customer-search/main-view/main-view.component';
-import { MainSideViewComponent } from './customer-search/main-side-view/main-side-view.component';
-import { CustomerResultsSideViewComponent } from './customer-search/results-side-view/results-side-view.component';
-import { OrderDetailsSideViewComponent } from './customer-search/order-details-side-view/order-details-side-view.component';
-import { CustomerCreateSideViewComponent } from './create-customer/customer-create-side-view';
-
-export const routes: Routes = [
-  {
-    path: '',
-    component: CustomerComponent,
-    children: [
-      {
-        path: '',
-        component: CustomerSearchComponent,
-        children: [
-          {
-            path: 'search',
-            component: CustomerMainViewComponent,
-            data: { side: 'main', breadcrumb: 'main' },
-          },
-          {
-            path: 'search/list',
-            component: CustomerResultsMainViewComponent,
-            data: { breadcrumb: 'search' },
-          },
-          {
-            path: 'search/filter',
-            component: CustomerFilterMainViewComponent,
-            data: { side: 'results', breadcrumb: 'filter' },
-          },
-          {
-            path: 'search/:customerId',
-            component: CustomerDetailsViewMainComponent,
-            data: { side: 'results', breadcrumb: 'details' },
-          },
-          {
-            path: 'search/:customerId/history',
-            component: CustomerHistoryMainViewComponent,
-            data: { side: 'results', breadcrumb: 'history' },
-          },
-          {
-            path: 'search/:customerId/kundenkarte',
-            component: KundenkarteMainViewComponent,
-            data: { side: 'results', breadcrumb: 'kundenkarte' },
-          },
-          {
-            path: 'search/:customerId/orders',
-            component: CustomerOrdersMainViewComponent,
-            data: { side: 'results', breadcrumb: 'orders' },
-          },
-          {
-            path: 'search/:customerId/orders/:orderId',
-            component: OrderDetailsMainViewComponent,
-            data: { side: 'order-details', breadcrumb: 'order-details' },
-          },
-          {
-            path: 'search/:customerId/orders/:orderId/:orderItemId',
-            component: OrderDetailsMainViewComponent,
-            data: { side: 'order-details', breadcrumb: 'order-details' },
-          },
-          {
-            path: 'search/:customerId/orders/:orderId/:orderItemId/history',
-            component: CustomerOrderDetailsHistoryMainViewComponent,
-            data: {
-              side: 'order-details',
-              breadcrumb: 'order-details-history',
-            },
-          },
-          {
-            path: 'search/:customerId/edit/b2b',
-            component: CustomerDataEditB2BComponent,
-            data: { side: 'results', breadcrumb: 'edit' },
-          },
-          {
-            path: 'search/:customerId/edit',
-            component: CustomerDataEditB2CComponent,
-            data: { side: 'results', breadcrumb: 'edit' },
-          },
-          {
-            path: 'search/:customerId/billingaddress/add',
-            component: AddBillingAddressMainViewComponent,
-            data: { side: 'results', breadcrumb: 'add-billing-address' },
-          },
-          {
-            path: 'search/:customerId/billingaddress/:payerId/edit',
-            component: EditBillingAddressMainViewComponent,
-            data: { side: 'results', breadcrumb: 'edit-billing-address' },
-          },
-          {
-            path: 'search/:customerId/shippingaddress/add',
-            component: AddShippingAddressMainViewComponent,
-            data: { side: 'results', breadcrumb: 'add-shipping-address' },
-          },
-          {
-            path: 'search/:customerId/shippingaddress/:shippingAddressId/edit',
-            component: EditShippingAddressMainViewComponent,
-            data: { side: 'results', breadcrumb: 'edit-shipping-address' },
-          },
-          {
-            path: 'search-customer-main',
-            outlet: 'side',
-            component: MainSideViewComponent,
-          },
-          {
-            path: 'results',
-            outlet: 'side',
-            component: CustomerResultsSideViewComponent,
-          },
-          {
-            path: 'order-details',
-            outlet: 'side',
-            component: OrderDetailsSideViewComponent,
-          },
-        ],
-      },
-      {
-        path: '',
-        component: CreateCustomerComponent,
-        canActivate: [CustomerCreateGuard],
-        canActivateChild: [CustomerCreateGuard],
-        children: [
-          { path: 'create', component: CreateStoreCustomerComponent },
-          { path: 'create/store', component: CreateStoreCustomerComponent },
-          { path: 'create/webshop', component: CreateWebshopCustomerComponent },
-          { path: 'create/b2b', component: CreateB2BCustomerComponent },
-          { path: 'create/guest', component: CreateGuestCustomerComponent },
-          // { path: 'create/webshop-p4m', component: CreateP4MCustomerComponent, data: { customerType: 'webshop' } },
-          // { path: 'create/store-p4m', component: CreateP4MCustomerComponent, data: { customerType: 'store' } },
-          // {
-          //   path: 'create/webshop-p4m/update',
-          //   component: UpdateP4MWebshopCustomerComponent,
-          //   data: { customerType: 'webshop' },
-          // },
-          {
-            path: 'create-customer-main',
-            outlet: 'side',
-            component: CustomerCreateSideViewComponent,
-          },
-        ],
-      },
-    ],
-  },
-];
+import { Routes } from '@angular/router';
+import { CustomerComponent } from './customer-page.component';
+import { CustomerSearchComponent } from './customer-search/customer-search.component';
+import { CustomerResultsMainViewComponent } from './customer-search/results-main-view/results-main-view.component';
+import { CustomerDetailsViewMainComponent } from './customer-search/details-main-view/details-main-view.component';
+import { CustomerHistoryMainViewComponent } from './customer-search/history-main-view/history-main-view.component';
+import { CustomerFilterMainViewComponent } from './customer-search/filter-main-view/filter-main-view.component';
+import { CustomerCreateGuard } from './guards/customer-create.guard';
+import {
+  CreateB2BCustomerComponent,
+  CreateGuestCustomerComponent,
+  // CreateP4MCustomerComponent,
+  CreateStoreCustomerComponent,
+  CreateWebshopCustomerComponent,
+} from './create-customer';
+// import { UpdateP4MWebshopCustomerComponent } from './create-customer/update-p4m-webshop-customer';
+import { CreateCustomerComponent } from './create-customer/create-customer.component';
+import { CustomerDataEditB2BComponent } from './customer-search/edit-main-view/customer-data-edit-b2b.component';
+import { CustomerDataEditB2CComponent } from './customer-search/edit-main-view/customer-data-edit-b2c.component';
+import { AddBillingAddressMainViewComponent } from './customer-search/add-billing-address-main-view/add-billing-address-main-view.component';
+import { AddShippingAddressMainViewComponent } from './customer-search/add-shipping-address-main-view/add-shipping-address-main-view.component';
+import { EditBillingAddressMainViewComponent } from './customer-search/edit-billing-address-main-view/edit-billing-address-main-view.component';
+import { EditShippingAddressMainViewComponent } from './customer-search/edit-shipping-address-main-view/edit-shipping-address-main-view.component';
+import { CustomerOrdersMainViewComponent } from './customer-search/orders-main-view/orders-main-view.component';
+import { OrderDetailsMainViewComponent } from './customer-search/order-details-main-view/order-details-main-view.component';
+import { KundenkarteMainViewComponent } from './customer-search/kundenkarte-main-view/kundenkarte-main-view.component';
+import { CustomerOrderDetailsHistoryMainViewComponent } from './customer-search/order-details-history-main-view/order-details-history-main-view.component';
+import { CustomerMainViewComponent } from './customer-search/main-view/main-view.component';
+import { MainSideViewComponent } from './customer-search/main-side-view/main-side-view.component';
+import { CustomerResultsSideViewComponent } from './customer-search/results-side-view/results-side-view.component';
+import { OrderDetailsSideViewComponent } from './customer-search/order-details-side-view/order-details-side-view.component';
+import { CustomerCreateSideViewComponent } from './create-customer/customer-create-side-view';
+
+export const routes: Routes = [
+  {
+    path: '',
+    component: CustomerComponent,
+    children: [
+      {
+        path: '',
+        component: CustomerSearchComponent,
+        children: [
+          {
+            path: 'search',
+            component: CustomerMainViewComponent,
+            title: 'Kundensuche',
+            data: { side: 'main', breadcrumb: 'main' },
+          },
+          {
+            path: 'search/list',
+            component: CustomerResultsMainViewComponent,
+            title: 'Kundensuche - Trefferliste',
+            data: { breadcrumb: 'search' },
+          },
+          {
+            path: 'search/filter',
+            component: CustomerFilterMainViewComponent,
+            title: 'Kundensuche - Filter',
+            data: { side: 'results', breadcrumb: 'filter' },
+          },
+          {
+            path: 'search/:customerId',
+            component: CustomerDetailsViewMainComponent,
+            title: 'Kundendetails',
+            data: { side: 'results', breadcrumb: 'details' },
+          },
+          {
+            path: 'search/:customerId/history',
+            component: CustomerHistoryMainViewComponent,
+            title: 'Kundendetails - Verlauf',
+            data: { side: 'results', breadcrumb: 'history' },
+          },
+          {
+            path: 'search/:customerId/kundenkarte',
+            component: KundenkarteMainViewComponent,
+            title: 'Kundendetails - Kundenkarte',
+            data: { side: 'results', breadcrumb: 'kundenkarte' },
+          },
+          {
+            path: 'search/:customerId/orders',
+            component: CustomerOrdersMainViewComponent,
+            title: 'Kundendetails - Bestellungen',
+            data: { side: 'results', breadcrumb: 'orders' },
+          },
+          {
+            path: 'search/:customerId/orders/:orderId',
+            component: OrderDetailsMainViewComponent,
+            title: 'Kundendetails - Bestelldetails',
+            data: { side: 'order-details', breadcrumb: 'order-details' },
+          },
+          {
+            path: 'search/:customerId/orders/:orderId/:orderItemId',
+            component: OrderDetailsMainViewComponent,
+            title: 'Kundendetails - Bestelldetails',
+            data: { side: 'order-details', breadcrumb: 'order-details' },
+          },
+          {
+            path: 'search/:customerId/orders/:orderId/:orderItemId/history',
+            component: CustomerOrderDetailsHistoryMainViewComponent,
+            title: 'Kundendetails - Bestelldetails Verlauf',
+            data: {
+              side: 'order-details',
+              breadcrumb: 'order-details-history',
+            },
+          },
+          {
+            path: 'search/:customerId/edit/b2b',
+            component: CustomerDataEditB2BComponent,
+            title: 'Kundendetails - Bearbeiten (B2B)',
+            data: { side: 'results', breadcrumb: 'edit' },
+          },
+          {
+            path: 'search/:customerId/edit',
+            component: CustomerDataEditB2CComponent,
+            title: 'Kundendetails - Bearbeiten',
+            data: { side: 'results', breadcrumb: 'edit' },
+          },
+          {
+            path: 'search/:customerId/billingaddress/add',
+            component: AddBillingAddressMainViewComponent,
+            title: 'Kundendetails - Neue Rechnungsadresse',
+            data: { side: 'results', breadcrumb: 'add-billing-address' },
+          },
+          {
+            path: 'search/:customerId/billingaddress/:payerId/edit',
+            component: EditBillingAddressMainViewComponent,
+            title: 'Kundendetails - Rechnungsadresse bearbeiten',
+            data: { side: 'results', breadcrumb: 'edit-billing-address' },
+          },
+          {
+            path: 'search/:customerId/shippingaddress/add',
+            component: AddShippingAddressMainViewComponent,
+            title: 'Kundendetails - Neue Lieferadresse',
+            data: { side: 'results', breadcrumb: 'add-shipping-address' },
+          },
+          {
+            path: 'search/:customerId/shippingaddress/:shippingAddressId/edit',
+            component: EditShippingAddressMainViewComponent,
+            title: 'Kundendetails - Lieferadresse bearbeiten',
+            data: { side: 'results', breadcrumb: 'edit-shipping-address' },
+          },
+          {
+            path: 'search-customer-main',
+            outlet: 'side',
+            component: MainSideViewComponent,
+          },
+          {
+            path: 'results',
+            outlet: 'side',
+            component: CustomerResultsSideViewComponent,
+          },
+          {
+            path: 'order-details',
+            outlet: 'side',
+            component: OrderDetailsSideViewComponent,
+          },
+        ],
+      },
+      {
+        path: '',
+        component: CreateCustomerComponent,
+        canActivate: [CustomerCreateGuard],
+        canActivateChild: [CustomerCreateGuard],
+        title: 'Kundendaten erfassen',
+        children: [
+          { path: 'create', component: CreateStoreCustomerComponent },
+          { path: 'create/store', component: CreateStoreCustomerComponent },
+          { path: 'create/webshop', component: CreateWebshopCustomerComponent },
+          { path: 'create/b2b', component: CreateB2BCustomerComponent },
+          { path: 'create/guest', component: CreateGuestCustomerComponent },
+          // { path: 'create/webshop-p4m', component: CreateP4MCustomerComponent, data: { customerType: 'webshop' } },
+          // { path: 'create/store-p4m', component: CreateP4MCustomerComponent, data: { customerType: 'store' } },
+          // {
+          //   path: 'create/webshop-p4m/update',
+          //   component: UpdateP4MWebshopCustomerComponent,
+          //   data: { customerType: 'webshop' },
+          // },
+          {
+            path: 'create-customer-main',
+            outlet: 'side',
+            component: CustomerCreateSideViewComponent,
+          },
+        ],
+      },
+    ],
+  },
+];
--- a/apps/isa-app/src/page/dashboard/dashboard-routing-module.ts
+++ b/apps/isa-app/src/page/dashboard/dashboard-routing-module.ts
@@ -1,16 +1,17 @@
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { DashboardComponent } from './dashboard.component';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: DashboardComponent,
-  },
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule],
-})
-export class DashboardRoutingModule {}
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { DashboardComponent } from './dashboard.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: DashboardComponent,
+    title: 'Dashboard',
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class DashboardRoutingModule {}
--- a/apps/isa-app/src/page/goods-in/good-in-routing.module.ts
+++ b/apps/isa-app/src/page/goods-in/good-in-routing.module.ts
@@ -1,35 +1,51 @@
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { GoodsInCleanupListComponent } from './goods-in-cleanup-list/goods-in-cleanup-list.component';
-import { GoodsInCleanupListModule } from './goods-in-cleanup-list/goods-in-cleanup-list.module';
-import { GoodsInListComponent } from './goods-in-list/goods-in-list.component';
-import { GoodsInListModule } from './goods-in-list/goods-in-list.module';
-import { GoodsInRemissionPreviewComponent } from './goods-in-remission-preview/goods-in-remission-preview.component';
-import { GoodsInRemissionPreviewModule } from './goods-in-remission-preview/goods-in-remission-preview.module';
-import { GoodsInReservationComponent } from './goods-in-reservation/goods-in-reservation.component';
-import { GoodsInReservationModule } from './goods-in-reservation/goods-in-reservation.module';
-import { GoodsInComponent } from './goods-in.component';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: GoodsInComponent,
-    children: [
-      { path: 'list', component: GoodsInListComponent },
-      { path: 'reservation', component: GoodsInReservationComponent },
-      { path: 'cleanup', component: GoodsInCleanupListComponent },
-      { path: 'preview', component: GoodsInRemissionPreviewComponent },
-    ],
-  },
-];
-@NgModule({
-  imports: [
-    RouterModule.forChild(routes),
-    GoodsInListModule,
-    GoodsInCleanupListModule,
-    GoodsInReservationModule,
-    GoodsInRemissionPreviewModule,
-  ],
-  exports: [RouterModule],
-})
-export class GoodsInRoutingModule {}
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { GoodsInCleanupListComponent } from './goods-in-cleanup-list/goods-in-cleanup-list.component';
+import { GoodsInCleanupListModule } from './goods-in-cleanup-list/goods-in-cleanup-list.module';
+import { GoodsInListComponent } from './goods-in-list/goods-in-list.component';
+import { GoodsInListModule } from './goods-in-list/goods-in-list.module';
+import { GoodsInRemissionPreviewComponent } from './goods-in-remission-preview/goods-in-remission-preview.component';
+import { GoodsInRemissionPreviewModule } from './goods-in-remission-preview/goods-in-remission-preview.module';
+import { GoodsInReservationComponent } from './goods-in-reservation/goods-in-reservation.component';
+import { GoodsInReservationModule } from './goods-in-reservation/goods-in-reservation.module';
+import { GoodsInComponent } from './goods-in.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: GoodsInComponent,
+    children: [
+      {
+        path: 'list',
+        component: GoodsInListComponent,
+        title: 'Abholfach - Fehlende',
+      },
+      {
+        path: 'reservation',
+        component: GoodsInReservationComponent,
+        title: 'Abholfach - Reservierung',
+      },
+      {
+        path: 'cleanup',
+        component: GoodsInCleanupListComponent,
+        title: 'Abholfach - Ausräumen',
+      },
+      {
+        path: 'preview',
+        component: GoodsInRemissionPreviewComponent,
+        title: 'Abholfach - Vorschau',
+      },
+    ],
+  },
+];
+@NgModule({
+  imports: [
+    RouterModule.forChild(routes),
+    GoodsInListModule,
+    GoodsInCleanupListModule,
+    GoodsInReservationModule,
+    GoodsInRemissionPreviewModule,
+  ],
+  exports: [RouterModule],
+})
+export class GoodsInRoutingModule {}
--- a/apps/isa-app/src/page/package-inspection/routes.ts
+++ b/apps/isa-app/src/page/package-inspection/routes.ts
@@ -1,22 +1,24 @@
-import { Routes } from '@angular/router';
-import { PackageDetailsComponent } from './package-details';
-import { PackageInspectionComponent } from './package-inspection.component';
-import { PackageResultComponent } from './package-result';
-
-export const packageInspectionRoutes: Routes = [
-  {
-    path: '',
-    component: PackageInspectionComponent,
-    children: [
-      {
-        path: 'packages',
-        component: PackageResultComponent,
-      },
-      {
-        path: 'packages/:id',
-        component: PackageDetailsComponent,
-      },
-      { path: '**', redirectTo: 'packages' },
-    ],
-  },
-];
+import { Routes } from '@angular/router';
+import { PackageDetailsComponent } from './package-details';
+import { PackageInspectionComponent } from './package-inspection.component';
+import { PackageResultComponent } from './package-result';
+
+export const packageInspectionRoutes: Routes = [
+  {
+    path: '',
+    component: PackageInspectionComponent,
+    title: 'Packstück-Prüfung',
+    children: [
+      {
+        path: 'packages',
+        component: PackageResultComponent,
+      },
+      {
+        path: 'packages/:id',
+        component: PackageDetailsComponent,
+        title: 'Packstück-Prüfung - Details',
+      },
+      { path: '**', redirectTo: 'packages' },
+    ],
+  },
+];
--- a/apps/isa-app/src/page/pickup-shelf/pickup-shelf-in/routes.ts
+++ b/apps/isa-app/src/page/pickup-shelf/pickup-shelf-in/routes.ts
@@ -1,146 +1,168 @@
-import { Routes } from '@angular/router';
-import { PickupShelfInComponent } from './pickup-shelf-in.component';
-import { PickupShelfFilterComponent } from '../shared/pickup-shelf-filter/pickup-shelf-filter.component';
-import { PickupShelfInDetailsComponent } from './pickup-shelf-in-details/pickup-shelf-in-details.component';
-import { viewResolver } from '../resolvers/view.resolver';
-import { PickUpShelfHistoryComponent } from '../shared/pickup-shelf-history/pickup-shelf-history.component';
-import { PickUpShelfInMainSideViewComponent } from './pickup-shelf-in-main-side-view/pickup-shelf-in-main-side-view.component';
-import { PickUpShelfInMainComponent } from './pickup-shelf-in-main/pickup-shelf-in-main.component';
-import { PickUpShelfInListComponent } from './pickup-shelf-in-list/pickup-shelf-in-list.component';
-import { PickupShelfInEditComponent } from './pickup-shelf-in-edit/pickup-shelf-in-edit.component';
-import { MatomoRouteData } from 'ngx-matomo-client';
-
-export const routes: Routes = [
-  {
-    path: '',
-    component: PickupShelfInComponent,
-    resolve: {
-      view: viewResolver,
-    },
-    runGuardsAndResolvers: 'always',
-    children: [
-      {
-        path: 'main',
-        component: PickUpShelfInMainComponent,
-        data: {
-          view: 'main',
-          matomo: {
-            title: 'Abholfach',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'list',
-        component: PickUpShelfInListComponent,
-        data: {
-          view: 'list',
-          matomo: {
-            title: 'Abholfach - Trefferliste',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'list/filter',
-        component: PickupShelfFilterComponent,
-        data: {
-          view: 'filter',
-          matomo: {
-            title: 'Abholfach - Filter',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/:orderItemSubsetId/edit',
-        component: PickupShelfInEditComponent,
-        data: {
-          view: 'edit',
-          matomo: {
-            title: 'Abholfach - Bearbeiten',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:orderItemSubsetId/edit',
-        component: PickupShelfInEditComponent,
-        data: {
-          view: 'edit',
-          matomo: {
-            title: 'Abholfach - Bearbeiten',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/:orderItemSubsetId/edit',
-        component: PickupShelfInEditComponent,
-        data: {
-          view: 'edit',
-          matomo: {
-            title: 'Abholfach - Bearbeiten',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/:orderItemSubsetId/history',
-        component: PickUpShelfHistoryComponent,
-        data: {
-          view: 'history',
-          matomo: {
-            title: 'Abholfach - Historie',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:orderItemSubsetId/history',
-        component: PickUpShelfHistoryComponent,
-        data: {
-          view: 'history',
-          matomo: {
-            title: 'Abholfach - Historie',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/:orderItemSubsetId/history',
-        component: PickUpShelfHistoryComponent,
-        data: {
-          view: 'history',
-          matomo: {
-            title: 'Abholfach - Historie',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/:orderItemSubsetId',
-        component: PickupShelfInDetailsComponent,
-        data: {
-          view: 'details',
-          matomo: {
-            title: 'Abholfach - Details',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:orderItemSubsetId',
-        component: PickupShelfInDetailsComponent,
-        data: {
-          view: 'details',
-          matomo: {
-            title: 'Abholfach - Details',
-          } as MatomoRouteData,
-        },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/:orderItemSubsetId',
-        component: PickupShelfInDetailsComponent,
-        data: {
-          view: 'details',
-          matomo: {
-            title: 'Abholfach - Details',
-          } as MatomoRouteData,
-        },
-      },
-      { path: 'search', component: PickUpShelfInMainSideViewComponent, outlet: 'side' },
-      { path: 'list', component: PickUpShelfInListComponent, data: { view: 'list' }, outlet: 'side' },
-    ],
-  },
-];
+import { Routes } from '@angular/router';
+import { PickupShelfInComponent } from './pickup-shelf-in.component';
+import { PickupShelfFilterComponent } from '../shared/pickup-shelf-filter/pickup-shelf-filter.component';
+import { PickupShelfInDetailsComponent } from './pickup-shelf-in-details/pickup-shelf-in-details.component';
+import { viewResolver } from '../resolvers/view.resolver';
+import { PickUpShelfHistoryComponent } from '../shared/pickup-shelf-history/pickup-shelf-history.component';
+import { PickUpShelfInMainSideViewComponent } from './pickup-shelf-in-main-side-view/pickup-shelf-in-main-side-view.component';
+import { PickUpShelfInMainComponent } from './pickup-shelf-in-main/pickup-shelf-in-main.component';
+import { PickUpShelfInListComponent } from './pickup-shelf-in-list/pickup-shelf-in-list.component';
+import { PickupShelfInEditComponent } from './pickup-shelf-in-edit/pickup-shelf-in-edit.component';
+import { MatomoRouteData } from 'ngx-matomo-client';
+
+export const routes: Routes = [
+  {
+    path: '',
+    component: PickupShelfInComponent,
+    resolve: {
+      view: viewResolver,
+    },
+    runGuardsAndResolvers: 'always',
+    title: 'Abholfach - Einbuchen',
+    children: [
+      {
+        path: 'main',
+        component: PickUpShelfInMainComponent,
+        data: {
+          view: 'main',
+          matomo: {
+            title: 'Abholfach',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'list',
+        component: PickUpShelfInListComponent,
+        title: 'Abholfach - Trefferliste',
+        data: {
+          view: 'list',
+          matomo: {
+            title: 'Abholfach - Trefferliste',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'list/filter',
+        component: PickupShelfFilterComponent,
+        title: 'Abholfach - Filter',
+        data: {
+          view: 'filter',
+          matomo: {
+            title: 'Abholfach - Filter',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/:orderItemSubsetId/edit',
+        component: PickupShelfInEditComponent,
+        title: 'Abholfach - Bearbeiten',
+        data: {
+          view: 'edit',
+          matomo: {
+            title: 'Abholfach - Bearbeiten',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:orderItemSubsetId/edit',
+        component: PickupShelfInEditComponent,
+        title: 'Abholfach - Bearbeiten',
+        data: {
+          view: 'edit',
+          matomo: {
+            title: 'Abholfach - Bearbeiten',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/:orderItemSubsetId/edit',
+        component: PickupShelfInEditComponent,
+        title: 'Abholfach - Bearbeiten',
+        data: {
+          view: 'edit',
+          matomo: {
+            title: 'Abholfach - Bearbeiten',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/:orderItemSubsetId/history',
+        component: PickUpShelfHistoryComponent,
+        title: 'Abholfach - Historie',
+        data: {
+          view: 'history',
+          matomo: {
+            title: 'Abholfach - Historie',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:orderItemSubsetId/history',
+        component: PickUpShelfHistoryComponent,
+        title: 'Abholfach - Historie',
+        data: {
+          view: 'history',
+          matomo: {
+            title: 'Abholfach - Historie',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/:orderItemSubsetId/history',
+        component: PickUpShelfHistoryComponent,
+        title: 'Abholfach - Historie',
+        data: {
+          view: 'history',
+          matomo: {
+            title: 'Abholfach - Historie',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/:orderItemSubsetId',
+        component: PickupShelfInDetailsComponent,
+        title: 'Abholfach - Details',
+        data: {
+          view: 'details',
+          matomo: {
+            title: 'Abholfach - Details',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:orderItemSubsetId',
+        component: PickupShelfInDetailsComponent,
+        title: 'Abholfach - Details',
+        data: {
+          view: 'details',
+          matomo: {
+            title: 'Abholfach - Details',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/:orderItemSubsetId',
+        component: PickupShelfInDetailsComponent,
+        title: 'Abholfach - Details',
+        data: {
+          view: 'details',
+          matomo: {
+            title: 'Abholfach - Details',
+          } as MatomoRouteData,
+        },
+      },
+      {
+        path: 'search',
+        component: PickUpShelfInMainSideViewComponent,
+
+        outlet: 'side',
+      },
+      {
+        path: 'list',
+        component: PickUpShelfInListComponent,
+        data: { view: 'list' },
+        outlet: 'side',
+      },
+    ],
+  },
+];
--- a/apps/isa-app/src/page/pickup-shelf/pickup-shelf-out/routes.ts
+++ b/apps/isa-app/src/page/pickup-shelf/pickup-shelf-out/routes.ts
@@ -1,75 +1,107 @@
-import { Routes } from '@angular/router';
-import { PickupShelfOutComponent } from './pickup-shelf-out.component';
-import { PickupShelfOutMainComponent } from './pickup-shelf-out-main/pickup-shelf-out-main.component';
-
-import { PickupShelfOutListComponent } from './pickup-shelf-out-list/pickup-shelf-out-list.component';
-import { PickupShelfFilterComponent } from '../shared/pickup-shelf-filter/pickup-shelf-filter.component';
-import { PickupShelfOutDetailsComponent } from './pickup-shelf-out-details/pickup-shelf-out-details.component';
-import { PickupShelfOutMainSideViewComponent } from './pickup-shelf-out-main-side-view/pickup-shelf-out-main-side-view.component';
-import { viewResolver } from '../resolvers/view.resolver';
-import { PickUpShelfHistoryComponent } from '../shared/pickup-shelf-history/pickup-shelf-history.component';
-import { PickupShelfOutEditComponent } from './pickup-shelf-out-edit/pickup-shelf-out-edit.component';
-
-export const routes: Routes = [
-  {
-    path: '',
-    component: PickupShelfOutComponent,
-    resolve: {
-      view: viewResolver,
-    },
-    runGuardsAndResolvers: 'always',
-    children: [
-      { path: 'main', component: PickupShelfOutMainComponent, data: { view: 'main' } },
-      { path: 'list', component: PickupShelfOutListComponent, data: { view: 'list' } },
-      { path: 'list/filter', component: PickupShelfFilterComponent, data: { view: 'filter' } },
-      {
-        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/edit',
-        component: PickupShelfOutEditComponent,
-        data: { view: 'edit' },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/status/:orderItemProcessingStatus/edit',
-        component: PickupShelfOutEditComponent,
-        data: { view: 'edit' },
-      },
-
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/status/:orderItemProcessingStatus/edit',
-        component: PickupShelfOutEditComponent,
-        data: { view: 'edit' },
-      },
-      {
-        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/history',
-        component: PickUpShelfHistoryComponent,
-        data: { view: 'history' },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/status/:orderItemProcessingStatus/history',
-        component: PickUpShelfHistoryComponent,
-        data: { view: 'history' },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/status/:orderItemProcessingStatus/history',
-        component: PickUpShelfHistoryComponent,
-        data: { view: 'history' },
-      },
-      {
-        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus',
-        component: PickupShelfOutDetailsComponent,
-        data: { view: 'details' },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/status/:orderItemProcessingStatus',
-        component: PickupShelfOutDetailsComponent,
-        data: { view: 'details' },
-      },
-      {
-        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/status/:orderItemProcessingStatus',
-        component: PickupShelfOutDetailsComponent,
-        data: { view: 'details' },
-      },
-      { path: 'search', component: PickupShelfOutMainSideViewComponent, outlet: 'side' },
-      { path: 'list', component: PickupShelfOutListComponent, data: { view: 'list' }, outlet: 'side' },
-    ],
-  },
-];
+import { Routes } from '@angular/router';
+import { PickupShelfOutComponent } from './pickup-shelf-out.component';
+import { PickupShelfOutMainComponent } from './pickup-shelf-out-main/pickup-shelf-out-main.component';
+
+import { PickupShelfOutListComponent } from './pickup-shelf-out-list/pickup-shelf-out-list.component';
+import { PickupShelfFilterComponent } from '../shared/pickup-shelf-filter/pickup-shelf-filter.component';
+import { PickupShelfOutDetailsComponent } from './pickup-shelf-out-details/pickup-shelf-out-details.component';
+import { PickupShelfOutMainSideViewComponent } from './pickup-shelf-out-main-side-view/pickup-shelf-out-main-side-view.component';
+import { viewResolver } from '../resolvers/view.resolver';
+import { PickUpShelfHistoryComponent } from '../shared/pickup-shelf-history/pickup-shelf-history.component';
+import { PickupShelfOutEditComponent } from './pickup-shelf-out-edit/pickup-shelf-out-edit.component';
+
+export const routes: Routes = [
+  {
+    path: '',
+    component: PickupShelfOutComponent,
+    resolve: {
+      view: viewResolver,
+    },
+    runGuardsAndResolvers: 'always',
+    title: 'Warenausgabe',
+    children: [
+      {
+        path: 'main',
+        component: PickupShelfOutMainComponent,
+        data: { view: 'main' },
+      },
+      {
+        path: 'list',
+        component: PickupShelfOutListComponent,
+        data: { view: 'list' },
+      },
+      {
+        path: 'list/filter',
+        component: PickupShelfFilterComponent,
+        data: { view: 'filter' },
+      },
+      {
+        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/edit',
+        component: PickupShelfOutEditComponent,
+        title: 'Warenausgabe - Details',
+        data: { view: 'edit' },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/status/:orderItemProcessingStatus/edit',
+        component: PickupShelfOutEditComponent,
+        title: 'Warenausgabe - Details',
+        data: { view: 'edit' },
+      },
+
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/status/:orderItemProcessingStatus/edit',
+        component: PickupShelfOutEditComponent,
+        title: 'Warenausgabe - Details',
+        data: { view: 'edit' },
+      },
+      {
+        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus/history',
+        component: PickUpShelfHistoryComponent,
+        title: 'Warenausgabe - Verlauf',
+        data: { view: 'history' },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/status/:orderItemProcessingStatus/history',
+        component: PickUpShelfHistoryComponent,
+        title: 'Warenausgabe - Verlauf',
+        data: { view: 'history' },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/status/:orderItemProcessingStatus/history',
+        component: PickUpShelfHistoryComponent,
+        title: 'Warenausgabe - Verlauf',
+        data: { view: 'history' },
+      },
+      {
+        path: 'order/:orderId/:orderNumber/item/status/:orderItemProcessingStatus',
+        component: PickupShelfOutDetailsComponent,
+        title: 'Warenausgabe - Details',
+        data: { view: 'details' },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/status/:orderItemProcessingStatus',
+        component: PickupShelfOutDetailsComponent,
+        title: 'Warenausgabe - Details',
+        data: { view: 'details' },
+      },
+      {
+        path: 'order/:orderId/compartment/:compartmentCode/:compartmentInfo/status/:orderItemProcessingStatus',
+        component: PickupShelfOutDetailsComponent,
+        title: 'Warenausgabe - Details',
+        data: { view: 'details' },
+      },
+      {
+        path: 'search',
+        component: PickupShelfOutMainSideViewComponent,
+        outlet: 'side',
+        data: { view: 'search' },
+      },
+      {
+        path: 'list',
+        component: PickupShelfOutListComponent,
+        data: { view: 'list' },
+        outlet: 'side',
+      },
+    ],
+  },
+];
--- a/apps/isa-app/src/page/task-calendar/page-task-calendar-routing.module.ts
+++ b/apps/isa-app/src/page/task-calendar/page-task-calendar-routing.module.ts
@@ -1,27 +1,36 @@
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { PageTaskCalendarComponent } from './page-task-calendar.component';
-import { CalendarComponent } from './pages/calendar/calendar.component';
-import { CalendarModule } from './pages/calendar/calendar.module';
-import { TaskSearchComponent } from './pages/task-search';
-import { TasksComponent } from './pages/tasks/tasks.component';
-import { TasksModule } from './pages/tasks/tasks.module';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: PageTaskCalendarComponent,
-    children: [
-      { path: 'calendar', component: CalendarComponent },
-      { path: 'tasks', component: TasksComponent },
-      { path: 'search', component: TaskSearchComponent },
-      { path: '', pathMatch: 'full', redirectTo: 'tasks' },
-    ],
-  },
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes), CalendarModule, TasksModule],
-  exports: [RouterModule],
-})
-export class PageTaskCalendarRoutingModule {}
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { PageTaskCalendarComponent } from './page-task-calendar.component';
+import { CalendarComponent } from './pages/calendar/calendar.component';
+import { CalendarModule } from './pages/calendar/calendar.module';
+import { TaskSearchComponent } from './pages/task-search';
+import { TasksComponent } from './pages/tasks/tasks.component';
+import { TasksModule } from './pages/tasks/tasks.module';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: PageTaskCalendarComponent,
+    title: 'Tätigkeitskalender',
+    children: [
+      { path: 'calendar', component: CalendarComponent },
+      {
+        path: 'tasks',
+        title: 'Tätigkeitskalender - Aufgaben',
+        component: TasksComponent,
+      },
+      {
+        path: 'search',
+        title: 'Tätigkeitskalender - Suche',
+        component: TaskSearchComponent,
+      },
+      { path: '', pathMatch: 'full', redirectTo: 'tasks' },
+    ],
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes), CalendarModule, TasksModule],
+  exports: [RouterModule],
+})
+export class PageTaskCalendarRoutingModule {}