#4534 Goods In Out Order Edit Always Show Price with Two Decimal Places

#4550 Fix Multiple Processes Bug

.vscode/extensions.json

@@ -3,6 +3,5 @@
         "johnpapa.angular2",
         "esbenp.prettier-vscode",
         "angular.ng-template",
-        "eg2.vscode-npm-script"
     ]
 }

angular.json

@@ -375,37 +375,6 @@
         }
       }
     },
-    "@shell/breadcrumb": {
-      "projectType": "library",
-      "root": "apps/shell/breadcrumb",
-      "sourceRoot": "apps/shell/breadcrumb/src",
-      "prefix": "shell",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
-          "options": {
-            "tsConfig": "apps/shell/breadcrumb/tsconfig.lib.json",
-            "project": "apps/shell/breadcrumb/ng-package.json"
-          },
-          "configurations": {
-            "production": {
-              "tsConfig": "apps/shell/breadcrumb/tsconfig.lib.prod.json"
-            }
-          }
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "tsConfig": "apps/shell/breadcrumb/tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "polyfills": [
-              "zone.js",
-              "zone.js/testing"
-            ]
-          }
-        }
-      }
-    },
     "@domain/defs": {
       "projectType": "library",
       "root": "apps/domain/defs",
@@ -840,37 +809,6 @@
         }
       }
     },
-    "@shell/header": {
-      "projectType": "library",
-      "root": "apps/shell/header",
-      "sourceRoot": "apps/shell/header/src",
-      "prefix": "shell",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
-          "options": {
-            "tsConfig": "apps/shell/header/tsconfig.lib.json",
-            "project": "apps/shell/header/ng-package.json"
-          },
-          "configurations": {
-            "production": {
-              "tsConfig": "apps/shell/header/tsconfig.lib.prod.json"
-            }
-          }
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "tsConfig": "apps/shell/header/tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "polyfills": [
-              "zone.js",
-              "zone.js/testing"
-            ]
-          }
-        }
-      }
-    },
     "@modal/reorder": {
       "projectType": "library",
       "root": "apps/modal/reorder",
@@ -1058,74 +996,6 @@
         }
       }
     },
-    "@shell/footer": {
-      "projectType": "library",
-      "root": "apps/shell/footer",
-      "sourceRoot": "apps/shell/footer/src",
-      "prefix": "lib",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
-          "options": {
-            "project": "apps/shell/footer/ng-package.json"
-          },
-          "configurations": {
-            "production": {
-              "tsConfig": "apps/shell/footer/tsconfig.lib.prod.json"
-            },
-            "development": {
-              "tsConfig": "apps/shell/footer/tsconfig.lib.json"
-            }
-          },
-          "defaultConfiguration": "production"
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "tsConfig": "apps/shell/footer/tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "polyfills": [
-              "zone.js",
-              "zone.js/testing"
-            ]
-          }
-        }
-      }
-    },
-    "@shell/process": {
-      "projectType": "library",
-      "root": "apps/shell/process",
-      "sourceRoot": "apps/shell/process/src",
-      "prefix": "lib",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
-          "options": {
-            "project": "apps/shell/process/ng-package.json"
-          },
-          "configurations": {
-            "production": {
-              "tsConfig": "apps/shell/process/tsconfig.lib.prod.json"
-            },
-            "development": {
-              "tsConfig": "apps/shell/process/tsconfig.lib.json"
-            }
-          },
-          "defaultConfiguration": "production"
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "tsConfig": "apps/shell/process/tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "polyfills": [
-              "zone.js",
-              "zone.js/testing"
-            ]
-          }
-        }
-      }
-    },
     "@domain/isa": {
       "projectType": "library",
       "root": "apps/domain/isa",
@@ -1160,40 +1030,6 @@
         }
       }
     },
-    "@shell/filter-overlay": {
-      "projectType": "library",
-      "root": "apps/shell/filter-overlay",
-      "sourceRoot": "apps/shell/filter-overlay/src",
-      "prefix": "lib",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
-          "options": {
-            "project": "apps/shell/filter-overlay/ng-package.json"
-          },
-          "configurations": {
-            "production": {
-              "tsConfig": "apps/shell/filter-overlay/tsconfig.lib.prod.json"
-            },
-            "development": {
-              "tsConfig": "apps/shell/filter-overlay/tsconfig.lib.json"
-            }
-          },
-          "defaultConfiguration": "production"
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "tsConfig": "apps/shell/filter-overlay/tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "polyfills": [
-              "zone.js",
-              "zone.js/testing"
-            ]
-          }
-        }
-      }
-    },
     "@store/search-component-store": {
       "projectType": "library",
       "root": "apps/store/search-component-store",
@@ -1634,6 +1470,39 @@
           }
         }
       }
+    },
+    "shell": {
+      "projectType": "library",
+      "root": "apps/shell",
+      "sourceRoot": "apps/shell/src",
+      "prefix": "shell",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "apps/shell/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "apps/shell/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "apps/shell/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "tsConfig": "apps/shell/tsconfig.spec.json",
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ]
+          }
+        }
+      }
     }
   },
   "cli": {

apps/adapter/scan/src/lib/dev.scan-adapter.ts

@@ -11,9 +11,10 @@ export class DevScanAdapter implements ScanAdapter {
   constructor(private _modal: UiModalService, private _environmentService: EnvironmentService) {}
 
   async init(): Promise<boolean> {
-    return new Promise((resolve, reject) => {
-      resolve(isDevMode());
-    });
+    return Promise.resolve(false);
+    // return new Promise((resolve, reject) => {
+    //   resolve(isDevMode());
+    // });
   }
 
   scan(): Observable<string> {

apps/cdn/product-image/src/lib/product-image.module.ts

@@ -2,8 +2,8 @@ import { NgModule } from '@angular/core';
 import { ProductImagePipe } from './product-image.pipe';
 
 @NgModule({
-  declarations: [ProductImagePipe],
-  imports: [],
+  declarations: [],
+  imports: [ProductImagePipe],
   exports: [ProductImagePipe],
 })
 export class ProductImageModule {}

apps/cdn/product-image/src/lib/product-image.pipe.ts

@@ -3,6 +3,8 @@ import { ProductImageService } from './product-image.service';
 
 @Pipe({
   name: 'productImage',
+  standalone: true,
+  pure: true,
 })
 export class ProductImagePipe implements PipeTransform {
   constructor(private imageService: ProductImageService) {}

apps/core/application/src/lib/application.service.ts

@@ -1,5 +1,4 @@
 import { Injectable } from '@angular/core';
-import { DomainAvailabilityService } from '@domain/availability';
 import { Store } from '@ngrx/store';
 import { BranchDTO } from '@swagger/checkout';
 import { isBoolean, isNumber } from '@utils/common';
@@ -16,19 +15,18 @@ import {
   selectActivatedProcess,
   patchProcess,
   patchProcessData,
+  selectTitle,
+  setTitle,
 } from './store';
 
 @Injectable()
 export class ApplicationService {
-  /** @deprecated */
   private activatedProcessIdSubject = new BehaviorSubject<number>(undefined);
 
-  /** @deprecated */
   get activatedProcessId() {
     return this.activatedProcessIdSubject.value;
   }
 
-  /** @deprecated */
   get activatedProcessId$() {
     return this.activatedProcessIdSubject.asObservable();
   }
@@ -48,6 +46,14 @@ export class ApplicationService {
     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));
@@ -80,6 +86,28 @@ export class ApplicationService {
     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) {

apps/core/application/src/lib/store/application.actions.ts

@@ -3,6 +3,8 @@ import { ApplicationProcess } from '..';
 
 const prefix = '[CORE-APPLICATION]';
 
+export const setTitle = createAction(`${prefix} Set Title`, props<{ title: string }>());
+
 export const setSection = createAction(`${prefix} Set Section`, props<{ section: 'customer' | 'branch' }>());
 
 export const addProcess = createAction(`${prefix} Add Process`, props<{ process: ApplicationProcess }>());

apps/core/application/src/lib/store/application.reducer.ts

@@ -1,9 +1,18 @@
 import { Action, createReducer, on } from '@ngrx/store';
-import { setSection, addProcess, removeProcess, setActivatedProcess, patchProcess, patchProcessData } from './application.actions';
+import {
+  setSection,
+  addProcess,
+  removeProcess,
+  setActivatedProcess,
+  patchProcess,
+  patchProcessData,
+  setTitle,
+} from './application.actions';
 import { ApplicationState, INITIAL_APPLICATION_STATE } from './application.state';
 
 const _applicationReducer = createReducer(
   INITIAL_APPLICATION_STATE,
+  on(setTitle, (state, { title }) => ({ ...state, title })),
   on(setSection, (state, { section }) => ({ ...state, section })),
   on(addProcess, (state, { process }) => ({ ...state, processes: [...state.processes, { data: {}, ...process }] })),
   on(removeProcess, (state, { processId }) => {

apps/core/application/src/lib/store/application.selectors.ts

@@ -2,6 +2,8 @@ import { createFeatureSelector, createSelector } from '@ngrx/store';
 import { ApplicationState } from './application.state';
 export const selectApplicationState = createFeatureSelector<ApplicationState>('core-application');
 
+export const selectTitle = createSelector(selectApplicationState, (s) => s.title);
+
 export const selectSection = createSelector(selectApplicationState, (s) => s.section);
 
 export const selectProcesses = createSelector(selectApplicationState, (s) => s.processes);

apps/core/application/src/lib/store/application.state.ts

@@ -1,11 +1,13 @@
 import { ApplicationProcess } from '../defs';
 
 export interface ApplicationState {
+  title: string;
   processes: ApplicationProcess[];
   section: 'customer' | 'branch';
 }
 
 export const INITIAL_APPLICATION_STATE: ApplicationState = {
+  title: '',
   processes: [],
   section: 'customer',
 };

apps/core/breadcrumb/src/lib/breadcrumb.service.ts

@@ -135,9 +135,9 @@ export class BreadcrumbService {
     crumbs.forEach((crumb) => this.removeBreadcrumb(crumb.id));
   }
 
-  getLatestBreadcrumbForSection(section: 'customer' | 'branch') {
+  getLatestBreadcrumbForSection(section: 'customer' | 'branch', predicate: (crumb: Breadcrumb) => boolean = (_) => true) {
     return this.store
       .select(selectors.selectBreadcrumbsBySection, { section })
-      .pipe(map((crumbs) => crumbs.sort((a, b) => b.changed - a.changed).find((f) => true)));
+      .pipe(map((crumbs) => crumbs.sort((a, b) => b.timestamp - a.timestamp).find((f) => predicate(f))));
   }
 }

apps/core/breadcrumb/src/lib/defs/breadcrumb.model.ts

@@ -22,7 +22,7 @@ export interface Breadcrumb {
   /**
    * Url
    */
-  path: string;
+  path: string | any[];
 
   /**
    * Query Parameter

apps/core/cache/src/lib/cache.service.ts

@@ -1,14 +1,24 @@
 import { Injectable } from '@angular/core';
 import { CacheOptions } from './cache-options';
 import { Cached } from './cached';
+import { interval } from 'rxjs';
 
 @Injectable({
   providedIn: 'root',
 })
 export class CacheService {
-  constructor() {}
+  constructor() {
+    this._registerCleanupTask();
+  }
 
-  set(token: Object, data: any, options?: CacheOptions) {
+  _registerCleanupTask() {
+    this.cleanup();
+    interval(1000 * 60).subscribe(() => {
+      this.cleanup();
+    });
+  }
+
+  set<T>(token: Object, data: T, options?: CacheOptions) {
     const persist = options?.persist;
     const ttl = options?.ttl;
     const cached: Cached = {
@@ -17,6 +27,8 @@ export class CacheService {
 
     if (ttl) {
       cached.until = Date.now() + ttl;
+    } else {
+      cached.until = Date.now() + 1000 * 60 * 60 * 12;
     }
 
     if (persist) {
@@ -29,13 +41,15 @@ export class CacheService {
     return cached;
   }
 
-  get<T = any>(token: Object, from: 'session' | 'persist' = 'session'): T {
+  get<T = any>(token: Object, from?: 'session' | 'persist'): T {
     let cached: Cached;
 
     if (from === 'session') {
       cached = this.deserialize(sessionStorage.getItem(this.getKey(token)));
     } else if (from === 'persist') {
       cached = this.deserialize(localStorage.getItem(this.getKey(token)));
+    } else {
+      cached = this.deserialize(sessionStorage.getItem(this.getKey(token))) || this.deserialize(localStorage.getItem(this.getKey(token)));
     }
 
     if (!cached) {
@@ -59,7 +73,8 @@ export class CacheService {
   }
 
   private getKey(token: Object) {
-    return this.hash(JSON.stringify(token));
+    const key = `CacheService_` + this.hash(JSON.stringify(token));
+    return key;
   }
 
   private hash(data: string): string {
@@ -77,4 +92,25 @@ export class CacheService {
   private deserialize(data: string): Cached {
     return JSON.parse(data);
   }
+
+  cleanup() {
+    // get all keys created by this service by looking for the service name and remove the entries
+    // that ttl is expired
+    let localStorageKeys = Object.keys(localStorage).filter((key) => key.startsWith('CacheService_'));
+    let seesionStorageKeys = Object.keys(sessionStorage).filter((key) => key.startsWith('CacheService_'));
+
+    localStorageKeys.forEach((key) => {
+      const cached = this.deserialize(localStorage.getItem(key));
+      if (cached.until < Date.now()) {
+        localStorage.removeItem(key);
+      }
+    });
+
+    seesionStorageKeys.forEach((key) => {
+      const cached = this.deserialize(sessionStorage.getItem(key));
+      if (cached.until < Date.now()) {
+        sessionStorage.removeItem(key);
+      }
+    });
+  }
 }

apps/core/environment/src/lib/environment.service.ts

@@ -1,17 +1,77 @@
 import { Injectable } from '@angular/core';
 import { Platform } from '@angular/cdk/platform';
 import { NativeContainerService } from 'native-container';
+import { BreakpointObserver } from '@angular/cdk/layout';
+import { map } from 'rxjs/operators';
+
+const MATCH_TABLET = '(max-width: 1023px)';
+
+const MATCH_DESKTOP_SMALL = '(min-width: 1024px) and (max-width: 1279px)';
+
+const MATCH_DESKTOP = '(min-width: 1280px)';
+
+const MATCH_DESKTOP_LARGE = '(min-width: 1440px)';
+
+const MATCH_DESKTOP_XLARGE = '(min-width: 1920px)';
+
+const MATCH_DESKTOP_XXLARGE = '(min-width: 2736px)';
 
 @Injectable({
   providedIn: 'root',
 })
 export class EnvironmentService {
-  constructor(private _platform: Platform, private _nativeContainer: NativeContainerService) {}
+  constructor(
+    private _platform: Platform,
+    private _nativeContainer: NativeContainerService,
+    private _breakpointObserver: BreakpointObserver
+  ) {}
 
+  matchTablet(): boolean {
+    return this._breakpointObserver.isMatched(MATCH_TABLET);
+  }
+
+  matchTablet$ = this._breakpointObserver.observe(MATCH_TABLET).pipe(map((result) => result.matches));
+
+  matchDesktopSmall(): boolean {
+    return this._breakpointObserver.isMatched(MATCH_DESKTOP_SMALL);
+  }
+
+  matchDesktopSmall$ = this._breakpointObserver.observe(MATCH_DESKTOP_SMALL).pipe(map((result) => result.matches));
+
+  matchDesktop(): boolean {
+    return this._breakpointObserver.isMatched(MATCH_DESKTOP);
+  }
+
+  matchDesktop$ = this._breakpointObserver.observe(MATCH_DESKTOP).pipe(map((result) => result.matches));
+
+  matchDesktopLarge(): boolean {
+    return this._breakpointObserver.isMatched(MATCH_DESKTOP_LARGE);
+  }
+
+  matchDesktopLarge$ = this._breakpointObserver.observe(MATCH_DESKTOP_LARGE).pipe(map((result) => result.matches));
+
+  matchDesktopXLarge(): boolean {
+    return this._breakpointObserver.isMatched(MATCH_DESKTOP_XLARGE);
+  }
+
+  matchDesktopXLarge$ = this._breakpointObserver.observe(MATCH_DESKTOP_XLARGE).pipe(map((result) => result.matches));
+
+  matchDesktopXXLarge(): boolean {
+    return this._breakpointObserver.isMatched(MATCH_DESKTOP_XXLARGE);
+  }
+
+  matchDesktopXXLarge$ = this._breakpointObserver.observe(MATCH_DESKTOP_XXLARGE).pipe(map((result) => result.matches));
+
+  /**
+   * @deprecated Use `matchDesktopSmall` or 'matchDesktop' instead.
+   */
   isDesktop(): boolean {
     return !this.isTablet();
   }
 
+  /**
+   * @deprecated Use `matchTablet` instead.
+   */
   isTablet(): boolean {
     return this.isNative() || this.isSafari();
   }
@@ -21,6 +81,6 @@ export class EnvironmentService {
   }
 
   isSafari(): boolean {
-    return (this._platform.ANDROID || this._platform.IOS) && this._platform.SAFARI;
+    return this._platform.IOS && this._platform.SAFARI;
   }
 }

apps/core/toast/src/lib/animation/toast-animation.ts

@@ -1,14 +0,0 @@
-import { AnimationTriggerMetadata, trigger, state, transition, style, animate } from '@angular/animations';
-
-export const slideAnimationTime = 150;
-export const toastAnimations: {
-  readonly slideToast: AnimationTriggerMetadata;
-} = {
-  slideToast: trigger('slideAnimation', [
-    state('default', style({ transform: 'translateY(0%)' })),
-    transition('void => *', [style({ transform: 'translateY(-100%)' }), animate(`${slideAnimationTime}ms ease-in`)]),
-    transition('default => closing', animate(`${slideAnimationTime}ms ease-in`, style({ transform: 'translateY(-100%)' }))),
-  ]),
-};
-
-export type ToastAnimationState = 'default' | 'closing';

apps/core/toast/src/lib/defs/index.ts

@@ -1,4 +0,0 @@
-// start:ng42.barrel
-export * from './toast';
-export * from './toast-ref';
-// end:ng42.barrel

apps/core/toast/src/lib/defs/toast-ref.ts

@@ -1,17 +0,0 @@
-import { OverlayRef } from '@angular/cdk/overlay';
-
-export class ToastRef {
-  constructor(private readonly _overlay: OverlayRef) {}
-
-  close() {
-    this._overlay.dispose();
-  }
-
-  isVisible() {
-    return this._overlay && this._overlay.overlayElement;
-  }
-
-  getPosition() {
-    return this._overlay.overlayElement.getBoundingClientRect();
-  }
-}

apps/core/toast/src/lib/defs/toast.ts

@@ -1,11 +0,0 @@
-import { TemplateRef } from '@angular/core';
-
-export interface Toast {
-  title?: string;
-  text?: string;
-  timer?: number;
-  position?: 'top-left' | 'top' | 'top-right' | 'bottom-right' | 'bottom' | 'bottom-left';
-  size?: 'width-full' | 'content';
-  template?: TemplateRef<any>; // For rendering dynamic content
-  templateContext?: {}; // For rendering dynamic content
-}

apps/core/toast/src/lib/index.ts

@@ -1,8 +0,0 @@
-// start:ng42.barrel
-export * from './toast.component';
-export * from './toast.module';
-export * from './toast.service';
-export * from './defs';
-export * from './animation';
-export * from './tokens';
-// end:ng42.barrel

apps/core/toast/src/lib/toast.component.html

@@ -1,15 +0,0 @@
-<div class="toast-main" [style.width]="width" [@slideAnimation]="{ value: animationState }" (@slideAnimation.done)="onSlideFinished()">
-  <button class="absolute top-2 right-2 p-6 border-none bg-transparent" (click)="close()">
-    <ui-icon icon="close" size="20px"></ui-icon>
-  </button>
-  <div class="toast-content flex flex-col justify-center items-center">
-    <h1 class="text-card-sub font-bold text-center py-3 whitespace-pre-wrap">{{ data.title }}</h1>
-    <ng-container *ngIf="data.text; else templateRef">
-      <p class="block text-base overflow-y-hidden pb-3 text-center overflow-x-hidden">{{ data.text }}</p>
-    </ng-container>
-  </div>
-</div>
-
-<ng-template #templateRef>
-  <ng-container *ngTemplateOutlet="data.template; context: data.templateContext"> </ng-container>
-</ng-template>

apps/core/toast/src/lib/toast.component.scss

@@ -1,12 +0,0 @@
-.toast-main {
-  @apply block relative mx-auto box-border text-white p-4;
-  background-color: var(--toast-background);
-  min-width: 18.75rem;
-  max-width: calc(100vw - 2rem);
-  min-height: 5rem;
-  border-radius: 25px;
-}
-
-.toast-content {
-  min-height: 3rem;
-}

apps/core/toast/src/lib/toast.component.ts

@@ -1,48 +0,0 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, OnDestroy, OnInit } from '@angular/core';
-import { toastAnimations, ToastAnimationState, slideAnimationTime } from './animation';
-import { Toast, ToastRef } from './defs';
-import { TOAST_CONFIG_TOKEN } from './tokens';
-
-@Component({
-  selector: 'lib-toast',
-  templateUrl: 'toast.component.html',
-  styleUrls: ['toast.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  animations: [toastAnimations.slideToast],
-})
-export class ToastComponent implements OnInit, OnDestroy {
-  timeoutRef?: any;
-  animationState: ToastAnimationState = 'default';
-  width = '55.25rem';
-
-  constructor(
-    @Inject(TOAST_CONFIG_TOKEN) public readonly data: Toast,
-    private readonly _ref: ToastRef,
-    private readonly _cdr: ChangeDetectorRef
-  ) {}
-
-  ngOnInit(): void {
-    if (this.data?.size) {
-      this.width = this.data?.size === 'width-full' ? '100vw' : '55.25rem';
-    }
-
-    this.timeoutRef = setTimeout(() => {
-      this.close();
-      this._cdr.markForCheck();
-    }, slideAnimationTime + (this.data.timer ?? 5000));
-  }
-
-  ngOnDestroy() {
-    clearTimeout(this.timeoutRef);
-  }
-
-  close() {
-    this.animationState = 'closing';
-  }
-
-  onSlideFinished() {
-    if (this.animationState === 'closing') {
-      this._ref.close();
-    }
-  }
-}

apps/core/toast/src/lib/toast.module.ts

@@ -1,12 +0,0 @@
-import { OverlayModule } from '@angular/cdk/overlay';
-import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
-import { UiIconModule } from '@ui/icon';
-import { ToastComponent } from './toast.component';
-
-@NgModule({
-  declarations: [ToastComponent],
-  imports: [CommonModule, OverlayModule, UiIconModule],
-  exports: [ToastComponent],
-})
-export class ToastModule {}

apps/core/toast/src/lib/toast.service.ts

@@ -1,79 +0,0 @@
-import { Overlay } from '@angular/cdk/overlay';
-import { ComponentPortal } from '@angular/cdk/portal';
-import { Injectable, Injector } from '@angular/core';
-import { Toast, ToastRef } from './defs';
-import { ToastComponent } from './toast.component';
-import { TOAST_CONFIG_TOKEN } from './tokens';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class ToastService {
-  private _lastToastRef: ToastRef;
-
-  get lastToastRef() {
-    return this._lastToastRef;
-  }
-
-  set lastToastRef(toastRef: ToastRef) {
-    this._lastToastRef = toastRef;
-  }
-
-  constructor(private readonly _overlay: Overlay, private readonly _injector: Injector) {}
-
-  create(data: Toast) {
-    const positionStrategy = this.getPositionStrategy(data);
-    const overlayRef = this._overlay.create({ positionStrategy });
-
-    this.lastToastRef = new ToastRef(overlayRef);
-    const injector = this.getInjector(data, this.lastToastRef);
-
-    const toastPortal = new ComponentPortal(ToastComponent, null, injector);
-    overlayRef.attach(toastPortal);
-
-    return this.lastToastRef;
-  }
-
-  getInjector(data: Toast, ref: ToastRef) {
-    return Injector.create({
-      parent: this._injector,
-      providers: [
-        { provide: TOAST_CONFIG_TOKEN, useValue: data },
-        { provide: ToastRef, useValue: ref },
-      ],
-    });
-  }
-
-  getPositionStrategy(data: Toast) {
-    switch (data?.position) {
-      case 'top':
-        return this._overlay.position().global().top(this.getNextPosition()).centerHorizontally();
-      case 'top-left':
-        return this._overlay.position().global().top(this.getNextPosition()).left('1rem');
-      case 'top-right':
-        return this._overlay.position().global().top(this.getNextPosition()).right('1rem');
-      case 'bottom':
-        return this._overlay.position().global().bottom(this.getNextPosition(true)).centerHorizontally();
-      case 'bottom-left':
-        return this._overlay.position().global().bottom(this.getNextPosition(true)).left('1rem');
-      case 'bottom-right':
-        return this._overlay.position().global().bottom(this.getNextPosition(true)).right('1rem');
-      default:
-        return this._overlay.position().global().top(this.getNextPosition()).centerHorizontally();
-    }
-  }
-
-  getNextPosition(fromBottom?: boolean) {
-    const lastToastIsVisible = this.lastToastRef && this.lastToastRef.isVisible();
-
-    let position = fromBottom ? 6 : 9;
-
-    if (lastToastIsVisible && fromBottom) {
-      position = (window.innerHeight - this.lastToastRef.getPosition().bottom + this.lastToastRef.getPosition().height + 16) / 16;
-    } else if (lastToastIsVisible) {
-      position = (this.lastToastRef.getPosition().bottom + 16) / 16;
-    }
-
-    return position + 'rem';
-  }
-}

apps/core/toast/src/lib/tokens.ts

@@ -1,4 +0,0 @@
-import { InjectionToken } from '@angular/core';
-import { Toast } from './defs';
-
-export const TOAST_CONFIG_TOKEN = new InjectionToken<Toast>('TOAST_DATA');

apps/core/toast/src/public-api.ts

@@ -1,5 +0,0 @@
-/*
- * Public API Surface of toast
- */
-
-export * from './lib';

apps/domain/availability/src/lib/availability.service.ts

@@ -8,7 +8,7 @@ import {
   StoreCheckoutSupplierService,
   SupplierDTO,
 } from '@swagger/checkout';
-import { combineLatest, Observable, of } from 'rxjs';
+import { BehaviorSubject, combineLatest, Observable, of } from 'rxjs';
 import {
   AvailabilityRequestDTO,
   AvailabilityService,
@@ -21,12 +21,16 @@ import { isArray, memorize } from '@utils/common';
 import { LogisticianDTO, LogisticianService } from '@swagger/oms';
 import { ResponseArgsOfIEnumerableOfStockInfoDTO, StockDTO, StockInfoDTO, StockService } from '@swagger/remi';
 import { PriceDTO } from '@swagger/availability';
-import { AvailabilityByBranchDTO, ItemData } from './defs';
+import { AvailabilityByBranchDTO, ItemData, Ssc } from './defs';
 import { Availability } from './defs/availability';
 import { isEmpty } from 'lodash';
 
 @Injectable()
 export class DomainAvailabilityService {
+  // Ticket #3378 Keep Result List Items and Details Page SSC in sync
+  sscs$ = new BehaviorSubject<Array<Ssc>>([]);
+  sscsObs$ = this.sscs$.asObservable();
+
   constructor(
     private _availabilityService: AvailabilityService,
     private _logisticanService: LogisticianService,
@@ -285,7 +289,7 @@ export class DomainAvailabilityService {
         const availabilities = r.result;
         const preferred = availabilities?.find((f) => f.preferred === 1);
 
-        const availability: AvailabilityDTO = {
+        return {
           availabilityType: preferred?.status,
           ssc: preferred?.ssc,
           sscText: preferred?.sscText,
@@ -298,8 +302,8 @@ export class DomainAvailabilityService {
           supplierProductNumber: preferred?.supplierProductNumber,
           supplierInfo: preferred?.requestStatusCode,
           lastRequest: preferred?.requested,
+          priceMaintained: preferred?.priceMaintained,
         };
-        return availability;
       }),
       shareReplay(1)
     );
@@ -348,7 +352,7 @@ export class DomainAvailabilityService {
         const availabilities = r.result;
         const preferred = availabilities?.find((f) => f.preferred === 1);
 
-        const availability: AvailabilityDTO = {
+        return {
           availabilityType: preferred?.status,
           ssc: preferred?.ssc,
           sscText: preferred?.sscText,
@@ -360,8 +364,8 @@ export class DomainAvailabilityService {
           logistician: { id: preferred?.logisticianId },
           supplierInfo: preferred?.requestStatusCode,
           lastRequest: preferred?.requested,
+          priceMaintained: preferred?.priceMaintained,
         };
-        return availability;
       }),
       shareReplay(1)
     );
@@ -454,32 +458,6 @@ export class DomainAvailabilityService {
     return [2, 32, 256, 1024, 2048, 4096].some((code) => availability?.availabilityType === code);
   }
 
-  mapToOlaAvailability({
-    availability,
-    item,
-    quantity,
-  }: {
-    availability: AvailabilityDTO;
-    item: ItemDTO;
-    quantity: number;
-  }): OLAAvailabilityDTO {
-    return {
-      status: availability?.availabilityType,
-      at: availability?.estimatedShippingDate,
-      ean: item?.product?.ean,
-      itemId: item?.id,
-      format: item?.product?.format,
-      isPrebooked: availability?.isPrebooked,
-      logisticianId: availability?.logistician?.id,
-      price: availability?.price,
-      qty: quantity,
-      ssc: availability?.ssc,
-      sscText: availability?.sscText,
-      supplierId: availability?.supplier?.id,
-      supplierProductNumber: availability?.supplierProductNumber,
-    };
-  }
-
   private _priceIsEmpty(price: PriceDTO) {
     return isEmpty(price?.value) || isEmpty(price?.vat);
   }
@@ -559,6 +537,7 @@ export class DomainAvailabilityService {
             supplierInfo: p?.requestStatusCode,
             lastRequest: p?.requested,
             itemId: p.itemId,
+            priceMaintained: p.priceMaintained,
           },
           p,
         ];
@@ -566,7 +545,7 @@ export class DomainAvailabilityService {
     }
   }
 
-  private _mapToShippingAvailability(availabilities: SwaggerAvailabilityDTO[]) {
+  private _mapToShippingAvailability(availabilities: SwaggerAvailabilityDTO[]): AvailabilityDTO[] {
     const preferred = availabilities.filter((f) => f.preferred === 1);
     return preferred.map((p) => {
       return {

apps/domain/availability/src/lib/defs/index.ts

@@ -1,3 +1,4 @@
 export * from './availability-by-branch-dto';
 export * from './availability';
 export * from './item-data';
+export * from './ssc';

apps/domain/availability/src/lib/defs/ssc.ts

@@ -0,0 +1,5 @@
+export interface Ssc {
+  itemId?: number;
+  ssc?: string;
+  sscText?: string;
+}

apps/domain/checkout/src/lib/checkout.service.ts

@@ -39,20 +39,41 @@ import {
   ResponseArgsOfValueTupleOfIEnumerableOfDisplayOrderDTOAndIEnumerableOfKeyValueDTOOfStringAndString,
 } from '@swagger/oms';
 import { isNullOrUndefined, memorize } from '@utils/common';
-import { combineLatest, Observable, of, concat, isObservable, throwError } from 'rxjs';
-import { bufferCount, catchError, filter, first, map, mergeMap, shareReplay, switchMap, tap, withLatestFrom } from 'rxjs/operators';
+import { combineLatest, Observable, of, concat, isObservable, throwError, interval as rxjsInterval } from 'rxjs';
+import {
+  bufferCount,
+  catchError,
+  distinctUntilChanged,
+  filter,
+  first,
+  map,
+  mergeMap,
+  shareReplay,
+  switchMap,
+  tap,
+  withLatestFrom,
+  startWith,
+} from 'rxjs/operators';
 
 import * as DomainCheckoutSelectors from './store/domain-checkout.selectors';
 import * as DomainCheckoutActions from './store/domain-checkout.actions';
-import { DomainAvailabilityService } from '@domain/availability';
+import { DomainAvailabilityService, ItemData } from '@domain/availability';
 import { HttpErrorResponse } from '@angular/common/http';
 import { ApplicationService } from '@core/application';
 import { CustomerDTO } from '@swagger/crm';
+import { Config } from '@core/config';
+import parseDuration from 'parse-duration';
 
 @Injectable()
 export class DomainCheckoutService {
+  get olaExpiration() {
+    const exp = this._config.get('@domain/checkout.olaExpiration') ?? '5m';
+    return parseDuration(exp);
+  }
+
   constructor(
     private store: Store<any>,
+    private _config: Config,
     private applicationService: ApplicationService,
     private storeCheckoutService: StoreCheckoutService,
     private orderCheckoutService: OrderCheckoutService,
@@ -123,14 +144,14 @@ export class DomainCheckoutService {
           })
           .pipe(
             map((response) => response.result),
-            tap((shoppingCart) =>
+            tap((shoppingCart) => {
               this.store.dispatch(
                 DomainCheckoutActions.setShoppingCart({
                   processId,
                   shoppingCart,
                 })
-              )
-            ),
+              );
+            }),
             tap((shoppingCart) => this.updateProcessCount(processId, shoppingCart?.items?.length))
           )
       )
@@ -257,11 +278,24 @@ export class DomainCheckoutService {
     shoppingCartItemId: number;
     availability: AvailabilityDTO;
   }) {
-    return this._shoppingCartService.StoreCheckoutShoppingCartUpdateShoppingCartItemAvailability({
-      shoppingCartId,
-      shoppingCartItemId,
-      availability,
-    });
+    return this._shoppingCartService
+      .StoreCheckoutShoppingCartUpdateShoppingCartItemAvailability({
+        shoppingCartId,
+        shoppingCartItemId,
+        availability,
+      })
+      .pipe(
+        map((response) => response.result),
+        tap((shoppingCart) => {
+          this.store.dispatch(
+            DomainCheckoutActions.addShoppingCartItemAvailabilityToHistoryByShoppingCartId({
+              shoppingCartId,
+              availability,
+              shoppingCartItemId,
+            })
+          );
+        })
+      );
   }
 
   updateItemInShoppingCart({
@@ -273,7 +307,7 @@ export class DomainCheckoutService {
     shoppingCartItemId: number;
     update: UpdateShoppingCartItemDTO;
   }): Observable<ShoppingCartDTO> {
-    return this.getShoppingCart({ processId }).pipe(
+    return this.getShoppingCart({ processId, latest: true }).pipe(
       first(),
       mergeMap((shoppingCart) =>
         this._shoppingCartService
@@ -284,8 +318,21 @@ export class DomainCheckoutService {
           })
           .pipe(
             map((response) => response.result),
-            tap((shoppingCart) => this.store.dispatch(DomainCheckoutActions.setShoppingCart({ processId, shoppingCart }))),
-            tap((shoppingCart) => this.updateProcessCount(processId, shoppingCart?.items?.length))
+            tap((shoppingCart) => {
+              this.store.dispatch(DomainCheckoutActions.setShoppingCart({ processId, shoppingCart }));
+
+              if (update.availability) {
+                this.store.dispatch(
+                  DomainCheckoutActions.addShoppingCartItemAvailabilityToHistory({
+                    processId,
+                    availability: update.availability,
+                    shoppingCartItemId,
+                  })
+                );
+              }
+
+              this.updateProcessCount(processId, shoppingCart?.items?.length);
+            })
           )
       )
     );
@@ -555,6 +602,175 @@ export class DomainCheckoutService {
     );
   }
 
+  async refreshAvailability({
+    processId,
+    shoppingCartItemId,
+  }: {
+    processId: number;
+    shoppingCartItemId: number;
+  }): Promise<AvailabilityDTO> {
+    const shoppingCart = await this.getShoppingCart({ processId }).pipe(first()).toPromise();
+    const item = shoppingCart?.items.find((item) => item.id === shoppingCartItemId)?.data;
+
+    if (!item) {
+      return;
+    }
+
+    const itemData: ItemData = {
+      ean: item.product.ean,
+      itemId: Number(item.product.catalogProductNumber),
+      price: item.availability.price,
+    };
+
+    let availability: AvailabilityDTO;
+
+    switch (item.features.orderType) {
+      case 'Abholung':
+        const abholung = await this.availabilityService
+          .getPickUpAvailability({
+            item: itemData,
+            branch: item.destination?.data?.targetBranch?.data,
+            quantity: item.quantity,
+          })
+          .toPromise();
+        availability = abholung[0];
+        break;
+      case 'Rücklage':
+        const ruecklage = await this.availabilityService
+          .getTakeAwayAvailability({
+            item: itemData,
+            quantity: item.quantity,
+            branch: item.destination?.data?.targetBranch?.data,
+          })
+          .toPromise();
+        availability = ruecklage;
+        break;
+      case 'Download':
+        const download = await this.availabilityService
+          .getDownloadAvailability({
+            item: itemData,
+          })
+          .toPromise();
+
+        availability = download;
+        break;
+
+      case 'Versand':
+        const versand = await this.availabilityService
+          .getDeliveryAvailability({
+            item: itemData,
+            quantity: item.quantity,
+          })
+          .toPromise();
+
+        availability = versand;
+        break;
+
+      case 'DIG-Versand':
+        const digVersand = await this.availabilityService
+          .getDigDeliveryAvailability({
+            item: itemData,
+            quantity: item.quantity,
+          })
+          .toPromise();
+
+        availability = digVersand;
+        break;
+
+      case 'B2B-Versand':
+        const b2bVersand = await this.availabilityService
+          .getB2bDeliveryAvailability({
+            item: itemData,
+            quantity: item.quantity,
+          })
+          .toPromise();
+
+        availability = b2bVersand;
+        break;
+    }
+
+    await this.updateItemInShoppingCart({
+      processId,
+      update: { availability },
+      shoppingCartItemId: item.id,
+    }).toPromise();
+
+    return availability;
+  }
+
+  /**
+   * Check if the availability of all items is valid
+   * @param param0 Process Id
+   * @returns true if the availability of all items is valid
+   */
+  validateOlaStatus({ processId, interval }: { processId: number; interval?: number }): Observable<boolean> {
+    return rxjsInterval(interval ?? this.olaExpiration / 10).pipe(
+      startWith(0),
+      switchMap(() =>
+        this.store.select(DomainCheckoutSelectors.selectCheckoutEntityByProcessId, { processId }).pipe(
+          map((entity) => {
+            const now = Date.now();
+            if (!entity || !entity.shoppingCart || !entity.shoppingCart.items) {
+              return;
+            }
+
+            const itemAvailabilityTimestamp = entity.itemAvailabilityTimestamp ?? {};
+            const shoppingCart = entity.shoppingCart;
+
+            const timestamps = shoppingCart.items
+              ?.map((i) => i.data)
+              ?.filter((item) => !!item?.features?.orderType)
+              ?.map((item) => {
+                const orderType = item.features.orderType;
+
+                let timestamp = itemAvailabilityTimestamp[`${item.id}_${orderType}`];
+
+                if (timestamp) {
+                  return timestamp;
+                }
+
+                if (orderType.endsWith('Versand')) {
+                  timestamp =
+                    itemAvailabilityTimestamp[`${item.id}_Versand`] ??
+                    itemAvailabilityTimestamp[`${item.id}_DIG-Versand`] ??
+                    itemAvailabilityTimestamp[`${item.id}_B2B-Versand`];
+                }
+
+                return timestamp;
+              })
+              ?.filter((timestamp) => !!timestamp);
+
+            if (timestamps?.length > 0) {
+              const oldestTimestamp = Math.min(...timestamps);
+              const expirationTimestamp = oldestTimestamp + this.olaExpiration;
+              return expirationTimestamp > now;
+            }
+
+            return false;
+          })
+        )
+      ),
+      distinctUntilChanged()
+    );
+  }
+
+  validateAvailabilities({ processId }: { processId: number }): Observable<boolean> {
+    return this.getShoppingCart({ processId }).pipe(
+      map((shoppingCart) => {
+        const items = shoppingCart?.items?.map((item) => item.data) || [];
+        return items.every((i) => this.availabilityService.isAvailable({ availability: i.availability }));
+      })
+    );
+  }
+
+  checkoutIsValid({ processId }: { processId: number }): Observable<boolean> {
+    const olaStatus$ = this.validateOlaStatus({ processId, interval: 250 });
+
+    const availabilities$ = this.validateAvailabilities({ processId });
+
+    return combineLatest([olaStatus$, availabilities$]).pipe(map(([olaStatus, availabilities]) => olaStatus && availabilities));
+  }
+
   completeCheckout({ processId }: { processId: number }): Observable<DisplayOrderDTO[]> {
     const refreshShoppingCart$ = this.getShoppingCart({ processId, latest: true }).pipe(first());
     const refreshCheckout$ = this.getCheckout({ processId, refresh: true }).pipe(first());
@@ -708,21 +924,23 @@ export class DomainCheckoutService {
       )
     );
 
-    return updateDestination$
-      .pipe(tap(console.log.bind(window, 'updateDestination$')))
+    return of(undefined)
       .pipe(
+        mergeMap((_) => updateDestination$.pipe(tap(console.log.bind(window, 'updateDestination$')))),
         mergeMap((_) => refreshShoppingCart$.pipe(tap(console.log.bind(window, 'refreshShoppingCart$')))),
         mergeMap((_) => setSpecialComment$.pipe(tap(console.log.bind(window, 'setSpecialComment$')))),
         mergeMap((_) => refreshCheckout$.pipe(tap(console.log.bind(window, 'refreshCheckout$')))),
         mergeMap((_) => checkAvailabilities$.pipe(tap(console.log.bind(window, 'checkAvailabilities$')))),
-        mergeMap((_) => updateAvailabilities$.pipe(tap(console.log.bind(window, 'updateAvailabilities$')))),
+        mergeMap((_) => updateAvailabilities$.pipe(tap(console.log.bind(window, 'updateAvailabilities$'))))
+      )
+      .pipe(
         mergeMap((_) => setBuyer$.pipe(tap(console.log.bind(window, 'setBuyer$')))),
         mergeMap((_) => setNotificationChannels$.pipe(tap(console.log.bind(window, 'setNotificationChannels$')))),
         mergeMap((_) => setPayer$.pipe(tap(console.log.bind(window, 'setPayer$')))),
         mergeMap((_) => setPaymentType$.pipe(tap(console.log.bind(window, 'setPaymentType$')))),
-        mergeMap((_) => setDestination$.pipe(tap(console.log.bind(window, 'setDestination$'))))
-      )
-      .pipe(mergeMap((_) => completeOrder$.pipe(tap(console.log.bind(window, 'completeOrder$')))));
+        mergeMap((_) => setDestination$.pipe(tap(console.log.bind(window, 'setDestination$')))),
+        mergeMap((_) => completeOrder$.pipe(tap(console.log.bind(window, 'completeOrder$'))))
+      );
   }
 
   completeKulturpassOrder({
@@ -803,6 +1021,7 @@ export class DomainCheckoutService {
 
   //#region Common
 
+  @memorize()
   canSetCustomer({
     processId,
     customerFeatures,
@@ -810,24 +1029,26 @@ export class DomainCheckoutService {
     processId: number;
     customerFeatures?: { [key: string]: string };
   }): Observable<{ ok?: boolean; filter?: { [key: string]: string }; message?: string; create?: InputDTO }> {
-    return this.getShoppingCart({ processId }).pipe(
-      first(),
-      mergeMap((shoppingCart) =>
-        this._shoppingCartService
-          .StoreCheckoutShoppingCartCanAddBuyer({
-            shoppingCartId: shoppingCart.id,
-            payload: { customerFeatures },
-          })
-          .pipe(
-            map((response) => ({
-              ok: response.result.ok,
-              filter: response.result.queryToken?.filter || {},
-              message: response.message,
-              create: response.result.create,
-            }))
-          )
+    return this.getShoppingCart({ processId })
+      .pipe(
+        first(),
+        mergeMap((shoppingCart) =>
+          this._shoppingCartService
+            .StoreCheckoutShoppingCartCanAddBuyer({
+              shoppingCartId: shoppingCart.id,
+              payload: { customerFeatures },
+            })
+            .pipe(
+              map((response) => ({
+                ok: response.result.ok,
+                filter: response.result.queryToken?.filter || {},
+                message: response.message,
+                create: response.result.create,
+              }))
+            )
+        )
       )
-    );
+      .pipe(shareReplay(1));
   }
 
   setNotificationChannels({ processId, notificationChannels }: { processId: number; notificationChannels: NotificationChannel }): void {
@@ -986,6 +1207,5 @@ export class DomainCheckoutService {
   private updateProcessCount(processId: number, count: number) {
     this.applicationService.patchProcessData(processId, { count });
   }
-
   //#endregion
 }

apps/domain/checkout/src/lib/store/defs/checkout.entity.ts

@@ -1,4 +1,12 @@
-import { BuyerDTO, CheckoutDTO, NotificationChannel, PayerDTO, ShippingAddressDTO, ShoppingCartDTO } from '@swagger/checkout';
+import {
+  AvailabilityDTO,
+  BuyerDTO,
+  CheckoutDTO,
+  NotificationChannel,
+  PayerDTO,
+  ShippingAddressDTO,
+  ShoppingCartDTO,
+} from '@swagger/checkout';
 import { CustomerDTO } from '@swagger/crm';
 import { DisplayOrderDTO } from '@swagger/oms';
 
@@ -14,4 +22,5 @@ export interface CheckoutEntity {
   specialComment: string;
   notificationChannels: NotificationChannel;
   olaErrorIds: number[];
+  itemAvailabilityTimestamp: Record<string, number | undefined>;
 }

apps/domain/checkout/src/lib/store/domain-checkout.actions.ts

@@ -7,6 +7,7 @@ import {
   ShippingAddressDTO,
   BuyerDTO,
   PayerDTO,
+  AvailabilityDTO,
 } from '@swagger/checkout';
 import { CustomerDTO } from '@swagger/crm';
 import { DisplayOrderDTO, DisplayOrderItemDTO } from '@swagger/oms';
@@ -61,3 +62,13 @@ export const setSpecialComment = createAction(`${prefix} Set Agent Comment`, pro
 export const setOlaError = createAction(`${prefix} Set Ola Error`, props<{ processId: number; olaErrorIds: number[] }>());
 
 export const setCustomer = createAction(`${prefix} Set Customer`, props<{ processId: number; customer: CustomerDTO }>());
+
+export const addShoppingCartItemAvailabilityToHistory = createAction(
+  `${prefix} Add Shopping Cart Item Availability To History`,
+  props<{ processId: number; shoppingCartItemId: number; availability: AvailabilityDTO }>()
+);
+
+export const addShoppingCartItemAvailabilityToHistoryByShoppingCartId = createAction(
+  `${prefix} Add Shopping Cart Item Availability To History By Shopping Cart Id`,
+  props<{ shoppingCartId: number; shoppingCartItemId: number; availability: AvailabilityDTO }>()
+);

apps/domain/checkout/src/lib/store/domain-checkout.reducer.ts

@@ -10,7 +10,22 @@ const _domainCheckoutReducer = createReducer(
   initialCheckoutState,
   on(DomainCheckoutActions.setShoppingCart, (s, { processId, shoppingCart }) => {
     const entity = getOrCreateCheckoutEntity({ processId, entities: s.entities });
+
+    const addedShoppingCartItems =
+      shoppingCart?.items?.filter((item) => !entity.shoppingCart?.items?.find((i) => i.id === item.id))?.map((item) => item.data) ?? [];
+
     entity.shoppingCart = shoppingCart;
+
+    entity.itemAvailabilityTimestamp = entity.itemAvailabilityTimestamp ? { ...entity.itemAvailabilityTimestamp } : {};
+
+    const now = Date.now();
+
+    for (let shoppingCartItem of addedShoppingCartItems) {
+      if (shoppingCartItem.features?.orderType) {
+        entity.itemAvailabilityTimestamp[`${shoppingCartItem.id}_${shoppingCartItem.features.orderType}`] = now;
+      }
+    }
+
     return storeCheckoutAdapter.setOne(entity, s);
   }),
   on(DomainCheckoutActions.setCheckout, (s, { processId, checkout }) => {
@@ -100,7 +115,40 @@ const _domainCheckoutReducer = createReducer(
     const entity = getOrCreateCheckoutEntity({ processId, entities: s.entities });
     entity.customer = customer;
     return storeCheckoutAdapter.setOne(entity, s);
-  })
+  }),
+  on(DomainCheckoutActions.addShoppingCartItemAvailabilityToHistory, (s, { processId, shoppingCartItemId, availability }) => {
+    const entity = getOrCreateCheckoutEntity({ processId, entities: s.entities });
+
+    const itemAvailabilityTimestamp = entity?.itemAvailabilityTimestamp ? { ...entity?.itemAvailabilityTimestamp } : {};
+
+    const item = entity?.shoppingCart?.items?.find((i) => i.id === shoppingCartItemId)?.data;
+
+    if (!item?.features?.orderType) return s;
+
+    itemAvailabilityTimestamp[`${item.id}_${item?.features?.orderType}`] = Date.now();
+
+    entity.itemAvailabilityTimestamp = itemAvailabilityTimestamp;
+
+    return storeCheckoutAdapter.setOne(entity, s);
+  }),
+  on(
+    DomainCheckoutActions.addShoppingCartItemAvailabilityToHistoryByShoppingCartId,
+    (s, { shoppingCartId, shoppingCartItemId, availability }) => {
+      const entity = getCheckoutEntityByShoppingCartId({ shoppingCartId, entities: s.entities });
+
+      const itemAvailabilityTimestamp = entity?.itemAvailabilityTimestamp ? { ...entity?.itemAvailabilityTimestamp } : {};
+
+      const item = entity?.shoppingCart?.items?.find((i) => i.id === shoppingCartItemId)?.data;
+
+      if (!item?.features?.orderType) return s;
+
+      itemAvailabilityTimestamp[`${item.id}_${item?.features?.orderType}`] = Date.now();
+
+      entity.itemAvailabilityTimestamp = itemAvailabilityTimestamp;
+
+      return storeCheckoutAdapter.setOne(entity, s);
+    }
+  )
 );
 
 export function domainCheckoutReducer(state, action) {
@@ -123,8 +171,20 @@ function getOrCreateCheckoutEntity({ entities, processId }: { entities: Dictiona
       notificationChannels: 0,
       olaErrorIds: [],
       customer: undefined,
+      // availabilityHistory: [],
+      itemAvailabilityTimestamp: {},
     };
   }
 
   return { ...entity };
 }
+
+function getCheckoutEntityByShoppingCartId({
+  entities,
+  shoppingCartId,
+}: {
+  entities: Dictionary<CheckoutEntity>;
+  shoppingCartId: number;
+}): CheckoutEntity {
+  return Object.values(entities).find((entity) => entity.shoppingCart?.id === shoppingCartId);
+}

apps/domain/crm/src/lib/crm-customer.service.ts

@@ -18,14 +18,15 @@ import {
   NotificationChannel,
   PayerDTO,
   PayerService,
+  QueryTokenDTO,
   ResponseArgsOfIEnumerableOfBonusCardInfoDTO,
   ShippingAddressDTO,
   ShippingAddressService,
 } from '@swagger/crm';
-import { isArray } from '@utils/common';
+import { isArray, memorize } from '@utils/common';
 import { PagedResult, Result } from 'apps/domain/defs/src/public-api';
 import { Observable, of, ReplaySubject } from 'rxjs';
-import { catchError, map, mergeMap, retry } from 'rxjs/operators';
+import { catchError, map, mergeMap, retry, shareReplay } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
 export class CrmCustomerService {
@@ -38,6 +39,14 @@ export class CrmCustomerService {
     private loyaltyCardService: LoyaltyCardService
   ) {}
 
+  @memorize()
+  filterSettings() {
+    return this.customerService.CustomerCustomerQuerySettings().pipe(
+      map((res) => res.result),
+      shareReplay(1)
+    );
+  }
+
   complete(queryString: string, filter?: { [key: string]: string }): Observable<Result<AutocompleteDTO[]>> {
     return this.customerService.CustomerCustomerAutocomplete({
       input: queryString,
@@ -66,6 +75,15 @@ export class CrmCustomerService {
     });
   }
 
+  getCustomersWithQueryToken(queryToken: QueryTokenDTO) {
+    if (queryToken.skip === undefined) queryToken.skip = 0;
+    if (queryToken.take === undefined) queryToken.take = 20;
+    if (queryToken.input === undefined) queryToken.input = { qs: '' };
+    if (queryToken.filter === undefined) queryToken.filter = {};
+
+    return this.customerService.CustomerListCustomers(queryToken);
+  }
+
   getCustomersByCustomerCardNumber(queryString: string): Observable<PagedResult<CustomerInfoDTO>> {
     return this.customerService.CustomerGetCustomerByBonuscard(!!queryString ? queryString : undefined);
   }

apps/domain/oms/src/lib/action-handler-services.ts

@@ -0,0 +1,88 @@
+import { ActionHandler } from '@core/command';
+import {
+  AcceptedActionHandler,
+  ArrivedActionHandler,
+  AssembledActionHandler,
+  AvailableForDownloadActionHandler,
+  BackToStockActionHandler,
+  CanceledByBuyerActionHandler,
+  CanceledByRetailerActionHandler,
+  CanceledBySupplierActionHandler,
+  CreateShippingNoteActionHandler,
+  DeliveredActionHandler,
+  DetermineSupplierActionHandler,
+  DispatchedActionHandler,
+  DownloadedActionHandler,
+  FetchedActionHandler,
+  InProcessActionHandler,
+  NotAvailableActionHandler,
+  NotFetchedActionHandler,
+  OrderAtSupplierActionHandler,
+  OrderingActionHandler,
+  OverdueActionHandler,
+  PackedActionHandler,
+  ParkedActionHandler,
+  PlacedActionHandler,
+  PreparationForShippingActionHandler,
+  PrintCompartmentLabelActionHandler,
+  PrintShippingNoteActionHandler,
+  ReOrderActionHandler,
+  RedirectedInternaqllyActionHandler,
+  RequestedActionHandler,
+  ReserverdActionHandler,
+  ReturnedByBuyerActionHandler,
+  ShippingNoteActionHandler,
+  SupplierTemporarilyOutOfStockActionHandler,
+  ReOrderedActionHandler,
+  CollectOnDeliveryNoteActionHandler,
+  PrintPriceDiffQrCodeLabelActionHandler,
+  CollectWithSmallAmountinvoiceActionHandler,
+  PrintSmallamountinvoiceActionHandler,
+  ShopWithKulturpassActionHandler,
+  ChangeOrderItemStatusBaseActionHandler,
+  CreateReturnItemActionHandler,
+} from './action-handlers';
+import { Type } from '@angular/core';
+
+export const ActionHandlerServices: Type<ActionHandler>[] = [
+  AcceptedActionHandler,
+  ArrivedActionHandler,
+  AssembledActionHandler,
+  AvailableForDownloadActionHandler,
+  BackToStockActionHandler,
+  CanceledByBuyerActionHandler,
+  CanceledByRetailerActionHandler,
+  CanceledBySupplierActionHandler,
+  CreateShippingNoteActionHandler,
+  DeliveredActionHandler,
+  DetermineSupplierActionHandler,
+  DispatchedActionHandler,
+  DownloadedActionHandler,
+  FetchedActionHandler,
+  InProcessActionHandler,
+  NotAvailableActionHandler,
+  NotFetchedActionHandler,
+  OrderAtSupplierActionHandler,
+  OrderingActionHandler,
+  OverdueActionHandler,
+  PackedActionHandler,
+  ParkedActionHandler,
+  PlacedActionHandler,
+  PreparationForShippingActionHandler,
+  PrintCompartmentLabelActionHandler,
+  PrintShippingNoteActionHandler,
+  ReOrderActionHandler,
+  RedirectedInternaqllyActionHandler,
+  RequestedActionHandler,
+  ReserverdActionHandler,
+  ReturnedByBuyerActionHandler,
+  ShippingNoteActionHandler,
+  SupplierTemporarilyOutOfStockActionHandler,
+  ReOrderedActionHandler,
+  CollectOnDeliveryNoteActionHandler,
+  PrintPriceDiffQrCodeLabelActionHandler,
+  CollectWithSmallAmountinvoiceActionHandler,
+  PrintSmallamountinvoiceActionHandler,
+  ShopWithKulturpassActionHandler,
+  CreateReturnItemActionHandler,
+];

apps/domain/oms/src/lib/action-handlers/re-order.action-handler.ts

@@ -5,7 +5,7 @@ import { UiModalService } from '@ui/modal';
 import { ReorderModalComponent, ReorderResult } from '@modal/reorder';
 import { DomainCheckoutService } from '@domain/checkout';
 import { AvailabilityDTO2, OrderItemListItemDTO } from '@swagger/oms';
-import { ToastService } from '@core/toast';
+import { ToasterService } from '@shared/shell';
 
 @Injectable()
 export class ReOrderActionHandler extends ActionHandler<OrderItemsContext> {
@@ -13,7 +13,7 @@ export class ReOrderActionHandler extends ActionHandler<OrderItemsContext> {
     private _command: CommandService,
     private _domainCheckoutService: DomainCheckoutService,
     private _uiModal: UiModalService,
-    private _toastService: ToastService
+    private _toastService: ToasterService
   ) {
     super('REORDER');
   }
@@ -71,8 +71,8 @@ export class ReOrderActionHandler extends ActionHandler<OrderItemsContext> {
       case 'Falscher Titel geliefert (richtiges Etikett)':
         break;
       default:
-        this._toastService.create({
-          title: 'Artikel wurde nachbestellt',
+        this._toastService.open({
+          message: 'Artikel wurde nachbestellt',
         });
     }
   }

apps/domain/oms/src/lib/customer-order.service.ts

@@ -1,5 +1,7 @@
 import { Injectable } from '@angular/core';
 import { AutocompleteTokenDTO, OrderService, QueryTokenDTO } from '@swagger/oms';
+import { memorize } from '@utils/common';
+import { map, shareReplay } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
 export class DomainCustomerOrderService {
@@ -14,16 +16,18 @@ export class DomainCustomerOrderService {
     // branch_id'
   }
 
-  getOrderItemsByOrderNumber(orderNumber: string) {
+  getOrderItemsByOrderNumber(params: { compartmentCode?: string; orderId: number }) {
     return this._orderService.OrderKundenbestellungen({
       filter: { all_branches: 'true', archive: 'true' },
-      input: {
-        qs: orderNumber,
-      },
+      input: { order_id: String(params.orderId), compartment_code: params.compartmentCode },
     });
   }
 
+  @memorize()
   settings() {
-    return this._orderService.OrderKundenbestellungenSettings();
+    return this._orderService.OrderKundenbestellungenSettings().pipe(
+      map((res) => res?.result),
+      shareReplay()
+    );
   }
 }

apps/domain/oms/src/public-api.ts

@@ -2,6 +2,7 @@
  * Public API Surface of oms
  */
 
+export * from './lib/action-handler-services';
 export * from './lib/goods.service';
 export * from './lib/receipt.service';
 export * from './lib/oms.service';

apps/domain/pickup-shelf/src/lib/pickup-shelf-in.service.ts

@@ -0,0 +1,60 @@
+import { Injectable, inject } from '@angular/core';
+import { AbholfachService, AutocompleteTokenDTO, ListResponseArgsOfDBHOrderItemListItemDTO, QueryTokenDTO } from '@swagger/oms';
+import { PickupShelfIOService } from './pickup-shelf-io.service';
+import { Observable, throwError } from 'rxjs';
+import { Filter } from '@shared/components/filter';
+
+@Injectable({ providedIn: 'root' })
+export class PickupShelfInService extends PickupShelfIOService {
+  private _abholfachService = inject(AbholfachService);
+
+  name() {
+    return 'PickupShelfInService';
+  }
+
+  getQuerySettings() {
+    return this._abholfachService.AbholfachWareneingangQuerySettings();
+  }
+
+  search(queryToken: QueryTokenDTO) {
+    return this._abholfachService.AbholfachWareneingang(queryToken);
+  }
+
+  complete(autocompleteToken: AutocompleteTokenDTO) {
+    return this._abholfachService.AbholfachWareneingangAutocomplete(autocompleteToken);
+  }
+
+  getOrderItemsByOrderNumberOrCompartmentCode(args: {
+    orderNumber?: string;
+    compartmentCode?: string;
+    filter?: Filter;
+  }): Observable<ListResponseArgsOfDBHOrderItemListItemDTO> {
+    if (!args.orderNumber && !args.compartmentCode) {
+      return throwError(
+        'PickupShelfInService.getOrderItemsByOrderNumberOrCompartmentCode(): Either orderNumber or compartmentCode must be provided.'
+      );
+    }
+
+    const { orderdate } = args.filter?.getQueryToken()?.filter ?? {};
+
+    return this._abholfachService.AbholfachWareneingang({
+      input: {
+        qs: args.compartmentCode ?? args.orderNumber,
+      },
+      filter: {
+        archive: String(true),
+        all_branches: String(true),
+        orderdate,
+      },
+    });
+  }
+
+  getOrderItemsByCustomerNumber(args: { customerNumber: string }): Observable<ListResponseArgsOfDBHOrderItemListItemDTO> {
+    return this._abholfachService.AbholfachWareneingang({
+      filter: { orderitemprocessingstatus: '16;128;8192;1048576' },
+      input: {
+        customer_name: args.customerNumber,
+      },
+    });
+  }
+}

apps/domain/pickup-shelf/src/lib/pickup-shelf-io.service.ts

@@ -0,0 +1,29 @@
+import { Injectable } from '@angular/core';
+import { Filter } from '@shared/components/filter';
+import {
+  AutocompleteTokenDTO,
+  ListResponseArgsOfDBHOrderItemListItemDTO,
+  QueryTokenDTO,
+  ResponseArgsOfIEnumerableOfAutocompleteDTO,
+  ResponseArgsOfQuerySettingsDTO,
+} from '@swagger/oms';
+import { Observable } from 'rxjs';
+
+@Injectable()
+export abstract class PickupShelfIOService {
+  abstract name(): string;
+
+  abstract getQuerySettings(): Observable<ResponseArgsOfQuerySettingsDTO>;
+
+  abstract search(queryToken: QueryTokenDTO): Observable<ListResponseArgsOfDBHOrderItemListItemDTO>;
+
+  abstract complete(autocompleteToken: AutocompleteTokenDTO): Observable<ResponseArgsOfIEnumerableOfAutocompleteDTO>;
+
+  abstract getOrderItemsByOrderNumberOrCompartmentCode(args: {
+    orderNumber?: string;
+    compartmentCode?: string;
+    filter?: Filter;
+  }): Observable<ListResponseArgsOfDBHOrderItemListItemDTO>;
+
+  abstract getOrderItemsByCustomerNumber(args: { customerNumber: string }): Observable<ListResponseArgsOfDBHOrderItemListItemDTO>;
+}

apps/domain/pickup-shelf/src/lib/pickup-shelf-out.service.ts

@@ -0,0 +1,55 @@
+import { Injectable, inject } from '@angular/core';
+import { AbholfachService, AutocompleteTokenDTO, ListResponseArgsOfDBHOrderItemListItemDTO, QueryTokenDTO } from '@swagger/oms';
+import { PickupShelfIOService } from './pickup-shelf-io.service';
+import { Observable, throwError } from 'rxjs';
+import { Filter } from '@shared/components/filter';
+
+@Injectable({ providedIn: 'root' })
+export class PickupShelfOutService extends PickupShelfIOService {
+  private _abholfachService = inject(AbholfachService);
+
+  name() {
+    return 'PickupShelfOutService';
+  }
+
+  getQuerySettings() {
+    return this._abholfachService.AbholfachWarenausgabeQuerySettings();
+  }
+
+  search(queryToken: QueryTokenDTO) {
+    return this._abholfachService.AbholfachWarenausgabe(queryToken);
+  }
+
+  complete(autocompleteToken: AutocompleteTokenDTO) {
+    return this._abholfachService.AbholfachWarenausgabeAutocomplete(autocompleteToken);
+  }
+
+  getOrderItemsByOrderNumberOrCompartmentCode(args: {
+    orderNumber?: string;
+    compartmentCode?: string;
+    filter?: Filter;
+  }): Observable<ListResponseArgsOfDBHOrderItemListItemDTO> {
+    if (!args.orderNumber && !args.compartmentCode) {
+      return throwError(
+        'PickupShelfOutService.getOrderItemsByOrderNumberOrCompartmentCode(): Either orderNumber or compartmentCode must be provided.'
+      );
+    }
+
+    const { orderdate } = args.filter?.getQueryToken()?.filter ?? {};
+
+    return this._abholfachService.AbholfachWarenausgabe({
+      input: {
+        qs: args.compartmentCode ?? args.orderNumber,
+      },
+      filter: {
+        archive: String(true),
+        all_branches: String(true),
+        orderdate,
+      },
+    });
+  }
+
+  getOrderItemsByCustomerNumber(args: { customerNumber: string }): Observable<ListResponseArgsOfDBHOrderItemListItemDTO> {
+    throw new Error('Method not implemented.');
+  }
+}

apps/domain/pickup-shelf/src/lib/pickup-shelf.service.ts

@@ -0,0 +1,27 @@
+import { Injectable, inject } from '@angular/core';
+import { DBHOrderItemListItemDTO, OrderItemDTO, OrderItemSubsetDTO, OrderService } from '@swagger/oms';
+
+@Injectable({ providedIn: 'root' })
+export class PickupShelfService {
+  private _orderService = inject(OrderService);
+
+  getOrderByOrderId(orderId: number) {
+    return this._orderService.OrderGetOrder(orderId);
+  }
+  patchOrderItemSubset(item: DBHOrderItemListItemDTO, changes: Partial<OrderItemSubsetDTO>) {
+    return this._orderService.OrderPatchOrderItemSubset({
+      orderId: item.orderId,
+      orderItemId: item.orderItemId,
+      orderItemSubsetId: item.orderItemSubsetId,
+      orderItemSubset: changes,
+    });
+  }
+
+  getOrderItemSubsetTasks(item: DBHOrderItemListItemDTO) {
+    return this._orderService.OrderGetOrderItemSubsetTasks({
+      orderId: item.orderId,
+      orderItemId: item.orderItemId,
+      orderItemSubsetId: item.orderItemSubsetId,
+    });
+  }
+}

apps/domain/pickup-shelf/src/public-api.ts

@@ -0,0 +1,4 @@
+export * from './lib/pickup-shelf-in.service';
+export * from './lib/pickup-shelf-io.service';
+export * from './lib/pickup-shelf-out.service';
+export * from './lib/pickup-shelf.service';

apps/hub/notifications/src/lib/index.ts

@@ -1,4 +1,5 @@
 // start:ng42.barrel
 export * from './hub-notification.module';
 export * from './notifications.hub';
+export * from './defs';
 // end:ng42.barrel

apps/isa-app/src/app/app-routing.module.ts

@@ -1,10 +1,11 @@
-import { isDevMode, NgModule } from '@angular/core';
+import { inject, isDevMode, NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-import { DebugComponent } from './debug/debug.component';
 import {
   CanActivateCartGuard,
   CanActivateCartWithProcessIdGuard,
   CanActivateCustomerGuard,
+  CanActivateCustomerOrdersGuard,
+  CanActivateCustomerOrdersWithProcessIdGuard,
   CanActivateCustomerWithProcessIdGuard,
   CanActivateGoodsInGuard,
   CanActivateGoodsOutGuard,
@@ -17,10 +18,13 @@ import {
 } 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 { ShellComponent, ShellModule } from './shell';
 import { TokenLoginComponent, TokenLoginModule } from './token-login';
+import { ApplicationService } from '@core/application';
+import { ProcessIdGuard } from './guards/process-id.guard';
+import { ActivateProcessIdGuard, ActivateProcessIdWithConfigKeyGuard } from './guards/activate-process-id.guard';
 
 const routes: Routes = [
   {
@@ -35,111 +39,111 @@ const routes: Routes = [
     canActivate: [IsAuthenticatedGuard],
     children: [
       {
-        path: '',
-        canActivate: [],
+        path: 'kunde',
+        component: MainComponent,
         children: [
           {
-            path: 'kunde',
-            component: ShellComponent,
-            children: [
-              {
-                path: 'dashboard',
-                loadChildren: () => import('@page/dashboard').then((m) => m.DashboardModule),
-              },
-              {
-                path: 'product',
-                loadChildren: () => import('@page/catalog').then((m) => m.PageCatalogModule),
-                canActivate: [CanActivateProductGuard],
-              },
-              {
-                path: ':processId/product',
-                loadChildren: () => import('@page/catalog').then((m) => m.PageCatalogModule),
-                canActivate: [CanActivateProductWithProcessIdGuard],
-                resolve: { processId: ProcessIdResolver },
-              },
-              {
-                path: 'order',
-                loadChildren: () => import('@page/customer-order').then((m) => m.CustomerOrderModule),
-                canActivate: [CanActivateGoodsOutGuard],
-              },
-              {
-                path: ':processId/order',
-                loadChildren: () => import('@page/customer-order').then((m) => m.CustomerOrderModule),
-                canActivate: [CanActivateGoodsOutWithProcessIdGuard],
-                resolve: { processId: ProcessIdResolver },
-              },
-              {
-                path: 'customer',
-                loadChildren: () => import('@page/customer').then((m) => m.PageCustomerModule),
-                canActivate: [CanActivateCustomerGuard],
-              },
-              {
-                path: ':processId/customer',
-                loadChildren: () => import('@page/customer').then((m) => m.PageCustomerModule),
-                canActivate: [CanActivateCustomerWithProcessIdGuard],
-                resolve: { processId: ProcessIdResolver },
-              },
-              {
-                path: 'cart',
-                loadChildren: () => import('@page/checkout').then((m) => m.PageCheckoutModule),
-                canActivate: [CanActivateCartGuard],
-              },
-              {
-                path: ':processId/cart',
-                loadChildren: () => import('@page/checkout').then((m) => m.PageCheckoutModule),
-                canActivate: [CanActivateCartWithProcessIdGuard],
-              },
-              {
-                path: 'goods/out',
-                loadChildren: () => import('@page/goods-out').then((m) => m.GoodsOutModule),
-                canActivate: [CanActivateGoodsOutGuard],
-              },
-              {
-                path: ':processId/goods/out',
-                loadChildren: () => import('@page/goods-out').then((m) => m.GoodsOutModule),
-                canActivate: [CanActivateGoodsOutWithProcessIdGuard],
-                resolve: { processId: ProcessIdResolver },
-              },
-              { path: '**', redirectTo: 'dashboard', pathMatch: 'full' },
-            ],
-            resolve: { section: CustomerSectionResolver },
+            path: 'dashboard',
+            loadChildren: () => import('@page/dashboard').then((m) => m.DashboardModule),
           },
           {
-            path: 'filiale',
-            component: ShellComponent,
-            children: [
-              {
-                path: 'task-calendar',
-                loadChildren: () => import('@page/task-calendar').then((m) => m.PageTaskCalendarModule),
-                canActivate: [CanActivateTaskCalendarGuard],
-              },
-              {
-                path: 'goods/in',
-                loadChildren: () => import('@page/goods-in').then((m) => m.GoodsInModule),
-                canActivate: [CanActivateGoodsInGuard],
-              },
-              {
-                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],
-              },
-              {
-                path: 'assortment',
-                loadChildren: () => import('@page/assortment').then((m) => m.AssortmentModule),
-                canActivate: [CanActivateAssortmentGuard],
-              },
-              { path: '**', redirectTo: 'task-calendar', pathMatch: 'full' },
-            ],
-            resolve: { section: BranchSectionResolver },
+            path: 'product',
+            loadChildren: () => import('@page/catalog').then((m) => m.PageCatalogModule),
+            canActivate: [CanActivateProductGuard],
           },
-          { path: '**', redirectTo: 'kunde', pathMatch: 'full' },
+          {
+            path: ':processId/product',
+            loadChildren: () => import('@page/catalog').then((m) => m.PageCatalogModule),
+            canActivate: [CanActivateProductWithProcessIdGuard],
+            resolve: { processId: ProcessIdResolver },
+          },
+          {
+            path: 'order',
+            loadChildren: () => import('@page/customer-order').then((m) => m.CustomerOrderModule),
+            canActivate: [CanActivateCustomerOrdersGuard],
+          },
+          {
+            path: ':processId/order',
+            loadChildren: () => import('@page/customer-order').then((m) => m.CustomerOrderModule),
+            canActivate: [CanActivateCustomerOrdersWithProcessIdGuard],
+            resolve: { processId: ProcessIdResolver },
+          },
+          {
+            path: 'customer',
+            loadChildren: () => import('@page/customer').then((m) => m.CustomerModule),
+            canActivate: [CanActivateCustomerGuard],
+          },
+          {
+            path: ':processId/customer',
+            loadChildren: () => import('@page/customer').then((m) => m.CustomerModule),
+            canActivate: [CanActivateCustomerWithProcessIdGuard],
+            resolve: { processId: ProcessIdResolver },
+          },
+          {
+            path: 'cart',
+            loadChildren: () => import('@page/checkout').then((m) => m.PageCheckoutModule),
+            canActivate: [CanActivateCartGuard],
+          },
+          {
+            path: ':processId/cart',
+            loadChildren: () => import('@page/checkout').then((m) => m.PageCheckoutModule),
+            canActivate: [CanActivateCartWithProcessIdGuard],
+          },
+          {
+            path: 'pickup-shelf',
+            canActivate: [ProcessIdGuard],
+            // NOTE: This is a workaround for the canActivate guard not being called
+            loadChildren: () => import('@page/pickup-shelf').then((m) => m.PickupShelfOutModule),
+          },
+          {
+            path: ':processId/pickup-shelf',
+            canActivate: [ActivateProcessIdGuard],
+            loadChildren: () => import('@page/pickup-shelf').then((m) => m.PickupShelfOutModule),
+          },
+          { path: '**', redirectTo: 'dashboard', pathMatch: 'full' },
         ],
+        resolve: { section: CustomerSectionResolver },
       },
+      {
+        path: 'filiale',
+        component: MainComponent,
+        children: [
+          {
+            path: 'task-calendar',
+            loadChildren: () => import('@page/task-calendar').then((m) => m.PageTaskCalendarModule),
+            canActivate: [CanActivateTaskCalendarGuard],
+          },
+          {
+            path: 'pickup-shelf',
+            canActivate: [ActivateProcessIdWithConfigKeyGuard('pickupShelf')],
+            // NOTE: This is a workaround for the canActivate guard not being called
+            loadChildren: () => import('@page/pickup-shelf').then((m) => m.PickupShelfInModule),
+          },
+          {
+            path: 'goods/in',
+            loadChildren: () => import('@page/goods-in').then((m) => m.GoodsInModule),
+            canActivate: [CanActivateGoodsInGuard],
+          },
+          {
+            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],
+          },
+          {
+            path: 'assortment',
+            loadChildren: () => import('@page/assortment').then((m) => m.AssortmentModule),
+            canActivate: [CanActivateAssortmentGuard],
+          },
+          { path: '**', redirectTo: 'task-calendar', pathMatch: 'full' },
+        ],
+        resolve: { section: BranchSectionResolver },
+      },
+      { path: '**', redirectTo: 'kunde', pathMatch: 'full' },
     ],
   },
 ];
@@ -152,7 +156,7 @@ if (isDevMode()) {
 }
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes), ShellModule, TokenLoginModule],
+  imports: [RouterModule.forRoot(routes), TokenLoginModule],
   exports: [RouterModule],
 })
 export class AppRoutingModule {}

apps/isa-app/src/app/app.component.scss

@@ -1,7 +1,3 @@
 :host {
-  @apply block box-border;
-}
-
-button {
-  @apply fixed bottom-4 right-2 bg-blue-500 text-white font-bold py-2 px-4 rounded z-tooltip;
+  @apply block;
 }

apps/isa-app/src/app/app.component.ts

@@ -116,6 +116,7 @@ export class AppComponent implements OnInit {
   checkForUpdate() {
     interval(this._checkForUpdates).subscribe(() => {
       this._swUpdate.checkForUpdate().then((value) => {
+        console.log('check for update', value);
         if (value) {
           this._notifications.updateNotification();
         }
@@ -125,6 +126,7 @@ export class AppComponent implements OnInit {
 
   initialCheckForUpdate() {
     this._swUpdate.checkForUpdate().then((value) => {
+      console.log('initial check for update', value);
       if (value) {
         location.reload();
       }

apps/isa-app/src/app/app.module.ts

@@ -32,9 +32,11 @@ import { IsaErrorHandler } from './providers/isa.error-handler';
 import { ScanAdapterModule, ScanAdapterService, ScanditScanAdapterModule } from '@adapter/scan';
 import { RootStateService } from './store/root-state.service';
 import * as Commands from './commands';
-import { UiIconModule } from '@ui/icon';
 import { PreviewComponent } from './preview';
 import { NativeContainerService } from 'native-container';
+import { ShellModule } from '@shared/shell';
+import { MainComponent } from './main.component';
+import { IconModule } from '@shared/components/icon';
 
 registerLocaleData(localeDe, localeDeExtra);
 registerLocaleData(localeDe, 'de', localeDeExtra);
@@ -74,11 +76,12 @@ export function _notificationsHubOptionsFactory(config: Config, auth: AuthServic
 }
 
 @NgModule({
-  declarations: [AppComponent],
+  declarations: [AppComponent, MainComponent],
   imports: [
     BrowserModule,
     BrowserAnimationsModule,
     HttpClientModule,
+    ShellModule.forRoot(),
     AppRoutingModule,
     AppSwaggerModule,
     AppDomainModule,
@@ -103,31 +106,7 @@ export function _notificationsHubOptionsFactory(config: Config, auth: AuthServic
     ScanAdapterModule.forRoot(),
     ScanditScanAdapterModule.forRoot(),
     PlatformModule,
-    UiIconModule.forRoot({
-      aliases: [
-        { alias: 'd-account', name: 'account' },
-        { alias: 'd-no-account', name: 'package-variant-closed' },
-        { name: 'isa-audio', alias: 'AU' },
-        { name: 'isa-audio', alias: 'CAS' },
-        { name: 'isa-audio', alias: 'DL' },
-        { name: 'isa-audio', alias: 'KAS' },
-        { name: 'isa-hard-cover', alias: 'BUCH' },
-        { name: 'isa-hard-cover', alias: 'GEB' },
-        { name: 'isa-hard-cover', alias: 'HC' },
-        { name: 'isa-hard-cover', alias: 'KT' },
-        { name: 'isa-ebook', alias: 'EB' },
-        { name: 'isa-non-book', alias: 'GLO' },
-        { name: 'isa-non-book', alias: 'HDL' },
-        { name: 'isa-non-book', alias: 'NB' },
-        { name: 'isa-non-book', alias: 'SPL' },
-        { name: 'isa-calendar', alias: 'KA' },
-        { name: 'isa-scroll', alias: 'MA' },
-        { name: 'isa-software', alias: 'SW' },
-        { name: 'isa-soft-cover', alias: 'TB' },
-        { name: 'isa-video', alias: 'VI' },
-        { name: 'isa-news-paper', alias: 'ZS' },
-      ],
-    }),
+    IconModule.forRoot(),
   ],
   providers: [
     {

apps/isa-app/src/app/guards/activate-process-id.guard.ts

@@ -0,0 +1,46 @@
+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;
+};

apps/isa-app/src/app/guards/can-activate-assortment.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationService } from '@core/application';
 import { Config } from '@core/config';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateAssortmentGuard implements CanActivate {
+export class CanActivateAssortmentGuard {
   constructor(private readonly _applicationService: ApplicationService, private readonly _config: Config) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

apps/isa-app/src/app/guards/can-activate-cart-with-process-id.guard.ts

@@ -1,10 +1,10 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationProcess, ApplicationService } from '@core/application';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateCartWithProcessIdGuard implements CanActivate {
+export class CanActivateCartWithProcessIdGuard {
   constructor(private readonly _applicationService: ApplicationService) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

apps/isa-app/src/app/guards/can-activate-cart.guard.ts

@@ -1,11 +1,12 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationService } from '@core/application';
+import { CheckoutNavigationService } from '@shared/services';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateCartGuard implements CanActivate {
-  constructor(private readonly _applicationService: ApplicationService, private readonly _router: Router) {}
+export class CanActivateCartGuard {
+  constructor(private readonly _applicationService: ApplicationService, private _checkoutNavigationService: CheckoutNavigationService) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
     const processes = await this._applicationService.getProcesses$('customer').pipe(first()).toPromise();
@@ -21,7 +22,7 @@ export class CanActivateCartGuard implements CanActivate {
         name: `Vorgang ${processes.length + 1}`,
       });
     }
-    await this._router.navigate(['/kunde', lastActivatedProcessId, 'cart']);
+    await this._checkoutNavigationService.getCheckoutReviewPath(lastActivatedProcessId).path;
     return false;
   }
 }

apps/isa-app/src/app/guards/can-activate-customer-orders-with-process-id.guard.ts

@@ -0,0 +1,64 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
+import { ApplicationProcess, ApplicationService } from '@core/application';
+import { BreadcrumbService } from '@core/breadcrumb';
+import { first } from 'rxjs/operators';
+
+@Injectable({ providedIn: 'root' })
+export class CanActivateCustomerOrdersWithProcessIdGuard {
+  constructor(private readonly _applicationService: ApplicationService, private readonly _breadcrumbService: BreadcrumbService) {}
+
+  async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
+    const process = await this._applicationService
+      .getProcessById$(+route.params.processId)
+      .pipe(first())
+      .toPromise();
+
+    if (!process) {
+      const processes = await this._applicationService.getProcesses$('customer').pipe(first()).toPromise();
+      await this._applicationService.createProcess({
+        id: +route.params.processId,
+        type: 'cart',
+        section: 'customer',
+        name: `Vorgang ${this.processNumber(processes.filter((process) => process.type === 'cart'))}`,
+      });
+    }
+
+    await this.removeBreadcrumbWithSameProcessId(route);
+    this._applicationService.activateProcess(+route.params.processId);
+    return true;
+  }
+
+  // Fix #3292: Alle Breadcrumbs die nichts mit dem aktuellen Prozess zu tun haben, müssen removed werden
+  async removeBreadcrumbWithSameProcessId(route: ActivatedRouteSnapshot) {
+    const crumbs = await this._breadcrumbService
+      .getBreadcrumbByKey$(+route.params.processId)
+      .pipe(first())
+      .toPromise();
+
+    // Entferne alle Crumbs die nichts mit den Kundenbestellungen zu tun haben
+    if (crumbs.length > 1) {
+      const crumbsToRemove = crumbs.filter((crumb) => crumb.tags.find((tag) => tag === 'customer-order') === undefined);
+      for (const crumb of crumbsToRemove) {
+        await this._breadcrumbService.removeBreadcrumb(crumb.id);
+      }
+    }
+  }
+
+  processNumber(processes: ApplicationProcess[]) {
+    const processNumbers = processes?.map((process) => Number(process?.name?.replace(/\D/g, '')));
+    return !!processNumbers && processNumbers.length > 0 ? this.findMissingNumber(processNumbers) : 1;
+  }
+
+  findMissingNumber(processNumbers: number[]) {
+    // Ticket #3272 Bei Klick auf "+" bzw. neuen Prozess hinzufügen soll der neue Tab immer die höchste Nummer haben (wie aktuell im Produktiv)
+    // ----------------------------------------------------------------------------------------------------------------------------------------
+
+    // for (let missingNumber = 1; missingNumber < Math.max(...processNumbers); missingNumber++) {
+    //   if (!processNumbers.find((number) => number === missingNumber)) {
+    //     return missingNumber;
+    //   }
+    // }
+    return Math.max(...processNumbers) + 1;
+  }
+}

apps/isa-app/src/app/guards/can-activate-customer-orders.guard.ts

@@ -0,0 +1,97 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
+import { ApplicationProcess, ApplicationService } from '@core/application';
+import { DomainCheckoutService } from '@domain/checkout';
+import { CustomerOrdersNavigationService } from '@shared/services';
+import { first } from 'rxjs/operators';
+
+@Injectable({ providedIn: 'root' })
+export class CanActivateCustomerOrdersGuard {
+  constructor(
+    private readonly _applicationService: ApplicationService,
+    private readonly _checkoutService: DomainCheckoutService,
+    private readonly _navigationService: CustomerOrdersNavigationService
+  ) {}
+
+  async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
+    const processes = await this._applicationService.getProcesses$('customer').pipe(first()).toPromise();
+
+    let lastActivatedProcessId = (
+      await this._applicationService.getLastActivatedProcessWithSectionAndType$('customer', 'cart').pipe(first()).toPromise()
+    )?.id;
+
+    const lastActivatedCartCheckoutProcessId = (
+      await this._applicationService.getLastActivatedProcessWithSectionAndType$('customer', 'cart-checkout').pipe(first()).toPromise()
+    )?.id;
+
+    const activatedProcessId = await this._applicationService.getActivatedProcessId$().pipe(first()).toPromise();
+
+    // Darf nur reinkommen wenn der aktuell aktive Tab ein Bestellabschluss Tab ist
+    if (!!lastActivatedCartCheckoutProcessId && lastActivatedCartCheckoutProcessId === activatedProcessId) {
+      await this.fromCartCheckoutProcess(processes, route, lastActivatedCartCheckoutProcessId);
+      return false;
+    }
+
+    if (!lastActivatedProcessId) {
+      await this.fromGoodsOutProcess(processes, route);
+      return false;
+    } else {
+      await this._navigationService.getCustomerOrdersBasePath(lastActivatedProcessId).navigate();
+    }
+
+    return false;
+  }
+
+  // Bei offenen Kundenbestellungen und Klick auf Kundenbestellungen
+  async fromGoodsOutProcess(processes: ApplicationProcess[], route: ActivatedRouteSnapshot) {
+    const newProcessId = Date.now();
+    await this._applicationService.createProcess({
+      id: newProcessId,
+      type: 'cart',
+      section: 'customer',
+      name: `Vorgang ${this.processNumber(processes.filter((process) => process.type === 'cart'))}`,
+    });
+
+    await this._navigationService.getCustomerOrdersBasePath(newProcessId).navigate();
+  }
+
+  // Bei offener Bestellbestätigung und Klick auf Kundenbestellungen
+  async fromCartCheckoutProcess(processes: ApplicationProcess[], route: ActivatedRouteSnapshot, processId: number) {
+    // Um alle Checkout Daten zu resetten die mit dem Prozess assoziiert sind
+    this._checkoutService.removeProcess({ processId });
+
+    // Ändere type cart-checkout zu customer-order
+    this._applicationService.patchProcess(processId, {
+      id: processId,
+      type: 'cart',
+      section: 'customer',
+      name: `Vorgang ${this.processNumber(processes.filter((process) => process.type === 'cart'))}`,
+      data: {},
+    });
+
+    // Navigation
+    await this._navigationService.getCustomerOrdersBasePath(processId).navigate();
+  }
+
+  getUrlFromSnapshot(route: ActivatedRouteSnapshot, url: string[] = []): string[] {
+    url.push(...route.url.map((segment) => segment.path));
+    if (route.firstChild) {
+      return this.getUrlFromSnapshot(route.firstChild, url);
+    }
+    return url.filter((segment) => !!segment);
+  }
+
+  processNumber(processes: ApplicationProcess[]) {
+    const processNumbers = processes?.map((process) => Number(process?.name?.replace(/\D/g, '')));
+    return !!processNumbers && processNumbers.length > 0 ? this.findMissingNumber(processNumbers) : 1;
+  }
+
+  findMissingNumber(processNumbers: number[]) {
+    for (let missingNumber = 1; missingNumber < Math.max(...processNumbers); missingNumber++) {
+      if (!processNumbers.find((number) => number === missingNumber)) {
+        return missingNumber;
+      }
+    }
+    return Math.max(...processNumbers) + 1;
+  }
+}

apps/isa-app/src/app/guards/can-activate-customer-with-process-id.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationProcess, ApplicationService } from '@core/application';
 import { BreadcrumbService } from '@core/breadcrumb';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateCustomerWithProcessIdGuard implements CanActivate {
+export class CanActivateCustomerWithProcessIdGuard {
   constructor(private readonly _applicationService: ApplicationService, private readonly _breadcrumbService: BreadcrumbService) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

apps/isa-app/src/app/guards/can-activate-customer.guard.ts

@@ -1,15 +1,17 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router';
 import { ApplicationProcess, ApplicationService } from '@core/application';
 import { DomainCheckoutService } from '@domain/checkout';
+import { CustomerSearchNavigation } from '@shared/services';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateCustomerGuard implements CanActivate {
+export class CanActivateCustomerGuard {
   constructor(
     private readonly _applicationService: ApplicationService,
     private readonly _checkoutService: DomainCheckoutService,
-    private readonly _router: Router
+    private readonly _router: Router,
+    private readonly _navigation: CustomerSearchNavigation
   ) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
@@ -41,11 +43,17 @@ export class CanActivateCustomerGuard implements CanActivate {
       await this.fromCartProcess(processes);
       return false;
     } else {
-      await this._router.navigate(['/kunde', String(lastActivatedProcessId), 'customer']);
+      await this.navigateToDefaultRoute(lastActivatedProcessId);
     }
     return false;
   }
 
+  async navigateToDefaultRoute(processId: number) {
+    const route = this._navigation.defaultRoute({ processId });
+
+    await this._router.navigate(route.path, { queryParams: route.queryParams });
+  }
+
   // Bei offener Artikelsuche/Kundensuche und Klick auf Footer Kundensuche
   async fromCartProcess(processes: ApplicationProcess[]) {
     const newProcessId = Date.now();
@@ -56,7 +64,7 @@ export class CanActivateCustomerGuard implements CanActivate {
       name: `Vorgang ${this.processNumber(processes.filter((process) => process.type === 'cart'))}`,
     });
 
-    await this._router.navigate(['/kunde', String(newProcessId), 'customer']);
+    await this.navigateToDefaultRoute(newProcessId);
   }
 
   // Bei offener Bestellbestätigung und Klick auf Footer Kundensuche
@@ -74,7 +82,7 @@ export class CanActivateCustomerGuard implements CanActivate {
     });
 
     // Navigation
-    await this._router.navigate(['/kunde', String(processId), 'customer']);
+    await this.navigateToDefaultRoute(processId);
   }
 
   // Bei offener Warenausgabe und Klick auf Footer Kundensuche
@@ -98,7 +106,7 @@ export class CanActivateCustomerGuard implements CanActivate {
     });
 
     // Navigation
-    await this._router.navigate(['/kunde', String(processId), 'customer']);
+    await this.navigateToDefaultRoute(processId);
   }
 
   processNumber(processes: ApplicationProcess[]) {

apps/isa-app/src/app/guards/can-activate-goods-in.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationService } from '@core/application';
 import { Config } from '@core/config';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateGoodsInGuard implements CanActivate {
+export class CanActivateGoodsInGuard {
   constructor(private readonly _applicationService: ApplicationService, private readonly _config: Config) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
@@ -15,7 +15,7 @@ export class CanActivateGoodsInGuard implements CanActivate {
         id: this._config.get('process.ids.goodsIn'),
         type: 'goods-in',
         section: 'branch',
-        name: 'Abholfach',
+        name: '',
       });
     }
     this._applicationService.activateProcess(this._config.get('process.ids.goodsIn'));

apps/isa-app/src/app/guards/can-activate-goods-out-with-process-id.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationProcess, ApplicationService } from '@core/application';
 import { BreadcrumbService } from '@core/breadcrumb';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateGoodsOutWithProcessIdGuard implements CanActivate {
+export class CanActivateGoodsOutWithProcessIdGuard {
   constructor(private readonly _applicationService: ApplicationService, private readonly _breadcrumbService: BreadcrumbService) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

apps/isa-app/src/app/guards/can-activate-goods-out.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router';
 import { ApplicationProcess, ApplicationService } from '@core/application';
 import { DomainCheckoutService } from '@domain/checkout';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateGoodsOutGuard implements CanActivate {
+export class CanActivateGoodsOutGuard {
   constructor(
     private readonly _applicationService: ApplicationService,
     private readonly _checkoutService: DomainCheckoutService,

apps/isa-app/src/app/guards/can-activate-package-inspection.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationService } from '@core/application';
 import { Config } from '@core/config';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivatePackageInspectionGuard implements CanActivate {
+export class CanActivatePackageInspectionGuard {
   constructor(private readonly _applicationService: ApplicationService, private readonly _config: Config) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

apps/isa-app/src/app/guards/can-activate-product-with-process-id.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationProcess, ApplicationService } from '@core/application';
 import { BreadcrumbService } from '@core/breadcrumb';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateProductWithProcessIdGuard implements CanActivate {
+export class CanActivateProductWithProcessIdGuard {
   constructor(private readonly _applicationService: ApplicationService, private readonly _breadcrumbService: BreadcrumbService) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

apps/isa-app/src/app/guards/can-activate-product.guard.ts

@@ -1,15 +1,16 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationProcess, ApplicationService } from '@core/application';
 import { DomainCheckoutService } from '@domain/checkout';
+import { ProductCatalogNavigationService } from '@shared/services';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateProductGuard implements CanActivate {
+export class CanActivateProductGuard {
   constructor(
     private readonly _applicationService: ApplicationService,
     private readonly _checkoutService: DomainCheckoutService,
-    private readonly _router: Router
+    private readonly _navigationService: ProductCatalogNavigationService
   ) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
@@ -38,17 +39,17 @@ export class CanActivateProductGuard implements CanActivate {
     }
 
     if (!lastActivatedProcessId) {
-      await this.fromCartProcess(processes, route);
+      await this.fromCartProcess(processes);
       return false;
     } else {
-      await this._router.navigate(this.getUrlFromSnapshot(route, ['/kunde', String(lastActivatedProcessId)]));
+      await this._navigationService.getArticleSearchBasePath(lastActivatedProcessId).navigate();
     }
 
     return false;
   }
 
   // Bei offener Artikelsuche/Kundensuche und Klick auf Footer Artikelsuche
-  async fromCartProcess(processes: ApplicationProcess[], route: ActivatedRouteSnapshot) {
+  async fromCartProcess(processes: ApplicationProcess[]) {
     const newProcessId = Date.now();
     await this._applicationService.createProcess({
       id: newProcessId,
@@ -57,7 +58,7 @@ export class CanActivateProductGuard implements CanActivate {
       name: `Vorgang ${this.processNumber(processes.filter((process) => process.type === 'cart'))}`,
     });
 
-    await this._router.navigate(this.getUrlFromSnapshot(route, ['/kunde', String(newProcessId)]));
+    await this._navigationService.getArticleSearchBasePath(newProcessId).navigate();
   }
 
   // Bei offener Warenausgabe und Klick auf Footer Artikelsuche
@@ -81,7 +82,7 @@ export class CanActivateProductGuard implements CanActivate {
     });
 
     // Navigation
-    await this._router.navigate(this.getUrlFromSnapshot(route, ['/kunde', String(processId)]));
+    await this._navigationService.getArticleSearchBasePath(processId).navigate();
   }
 
   // Bei offener Bestellbestätigung und Klick auf Footer Artikelsuche
@@ -99,7 +100,7 @@ export class CanActivateProductGuard implements CanActivate {
     });
 
     // Navigation
-    await this._router.navigate(this.getUrlFromSnapshot(route, ['/kunde', String(processId)]));
+    await this._navigationService.getArticleSearchBasePath(processId).navigate();
   }
 
   getUrlFromSnapshot(route: ActivatedRouteSnapshot, url: string[] = []): string[] {

apps/isa-app/src/app/guards/can-activate-remission.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router';
 import { ApplicationService } from '@core/application';
 import { Config } from '@core/config';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateRemissionGuard implements CanActivate {
+export class CanActivateRemissionGuard {
   constructor(
     private readonly _applicationService: ApplicationService,
     private readonly _config: Config,

apps/isa-app/src/app/guards/can-activate-task-calendar.guard.ts

@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { ApplicationService } from '@core/application';
 import { Config } from '@core/config';
 import { first } from 'rxjs/operators';
 
 @Injectable({ providedIn: 'root' })
-export class CanActivateTaskCalendarGuard implements CanActivate {
+export class CanActivateTaskCalendarGuard {
   constructor(private readonly _applicationService: ApplicationService, private readonly _config: Config) {}
 
   async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

apps/isa-app/src/app/guards/index.ts

@@ -5,6 +5,8 @@ export * from './can-activate-customer.guard';
 export * from './can-activate-goods-in.guard';
 export * from './can-activate-goods-out-with-process-id.guard';
 export * from './can-activate-goods-out.guard';
+export * from './can-activate-customer-orders.guard';
+export * from './can-activate-customer-orders-with-process-id.guard';
 export * from './can-activate-product-with-process-id.guard';
 export * from './can-activate-product.guard';
 export * from './can-activate-remission.guard';

apps/isa-app/src/app/guards/is-authenticated.guard.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { AuthService } from '@core/auth';
 import { ScanAdapterService } from '@adapter/scan';
 import { AuthService as IsaAuthService } from '@swagger/isa';
@@ -7,7 +7,7 @@ import { UiConfirmModalComponent, UiErrorModalComponent, UiModalService } from '
 import { EnvironmentService } from '@core/environment';
 
 @Injectable({ providedIn: 'root' })
-export class IsAuthenticatedGuard implements CanActivate {
+export class IsAuthenticatedGuard {
   constructor(
     private _authService: AuthService,
     private _scanService: ScanAdapterService,

apps/isa-app/src/app/guards/process-id.guard.ts

@@ -0,0 +1,33 @@
+import { inject } from '@angular/core';
+import { ActivatedRouteSnapshot, CanActivateFn, Router, RouterStateSnapshot, UrlTree } from '@angular/router';
+import { ApplicationService } from '@core/application';
+import { take } from 'rxjs/operators';
+
+export const ProcessIdGuard: CanActivateFn = async (
+  route: ActivatedRouteSnapshot,
+  state: RouterStateSnapshot
+): Promise<boolean | UrlTree> => {
+  const application = inject(ApplicationService);
+  const router = inject(Router);
+
+  const process = await application.getLastActivatedProcessWithSection$('customer').pipe(take(1)).toPromise();
+
+  const processId = process?.id ?? Date.now();
+
+  const originalUrl = state.url?.split('?')[0] ?? '';
+
+  let url: string = '';
+
+  if (originalUrl.startsWith('/kunde')) {
+    url = originalUrl.replace('/kunde', `/kunde/${processId}`);
+  } else {
+    url = originalUrl;
+  }
+
+  if (originalUrl === url) {
+    return true;
+  }
+
+  await router.navigateByUrl(url);
+  return false;
+};

apps/isa-app/src/app/main.component.html

@@ -0,0 +1,3 @@
+<shell-root>
+  <router-outlet></router-outlet>
+</shell-root>

apps/isa-app/src/app/main.component.ts

@@ -0,0 +1,10 @@
+import { Component, ChangeDetectionStrategy } from '@angular/core';
+
+@Component({
+  selector: 'app-main',
+  templateUrl: 'main.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class MainComponent {
+  constructor() {}
+}

apps/isa-app/src/app/resolvers/process-id.resolver.ts

@@ -1,9 +1,9 @@
 import { Injectable } from '@angular/core';
-import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot } from '@angular/router';
 import { Observable } from 'rxjs';
 
 @Injectable({ providedIn: 'root' })
-export class ProcessIdResolver implements Resolve<number> {
+export class ProcessIdResolver {
   constructor() {}
 
   resolve(route: ActivatedRouteSnapshot): Observable<number> | Promise<number> | number {

apps/isa-app/src/app/resolvers/section.resolver.ts

@@ -1,9 +1,9 @@
 import { Injectable } from '@angular/core';
-import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot } from '@angular/router';
 import { ApplicationService } from '@core/application';
 import { Observable } from 'rxjs';
 
-export abstract class SectionResolver implements Resolve<string> {
+export abstract class SectionResolver {
   constructor(protected section: 'customer' | 'branch', protected applicationService: ApplicationService) {}
 
   resolve(route: ActivatedRouteSnapshot): Observable<string> | Promise<string> | string {

apps/isa-app/src/app/shell/index.ts

@@ -1,4 +0,0 @@
-// start:ng42.barrel
-export * from './shell.component';
-export * from './shell.module';
-// end:ng42.barrel

apps/isa-app/src/app/shell/shell.component.html

@@ -1,88 +0,0 @@
-<div class="shell-header-wrapper">
-  <shell-header [section]="section$ | async" (sectionChange)="setSection($event)">
-    <a [routerLink]="['/kunde/dashboard']" routerLinkActive="active" class="dashboard-btn">
-      <ui-icon icon="dashboard" size="26px"></ui-icon>
-    </a>
-    <button class="notifications-btn" [disabled]="(notificationCount$ | async) === 0" (click)="openNotifications()">
-      <ui-icon icon="notification" size="26px"></ui-icon>
-      <span class="notification-counter" *ngIf="notificationCount$ | async; let count">{{ count }}</span>
-    </button>
-    <button (click)="logout()" class="logout-btn">
-      <span *ngIf="currentBranch$ | async; let currentBranch">{{ currentBranch.key | uppercase }}</span>
-      <ui-icon icon="logout" size="26px"></ui-icon>
-    </button>
-  </shell-header>
-</div>
-<div class="shell-process-wrapper">
-  <shell-process
-    [label]="addProcessLabel$ | async"
-    [canAddProcess]="canAddProcess$ | async"
-    (addProcess)="addProcess(); processTabs?.last?.triggerAnimation()"
-  >
-    <shell-process-tab
-      #processTabs
-      (activateProcess)="activateProcess($event)"
-      (closeProcess)="closeProcess($event)"
-      (processAction)="processAction($event)"
-      *ngFor="let process of processes$ | async; trackBy: trackByIdFn"
-      [isActive]="(activatedProcessId$ | async) === process.id"
-      [process]="process"
-    ></shell-process-tab>
-  </shell-process>
-</div>
-<div class="main-wrapper">
-  <main>
-    <router-outlet></router-outlet>
-  </main>
-</div>
-
-<div class="shell-footer-wrapper">
-  <shell-footer *ngIf="section$ | async; let section">
-    <ng-container *ngIf="section === 'customer'">
-      <a [routerLink]="[customerBasePath$ | async, 'product']" routerLinkActive="active">
-        <ui-icon icon="catalog" size="30px"></ui-icon>
-        Artikelsuche
-      </a>
-      <a [routerLink]="[customerBasePath$ | async, 'customer']" routerLinkActive="active">
-        <ui-icon icon="customer" size="24px"></ui-icon>
-        Kundensuche
-      </a>
-      <a *ifRole="'Store'" [routerLink]="[customerBasePath$ | async, 'goods', 'out']" routerLinkActive="active">
-        <ui-icon icon="box_out" size="24px"></ui-icon>
-        Warenausgabe
-      </a>
-      <a *ifRole="'CallCenter'" [routerLink]="[customerBasePath$ | async, 'order']" routerLinkActive="active">
-        <ui-svg-icon icon="package-variant-closed" [size]="28"></ui-svg-icon>
-        Kundenbestellungen
-      </a>
-    </ng-container>
-    <ng-container *ngIf="section === 'branch'">
-      <a [routerLink]="['/filiale/assortment']" routerLinkActive="active">
-        <ui-svg-icon icon="shape-outline" [size]="24"></ui-svg-icon>
-        Sortiment
-      </a>
-      <a [routerLink]="['/filiale/task-calendar']" routerLinkActive="active">
-        <ui-icon icon="calendar_check" size="24px"></ui-icon>
-        Tätigkeitskalender
-      </a>
-      <a [routerLink]="['/filiale/goods/in']" routerLinkActive="active">
-        <ui-icon icon="box_return" size="24px"></ui-icon>
-        Abholfach
-      </a>
-      <a [routerLink]="[remissionUrl$ | async]" [queryParams]="remissionQueryParams$ | async" routerLinkActive="active">
-        <ui-icon icon="documents_refresh" size="24px"></ui-icon>
-        Remission
-      </a>
-      <a [routerLink]="['/filiale/package-inspection']" routerLinkActive="active" (click)="fetchAndOpenPackages()">
-        <ui-svg-icon icon="clipboard-check-outline" [size]="24"></ui-svg-icon>
-        Wareneingang
-      </a>
-    </ng-container>
-  </shell-footer>
-</div>
-
-<button *ngIf="isDevelopment" class="block absolute bottom-0 right-0 z-tooltip p-4 opacity-5" (click)="debugOpen = !debugOpen">
-  <ui-svg-icon icon="bug-outline"></ui-svg-icon>
-</button>
-
-<app-debug *ngIf="debugOpen" class="absolute inset-x-0 top-0 max-h-[calc(100vh-80px)]"></app-debug>

apps/isa-app/src/app/shell/shell.component.scss

@@ -1,60 +0,0 @@
-:host {
-  @apply block relative min-h-screen;
-}
-
-.main-wrapper {
-  @apply fixed right-0 left-0 overflow-auto;
-  top: 8.375rem;
-  bottom: 5rem;
-
-  main {
-    @apply w-full max-w-content mx-auto px-4 self-stretch;
-  }
-}
-
-.shell-header-wrapper {
-  @apply fixed top-0 left-0 right-0 bg-white;
-
-  shell-header {
-    @apply w-full max-w-content mx-auto;
-  }
-
-  button.notifications-btn {
-    @apply relative;
-
-    .notification-counter {
-      @apply absolute flex items-center justify-center top-2 right-px-3 text-sm rounded-full w-6 h-6 font-semibold;
-      background-color: var(--shell-notification-counter-background);
-      color: var(--shell-notification-counter-text);
-      z-index: 10;
-    }
-  }
-}
-
-.shell-process-wrapper {
-  @apply fixed left-0 right-0 bg-white;
-  top: 5.125rem;
-
-  shell-process {
-    @apply w-full max-w-content mx-auto;
-    height: 52px;
-  }
-}
-
-shell-process {
-  height: 52px;
-  grid-area: process;
-}
-
-.shell-footer-wrapper {
-  @apply fixed bottom-0 left-0 right-0 bg-white z-fixed shadow-card;
-
-  shell-footer {
-    @apply w-full max-w-content mx-auto;
-
-    .active {
-      @apply font-bold;
-      color: var(--shell-footer-link-active);
-    }
-  }
-}

apps/isa-app/src/app/shell/shell.component.spec.ts

@@ -1,445 +0,0 @@
-// unit test ShellComponent with Spectator
-
-import { Component } from '@angular/core';
-import { Router } from '@angular/router';
-import { RouterTestingModule } from '@angular/router/testing';
-import { ApplicationProcess, ApplicationService } from '@core/application';
-import { AuthModule, AuthService } from '@core/auth';
-import { Config } from '@core/config';
-import { BreadcrumbService } from '@core/breadcrumb';
-import { DomainAvailabilityService } from '@domain/availability';
-import { DomainDashboardService } from '@domain/isa';
-import { NotificationsHub } from '@hub/notifications';
-import { ModalNotificationsComponent } from '@modal/notifications';
-import { Spectator, createComponentFactory, SpyObject, createSpyObject } from '@ngneat/spectator';
-import { DashboardComponent } from '@page/dashboard';
-import { ShellFooterComponent } from '@shell/footer';
-import { ShellHeaderComponent } from '@shell/header';
-import { ShellProcessComponent, ShellProcessTabComponent } from '@shell/process';
-import { IconRegistry, UiIconComponent, UiIconModule } from '@ui/icon';
-import { UiModalService } from '@ui/modal';
-import { EnvelopeDTO, MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
-import { MockComponent } from 'ng-mocks';
-import { of } from 'rxjs';
-import { first } from 'rxjs/operators';
-import { ShellComponent } from './shell.component';
-import { WrongDestinationModalService } from 'apps/page/package-inspection/src/lib/components/wrong-destination-modal/wrong-destination-modal.service';
-
-// DummyComponent Class
-@Component({
-  selector: 'dummy-component',
-  template: '<div></div>',
-})
-class DummyComponent {
-  constructor() {}
-}
-
-describe('ShellComponent', () => {
-  let spectator: Spectator<ShellComponent>;
-  let applicationServiceMock: SpyObject<ApplicationService>;
-  let modalServiceMock: SpyObject<UiModalService>;
-  let notificationsHubMock: SpyObject<NotificationsHub>;
-  let router: Router;
-  let breadcrumbServiceMock: SpyObject<BreadcrumbService>;
-  let authServiceMock: SpyObject<AuthService>;
-
-  const createComponent = createComponentFactory({
-    component: ShellComponent,
-    imports: [
-      UiIconModule,
-      RouterTestingModule.withRoutes([
-        { path: 'kunde', component: DummyComponent },
-        { path: 'kunde/dashboard', component: DashboardComponent },
-      ]),
-      AuthModule,
-    ],
-    declarations: [
-      MockComponent(ShellHeaderComponent),
-      MockComponent(ShellFooterComponent),
-      MockComponent(ShellProcessComponent),
-      MockComponent(ShellProcessTabComponent),
-    ],
-    mocks: [
-      BreadcrumbService,
-      DomainAvailabilityService,
-      AuthService,
-      DomainDashboardService,
-      Config,
-      WrongDestinationModalService,
-      IconRegistry,
-    ],
-  });
-
-  beforeEach(() => {
-    applicationServiceMock = createSpyObject(ApplicationService);
-    applicationServiceMock.getSection$.and.returnValue(of('customer'));
-    applicationServiceMock.getProcesses$.and.returnValue(of([]));
-    applicationServiceMock.getProcessById$.and.returnValue(of({ id: 4000 }));
-    applicationServiceMock.getActivatedProcessId$.and.returnValue(of(undefined));
-    applicationServiceMock.getLastActivatedProcessWithSectionAndType$.and.returnValue(of({}));
-    applicationServiceMock.getLastActivatedProcessWithSection$.and.returnValue(of({}));
-
-    notificationsHubMock = createSpyObject(NotificationsHub);
-    notificationsHubMock.notifications$ = of({});
-
-    modalServiceMock = createSpyObject(UiModalService);
-
-    authServiceMock = createSpyObject(AuthService);
-
-    spectator = createComponent({
-      providers: [
-        { provide: ApplicationService, useValue: applicationServiceMock },
-        { provide: NotificationsHub, useValue: notificationsHubMock },
-        { provide: UiModalService, useValue: modalServiceMock },
-        { provide: AuthService, useValue: authServiceMock },
-      ],
-    });
-
-    breadcrumbServiceMock = spectator.inject(BreadcrumbService);
-    router = spectator.inject(Router);
-  });
-
-  it('should create', () => {
-    expect(spectator.component).toBeTruthy();
-  });
-
-  describe('shell-header', () => {
-    it('should call setSection() on sectionChange event with the section argument', () => {
-      spyOn(spectator.component, 'setSection');
-      spectator.triggerEventHandler('shell-header', 'sectionChange', 'branch');
-      expect(spectator.component.setSection).toHaveBeenCalledWith('branch');
-    });
-
-    it('should render the header buttons', () => {
-      // Test verhält sich anders, wenn die größe des Browserfensters kleiner ist als 640px, da
-      // die Buttons dann unsichtbar werden und ins Drei-Punkt Menü verschoben werden.
-      if (document.body.clientWidth > 639) {
-        expect(spectator.query('shell-header .notifications-btn')).toBeVisible();
-        expect(spectator.query('shell-header .dashboard-btn')).toBeVisible();
-        expect(spectator.query('shell-header .logout-btn')).toBeVisible();
-      } else {
-        expect(spectator.query('shell-header .notifications-btn')).not.toBeVisible();
-        expect(spectator.query('shell-header .dashboard-btn')).not.toBeVisible();
-        expect(spectator.query('shell-header .logout-btn')).not.toBeVisible();
-      }
-    });
-
-    it('should have a anchor tag which navigates to /kunde/dashboard', () => {
-      const anchor = spectator.query('shell-header a');
-      expect(anchor).toHaveAttribute('href', '/kunde/dashboard');
-    });
-  });
-
-  describe('shell-process', () => {
-    it('should call addProcess() on addProcess event', () => {
-      spyOn(spectator.component, 'addProcess');
-      spectator.triggerEventHandler('shell-process', 'addProcess', undefined);
-      expect(spectator.component.addProcess).toHaveBeenCalled();
-    });
-
-    describe('shell-process-tab', () => {
-      it('should render for each process', () => {
-        const processes = [{}, {}, {}];
-        applicationServiceMock.getSection$.and.returnValue(of('customer'));
-        applicationServiceMock.getProcesses$.and.returnValue(of(processes));
-        spectator.detectComponentChanges();
-        expect(spectator.queryAll('shell-process-tab')).toHaveLength(processes.length);
-      });
-
-      it('should call activateProcess() on activateProcess event', () => {
-        const processes = [{ id: 1 }];
-
-        applicationServiceMock.getProcesses$.and.returnValue(of(processes));
-        spectator.detectComponentChanges();
-
-        spyOn(spectator.component, 'activateProcess');
-        spectator.triggerEventHandler('shell-process-tab', 'activateProcess', processes[0].id);
-        expect(spectator.component.activateProcess).toHaveBeenCalledWith(1);
-      });
-
-      it('should call closeProcess() on closeProcess event', () => {
-        const processes = [{ id: 1 }];
-
-        applicationServiceMock.getProcesses$.and.returnValue(of(processes));
-        spectator.detectComponentChanges();
-
-        spyOn(spectator.component, 'closeProcess');
-        spectator.triggerEventHandler('shell-process-tab', 'closeProcess', processes[0].id);
-        expect(spectator.component.closeProcess).toHaveBeenCalledWith(1);
-      });
-    });
-  });
-
-  describe('shell-footer', () => {
-    it('should render when section is set', () => {
-      applicationServiceMock.getSection$.and.returnValue(of('customer'));
-      spectator.detectComponentChanges();
-      expect(spectator.query('shell-footer')).toBeVisible();
-    });
-
-    it('should not render when section is undefined', () => {
-      applicationServiceMock.getSection$.and.returnValue(of(undefined));
-      spectator.detectComponentChanges();
-      expect(spectator.query('shell-footer')).not.toBeVisible();
-    });
-
-    xit('should display the menu items for section customer', () => {
-      applicationServiceMock.getSection$.and.returnValue(of('customer'));
-      spectator.component.customerBasePath$ = of('/kunde/1');
-      spectator.detectComponentChanges();
-
-      authServiceMock.hasRole.and.returnValue(true);
-
-      const anchors = spectator.queryAll('shell-footer a');
-      expect(anchors[0]).toHaveText('Artikelsuche');
-      expect(anchors[0]).toHaveAttribute('href', '/kunde/1/product');
-      expect(anchors[1]).toHaveText('Kundensuche');
-      expect(anchors[1]).toHaveAttribute('href', '/kunde/1/customer');
-      expect(anchors[2]).toHaveText('Warenausgabe');
-      expect(anchors[2]).toHaveAttribute('href', '/kunde/1/goods/out');
-    });
-
-    it('should display the menu items for section branch', () => {
-      applicationServiceMock.getSection$.and.returnValue(of('branch'));
-      spectator.detectComponentChanges();
-
-      const anchors = spectator.queryAll('shell-footer a');
-      expect(anchors[0]).toHaveText('Sortiment');
-      expect(anchors[0]).toHaveAttribute('href', '/filiale/assortment');
-      expect(anchors[1]).toHaveText('Tätigkeitskalender');
-      expect(anchors[1]).toHaveAttribute('href', '/filiale/task-calendar');
-      expect(anchors[2]).toHaveText('Abholfach');
-      expect(anchors[2]).toHaveAttribute('href', '/filiale/goods/in');
-      expect(anchors[3]).toHaveText('Remission');
-      expect(anchors[3]).toHaveAttribute('href', '/filiale/remission');
-      // expect(anchors[4]).toHaveText('Wareneingang');
-      // expect(anchors[4]).toHaveAttribute('href', '/filiale/package-inspection');
-    });
-  });
-
-  describe('activatedProcessId$', () => {
-    it('should call _appService.getActivatedProcessId$() and return its value', async () => {
-      applicationServiceMock.getActivatedProcessId$.and.returnValue(of(1));
-      const processId = await spectator.component.activatedProcessId$.pipe(first()).toPromise();
-      expect(processId).toBe(1);
-      expect(applicationServiceMock.getActivatedProcessId$).toHaveBeenCalled();
-    });
-  });
-
-  describe('section$', () => {
-    it('should call _appService.getSection$() and return its value', async () => {
-      applicationServiceMock.getSection$.and.returnValue(of('branch'));
-      const section = await spectator.component.section$.pipe(first()).toPromise();
-      expect(section).toBe('branch');
-      expect(applicationServiceMock.getSection$).toHaveBeenCalled();
-    });
-  });
-
-  describe('processes$', () => {
-    it('should call _appService.processes$() and return its value', async () => {
-      applicationServiceMock.getProcesses$.and.returnValue(of([{}, {}]));
-      const processes = await spectator.component.processes$.pipe(first()).toPromise();
-      expect(processes).toHaveLength(2);
-      expect(applicationServiceMock.getProcesses$).toHaveBeenCalledWith('customer');
-    });
-  });
-
-  describe('remissionProcess$', () => {
-    it('should call _appService.getProcessById$() with Remission Id and return its value', async () => {
-      applicationServiceMock.getProcessById$.and.returnValue(of({ id: 4000 }));
-      await spectator.component.remissionProcess$.pipe(first()).toPromise();
-      expect(applicationServiceMock.getProcessById$).toHaveBeenCalled();
-    });
-  });
-
-  describe('remissionUrl$', () => {
-    it('should return the correct url if process.data.active is available', async () => {
-      const process = {
-        id: 4000,
-        data: {
-          active: 9999,
-        },
-      };
-      applicationServiceMock.getProcessById$.and.returnValue(of(process));
-      const url = await spectator.component.remissionUrl$.pipe(first()).toPromise();
-      expect(url).toBe('/filiale/remission/9999/list');
-    });
-
-    it('should return the correct url if process.data.active is not available', async () => {
-      const process = {
-        id: 4000,
-        data: {},
-      };
-      applicationServiceMock.getProcessById$.and.returnValue(of(process));
-      const url = await spectator.component.remissionUrl$.pipe(first()).toPromise();
-      expect(url).toBe('/filiale/remission');
-    });
-  });
-
-  describe('remissionQueryParams$', () => {
-    it('should return the correct queryParams if process.data.active and process.data.queryParams are available', async () => {
-      const process = {
-        id: 4000,
-        data: {
-          active: 9999,
-          queryParams: { filter: 'test' },
-        },
-      };
-      applicationServiceMock.getProcessById$.and.returnValue(of(process));
-      const queryParams = await spectator.component.remissionQueryParams$.pipe(first()).toPromise();
-      expect(queryParams).toEqual(process.data.queryParams);
-    });
-
-    it('should return the correct queryParams if process.data.active and process.data.queryParams are not available', async () => {
-      const process = {
-        id: 4000,
-        data: {},
-      };
-      applicationServiceMock.getProcessById$.and.returnValue(of(process));
-      const queryParams = await spectator.component.remissionQueryParams$.pipe(first()).toPromise();
-      expect(queryParams).toEqual({});
-    });
-  });
-
-  describe('setSection()', () => {
-    it('should call _appService.setSection() with the argument section', async () => {
-      await spectator.component.setSection('customer');
-      expect(applicationServiceMock.setSection).toHaveBeenCalledWith('customer');
-    });
-
-    it('should call activateProcess if getLastActivatedProcessWithSection returns a value', async () => {
-      applicationServiceMock.getLastActivatedProcessWithSection$.and.returnValue(of({ id: 1 }));
-      spyOn(spectator.component, 'activateProcess');
-      await spectator.component.setSection('customer');
-      expect(spectator.component.activateProcess).toHaveBeenCalledWith(1);
-    });
-  });
-
-  describe('logout()', () => {
-    it('should call _authService.logout()', () => {
-      spectator.component.logout();
-      expect(authServiceMock.logout).toHaveBeenCalled();
-    });
-  });
-
-  describe('addProcess()', () => {
-    it('should call navigate to /kunde/{timestamp}/product', () => {
-      spyOn(router, 'navigate');
-      spyOn(Date, 'now').and.returnValue(123);
-      spectator.component.addProcess();
-      expect(router.navigate).toHaveBeenCalledWith(['/kunde', 123, 'product']);
-    });
-  });
-
-  describe('closeProcess()', () => {
-    it('should call _appService.removeProcess() with the processId argument', () => {
-      const processes = [{}, {}, {}];
-      applicationServiceMock.getSection$.and.returnValue(of('customer'));
-      applicationServiceMock.getProcesses$.and.returnValue(of(processes));
-      spectator.component.closeProcess(1);
-      expect(applicationServiceMock.removeProcess).toHaveBeenCalledWith(1);
-    });
-
-    it('should navigate to kunde/dashboard if no process is available', async () => {
-      spyOn(router, 'navigate');
-      applicationServiceMock.getSection$.and.returnValue(of('customer'));
-      applicationServiceMock.getProcesses$.and.returnValue(of([]));
-      spectator.detectComponentChanges();
-      await spectator.component.closeProcess(1);
-      expect(router.navigate).toHaveBeenCalledWith(['/kunde', 'dashboard']);
-    });
-
-    it('should not navigate to kunde/dashboard if processes are available', async () => {
-      spyOn(router, 'navigate');
-      const processes = [
-        { id: 1, name: 'test', section: 'customer' },
-        { id: 2, name: 'test', section: 'customer' },
-      ];
-
-      applicationServiceMock.getLastActivatedProcessWithSection$.and.returnValue(of({}));
-      applicationServiceMock.getSection$.and.returnValue(of('customer'));
-      applicationServiceMock.getProcesses$.and.returnValue(of(processes));
-      await spectator.component.closeProcess(1);
-      expect(router.navigate).not.toHaveBeenCalledWith(['/kunde', 'dashboard']);
-    });
-
-    it('should activate the next process when it was not the last process', async () => {
-      spyOn(spectator.component, 'activateProcess');
-
-      applicationServiceMock.getLastActivatedProcessWithSection$.and.returnValue(
-        of({
-          id: 2,
-          name: 'test',
-          section: 'customer',
-          activated: 2,
-        })
-      );
-
-      const processes = [
-        { id: 1, name: 'test', section: 'customer', activated: 1 },
-        { id: 2, name: 'test', section: 'customer', activated: 2 },
-      ];
-      applicationServiceMock.getSection$.and.returnValue(of('customer'));
-      applicationServiceMock.getProcesses$.and.returnValue(of(processes));
-      await spectator.component.closeProcess(1);
-
-      expect(spectator.component.activateProcess).toHaveBeenCalledWith(2);
-    });
-  });
-
-  describe('activateProcess()', () => {
-    it('should get the last activated breadcrumb by key and if it is defined it navigates to its path with queryParams', async () => {
-      const crumb = { path: '/kunde/product', params: { id: 1 } };
-      spyOn(router, 'navigate');
-      breadcrumbServiceMock.getLastActivatedBreadcrumbByKey$.and.returnValue(of(crumb));
-
-      await spectator.component.activateProcess(1);
-      expect(router.navigate).toHaveBeenCalledWith([crumb.path], { queryParams: crumb.params });
-    });
-
-    it('should navigate to /kunde if no breadcrumb for this process exists', async () => {
-      breadcrumbServiceMock.getLastActivatedBreadcrumbByKey$.and.returnValue(of(undefined));
-      spyOn(router, 'navigate');
-
-      await spectator.component.activateProcess(1);
-      expect(router.navigate).toHaveBeenCalledWith(['/kunde', 1, 'product']);
-    });
-  });
-
-  describe('processAction()', () => {
-    it('should navigate to cart when process type is cart', () => {
-      spyOn(router, 'navigate');
-
-      const process: ApplicationProcess = { id: 1, name: 'Vorgang', section: 'customer', type: 'cart' };
-      spectator.component.processAction(process);
-      expect(router.navigate).toHaveBeenCalledWith(['/kunde', process.id, 'cart']);
-    });
-
-    it('should not navigate to when process type is not cart', () => {
-      spyOn(router, 'navigate');
-
-      const process: ApplicationProcess = { id: 1, name: 'Vorgang', section: 'customer', type: 'goods-out' };
-      spectator.component.processAction(process);
-      expect(router.navigate).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('openNotifications()', () => {
-    it('should call modalService.open() with the ModalNotificationComponent', async () => {
-      const notifications: EnvelopeDTO<MessageBoardItemDTO[]> = {
-        data: [{}, {}, {}],
-      };
-
-      spectator.component.notifications$ = of(notifications);
-
-      await spectator.component.openNotifications();
-      expect(modalServiceMock.open).toHaveBeenCalledWith({
-        content: ModalNotificationsComponent,
-        data: notifications,
-        config: {
-          showScrollbarY: false,
-        },
-      });
-    });
-  });
-});

apps/isa-app/src/app/shell/shell.component.ts

@@ -1,176 +0,0 @@
-import { Component, ChangeDetectionStrategy, ViewChildren, QueryList, TrackByFunction, NgZone } from '@angular/core';
-import { ApplicationProcess, ApplicationService } from '@core/application';
-import { first, map, shareReplay, switchMap, take, tap } from 'rxjs/operators';
-import { NotificationsHub } from '@hub/notifications';
-import { ModalNotificationsComponent } from '@modal/notifications';
-import { UiModalService } from '@ui/modal';
-import { Router } from '@angular/router';
-import { BreadcrumbService } from '@core/breadcrumb';
-import { combineLatest } from 'rxjs';
-import { AuthService } from '@core/auth';
-import { DomainAvailabilityService } from '@domain/availability';
-import { ShellProcessTabComponent } from '@shell/process';
-import { Config } from '@core/config';
-import { WrongDestinationModalService } from 'apps/page/package-inspection/src/lib/components/wrong-destination-modal/wrong-destination-modal.service';
-
-@Component({
-  selector: 'app-shell',
-  templateUrl: 'shell.component.html',
-  styleUrls: ['shell.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class ShellComponent {
-  isDevelopment = Boolean(this._config.get('debug'));
-
-  debugOpen = false;
-
-  @ViewChildren('processTabs')
-  readonly processTabs: QueryList<ShellProcessTabComponent>;
-
-  notifications$ = this._notificationsHub.notifications$;
-
-  notificationCount$ = this.notifications$.pipe(
-    map((notifications) => Object.values(notifications).reduce((acc, val) => acc + val?.length ?? 0, 0))
-  );
-
-  get activatedProcessId$() {
-    return this._appService.getActivatedProcessId$().pipe(
-      tap((activatedProcessId) => {
-        this.processTabs?.find((process) => process?.process?.id === activatedProcessId && !process?.isActive)?.slideIntoView();
-      })
-    );
-  }
-
-  customerBasePath$ = this.activatedProcessId$.pipe(
-    switchMap((processId) => this._appService.getProcessById$(processId)),
-    map((process) => {
-      if (!!process && process.section === 'customer' && process.type !== 'cart-checkout') {
-        // Übernehme aktiven Prozess
-        return `/kunde/${process.id}`;
-      } else {
-        // Über Guards wird ein neuer Prozess erstellt
-        return '/kunde';
-      }
-    })
-  );
-
-  get section$() {
-    return this._appService.getSection$().pipe(shareReplay());
-  }
-
-  get processes$() {
-    return this.section$.pipe(switchMap((section) => this._appService.getProcesses$(section)));
-  }
-
-  get remissionProcess$() {
-    return this._appService.getProcessById$(this._config.get('process.ids.remission'));
-  }
-
-  get remissionUrl$() {
-    return this.remissionProcess$.pipe(
-      map((process) => (process?.data?.active ? `/filiale/remission/${process.data.active}/list` : '/filiale/remission'))
-    );
-  }
-
-  get remissionQueryParams$() {
-    return this.remissionProcess$.pipe(
-      map((process) => (process?.data?.active && process?.data?.queryParams ? process.data.queryParams : {}))
-    );
-  }
-
-  get addProcessLabel$() {
-    return combineLatest([this.section$, this.processes$]).pipe(
-      map(([section, processes]) => (section === 'customer' && processes.length === 0 ? 'VORGANG STARTEN' : ''))
-    );
-  }
-
-  get canAddProcess$() {
-    return this.section$.pipe(map((section) => section === 'customer'));
-  }
-
-  get currentBranch$() {
-    return this._availabilityService.getDefaultBranch();
-  }
-
-  constructor(
-    private readonly _appService: ApplicationService,
-    private readonly _config: Config,
-    private readonly _notificationsHub: NotificationsHub,
-    private readonly _modal: UiModalService,
-    private readonly _router: Router,
-    private readonly _breadcrumbService: BreadcrumbService,
-    private readonly _authService: AuthService,
-    private readonly _availabilityService: DomainAvailabilityService,
-    private readonly _zone: NgZone,
-    private readonly _wrongDestinationModalService: WrongDestinationModalService
-  ) {}
-
-  async setSection(section: 'customer' | 'branch') {
-    this._appService.setSection(section);
-
-    const lastProcessId = (await this._appService.getLastActivatedProcessWithSection$(section).pipe(first()).toPromise())?.id;
-    if (lastProcessId) {
-      this.activateProcess(lastProcessId);
-    } else {
-      this._router.navigate([section === 'customer' ? '/kunde' : '/filiale']);
-    }
-  }
-
-  // Process werden über Guards erstellt und aktiviert. An dieser Stelle wird nur navigiert
-  async addProcess() {
-    const processId = Date.now();
-    await this._router.navigate(['/kunde', processId, 'product']);
-  }
-
-  async activateProcess(activatedProcessId: number) {
-    try {
-      const latestCrumb = await this._breadcrumbService?.getLastActivatedBreadcrumbByKey$(activatedProcessId)?.pipe(take(1)).toPromise();
-      await this._zone.run(async () => {
-        if (latestCrumb) {
-          await this._router.navigate([latestCrumb.path], { queryParams: latestCrumb.params });
-        } else {
-          await this._router.navigate(['/kunde', activatedProcessId, 'product']);
-        }
-      });
-    } catch (error) {}
-  }
-
-  async closeProcess(processId: number) {
-    this._appService.removeProcess(processId);
-
-    const processes = await this.processes$.pipe(first()).toPromise();
-    if (processes.length === 0) {
-      await this._router.navigate(['/kunde', 'dashboard']);
-      return;
-    }
-
-    const section = await this.section$.pipe(first()).toPromise();
-    const lastActivatedProcess = await this._appService.getLastActivatedProcessWithSection$(section).pipe(first()).toPromise();
-    this.activateProcess(lastActivatedProcess?.id);
-  }
-
-  processAction(process: ApplicationProcess) {
-    if (process?.type === 'cart') {
-      this._router.navigate(['/kunde', process.id, 'cart']);
-    }
-  }
-
-  async logout() {
-    await this._authService.logout();
-  }
-
-  async openNotifications() {
-    const notifications = await this.notifications$.pipe(first()).toPromise();
-    this._modal.open({
-      content: ModalNotificationsComponent,
-      data: notifications,
-      config: {
-        showScrollbarY: false,
-      },
-    });
-  }
-
-  trackByIdFn: TrackByFunction<ApplicationProcess> = (_, process) => process.id;
-
-  fetchAndOpenPackages = () => this._wrongDestinationModalService.fetchAndOpen();
-}

apps/isa-app/src/app/shell/shell.module.ts

@@ -1,31 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { OverlayModule } from '@angular/cdk/overlay';
-
-import { ShellHeaderModule } from '@shell/header';
-import { ShellProcessModule } from '@shell/process';
-import { ShellFooterModule } from '@shell/footer';
-
-import { ShellComponent } from './shell.component';
-import { UiIconModule } from '@ui/icon';
-import { RouterModule } from '@angular/router';
-import { AuthModule } from '@core/auth';
-import { DebugComponent } from '../debug/debug.component';
-
-@NgModule({
-  imports: [
-    RouterModule,
-    CommonModule,
-    ShellHeaderModule,
-    ShellProcessModule,
-    ShellFooterModule,
-    UiIconModule,
-    OverlayModule,
-    AuthModule,
-    DebugComponent,
-  ],
-  exports: [ShellComponent],
-  declarations: [ShellComponent],
-  providers: [],
-})
-export class ShellModule {}

apps/isa-app/src/assets/icons.json

@@ -6,6 +6,10 @@
             "name": "account",
             "data": "M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z"
         },
+        {
+            "name": "account-circle",
+            "data": "M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M7.07,18.28C7.5,17.38 10.12,16.5 12,16.5C13.88,16.5 16.5,17.38 16.93,18.28C15.57,19.36 13.86,20 12,20C10.14,20 8.43,19.36 7.07,18.28M18.36,16.83C16.93,15.09 13.46,14.5 12,14.5C10.54,14.5 7.07,15.09 5.64,16.83C4.62,15.5 4,13.82 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,13.82 19.38,15.5 18.36,16.83M12,6C10.06,6 8.5,7.56 8.5,9.5C8.5,11.44 10.06,13 12,13C13.94,13 15.5,11.44 15.5,9.5C15.5,7.56 13.94,6 12,6M12,11A1.5,1.5 0 0,1 10.5,9.5A1.5,1.5 0 0,1 12,8A1.5,1.5 0 0,1 13.5,9.5A1.5,1.5 0 0,1 12,11Z"
+        },
         {
             "name": "package-variant-closed",
             "data": "M21,16.5C21,16.88 20.79,17.21 20.47,17.38L12.57,21.82C12.41,21.94 12.21,22 12,22C11.79,22 11.59,21.94 11.43,21.82L3.53,17.38C3.21,17.21 3,16.88 3,16.5V7.5C3,7.12 3.21,6.79 3.53,6.62L11.43,2.18C11.59,2.06 11.79,2 12,2C12.21,2 12.41,2.06 12.57,2.18L20.47,6.62C20.79,6.79 21,7.12 21,7.5V16.5M12,4.15L10.11,5.22L16,8.61L17.96,7.5L12,4.15M6.04,7.5L12,10.85L13.96,9.75L8.08,6.35L6.04,7.5M5,15.91L11,19.29V12.58L5,9.21V15.91M19,15.91V9.21L13,12.58V19.29L19,15.91Z"
@@ -256,6 +260,26 @@
             "name": "badge",
             "data": "M140-80q-24 0-42-18t-18-42v-480q0-24 18-42t42-18h250v-140q0-24 18-42t42.411-18h59.178Q534-880 552-862t18 42v140h250q24 0 42 18t18 42v480q0 24-18 42t-42 18H140Zm0-60h680v-480H570v30q0 28-18 44t-42.411 16h-59.178Q426-530 408-546t-18-44v-30H140v480Zm92-107h239v-14q0-18-9-32t-23-19q-32-11-50-14.5t-35-3.5q-19 0-40.5 4.5T265-312q-15 5-24 19t-9 32v14Zm336-67h170v-50H568v50Zm-214-50q22.5 0 38.25-15.75T408-418q0-22.5-15.75-38.25T354-472q-22.5 0-38.25 15.75T300-418q0 22.5 15.75 38.25T354-364Zm214-63h170v-50H568v50ZM450-590h60v-230h-60v230Zm30 210Z",
             "viewBox": "0 -960 960 960"
+        },
+        {
+            "name": "text-increase",
+            "data": "m40-200 220-560h80l220 560h-75l-57-150H172l-57 150H40Zm156-214h208L302-685h-4L196-414Zm534 94v-130H600v-60h130v-130h60v130h130v60H790v130h-60Z",
+            "viewBox": "0 -960 960 960"
+        },
+        {
+            "name": "text-decrease",
+            "data": "m40-200 220-560h80l220 560h-75l-57-150H172l-57 150H40Zm156-214h208L302-685h-4L196-414Zm414-36v-60h310v60H610Z",
+            "viewBox":"0 -960 960 960"
+        },
+        {
+            "name": "calendar-today",
+            "data": "M180-80q-24 0-42-18t-18-42v-620q0-24 18-42t42-18h65v-60h65v60h340v-60h65v60h65q24 0 42 18t18 42v620q0 24-18 42t-42 18H180Zm0-60h600v-430H180v430Zm0-490h600v-130H180v130Zm0 0v-130 130Z",
+            "viewBox": "0 -960 960 960"
+        },
+        {
+            "name": "apps",
+            "data": "M226-160q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19Zm254 0q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19Zm254 0q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19ZM226-414q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19Zm254 0q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19Zm254 0q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19ZM226-668q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19Zm254 0q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19Zm254 0q-28 0-47-19t-19-47q0-28 19-47t47-19q28 0 47 19t19 47q0 28-19 47t-47 19Z",
+            "viewBox": "0 -960 960 960"
         }
         
     ],
@@ -324,6 +348,14 @@
             "name": "isa-hard-cover",
             "alias": "GEH"
         },
+        {
+            "name": "isa-hard-cover",
+            "alias": "PP"
+        },
+        {
+            "name": "isa-hard-cover",
+            "alias": "DR"
+        },
         {
             "name": "isa-hard-cover",
             "alias": "HC"
@@ -383,6 +415,10 @@
         {
             "name": "isa-box-out",
             "alias": "Versandbestellung (oder gemischt)"
+        },
+        {
+            "name": "package-variant-closed",
+            "alias": "Bestellung ohne Konto"
         },{
             "name": "person",
             "alias": "Onlinekonto"

apps/isa-app/src/assets/icons/icons.css

@@ -1,20 +0,0 @@
-@font-face {
-  font-family: 'Material Symbols Outlined';
-  font-style: normal;
-  font-weight: 100 700;
-  src: url(./materials-icons-outlined.woff2) format('woff2');
-}
-
-@font-face {
-  font-family: 'Material Symbols Rounded';
-  font-style: normal;
-  font-weight: 100 700;
-  src: url(./materials-icons-rounded.woff2) format('woff2');
-}
-
-@font-face {
-  font-family: 'Material Symbols Sharp';
-  font-style: normal;
-  font-weight: 100 700;
-  src: url(./materials-icons-sharp.woff2) format('woff2');
-}

apps/isa-app/src/config/config.feature.json

@@ -16,6 +16,9 @@
     "@core/logger": {
         "logLevel": "debug"
     },
+    "@domain/checkout": {
+        "olaExpiration": "5m"
+    },
     "@swagger/isa": {
         "rootUrl": "https://isa-test.paragon-data.net/isa/v1"
     },
@@ -64,11 +67,14 @@
             "taskCalendar": 3000,
             "remission": 4000,
             "packageInspection": 5000,
-            "assortment": 6000
+            "assortment": 6000,
+            "pickupShelf": 7000
         }
     },
     "checkForUpdates": 3600000,
     "licence": {
-        "scandit": "AZ7zLw2eLmFWHbYP4RDq8VAEgAxmNGYcPU8YpOc3DryEXj4zMzYQFrQuUm0YewGQYEESXjpRwGX1NYmKY3pXHnAn2DeqIzh2an+FUu9socQlbQnJiHJHoWBAqcqWSua+P12tc95P3s9aaEEYvSjUy7Md88f7N+sk6zZbUmqbMXeXqmZwdkmRoUY/2w0CiiiA4gBFHgu4sMeNQ9dWyfxKTUPf5AnsxnuYpCt5KLxJWSYDv8HHj0mx8DCJTe1m2ony97Lge3JbJ5Dd+Zz6SCwqik7fv53Qole9s/3m66lYFWKAzWRKkHN1zts78CmPxPb+AAHVoqlBM3duvYmnCxxGOmlXabKUNuDR2ExaMu/nlo532jqqy25Cet/FP1UAs96ZGRgzEcHxGPp6kA53lJ15zd+cxz6G93E83AmYJkhddXBQElWEaGtQRfrEzRGmvcksR+V8MMYjGmhkVbQxGGqpnfP4IxbuEFcef6bxxTiulzo75gXoqZTt+7C1qpDcrMM3Yp0Z8RBw3JlV2tLk4FYFZpxY8QrXIcjvRYKExtQ9e5sSbST4Vx95YhEUd6iX0SBPDzcmgR4/Ef6gvJfoWgz68+rqhBGckphdHi2Mf/pYuAlh2jbwtrkErE2xWARBejR/UcU/A3F7k9RkFd5/QZC7qhsE6bZH7uhpkptIbi5XkXagwYy1oJD7yJs4VLOJteYWferRm8h1auxXew5tL8VLHciF+lLj6h8PTUDt2blLgUjHtualqlCwdSTzJyYwk4oswGGDk6E48X7LXpzuhtR8TYTOi2REN0uuTbO/slFBRw+CaYUnD0LjB9p2lb8ndcdV9adzBKmwPxiOtlOELQ=="
-    }
+        "scandit": "Ae7z0WDdRDFqG6oYuAXzesYGJpDLDqt+xWtQHOESiOjaSkB7IEIDJAk534U+cg1zGnk++4hOEK9hXEGR01NLTjh76w1fDL0U63OUjo50EHBXIUvzAVSur3pRY+1ER7SvSEWaT0hDOLYvYrTpdECtt1graN9yMvJzXD38VJKUfssT92p+YENV2Hul3eXIvaVjHqXE/yvupF+MlOMMUMhX0/Km/yTU9H9SjBdsXYihZmYWbt2JotO3Zs1ojXb0+3La10xb01S1q0XdDN6El3XMVilEtdmrP3WoGois8vpQBvOCEvduxCfILFAqjeWXTZvXSut9u+kQKpK8uHW4rVV6iVClpZfPYqKJqTh78AI9gpnfb/zO9GfQEDS3g7wI5WbQKqaNRzhTVowFRri4Ep9R5TRC1bnd00RC4zVaMkbu5kBOA7YoRjgUiYWHKJpi/VokZWyN6u1lsi5mTUbQkm1ZWfX5I/iUVYBgyHZYl+8kfFkwLPXGZNrF4xqubjKiCZRQj0oyNjHOBeHqvAekzhk7scX2g/NN+liRQv4ur413b+uXacSiiYIrLhtGgzrz1KRrtu19uB5odk3LoerDoiYXat7wEg9zUYT/+uBfO2X+uS7L5LW0PMI3hV+joQVpDk5SlA2868Nx0KWtPWmMf7xCuFIhDskfBsXZNRTblqxkk0RzzSqtjx9ihGr+/Tuzm8Pm0s4OQqV7b+++/Zn+Vo4rCqMTwutjOO7dqhah5hbOT1MqY/6VcjCXyDad3BXXr+WYU4GtYTe8Ytjkm/ZTG3fImoDbMchEcqnCw3oxG5e/gkdurE8g/mZlFOtzAN7KkqIsg6qLaC5COjfLPXsi/A=="
+    },
+    "@shared/icon": "/assets/icons.json"
+
 }

apps/isa-app/src/config/config.integration.json

@@ -1,7 +1,7 @@
 {
   "title": "ISA - Integration",
   "silentRefresh": {
-    "interval": 300000
+    "interval": 60000
   },
   "@cdn/product-image": {
     "url": "https://produktbilder.paragon-data.net"
@@ -15,6 +15,9 @@
   "@core/logger": {
     "logLevel": "debug"
   },
+  "@domain/checkout": {
+    "olaExpiration": "5m"
+},
   "@swagger/isa": {
     "rootUrl": "https://isa-integration.paragon-data.net/isa/v1"
   },
@@ -63,11 +66,13 @@
       "taskCalendar": 3000,
       "remission": 4000,
       "packageInspection": 5000,
-      "assortment": 6000
+      "assortment": 6000,
+      "pickupShelf": 7000
     }
   },
-  "checkForUpdates": 3600000,
+  "checkForUpdates": 900000,
   "licence": {
-    "scandit": "AZ7zLw2eLmFWHbYP4RDq8VAEgAxmNGYcPU8YpOc3DryEXj4zMzYQFrQuUm0YewGQYEESXjpRwGX1NYmKY3pXHnAn2DeqIzh2an+FUu9socQlbQnJiHJHoWBAqcqWSua+P12tc95P3s9aaEEYvSjUy7Md88f7N+sk6zZbUmqbMXeXqmZwdkmRoUY/2w0CiiiA4gBFHgu4sMeNQ9dWyfxKTUPf5AnsxnuYpCt5KLxJWSYDv8HHj0mx8DCJTe1m2ony97Lge3JbJ5Dd+Zz6SCwqik7fv53Qole9s/3m66lYFWKAzWRKkHN1zts78CmPxPb+AAHVoqlBM3duvYmnCxxGOmlXabKUNuDR2ExaMu/nlo532jqqy25Cet/FP1UAs96ZGRgzEcHxGPp6kA53lJ15zd+cxz6G93E83AmYJkhddXBQElWEaGtQRfrEzRGmvcksR+V8MMYjGmhkVbQxGGqpnfP4IxbuEFcef6bxxTiulzo75gXoqZTt+7C1qpDcrMM3Yp0Z8RBw3JlV2tLk4FYFZpxY8QrXIcjvRYKExtQ9e5sSbST4Vx95YhEUd6iX0SBPDzcmgR4/Ef6gvJfoWgz68+rqhBGckphdHi2Mf/pYuAlh2jbwtrkErE2xWARBejR/UcU/A3F7k9RkFd5/QZC7qhsE6bZH7uhpkptIbi5XkXagwYy1oJD7yJs4VLOJteYWferRm8h1auxXew5tL8VLHciF+lLj6h8PTUDt2blLgUjHtualqlCwdSTzJyYwk4oswGGDk6E48X7LXpzuhtR8TYTOi2REN0uuTbO/slFBRw+CaYUnD0LjB9p2lb8ndcdV9adzBKmwPxiOtlOELQ=="
-  }
+    "scandit": "Ae7z0WDdRDFqG6oYuAXzesYGJpDLDqt+xWtQHOESiOjaSkB7IEIDJAk534U+cg1zGnk++4hOEK9hXEGR01NLTjh76w1fDL0U63OUjo50EHBXIUvzAVSur3pRY+1ER7SvSEWaT0hDOLYvYrTpdECtt1graN9yMvJzXD38VJKUfssT92p+YENV2Hul3eXIvaVjHqXE/yvupF+MlOMMUMhX0/Km/yTU9H9SjBdsXYihZmYWbt2JotO3Zs1ojXb0+3La10xb01S1q0XdDN6El3XMVilEtdmrP3WoGois8vpQBvOCEvduxCfILFAqjeWXTZvXSut9u+kQKpK8uHW4rVV6iVClpZfPYqKJqTh78AI9gpnfb/zO9GfQEDS3g7wI5WbQKqaNRzhTVowFRri4Ep9R5TRC1bnd00RC4zVaMkbu5kBOA7YoRjgUiYWHKJpi/VokZWyN6u1lsi5mTUbQkm1ZWfX5I/iUVYBgyHZYl+8kfFkwLPXGZNrF4xqubjKiCZRQj0oyNjHOBeHqvAekzhk7scX2g/NN+liRQv4ur413b+uXacSiiYIrLhtGgzrz1KRrtu19uB5odk3LoerDoiYXat7wEg9zUYT/+uBfO2X+uS7L5LW0PMI3hV+joQVpDk5SlA2868Nx0KWtPWmMf7xCuFIhDskfBsXZNRTblqxkk0RzzSqtjx9ihGr+/Tuzm8Pm0s4OQqV7b+++/Zn+Vo4rCqMTwutjOO7dqhah5hbOT1MqY/6VcjCXyDad3BXXr+WYU4GtYTe8Ytjkm/ZTG3fImoDbMchEcqnCw3oxG5e/gkdurE8g/mZlFOtzAN7KkqIsg6qLaC5COjfLPXsi/A=="
+  },
+  "@shared/icon": "/assets/icons.json"
 }

apps/isa-app/src/config/config.json

@@ -47,6 +47,9 @@
     "@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",
@@ -65,11 +68,13 @@
             "taskCalendar": 3000,
             "remission": 4000,
             "packageInspection": 5000,
-            "assortment": 6000
+            "assortment": 6000,
+            "pickupShelf": 7000
         }
     },
     "checkForUpdates": 3600000,
     "licence": {
-        "scandit": "AZ7zLw2eLmFWHbYP4RDq8VAEgAxmNGYcPU8YpOc3DryEXj4zMzYQFrQuUm0YewGQYEESXjpRwGX1NYmKY3pXHnAn2DeqIzh2an+FUu9socQlbQnJiHJHoWBAqcqWSua+P12tc95P3s9aaEEYvSjUy7Md88f7N+sk6zZbUmqbMXeXqmZwdkmRoUY/2w0CiiiA4gBFHgu4sMeNQ9dWyfxKTUPf5AnsxnuYpCt5KLxJWSYDv8HHj0mx8DCJTe1m2ony97Lge3JbJ5Dd+Zz6SCwqik7fv53Qole9s/3m66lYFWKAzWRKkHN1zts78CmPxPb+AAHVoqlBM3duvYmnCxxGOmlXabKUNuDR2ExaMu/nlo532jqqy25Cet/FP1UAs96ZGRgzEcHxGPp6kA53lJ15zd+cxz6G93E83AmYJkhddXBQElWEaGtQRfrEzRGmvcksR+V8MMYjGmhkVbQxGGqpnfP4IxbuEFcef6bxxTiulzo75gXoqZTt+7C1qpDcrMM3Yp0Z8RBw3JlV2tLk4FYFZpxY8QrXIcjvRYKExtQ9e5sSbST4Vx95YhEUd6iX0SBPDzcmgR4/Ef6gvJfoWgz68+rqhBGckphdHi2Mf/pYuAlh2jbwtrkErE2xWARBejR/UcU/A3F7k9RkFd5/QZC7qhsE6bZH7uhpkptIbi5XkXagwYy1oJD7yJs4VLOJteYWferRm8h1auxXew5tL8VLHciF+lLj6h8PTUDt2blLgUjHtualqlCwdSTzJyYwk4oswGGDk6E48X7LXpzuhtR8TYTOi2REN0uuTbO/slFBRw+CaYUnD0LjB9p2lb8ndcdV9adzBKmwPxiOtlOELQ=="
-    }
+        "scandit": "Ae7z0WDdRDFqG6oYuAXzesYGJpDLDqt+xWtQHOESiOjaSkB7IEIDJAk534U+cg1zGnk++4hOEK9hXEGR01NLTjh76w1fDL0U63OUjo50EHBXIUvzAVSur3pRY+1ER7SvSEWaT0hDOLYvYrTpdECtt1graN9yMvJzXD38VJKUfssT92p+YENV2Hul3eXIvaVjHqXE/yvupF+MlOMMUMhX0/Km/yTU9H9SjBdsXYihZmYWbt2JotO3Zs1ojXb0+3La10xb01S1q0XdDN6El3XMVilEtdmrP3WoGois8vpQBvOCEvduxCfILFAqjeWXTZvXSut9u+kQKpK8uHW4rVV6iVClpZfPYqKJqTh78AI9gpnfb/zO9GfQEDS3g7wI5WbQKqaNRzhTVowFRri4Ep9R5TRC1bnd00RC4zVaMkbu5kBOA7YoRjgUiYWHKJpi/VokZWyN6u1lsi5mTUbQkm1ZWfX5I/iUVYBgyHZYl+8kfFkwLPXGZNrF4xqubjKiCZRQj0oyNjHOBeHqvAekzhk7scX2g/NN+liRQv4ur413b+uXacSiiYIrLhtGgzrz1KRrtu19uB5odk3LoerDoiYXat7wEg9zUYT/+uBfO2X+uS7L5LW0PMI3hV+joQVpDk5SlA2868Nx0KWtPWmMf7xCuFIhDskfBsXZNRTblqxkk0RzzSqtjx9ihGr+/Tuzm8Pm0s4OQqV7b+++/Zn+Vo4rCqMTwutjOO7dqhah5hbOT1MqY/6VcjCXyDad3BXXr+WYU4GtYTe8Ytjkm/ZTG3fImoDbMchEcqnCw3oxG5e/gkdurE8g/mZlFOtzAN7KkqIsg6qLaC5COjfLPXsi/A=="
+    },
+    "@shared/icon": "/assets/icons.json"
 }

apps/isa-app/src/config/config.production.json

@@ -16,6 +16,9 @@
   "@core/logger": {
     "logLevel": "debug"
   },
+  "@domain/checkout": {
+    "olaExpiration": "5m"
+},
   "@swagger/isa": {
     "rootUrl": "https://isa.paragon-systems.de/isa/v1"
   },
@@ -64,11 +67,13 @@
       "taskCalendar": 3000,
       "remission": 4000,
       "packageInspection": 5000,
-      "assortment": 6000
+      "assortment": 6000,
+      "pickupShelf": 7000
     }
   },
   "checkForUpdates": 3600000,
   "licence": {
-    "scandit": "AZZzfQ+eLFl3Dzf1QSBag1lDibIoOPh4W33erRIRe3SDUMkHDX8eczEjd2TnfRMWoE5lXOBGtESCWICN9EbrmI1S9Lu5APsvvEOD+K54ADwIVawx0HNZRAc8/+9Vf/izcEGOFQFGBQJyR6vzdzFv5HcjznhxI9E3LiF+uVQPtCqsVYzpkMWIrC5VCg2uwNrj9Bw6f8zYi/lZPrDMS5yVKVcajeK7sh9QAq17dR0opjIIuP5t5nDEJ7hnITwtTR5HaM6cX/KhKpTILOgKexvLYqrK6QJWpU85sDwqwn6T7av4V68qL3XrUo60dScop4QsvraQe1HkRsffl6DkAEoX0RNMS5qVWjGerW7lvA/DQd9hsAO3jWFDR9hVDyt2VvmzzFKnHYqTYxC5qG4bCEJ0RJjy6tEP5Q7vL5SxWygVadmjPv+TwDOCS7DxzxIjcO+BXQY7gW6qn0hx9fXzyvO3avrGWqyImMlgEApZq+36ANqtRcPD/stEe4i0N9dSPhYoHPcc/9/9jpts43FozlgfY4wY8Wt5ybB3X0caISMmB/klFIJKKN7num439z3+Xk7ENB/Xvb0XAtnOt/cuxQYsGQ7fb62GOO/7Va5fdE9ZfaIJsS5ToE6oIbV04pLUssJf9cUMsyPFVELYSJmyGPQQFRz0TTxxRvPapIWrfa2x5x3hYUpNTAdY3v0fN9l/1ZqNSBmIBLH/LoXaVJQ2DydGD1/QFZ2Z/S7zTYKg5/cSEpUgiYtbwutNZSjRH29ucSizC524k+Zst95T8G7LJaWCT8SQAcKXqCnjpiEGWzD++h0jXjn6BWjUnIHi0te+27vF/z6UQL00sWco5hUIqF66EiU="
-  }
+    "scandit": "AVljxT/dG+TAIDDL2jTxm843juR2OtZ6lHLxRpYR7x9uYiSvY2IAHdRx8tjsf9KU7wK0F5cAeb/nLMHF6Vor9ps79wvuBQw6G3N0IW978b78ZUgPOFzxHUAMuD8dbkDZlX8r9y1cOd9sT3UNEwGrQ4siUt2oCkigyTxJAgYs1ijnjQid7q42hHk3tMXywrAYeu5MhF0TV1H77DRDMxPHD/xiR0zhFQRB2Dtnm1+e3LHKCyQjZ/zknEpQB6HS7UbCBoEDj4tohb83E6oqmQFWwt85/Jk9f49gxXakIcNODnQI5H63kSqpEmV9Al1a5L+WGZ6Bq1gwBbnD8FBXlVqxoooiFXW7jzzBa9LNmQiQ5J8yEkIsPeyOHec7F4ERvVONSMYwWyH39ZweSiRsZRM1UsFPhN96bCT5MEwkjPFn4gji6TPGEceJZvV3HwsiCT5Bgjla4bvDsZ2jYvAr9tSij8kIii9dHvsWlrimt+szHJLSz+8uNI6jAvXyr2f3oRxZD/F9osZHVWkgtAc+vVWqkxVJCqmpmoHOXI6TFSqSjYHddhZyU5r2lgQt0+NI6k/bV3iN7Le1RJCP/wuSDCTZjzsU1igB7UnIN2Y70CqCjIeVH9qlxaI1YAC9lwFv1FZvsiueYeJP1n39mmXCSELVtzxgIBEX5yaIHNbbGXd+e8JUgcO8vJ2JA2kJudaU+xfYR5SY//+J1kPsNSbnBnM25LL+LjeRB3QTfqV5sFq8ORWcIMITvkEaRfP3PVcOzb+hO4Ren4ezhJuyADulmvG8a9Kxxk6ymzBbE7a93SGVbxp7OQNEmvTn5+B9wJ7/l1mtvZL2TilrDZBQVMYWrGuUGpA="
+  },
+"@shared/icon": "/assets/icons.json"
 }

apps/isa-app/src/config/config.staging.json

@@ -16,6 +16,9 @@
   "@core/logger": {
     "logLevel": "debug"
   },
+  "@domain/checkout": {
+    "olaExpiration": "5m"
+},
   "@swagger/isa": {
     "rootUrl": "https://isa-staging.paragon-systems.de/isa/v1"
   },
@@ -64,11 +67,13 @@
       "taskCalendar": 3000,
       "remission": 4000,
       "packageInspection": 5000,
-      "assortment": 6000
+      "assortment": 6000,
+      "pickupShelf": 7000
     }
   },
   "checkForUpdates": 3600000,
   "licence": {
-    "scandit": "AZZzfQ+eLFl3Dzf1QSBag1lDibIoOPh4W33erRIRe3SDUMkHDX8eczEjd2TnfRMWoE5lXOBGtESCWICN9EbrmI1S9Lu5APsvvEOD+K54ADwIVawx0HNZRAc8/+9Vf/izcEGOFQFGBQJyR6vzdzFv5HcjznhxI9E3LiF+uVQPtCqsVYzpkMWIrC5VCg2uwNrj9Bw6f8zYi/lZPrDMS5yVKVcajeK7sh9QAq17dR0opjIIuP5t5nDEJ7hnITwtTR5HaM6cX/KhKpTILOgKexvLYqrK6QJWpU85sDwqwn6T7av4V68qL3XrUo60dScop4QsvraQe1HkRsffl6DkAEoX0RNMS5qVWjGerW7lvA/DQd9hsAO3jWFDR9hVDyt2VvmzzFKnHYqTYxC5qG4bCEJ0RJjy6tEP5Q7vL5SxWygVadmjPv+TwDOCS7DxzxIjcO+BXQY7gW6qn0hx9fXzyvO3avrGWqyImMlgEApZq+36ANqtRcPD/stEe4i0N9dSPhYoHPcc/9/9jpts43FozlgfY4wY8Wt5ybB3X0caISMmB/klFIJKKN7num439z3+Xk7ENB/Xvb0XAtnOt/cuxQYsGQ7fb62GOO/7Va5fdE9ZfaIJsS5ToE6oIbV04pLUssJf9cUMsyPFVELYSJmyGPQQFRz0TTxxRvPapIWrfa2x5x3hYUpNTAdY3v0fN9l/1ZqNSBmIBLH/LoXaVJQ2DydGD1/QFZ2Z/S7zTYKg5/cSEpUgiYtbwutNZSjRH29ucSizC524k+Zst95T8G7LJaWCT8SQAcKXqCnjpiEGWzD++h0jXjn6BWjUnIHi0te+27vF/z6UQL00sWco5hUIqF66EiU="
-  }
+    "scandit": "AVljxT/dG+TAIDDL2jTxm843juR2OtZ6lHLxRpYR7x9uYiSvY2IAHdRx8tjsf9KU7wK0F5cAeb/nLMHF6Vor9ps79wvuBQw6G3N0IW978b78ZUgPOFzxHUAMuD8dbkDZlX8r9y1cOd9sT3UNEwGrQ4siUt2oCkigyTxJAgYs1ijnjQid7q42hHk3tMXywrAYeu5MhF0TV1H77DRDMxPHD/xiR0zhFQRB2Dtnm1+e3LHKCyQjZ/zknEpQB6HS7UbCBoEDj4tohb83E6oqmQFWwt85/Jk9f49gxXakIcNODnQI5H63kSqpEmV9Al1a5L+WGZ6Bq1gwBbnD8FBXlVqxoooiFXW7jzzBa9LNmQiQ5J8yEkIsPeyOHec7F4ERvVONSMYwWyH39ZweSiRsZRM1UsFPhN96bCT5MEwkjPFn4gji6TPGEceJZvV3HwsiCT5Bgjla4bvDsZ2jYvAr9tSij8kIii9dHvsWlrimt+szHJLSz+8uNI6jAvXyr2f3oRxZD/F9osZHVWkgtAc+vVWqkxVJCqmpmoHOXI6TFSqSjYHddhZyU5r2lgQt0+NI6k/bV3iN7Le1RJCP/wuSDCTZjzsU1igB7UnIN2Y70CqCjIeVH9qlxaI1YAC9lwFv1FZvsiueYeJP1n39mmXCSELVtzxgIBEX5yaIHNbbGXd+e8JUgcO8vJ2JA2kJudaU+xfYR5SY//+J1kPsNSbnBnM25LL+LjeRB3QTfqV5sFq8ORWcIMITvkEaRfP3PVcOzb+hO4Ren4ezhJuyADulmvG8a9Kxxk6ymzBbE7a93SGVbxp7OQNEmvTn5+B9wJ7/l1mtvZL2TilrDZBQVMYWrGuUGpA="
+  },
+  "@shared/icon": "/assets/icons.json"
 }

apps/isa-app/src/config/config.test.json

@@ -17,6 +17,9 @@
     "@core/logger": {
         "logLevel": "debug"
     },
+    "@domain/checkout": {
+        "olaExpiration": "5m"
+    },
     "@swagger/isa": {
         "rootUrl": "https://isa-test.paragon-data.net/isa/v1"
     },
@@ -65,11 +68,13 @@
             "taskCalendar": 3000,
             "remission": 4000,
             "packageInspection": 5000,
-            "assortment": 6000
+            "assortment": 6000,
+            "pickupShelf": 7000
         }
     },
     "checkForUpdates": 3600000,
     "licence": {
-        "scandit": "AZ7zLw2eLmFWHbYP4RDq8VAEgAxmNGYcPU8YpOc3DryEXj4zMzYQFrQuUm0YewGQYEESXjpRwGX1NYmKY3pXHnAn2DeqIzh2an+FUu9socQlbQnJiHJHoWBAqcqWSua+P12tc95P3s9aaEEYvSjUy7Md88f7N+sk6zZbUmqbMXeXqmZwdkmRoUY/2w0CiiiA4gBFHgu4sMeNQ9dWyfxKTUPf5AnsxnuYpCt5KLxJWSYDv8HHj0mx8DCJTe1m2ony97Lge3JbJ5Dd+Zz6SCwqik7fv53Qole9s/3m66lYFWKAzWRKkHN1zts78CmPxPb+AAHVoqlBM3duvYmnCxxGOmlXabKUNuDR2ExaMu/nlo532jqqy25Cet/FP1UAs96ZGRgzEcHxGPp6kA53lJ15zd+cxz6G93E83AmYJkhddXBQElWEaGtQRfrEzRGmvcksR+V8MMYjGmhkVbQxGGqpnfP4IxbuEFcef6bxxTiulzo75gXoqZTt+7C1qpDcrMM3Yp0Z8RBw3JlV2tLk4FYFZpxY8QrXIcjvRYKExtQ9e5sSbST4Vx95YhEUd6iX0SBPDzcmgR4/Ef6gvJfoWgz68+rqhBGckphdHi2Mf/pYuAlh2jbwtrkErE2xWARBejR/UcU/A3F7k9RkFd5/QZC7qhsE6bZH7uhpkptIbi5XkXagwYy1oJD7yJs4VLOJteYWferRm8h1auxXew5tL8VLHciF+lLj6h8PTUDt2blLgUjHtualqlCwdSTzJyYwk4oswGGDk6E48X7LXpzuhtR8TYTOi2REN0uuTbO/slFBRw+CaYUnD0LjB9p2lb8ndcdV9adzBKmwPxiOtlOELQ=="
-    }
+        "scandit": "Ae7z0WDdRDFqG6oYuAXzesYGJpDLDqt+xWtQHOESiOjaSkB7IEIDJAk534U+cg1zGnk++4hOEK9hXEGR01NLTjh76w1fDL0U63OUjo50EHBXIUvzAVSur3pRY+1ER7SvSEWaT0hDOLYvYrTpdECtt1graN9yMvJzXD38VJKUfssT92p+YENV2Hul3eXIvaVjHqXE/yvupF+MlOMMUMhX0/Km/yTU9H9SjBdsXYihZmYWbt2JotO3Zs1ojXb0+3La10xb01S1q0XdDN6El3XMVilEtdmrP3WoGois8vpQBvOCEvduxCfILFAqjeWXTZvXSut9u+kQKpK8uHW4rVV6iVClpZfPYqKJqTh78AI9gpnfb/zO9GfQEDS3g7wI5WbQKqaNRzhTVowFRri4Ep9R5TRC1bnd00RC4zVaMkbu5kBOA7YoRjgUiYWHKJpi/VokZWyN6u1lsi5mTUbQkm1ZWfX5I/iUVYBgyHZYl+8kfFkwLPXGZNrF4xqubjKiCZRQj0oyNjHOBeHqvAekzhk7scX2g/NN+liRQv4ur413b+uXacSiiYIrLhtGgzrz1KRrtu19uB5odk3LoerDoiYXat7wEg9zUYT/+uBfO2X+uS7L5LW0PMI3hV+joQVpDk5SlA2868Nx0KWtPWmMf7xCuFIhDskfBsXZNRTblqxkk0RzzSqtjx9ihGr+/Tuzm8Pm0s4OQqV7b+++/Zn+Vo4rCqMTwutjOO7dqhah5hbOT1MqY/6VcjCXyDad3BXXr+WYU4GtYTe8Ytjkm/ZTG3fImoDbMchEcqnCw3oxG5e/gkdurE8g/mZlFOtzAN7KkqIsg6qLaC5COjfLPXsi/A=="
+    },
+    "@shared/icon": "/assets/icons.json"
 }

apps/isa-app/src/environments/environment.prod.ts

@@ -1,3 +1,4 @@
 export const environment = {
   production: true,
+  debug: false,
 };

apps/isa-app/src/environments/environment.ts

@@ -4,6 +4,7 @@
 
 export const environment = {
   production: false,
+  debug: false,
 };
 
 /*

apps/isa-app/src/index.html

@@ -7,7 +7,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
     <link rel="icon" type="image/x-icon" href="favicon.ico" />
     <link href="/assets/fonts/fonts.css" rel="stylesheet" />
-    <link href="/assets/icons/icons.css" rel="stylesheet" />
     <link rel="manifest" href="manifest.webmanifest" />
     <meta name="theme-color" content="#1976d2" />
   </head>

apps/isa-app/src/main.ts

@@ -14,26 +14,28 @@ if (environment.production) {
 
 const debugService = new DebugService();
 
-const consoleLog = console.log;
+if (environment.debug) {
+  const consoleLog = console.log;
 
-console.log = (...args) => {
-  debugService.add({ type: 'log', args });
-  consoleLog(...args);
-};
+  console.log = (...args) => {
+    debugService.add({ type: 'log', args });
+    consoleLog(...args);
+  };
 
-const consoleWarn = console.warn;
+  const consoleWarn = console.warn;
 
-console.warn = (...args) => {
-  debugService.add({ type: 'warn', args });
-  consoleWarn(...args);
-};
+  console.warn = (...args) => {
+    debugService.add({ type: 'warn', args });
+    consoleWarn(...args);
+  };
 
-const consoleError = console.error;
+  const consoleError = console.error;
 
-console.error = (...args) => {
-  debugService.add({ type: 'error', args });
-  consoleError(...args);
-};
+  console.error = (...args) => {
+    debugService.add({ type: 'error', args });
+    consoleError(...args);
+  };
+}
 
 platformBrowserDynamic([{ provide: DebugService, useValue: debugService }])
   .bootstrapModule(AppModule)

apps/isa-app/src/styles.scss

@@ -11,15 +11,11 @@
 @import './scss/customer';
 @import './scss/branch';
 
-* {
-  @apply font-sans;
-}
-
-body {
-  background: var(--bg-color);
-}
-
 @layer base {
+  body {
+    @apply bg-background;
+  }
+
   ::-webkit-scrollbar {
     width: 0; // remove scrollbar space
     height: 0;
@@ -61,3 +57,18 @@ body {
   @apply block bg-gray-300 h-6;
   animation: load 1s ease-in-out infinite;
 }
+
+@layer components {
+  .input-control {
+    @apply rounded border border-solid border-[#AEB7C1] px-4 py-[1.125rem] outline-none;
+  }
+
+  // .input-control:focus,
+  // .input-control:not(:placeholder-shown) {
+  //   @apply bg-white;
+  // }
+
+  .input-control.ng-touched.ng-invalid {
+    @apply border-brand;
+  }
+}

apps/modal/availabilities/src/lib/availabilities.component.scss

@@ -3,7 +3,7 @@
 }
 
 .subtitle {
-  @apply text-center text-regular my-6;
+  @apply text-center text-p2 my-6;
 }
 
 .bold {
@@ -62,7 +62,7 @@ hr {
       @apply flex flex-row items-center;
 
       .cta-reserve {
-        @apply absolute bg-transparent text-brand text-base font-bold border-none px-1 -mr-1;
+        @apply absolute bg-transparent text-brand text-p2 font-bold border-none px-1 -mr-1;
         right: 85px;
       }
     }

apps/modal/notifications/src/lib/notifications-package-inspection-group/notifications-package-inspection-group.component.spec.ts

@@ -1,101 +0,0 @@
-import { createComponentFactory, Spectator, SpyObject } from '@ngneat/spectator';
-import { CommonModule } from '@angular/common';
-import { RouterTestingModule } from '@angular/router/testing';
-import { UiIconModule } from '@ui/icon';
-import { Router } from '@angular/router';
-import { UiFilter } from '@ui/filter';
-import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
-import { Component } from '@angular/core';
-import { ModalNotificationsListItemComponent } from '../notifications-list-item/notifications-list-item.component';
-import { ModalNotificationsRemissionGroupComponent } from './notifications-remission-group.component';
-
-// DummyComponent Class
-@Component({
-  selector: 'dummy-component',
-  template: '<div></div>',
-})
-class DummyComponent {
-  constructor() {}
-}
-
-describe('ModalNotificationsRemissionGroupComponent', () => {
-  let spectator: Spectator<ModalNotificationsRemissionGroupComponent>;
-  let uiFilterMock: SpyObject<UiFilter>;
-  let router: Router;
-
-  const createComponent = createComponentFactory({
-    component: ModalNotificationsRemissionGroupComponent,
-    declarations: [ModalNotificationsListItemComponent],
-    imports: [
-      CommonModule,
-      RouterTestingModule.withRoutes([
-        { path: 'filiale/goods/in/results', component: DummyComponent },
-        { path: 'filiale/remission/create', component: DummyComponent },
-      ]),
-      UiIconModule,
-    ],
-    providers: [],
-    mocks: [UiFilter],
-  });
-
-  beforeEach(() => {
-    spectator = createComponent({ props: { notifications: [] } });
-    router = spectator.inject(Router);
-    uiFilterMock = spectator.inject(UiFilter);
-  });
-
-  it('should create', () => {
-    expect(spectator.component).toBeTruthy();
-  });
-
-  describe('notifications input', () => {
-    it('should display the right notification-counter value based on the length of the input array', () => {
-      spectator.setInput({ notifications: [{}, {}, {}] });
-      expect(spectator.query('.notification-counter')).toHaveText('3');
-    });
-
-    it('should not display notification-counter if input array has length 0', () => {
-      spectator.setInput({ notifications: [] });
-      expect(spectator.query('.notification-counter')).toHaveText('');
-    });
-
-    it('should render modal-notifications-list-item based on the input array', () => {
-      const notifications = [{}, {}];
-      spectator.setInput({ notifications });
-      spectator.detectComponentChanges();
-      expect(spectator.queryAll('modal-notifications-list-item')).toHaveLength(notifications.length);
-    });
-  });
-
-  describe('itemSelected()', () => {
-    it('should navigate to results with queryParams from UiFilter.getQueryParamsFromQueryTokenDTO()', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(UiFilter, 'getQueryParamsFromQueryTokenDTO').and.returnValue(item.queryToken.input);
-      spyOn(router, 'navigate');
-      spectator.component.itemSelected(item);
-      expect(router.navigate).toHaveBeenCalledWith(['/filiale/goods/in/results'], { queryParams: item.queryToken.input });
-    });
-
-    it('should emit the navigated event after select item', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.component.itemSelected(item);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-
-  describe('actions CTA', () => {
-    it('should navigate to remission page after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary');
-      expect(cta).toHaveText('Zur Remission');
-      expect(cta).toHaveAttribute('href', '/filiale/remission/create');
-    });
-
-    it('should emit the navigated event after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary') as HTMLAnchorElement;
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.click(cta);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-});

apps/modal/notifications/src/lib/notifications-remission-group/notifications-remission-group.component.spec.ts

@@ -1,101 +0,0 @@
-import { createComponentFactory, Spectator, SpyObject } from '@ngneat/spectator';
-import { CommonModule } from '@angular/common';
-import { RouterTestingModule } from '@angular/router/testing';
-import { UiIconModule } from '@ui/icon';
-import { Router } from '@angular/router';
-import { UiFilter } from '@ui/filter';
-import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
-import { Component } from '@angular/core';
-import { ModalNotificationsListItemComponent } from '../notifications-list-item/notifications-list-item.component';
-import { ModalNotificationsRemissionGroupComponent } from './notifications-remission-group.component';
-
-// DummyComponent Class
-@Component({
-  selector: 'dummy-component',
-  template: '<div></div>',
-})
-class DummyComponent {
-  constructor() {}
-}
-
-describe('ModalNotificationsRemissionGroupComponent', () => {
-  let spectator: Spectator<ModalNotificationsRemissionGroupComponent>;
-  let uiFilterMock: SpyObject<UiFilter>;
-  let router: Router;
-
-  const createComponent = createComponentFactory({
-    component: ModalNotificationsRemissionGroupComponent,
-    declarations: [ModalNotificationsListItemComponent],
-    imports: [
-      CommonModule,
-      RouterTestingModule.withRoutes([
-        { path: 'filiale/goods/in/results', component: DummyComponent },
-        { path: 'filiale/remission/create', component: DummyComponent },
-      ]),
-      UiIconModule,
-    ],
-    providers: [],
-    mocks: [UiFilter],
-  });
-
-  beforeEach(() => {
-    spectator = createComponent({ props: { notifications: [] } });
-    router = spectator.inject(Router);
-    uiFilterMock = spectator.inject(UiFilter);
-  });
-
-  it('should create', () => {
-    expect(spectator.component).toBeTruthy();
-  });
-
-  describe('notifications input', () => {
-    it('should display the right notification-counter value based on the length of the input array', () => {
-      spectator.setInput({ notifications: [{}, {}, {}] });
-      expect(spectator.query('.notification-counter')).toHaveText('3');
-    });
-
-    it('should not display notification-counter if input array has length 0', () => {
-      spectator.setInput({ notifications: [] });
-      expect(spectator.query('.notification-counter')).toHaveText('');
-    });
-
-    it('should render modal-notifications-list-item based on the input array', () => {
-      const notifications = [{}, {}];
-      spectator.setInput({ notifications });
-      spectator.detectComponentChanges();
-      expect(spectator.queryAll('modal-notifications-list-item')).toHaveLength(notifications.length);
-    });
-  });
-
-  describe('itemSelected()', () => {
-    it('should navigate to results with queryParams from UiFilter.getQueryParamsFromQueryTokenDTO()', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(UiFilter, 'getQueryParamsFromQueryTokenDTO').and.returnValue(item.queryToken.input);
-      spyOn(router, 'navigate');
-      spectator.component.itemSelected(item);
-      expect(router.navigate).toHaveBeenCalledWith(['/filiale/goods/in/results'], { queryParams: item.queryToken.input });
-    });
-
-    it('should emit the navigated event after select item', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.component.itemSelected(item);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-
-  describe('actions CTA', () => {
-    it('should navigate to remission page after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary');
-      expect(cta).toHaveText('Zur Remission');
-      expect(cta).toHaveAttribute('href', '/filiale/remission/create');
-    });
-
-    it('should emit the navigated event after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary') as HTMLAnchorElement;
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.click(cta);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-});

apps/modal/notifications/src/lib/notifications-remission-group/notifications-remission-group.component.ts

@@ -1,5 +1,6 @@
-import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, inject } from '@angular/core';
 import { Router } from '@angular/router';
+import { PickupShelfInNavigationService } from '@shared/services';
 import { UiFilter } from '@ui/filter';
 import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
 
@@ -9,6 +10,8 @@ import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ModalNotificationsRemissionGroupComponent {
+  private _pickupShelfInNavigationService = inject(PickupShelfInNavigationService);
+
   @Input()
   notifications: MessageBoardItemDTO[];
 
@@ -18,8 +21,14 @@ export class ModalNotificationsRemissionGroupComponent {
   constructor(private _router: Router) {}
 
   itemSelected(item: MessageBoardItemDTO) {
+    const defaultNav = this._pickupShelfInNavigationService.listRoute();
     const queryParams = UiFilter.getQueryParamsFromQueryTokenDTO(item.queryToken);
-    this._router.navigate(['/filiale/goods/in/results'], { queryParams });
+    this._router.navigate(defaultNav.path, {
+      queryParams: {
+        ...defaultNav.queryParams,
+        ...queryParams,
+      },
+    });
     this.navigated.emit();
   }
 }

apps/modal/notifications/src/lib/notifications-reservation-group/notifications-reservation-group.component.spec.ts

@@ -1,101 +0,0 @@
-import { createComponentFactory, Spectator, SpyObject } from '@ngneat/spectator';
-import { CommonModule } from '@angular/common';
-import { ModalNotificationsReservationGroupComponent } from './notifications-reservation-group.component';
-import { RouterTestingModule } from '@angular/router/testing';
-import { UiIconModule } from '@ui/icon';
-import { Router } from '@angular/router';
-import { UiFilter } from '@ui/filter';
-import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
-import { Component } from '@angular/core';
-import { ModalNotificationsListItemComponent } from '../notifications-list-item/notifications-list-item.component';
-
-// DummyComponent Class
-@Component({
-  selector: 'dummy-component',
-  template: '<div></div>',
-})
-class DummyComponent {
-  constructor() {}
-}
-
-describe('ModalNotificationsReservationGroupComponent', () => {
-  let spectator: Spectator<ModalNotificationsReservationGroupComponent>;
-  let uiFilterMock: SpyObject<UiFilter>;
-  let router: Router;
-
-  const createComponent = createComponentFactory({
-    component: ModalNotificationsReservationGroupComponent,
-    declarations: [ModalNotificationsListItemComponent],
-    imports: [
-      CommonModule,
-      RouterTestingModule.withRoutes([
-        { path: 'filiale/goods/in/results', component: DummyComponent },
-        { path: 'filiale/goods/in/reservation', component: DummyComponent },
-      ]),
-      UiIconModule,
-    ],
-    providers: [],
-    mocks: [UiFilter],
-  });
-
-  beforeEach(() => {
-    spectator = createComponent({ props: { notifications: [] } });
-    router = spectator.inject(Router);
-    uiFilterMock = spectator.inject(UiFilter);
-  });
-
-  it('should create', () => {
-    expect(spectator.component).toBeTruthy();
-  });
-
-  describe('notifications input', () => {
-    it('should display the right notification-counter value based on the length of the input array', () => {
-      spectator.setInput({ notifications: [{}, {}, {}] });
-      expect(spectator.query('.notification-counter')).toHaveText('3');
-    });
-
-    it('should not display notification-counter if input array has length 0', () => {
-      spectator.setInput({ notifications: [] });
-      expect(spectator.query('.notification-counter')).toHaveText('');
-    });
-
-    it('should render modal-notifications-list-item based on the input array', () => {
-      const notifications = [{}, {}];
-      spectator.setInput({ notifications });
-      spectator.detectComponentChanges();
-      expect(spectator.queryAll('modal-notifications-list-item')).toHaveLength(notifications.length);
-    });
-  });
-
-  describe('itemSelected()', () => {
-    it('should navigate to results with queryParams from UiFilter.getQueryParamsFromQueryTokenDTO()', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(UiFilter, 'getQueryParamsFromQueryTokenDTO').and.returnValue(item.queryToken.input);
-      spyOn(router, 'navigate');
-      spectator.component.itemSelected(item);
-      expect(router.navigate).toHaveBeenCalledWith(['/filiale/goods/in/results'], { queryParams: item.queryToken.input });
-    });
-
-    it('should emit the navigated event after select item', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.component.itemSelected(item);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-
-  describe('actions CTA', () => {
-    it('should navigate to reservation page after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary');
-      expect(cta).toHaveText('Zu den Reservierungen');
-      expect(cta).toHaveAttribute('href', '/filiale/goods/in/reservation');
-    });
-
-    it('should emit the navigated event after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary') as HTMLAnchorElement;
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.click(cta);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-});

apps/modal/notifications/src/lib/notifications-reservation-group/notifications-reservation-group.component.ts

@@ -1,5 +1,6 @@
-import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, inject } from '@angular/core';
 import { Router } from '@angular/router';
+import { PickupShelfInNavigationService } from '@shared/services';
 import { UiFilter } from '@ui/filter';
 import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
 
@@ -9,6 +10,7 @@ import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ModalNotificationsReservationGroupComponent {
+  private _pickupShelfInNavigationService = inject(PickupShelfInNavigationService);
   @Input()
   notifications: MessageBoardItemDTO[];
 
@@ -18,8 +20,14 @@ export class ModalNotificationsReservationGroupComponent {
   constructor(private _router: Router) {}
 
   itemSelected(item: MessageBoardItemDTO) {
+    const defaultNav = this._pickupShelfInNavigationService.listRoute();
     const queryParams = UiFilter.getQueryParamsFromQueryTokenDTO(item.queryToken);
-    this._router.navigate(['/filiale/goods/in/results'], { queryParams });
+    this._router.navigate(defaultNav.path, {
+      queryParams: {
+        ...defaultNav.queryParams,
+        ...queryParams,
+      },
+    });
     this.navigated.emit();
   }
 }

apps/modal/notifications/src/lib/notifications-task-calendar-group/notifications-task-calendar-group.component.spec.ts

@@ -1,101 +0,0 @@
-import { createComponentFactory, Spectator, SpyObject } from '@ngneat/spectator';
-import { CommonModule } from '@angular/common';
-import { RouterTestingModule } from '@angular/router/testing';
-import { UiIconModule } from '@ui/icon';
-import { Router } from '@angular/router';
-import { UiFilter } from '@ui/filter';
-import { MessageBoardItemDTO } from 'apps/hub/notifications/src/lib/defs';
-import { Component } from '@angular/core';
-import { ModalNotificationsListItemComponent } from '../notifications-list-item/notifications-list-item.component';
-import { ModalNotificationsTaskCalendarGroupComponent } from './notifications-task-calendar-group.component';
-
-// DummyComponent Class
-@Component({
-  selector: 'dummy-component',
-  template: '<div></div>',
-})
-class DummyComponent {
-  constructor() {}
-}
-
-describe('ModalNotificationsTaskCalendarGroupComponent', () => {
-  let spectator: Spectator<ModalNotificationsTaskCalendarGroupComponent>;
-  let uiFilterMock: SpyObject<UiFilter>;
-  let router: Router;
-
-  const createComponent = createComponentFactory({
-    component: ModalNotificationsTaskCalendarGroupComponent,
-    declarations: [ModalNotificationsListItemComponent],
-    imports: [
-      CommonModule,
-      RouterTestingModule.withRoutes([
-        { path: 'filiale/goods/in/results', component: DummyComponent },
-        { path: 'filiale/task-calendar/calendar', component: DummyComponent },
-      ]),
-      UiIconModule,
-    ],
-    providers: [],
-    mocks: [UiFilter],
-  });
-
-  beforeEach(() => {
-    spectator = createComponent({ props: { notifications: [] } });
-    router = spectator.inject(Router);
-    uiFilterMock = spectator.inject(UiFilter);
-  });
-
-  it('should create', () => {
-    expect(spectator.component).toBeTruthy();
-  });
-
-  describe('notifications input', () => {
-    it('should display the right notification-counter value based on the length of the input array', () => {
-      spectator.setInput({ notifications: [{}, {}, {}] });
-      expect(spectator.query('.notification-counter')).toHaveText('3');
-    });
-
-    it('should not display notification-counter if input array has length 0', () => {
-      spectator.setInput({ notifications: [] });
-      expect(spectator.query('.notification-counter')).toHaveText('');
-    });
-
-    it('should render modal-notifications-list-item based on the input array', () => {
-      const notifications = [{}, {}];
-      spectator.setInput({ notifications });
-      spectator.detectComponentChanges();
-      expect(spectator.queryAll('modal-notifications-list-item')).toHaveLength(notifications.length);
-    });
-  });
-
-  describe('itemSelected()', () => {
-    it('should navigate to results with queryParams from UiFilter.getQueryParamsFromQueryTokenDTO()', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(UiFilter, 'getQueryParamsFromQueryTokenDTO').and.returnValue(item.queryToken.input);
-      spyOn(router, 'navigate');
-      spectator.component.itemSelected(item);
-      expect(router.navigate).toHaveBeenCalledWith(['/filiale/goods/in/results'], { queryParams: item.queryToken.input });
-    });
-
-    it('should emit the navigated event after select item', () => {
-      const item: MessageBoardItemDTO = { queryToken: { input: { main_qs: 'test' } } };
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.component.itemSelected(item);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-
-  describe('actions CTA', () => {
-    it('should navigate to reservation page after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary');
-      expect(cta).toHaveText('Zum Tätigkeitskalender');
-      expect(cta).toHaveAttribute('href', '/filiale/task-calendar/calendar');
-    });
-
-    it('should emit the navigated event after clicking the CTA', () => {
-      const cta = spectator.query('.cta-primary') as HTMLAnchorElement;
-      spyOn(spectator.component.navigated, 'emit');
-      spectator.click(cta);
-      expect(spectator.component.navigated.emit).toHaveBeenCalled();
-    });
-  });
-});