oip-common 0.2.1 → 0.3.1

package/fesm2022/oip-common.mjs

@@ -1,18 +1,18 @@
 import * as i0 from '@angular/core';
-import { Injectable, inject, InjectionToken, signal, computed, effect, DestroyRef, ChangeDetectorRef, Component, Input, PLATFORM_ID, HostBinding, EventEmitter, Output, ViewChild, Renderer2, SecurityContext, ChangeDetectionStrategy, makeEnvironmentProviders, Pipe } from '@angular/core';
+import { Injectable, inject, signal, computed, effect, DestroyRef, ChangeDetectorRef, Component, Input, InjectionToken, PLATFORM_ID, ViewChild, HostBinding, EventEmitter, Output, Renderer2, SecurityContext, ChangeDetectionStrategy, makeEnvironmentProviders, importProvidersFrom } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import * as i2$6 from 'primeng/api';
+import * as i2$3 from 'primeng/api';
 import { MessageService, ConfirmationService, PrimeIcons, SharedModule } from 'primeng/api';
-import { HttpErrorResponse, HttpClient as HttpClient$1, HttpHeaders } from '@angular/common/http';
+import { HttpErrorResponse, HttpClient as HttpClient$1, provideHttpClient, withInterceptors, withFetch } from '@angular/common/http';
 import * as i2$4 from '@ngx-translate/core';
-import { TranslateService, TranslatePipe, TranslateModule } from '@ngx-translate/core';
-import * as i1$3 from '@angular/router';
+import { TranslateService, TranslatePipe, TranslateModule, TranslateLoader } from '@ngx-translate/core';
+import * as i1$4 from '@angular/router';
 import { ActivatedRoute, Router, RouterModule, NavigationEnd, RouterLinkActive, RouterLink } from '@angular/router';
-import { lastValueFrom, BehaviorSubject, Subject, ReplaySubject, merge, from, filter as filter$1, combineLatest, of, map as map$1, Observable } from 'rxjs';
-import { filter, distinctUntilChanged, map, switchMap, catchError } from 'rxjs/operators';
+import { BehaviorSubject, Subject, of, tap, shareReplay, ReplaySubject, firstValueFrom, merge, from, finalize, filter as filter$1 } from 'rxjs';
+import { tap as tap$1, catchError, filter, distinctUntilChanged, map, switchMap, take } from 'rxjs/operators';
 import { Title, DomSanitizer } from '@angular/platform-browser';
 import { PrimeNG } from 'primeng/config';
-import { OidcSecurityService, PublicEventsService, EventTypes, StsConfigHttpLoader } from 'angular-auth-oidc-client';
+import { OidcSecurityService, PublicEventsService, EventTypes } from 'angular-auth-oidc-client';
 import * as i1 from 'primeng/multiselect';
 import { MultiSelectModule } from 'primeng/multiselect';
 import * as i2 from 'primeng/tooltip';
@@ -22,8 +22,8 @@ import { ButtonModule, Button } from 'primeng/button';
 import * as i1$1 from '@angular/forms';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i2$1 from '@angular/common';
-import { isPlatformBrowser, CommonModule, NgComponentOutlet, NgClass, DatePipe } from '@angular/common';
-import * as i3$1 from 'primeng/styleclass';
+import { isPlatformBrowser, CommonModule, NgComponentOutlet, NgClass, DatePipe, PathLocationStrategy, LocationStrategy } from '@angular/common';
+import * as i3$2 from 'primeng/styleclass';
 import { StyleClassModule } from 'primeng/styleclass';
 import { updatePreset, updateSurfacePalette, $t } from '@primeng/themes';
 import Aura from '@primeng/themes/aura';
@@ -34,40 +34,44 @@ import { SelectButtonModule } from 'primeng/selectbutton';
 import { Tabs, TabList, Tab } from 'primeng/tabs';
 import * as i2$2 from 'primeng/avatar';
 import { AvatarModule } from 'primeng/avatar';
-import * as i1$4 from 'primeng/contextmenu';
+import { ConfirmDialog } from 'primeng/confirmdialog';
+import * as i1$3 from 'primeng/badge';
+import { BadgeModule } from 'primeng/badge';
+import * as i3$1 from 'primeng/paginator';
+import { PaginatorModule } from 'primeng/paginator';
+import * as i7 from 'primeng/popover';
+import { Popover, PopoverModule } from 'primeng/popover';
+import * as i4 from 'primeng/progressspinner';
+import { ProgressSpinnerModule } from 'primeng/progressspinner';
+import * as i9 from 'primeng/tag';
+import { Tag, TagModule } from 'primeng/tag';
+import * as signalR from '@microsoft/signalr';
+import * as i1$5 from 'primeng/contextmenu';
 import { ContextMenuModule, ContextMenu } from 'primeng/contextmenu';
-import * as i2$3 from 'primeng/dialog';
+import * as i3$4 from 'primeng/dialog';
 import { DialogModule } from 'primeng/dialog';
-import * as i3$3 from 'primeng/inputtext';
+import * as i4$1 from 'primeng/inputtext';
 import { InputTextModule, InputText } from 'primeng/inputtext';
-import { trigger, state, transition, style, animate } from '@angular/animations';
-import * as i3$2 from 'primeng/ripple';
+import * as i3$3 from 'primeng/ripple';
 import { RippleModule } from 'primeng/ripple';
-import { ConfirmDialog } from 'primeng/confirmdialog';
-import * as i4 from 'primeng/select';
+import * as i5 from 'primeng/select';
 import { SelectModule, Select } from 'primeng/select';
-import * as i1$5 from 'primeng/fileupload';
+import * as i1$6 from 'primeng/fileupload';
 import { FileUploadModule } from 'primeng/fileupload';
 import { ImageModule } from 'primeng/image';
-import * as i1$6 from 'primeng/table';
+import * as i1$7 from 'primeng/table';
 import { TableModule } from 'primeng/table';
 import * as i2$5 from 'primeng/toggleswitch';
 import { ToggleSwitchModule } from 'primeng/toggleswitch';
-import * as i9 from 'primeng/tag';
-import { TagModule, Tag } from 'primeng/tag';
 import { TextareaModule, Textarea } from 'primeng/textarea';
-import * as i4$1 from 'primeng/toolbar';
+import * as i4$2 from 'primeng/toolbar';
 import { ToolbarModule } from 'primeng/toolbar';
-import * as i5 from 'primeng/card';
+import * as i5$1 from 'primeng/card';
 import { CardModule } from 'primeng/card';
 import { DividerModule } from 'primeng/divider';
 import * as i6 from 'primeng/panel';
 import { PanelModule } from 'primeng/panel';
-import * as i7 from 'primeng/popover';
-import { PopoverModule } from 'primeng/popover';
-import * as i8 from 'primeng/progressspinner';
-import { ProgressSpinnerModule } from 'primeng/progressspinner';
-import * as signalR from '@microsoft/signalr';
+import { TranslateHttpLoader } from '@ngx-translate/http-loader';
 
 class TopBarService {
     get availableTopBarItems() {
@@ -235,94 +239,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             args: [{ providedIn: 'root' }]
         }] });
 
-const DEFAULT_OIP_FRONTEND_CONFIG = {
-    appMode: 'standalone',
-    apiBaseUrl: '',
-    notificationHubUrl: ''
-};
-const OIP_FRONTEND_CONFIG = new InjectionToken('OIP_FRONTEND_CONFIG', {
-    factory: () => DEFAULT_OIP_FRONTEND_CONFIG
-});
-
-/**
- * BaseDataService provides a unified interface for sending HTTP requests
- * using Angular's HttpClient. It supports standard HTTP methods and automatic
- * credential handling.
- */
-class BaseDataService {
-    constructor() {
-        this.http = inject(HttpClient$1);
-        this.frontendConfig = inject(OIP_FRONTEND_CONFIG);
-    }
-    /**
-     * Gets the base URL of the application from the HTML <base> tag.
-     */
-    get baseUrl() {
-        return this.normalizeBaseUrl(this.frontendConfig.apiBaseUrl || document.getElementsByTagName('base')[0].href);
-    }
-    /**
-     * Builds a fully-qualified application URL based on frontend mode.
-     */
-    buildUrl(path) {
-        const normalizedPath = path.startsWith('/') ? path.substring(1) : path;
-        return `${this.baseUrl}${normalizedPath}`;
-    }
-    /**
-     * Sends an HTTP request with the specified method and data.
-     *
-     * @template TResponse - Expected response type.
-     * @param url - The target URL for the HTTP request.
-     * @param method - The HTTP method to use (GET, PUT, POST, DELETE). Default is 'GET'.
-     * @param data - An object containing request parameters or payload.
-     * @returns A promise that resolves to the response of type TResponse.
-     */
-    sendRequest(url, method = 'GET', data = {}) {
-        const httpOptions = { withCredentials: true };
-        let result;
-        switch (method) {
-            case 'GET':
-                result = this.http.get(url, { params: data });
-                break;
-            case 'PUT':
-                result = this.http.put(url, data, httpOptions);
-                break;
-            case 'POST':
-                result = this.http.post(url, data, httpOptions);
-                break;
-            case 'DELETE':
-                result = this.http.request('DELETE', url, {
-                    body: data,
-                    headers: new HttpHeaders({ 'Content-Type': 'application/json' }),
-                    withCredentials: true
-                });
-                break;
-        }
-        return lastValueFrom(result);
-    }
-    /**
-     * Sends a GET request and retrieves a response as a Blob.
-     *
-     * @param url - The target URL for the GET request.
-     * @returns A promise that resolves to a Object response.
-     */
-    getBlob(url) {
-        const httpOptions = {
-            responseType: 'blob',
-            withCredentials: true
-        };
-        const result = this.http.get(url, httpOptions);
-        return lastValueFrom(result);
-    }
-    normalizeBaseUrl(baseUrl) {
-        return baseUrl.endsWith('/') ? baseUrl : `${baseUrl}/`;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BaseDataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BaseDataService }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BaseDataService, decorators: [{
-            type: Injectable
-        }] });
-
 /**
  * Service to manage the application title.
  */
@@ -611,6 +527,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 class L10nService {
     constructor() {
         this.loadedTranslations = new Set();
+        this.loadingTranslations = new Map();
         this.httpClient = inject(HttpClient$1);
         this.translateService = inject(TranslateService);
         this.primeNg = inject(PrimeNG);
@@ -621,8 +538,8 @@ class L10nService {
      * @param component - Name of the component to load translations for
      */
     loadComponentTranslations(component) {
-        const lang = this.translateService.currentLang;
-        this.loadTranslations(component, lang);
+        const lang = this.translateService.currentLang || this.layoutService.language() || 'en';
+        return this.loadTranslations(component, lang);
     }
     /**
      * Gets the translated value of a key (or an array of keys)
@@ -640,19 +557,27 @@ class L10nService {
     loadTranslations(component, lang) {
         const key = `${component}.${lang}`;
         if (this.loadedTranslations.has(key)) {
-            return;
-        }
-        try {
-            this.httpClient.get(`./assets/i18n/${component}.${lang}.json`).subscribe((translations) => {
-                const current = this.translateService.translations[lang] || {};
-                this.translateService.setTranslation(lang, { ...current, ...translations }, true);
-                this.loadedTranslations.add(key);
-            });
+            return of(null);
         }
-        catch (e) {
-            console.error(`No translations found for ${component}.${lang}.json`);
-            console.error(e);
+        const loading = this.loadingTranslations.get(key);
+        if (loading) {
+            return loading;
         }
+        const request = this.httpClient.get(`./assets/i18n/${component}.${lang}.json`).pipe(tap((translations) => {
+            const current = this.translateService.translations[lang] || {};
+            this.translateService.setTranslation(lang, { ...current, ...translations }, true);
+            this.loadedTranslations.add(key);
+            this.loadingTranslations.delete(key);
+        }), shareReplay(1));
+        this.loadingTranslations.set(key, request);
+        request.subscribe({
+            error: (e) => {
+                this.loadingTranslations.delete(key);
+                console.error(`No translations found for ${component}.${lang}.json`);
+                console.error(e);
+            }
+        });
+        return request;
     }
     /**
      * Changes the lang currently used
@@ -684,25 +609,131 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             args: [{ providedIn: 'root' }]
         }] });
 
-class SecurityDataService extends BaseDataService {
-    getSecurity(controller, id) {
-        return this.sendRequest(this.baseUrl + `api/${controller}/get-security?id=${id}`);
+class SecurityService {
+}
+class BffSecurityService {
+    constructor() {
+        this.http = inject(HttpClient$1);
+        this.authenticated = new BehaviorSubject(null);
+        this.currentUser = new BehaviorSubject(null);
+        this.csrfToken = new ReplaySubject(1);
+        this.payload = new BehaviorSubject(null);
     }
-    saveSecurity(controller, request) {
-        return this.sendRequest(this.baseUrl + `api/${controller}/put-security`, 'PUT', request);
+    auth() {
+        this.http.get(this.buildUrl('api/security/get-current-auth-session'), {
+            withCredentials: true
+        }).pipe(tap$1((session) => this.applySession(session)), catchError(() => {
+            this.applyAnonymousSession();
+            return of(null);
+        })).subscribe();
+    }
+    logout() {
+        firstValueFrom(this.getCsrfToken()).then((csrfToken) => {
+            const form = this.createPostForm(this.buildUrl('api/security/delete-auth-session'));
+            if (csrfToken?.token) {
+                const tokenInput = document.createElement('input');
+                tokenInput.type = 'hidden';
+                tokenInput.name = '__RequestVerificationToken';
+                tokenInput.value = csrfToken.token;
+                form.appendChild(tokenInput);
+            }
+            document.body.appendChild(form);
+            form.submit();
+        });
+    }
+    isAuthenticated() {
+        return this.authenticated.asObservable().pipe(filter((value) => value !== null), distinctUntilChanged());
+    }
+    getAccessToken() {
+        return of('');
+    }
+    isTokenExpired() {
+        return of(false);
     }
-    getRealmRoles() {
-        return this.sendRequest(this.baseUrl + `api/security/get-realm-roles`);
+    getCurrentUser() {
+        return this.currentUser.getValue();
+    }
+    getCurrentUser$() {
+        return this.currentUser.asObservable();
+    }
+    forceRefreshSession() {
+        this.auth();
+        return of({
+            isAuthenticated: this.authenticated.getValue() === true,
+            userData: this.currentUser.getValue()
+        });
+    }
+    getCsrfToken() {
+        this.http.get(this.buildUrl('api/security/get-auth-csrf-token'), {
+            withCredentials: true
+        }).pipe(catchError(() => of(null))).subscribe((token) => this.csrfToken.next(token));
+        return this.csrfToken.asObservable();
+    }
+    isAdmin() {
+        return this.payload.getValue()?.realm_access?.roles?.includes('admin') ?? false;
+    }
+    authorize() {
+        const form = this.createPostForm(this.buildUrl('api/security/create-auth-session'));
+        document.body.appendChild(form);
+        form.submit();
+    }
+    ngOnDestroy() {
+        this.authenticated.complete();
+        this.currentUser.complete();
+        this.payload.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityDataService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityDataService }); }
+    applySession(session) {
+        const roles = session.roles ?? [];
+        const user = this.createCurrentUser(session, roles);
+        this.authenticated.next(session.isAuthenticated);
+        this.currentUser.next(user);
+        this.payload.next({ realm_access: { roles }, ...user });
+    }
+    createCurrentUser(session, roles) {
+        const displayName = session.displayName || session.userName || session.email;
+        const nameParts = this.splitDisplayName(displayName);
+        return {
+            userName: session.userName,
+            displayName,
+            email: session.email,
+            roles,
+            preferred_username: session.userName,
+            name: displayName,
+            given_name: nameParts.givenName,
+            family_name: nameParts.familyName
+        };
+    }
+    splitDisplayName(displayName) {
+        const parts = displayName?.trim().split(/\s+/).filter(Boolean) ?? [];
+        return {
+            givenName: parts[0],
+            familyName: parts.length > 1 ? parts.slice(1).join(' ') : undefined
+        };
+    }
+    applyAnonymousSession() {
+        this.authenticated.next(false);
+        this.currentUser.next(null);
+        this.payload.next(null);
+        this.csrfToken.next(null);
+    }
+    createPostForm(action) {
+        const form = document.createElement('form');
+        form.method = 'post';
+        form.action = action;
+        form.style.display = 'none';
+        return form;
+    }
+    buildUrl(path) {
+        const baseUrl = document.getElementsByTagName('base')[0].href;
+        const normalizedBase = baseUrl.endsWith('/') ? baseUrl : `${baseUrl}/`;
+        return `${normalizedBase}${path}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BffSecurityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BffSecurityService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityDataService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BffSecurityService, decorators: [{
             type: Injectable
         }] });
-
-class SecurityService {
-}
 /**
  * SecurityService extends OidcSecurityService to manage authentication,
  * token handling, and user role access in an Angular application.
@@ -717,6 +748,11 @@ class KeycloakSecurityService extends OidcSecurityService {
      */
     constructor() {
         super();
+        this.refreshLockKeyPrefix = 'oip:keycloak-refresh-lock';
+        this.refreshResultKeyPrefix = 'oip:keycloak-refresh-result';
+        this.refreshLockTtlMs = 15000;
+        this.refreshWaitTimeoutMs = 10000;
+        this.refreshTabId = this.createRefreshTabId();
         /**
          * Handles angular OIDC events.
          */
@@ -742,7 +778,9 @@ class KeycloakSecurityService extends OidcSecurityService {
             .registerForEvents()
             .pipe(filter((event) => event.type === EventTypes.NewAuthenticationResult))
             .subscribe(() => {
-            super.getAccessToken().subscribe(token => { this.accessToken.next(token); });
+            super.getAccessToken().subscribe(token => {
+                this.accessToken.next(token);
+            });
             this.auth();
         });
     }
@@ -759,6 +797,17 @@ class KeycloakSecurityService extends OidcSecurityService {
     getAccessToken(configId) {
         return merge(super.getAccessToken(configId), this.accessToken.asObservable()).pipe(distinctUntilChanged());
     }
+    forceRefreshSession(customParams, configId) {
+        if (!this.refreshSession$) {
+            this.refreshSession$ = from(this.runSynchronizedRefresh(customParams, configId)).pipe(finalize(() => {
+                this.refreshSession$ = undefined;
+            }), shareReplay({ bufferSize: 1, refCount: false }));
+        }
+        return this.refreshSession$;
+    }
+    getCsrfToken() {
+        return of(null);
+    }
     /**
      * Indicates whether the current user has the 'admin' role.
      *
@@ -807,125 +856,480 @@ class KeycloakSecurityService extends OidcSecurityService {
             return payload.exp < Math.floor(Date.now() / 1000);
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KeycloakSecurityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KeycloakSecurityService }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KeycloakSecurityService, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [] });
-
-class BaseModuleComponent {
-    static { this.readRight = 'read'; }
-    static { this.editRight = 'edit'; }
-    static { this.deleteRight = 'delete'; }
-    /**
-     * Updates local settings and persists them to local storage.
-     * @return {void}
-     */
-    onConfigUpdate() {
-        if (Object.keys(this.localSettings()).length > 0) {
-            this._localSettings = { ...this.localSettings() };
-            this.localSettingsUpdate.next(this._localSettings);
-            localStorage.setItem(`Instance_${this.id}`, JSON.stringify(this._localSettings));
+    async runSynchronizedRefresh(customParams, configId) {
+        const webLocks = this.getWebLocks();
+        if (webLocks) {
+            return webLocks.request(this.getRefreshLockKey(configId), { mode: 'exclusive' }, async () => {
+                const currentState = await this.syncAuthState(configId);
+                if (!(await this.isCurrentAccessTokenExpired())) {
+                    return currentState;
+                }
+                return this.refreshAsLockOwner(customParams, configId);
+            });
         }
+        return this.runSynchronizedRefreshWithStorageLock(customParams, configId);
     }
-    getLocalStorageSettings() {
-        try {
-            const localStorageSettingsString = localStorage.getItem(`Instance_${this.id}`);
-            if (localStorageSettingsString != null) {
-                this.localSettings.set(JSON.parse(localStorageSettingsString));
+    async runSynchronizedRefreshWithStorageLock(customParams, configId) {
+        const startedAt = Date.now();
+        if (this.tryAcquireRefreshLock(configId)) {
+            try {
+                const currentState = await this.syncAuthState(configId);
+                if (!(await this.isCurrentAccessTokenExpired())) {
+                    return currentState;
+                }
+                return await this.refreshAsLockOwner(customParams, configId);
             }
-            else {
-                this.localSettings.set({});
+            finally {
+                this.releaseRefreshLock(configId);
             }
         }
+        const waitResult = await this.waitForRefreshResult(startedAt, configId);
+        if (waitResult === 'success') {
+            return this.syncAuthState(configId);
+        }
+        if (waitResult === 'error') {
+            throw new Error('Token refresh failed in another tab.');
+        }
+        return this.runSynchronizedRefreshWithStorageLock(customParams, configId);
+    }
+    async refreshAsLockOwner(customParams, configId) {
+        try {
+            const response = await firstValueFrom(super.forceRefreshSession(customParams, configId));
+            await this.applyLoginResponse(response, configId);
+            this.publishRefreshResult('success', configId);
+            return response;
+        }
         catch (error) {
-            this.msgService.error(error, 'Error parsing layoutConfig:');
-            this.localSettings.set({});
+            this.publishRefreshResult('error', configId);
+            throw error;
         }
     }
-    /**
-     * Checks if the content ID is present.
-     * @returns {boolean} True if the content ID is present, false otherwise.
-     */
-    get isContent() {
-        return this.topBarService.checkId('content');
+    async syncAuthState(configId) {
+        const response = await firstValueFrom(super.checkAuth(undefined, configId));
+        await this.applyLoginResponse(response, configId);
+        return response;
+    }
+    async applyLoginResponse(response, configId) {
+        this.loginResponse.next(response);
+        this.currentUser.next(response.userData);
+        const token = await firstValueFrom(super.getAccessToken(configId));
+        this.accessToken.next(token);
+        const payload = await firstValueFrom(this.getPayloadFromAccessToken());
+        this.payload.next(payload);
+    }
+    async isCurrentAccessTokenExpired() {
+        const payload = await firstValueFrom(this.getPayloadFromAccessToken());
+        return !payload?.exp || payload.exp < Math.floor(Date.now() / 1000);
+    }
+    tryAcquireRefreshLock(configId) {
+        const lockKey = this.getRefreshLockKey(configId);
+        const now = Date.now();
+        const currentLock = this.readRefreshLock(lockKey);
+        if (currentLock && currentLock.ownerId !== this.refreshTabId && currentLock.expiresAt > now) {
+            return false;
+        }
+        const nextLock = {
+            ownerId: this.refreshTabId,
+            expiresAt: now + this.refreshLockTtlMs
+        };
+        localStorage.setItem(lockKey, JSON.stringify(nextLock));
+        return this.readRefreshLock(lockKey)?.ownerId === this.refreshTabId;
+    }
+    releaseRefreshLock(configId) {
+        const lockKey = this.getRefreshLockKey(configId);
+        const currentLock = this.readRefreshLock(lockKey);
+        if (currentLock?.ownerId === this.refreshTabId) {
+            localStorage.removeItem(lockKey);
+        }
     }
-    /**
-     * Checks if the settings ID is present.
-     * @returns {boolean} True if the settings ID is present, false otherwise.
-     */
-    get isSettings() {
-        return this.topBarService.checkId('settings');
+    waitForRefreshResult(startedAt, configId) {
+        const resultKey = this.getRefreshResultKey(configId);
+        return new Promise((resolve) => {
+            const timeoutId = window.setTimeout(() => {
+                cleanup();
+                resolve('timeout');
+            }, this.refreshWaitTimeoutMs);
+            const intervalId = window.setInterval(() => {
+                const result = this.tryResolveRefreshResult(resultKey, startedAt, configId);
+                if (result) {
+                    cleanup();
+                    resolve(result);
+                }
+            }, 250);
+            const onStorage = (event) => {
+                if (event.key === resultKey) {
+                    const result = this.tryResolveRefreshResult(resultKey, startedAt, configId);
+                    if (result) {
+                        cleanup();
+                        resolve(result);
+                    }
+                }
+            };
+            const cleanup = () => {
+                window.clearTimeout(timeoutId);
+                window.clearInterval(intervalId);
+                window.removeEventListener('storage', onStorage);
+            };
+            window.addEventListener('storage', onStorage);
+            const result = this.tryResolveRefreshResult(resultKey, startedAt, configId);
+            if (result) {
+                cleanup();
+                resolve(result);
+            }
+        });
     }
-    /**
-     * Checks if the security ID is present.
-     * @returns {boolean} True if the security ID is present, false otherwise.
-     */
-    get isSecurity() {
-        return this.topBarService.checkId('security');
+    tryResolveRefreshResult(resultKey, startedAt, configId) {
+        const result = this.readRefreshResult(resultKey);
+        if (!result || result.timestamp < startedAt || result.configId !== configId) {
+            return null;
+        }
+        return result.status;
+    }
+    publishRefreshResult(status, configId) {
+        const result = {
+            configId,
+            ownerId: this.refreshTabId,
+            status,
+            timestamp: Date.now()
+        };
+        localStorage.setItem(this.getRefreshResultKey(configId), JSON.stringify(result));
     }
-    /**
-     * Gets an instant translation for a key or an array of keys.
-     */
-    t(key, interpolateParams) {
-        return this.translateService.instant(key, interpolateParams);
+    readRefreshLock(lockKey) {
+        try {
+            const value = localStorage.getItem(lockKey);
+            return value ? JSON.parse(value) : null;
+        }
+        catch {
+            return null;
+        }
     }
-    /**
-     * Initializes the component and subscribes to local settings updates.
-     */
+    readRefreshResult(resultKey) {
+        try {
+            const value = localStorage.getItem(resultKey);
+            return value ? JSON.parse(value) : null;
+        }
+        catch {
+            return null;
+        }
+    }
+    getRefreshLockKey(configId) {
+        return `${this.refreshLockKeyPrefix}:${configId ?? 'default'}`;
+    }
+    getRefreshResultKey(configId) {
+        return `${this.refreshResultKeyPrefix}:${configId ?? 'default'}`;
+    }
+    getWebLocks() {
+        return navigator.locks ?? null;
+    }
+    createRefreshTabId() {
+        return window.crypto?.randomUUID?.() ?? `${Date.now()}-${Math.random()}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KeycloakSecurityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KeycloakSecurityService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KeycloakSecurityService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+
+/* eslint-disable */
+/* tslint:disable */
+// @ts-nocheck
+var ContentType;
+(function (ContentType) {
+    ContentType["Json"] = "application/json";
+    ContentType["JsonApi"] = "application/vnd.api+json";
+    ContentType["FormData"] = "multipart/form-data";
+    ContentType["UrlEncoded"] = "application/x-www-form-urlencoded";
+    ContentType["Text"] = "text/plain";
+})(ContentType || (ContentType = {}));
+class HttpClient {
     constructor() {
-        this.isInitialized = false;
-        this.moduleInstanceReloadPromise = Promise.resolve();
-        this.destroyRef = inject(DestroyRef);
-        this.securityDataService = inject(SecurityDataService);
         this.securityService = inject(SecurityService);
-        /**
-         * Provide access to app settings
-         */
         this.layoutService = inject(LayoutService);
-        /**
-         * Provides access to topbar related functionality, such as managing visibility and content.
-         * @type {TopBarService}
-         */
-        this.topBarService = inject(TopBarService);
-        /**
-         * Provides access to information about the current route.
-         * This includes route parameters, data, and the route's path.
-         */
-        this.route = inject(ActivatedRoute);
-        /**
-         * Provides access to messaging services.
-         */
-        this.msgService = inject(MsgService);
-        /**
-         * Provides access to base data service functionality.
-         * @deprecated The method should not be used
-         */
-        this.baseDataService = inject(BaseDataService);
-        /**
-         * Provides access to translation functionality.
-         */
-        this.translateService = inject(TranslateService);
-        /**
-         * Provides access to the application's title service.
-         */
-        this.appTitleService = inject(AppTitleService);
-        /**
-         * Reference to the ChangeDetector. Used to trigger change detection manually.
-         */
-        this.changeDetectorRef = inject(ChangeDetectorRef);
-        /**
-         * Represents a subscription to an observable.
-         * Manages the lifecycle of receiving data from the observable and allows unsubscribing to stop receiving data.
-         * @type {Subscription}
-         */
-        this.subscriptions = [];
-        /**
-         * Configuration object for backend storage
-         * @type {TBackendStoreSettings}
-         */
-        this.settings = {};
+        this.baseUrl = "";
+        this.securityWorker = () => ({
+            headers: {
+                "Accept-language": this.layoutService.language()
+                    ? this.layoutService.language()
+                    : "en",
+                "X-Timezone": this.layoutService.timeZone(),
+            },
+        });
+        this.abortControllers = new Map();
+        this.customFetch = (...fetchParams) => fetch(...fetchParams);
+        this.baseApiParams = {
+            credentials: "same-origin",
+            headers: {},
+            redirect: "follow",
+            referrerPolicy: "no-referrer",
+        };
+        this.setSecurityData = (data) => { };
+        this.contentFormatters = {
+            [ContentType.Json]: (input) => input !== null && (typeof input === "object" || typeof input === "string")
+                ? JSON.stringify(input)
+                : input,
+            [ContentType.JsonApi]: (input) => input !== null && (typeof input === "object" || typeof input === "string")
+                ? JSON.stringify(input)
+                : input,
+            [ContentType.Text]: (input) => input !== null && typeof input !== "string"
+                ? JSON.stringify(input)
+                : input,
+            [ContentType.FormData]: (input) => {
+                if (input instanceof FormData) {
+                    return input;
+                }
+                return Object.keys(input || {}).reduce((formData, key) => {
+                    const property = input[key];
+                    formData.append(key, property instanceof Blob
+                        ? property
+                        : typeof property === "object" && property !== null
+                            ? JSON.stringify(property)
+                            : `${property}`);
+                    return formData;
+                }, new FormData());
+            },
+            [ContentType.UrlEncoded]: (input) => this.toQueryString(input),
+        };
+        this.createAbortSignal = (cancelToken) => {
+            if (this.abortControllers.has(cancelToken)) {
+                const abortController = this.abortControllers.get(cancelToken);
+                if (abortController) {
+                    return abortController.signal;
+                }
+                return void 0;
+            }
+            const abortController = new AbortController();
+            this.abortControllers.set(cancelToken, abortController);
+            return abortController.signal;
+        };
+        this.abortRequest = (cancelToken) => {
+            const abortController = this.abortControllers.get(cancelToken);
+            if (abortController) {
+                abortController.abort();
+                this.abortControllers.delete(cancelToken);
+            }
+        };
+        this.request = async ({ body, secure, path, type, query, format, baseUrl, cancelToken, ...params }) => {
+            const secureParams = ((typeof secure === "boolean" ? secure : this.baseApiParams.secure) &&
+                this.securityWorker &&
+                (await this.securityWorker(null))) ||
+                {};
+            const csrfParams = await this.getCsrfRequestParams(params.method, path);
+            const requestParams = this.mergeRequestParams(this.mergeRequestParams(params, secureParams), csrfParams);
+            const queryString = query && this.toQueryString(query);
+            const payloadFormatter = this.contentFormatters[type || ContentType.Json];
+            let responseFormat = format || requestParams.format;
+            return this.customFetch(`${baseUrl || this.baseUrl || ""}${path}${queryString ? `?${queryString}` : ""}`, {
+                ...requestParams,
+                headers: {
+                    ...(requestParams.headers || {}),
+                    ...(type && type !== ContentType.FormData
+                        ? { "Content-Type": type }
+                        : {}),
+                },
+                signal: (cancelToken
+                    ? this.createAbortSignal(cancelToken)
+                    : requestParams.signal) || null,
+                body: typeof body === "undefined" || body === null
+                    ? null
+                    : payloadFormatter(body),
+            }).then(async (response) => {
+                const r = response;
+                r.data = null;
+                r.error = null;
+                if (typeof E !== undefined && responseFormat === undefined)
+                    responseFormat = "json";
+                const responseToParse = responseFormat ? response.clone() : response;
+                const data = !responseFormat
+                    ? r
+                    : await responseToParse[responseFormat]()
+                        .then((data) => {
+                        if (r.ok) {
+                            r.data = data;
+                        }
+                        else {
+                            r.error = data;
+                        }
+                        return r;
+                    })
+                        .catch((e) => {
+                        r.error = e;
+                        return r;
+                    });
+                if (cancelToken) {
+                    this.abortControllers.delete(cancelToken);
+                }
+                if (!response.ok)
+                    throw data;
+                return data.data;
+            });
+        };
+    }
+    encodeQueryParam(key, value) {
+        const encodedKey = encodeURIComponent(key);
+        return `${encodedKey}=${encodeURIComponent(typeof value === "number" ? value : `${value}`)}`;
+    }
+    addQueryParam(query, key) {
+        return this.encodeQueryParam(key, query[key]);
+    }
+    addArrayQueryParam(query, key) {
+        const value = query[key];
+        return value.map((v) => this.encodeQueryParam(key, v)).join("&");
+    }
+    toQueryString(rawQuery) {
+        const query = rawQuery || {};
+        const keys = Object.keys(query).filter((key) => "undefined" !== typeof query[key]);
+        return keys
+            .map((key) => Array.isArray(query[key])
+            ? this.addArrayQueryParam(query, key)
+            : this.addQueryParam(query, key))
+            .join("&");
+    }
+    addQueryParams(rawQuery) {
+        const queryString = this.toQueryString(rawQuery);
+        return queryString ? `?${queryString}` : "";
+    }
+    mergeRequestParams(params1, params2) {
+        return {
+            ...this.baseApiParams,
+            ...params1,
+            ...(params2 || {}),
+            headers: {
+                ...(this.baseApiParams.headers || {}),
+                ...(params1.headers || {}),
+                ...((params2 && params2.headers) || {}),
+            },
+        };
+    }
+    async getCsrfRequestParams(method, path) {
+        if (!method ||
+            !["POST", "PUT", "PATCH", "DELETE"].includes(method.toUpperCase())) {
+            return {};
+        }
+        if (path.includes("/api/security/create-auth-session") ||
+            path.includes("/api/security/get-auth-csrf-token")) {
+            return {};
+        }
+        const csrfToken = await firstValueFrom(this.securityService.getCsrfToken());
+        return csrfToken?.token
+            ? { headers: { [csrfToken.headerName]: csrfToken.token } }
+            : {};
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HttpClient, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HttpClient, providedIn: "root" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HttpClient, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+
+class BaseModuleComponent {
+    static { this.readRight = 'read'; }
+    static { this.editRight = 'edit'; }
+    static { this.deleteRight = 'delete'; }
+    /**
+     * Updates local settings and persists them to local storage.
+     * @return {void}
+     */
+    onConfigUpdate() {
+        if (Object.keys(this.localSettings()).length > 0) {
+            this._localSettings = { ...this.localSettings() };
+            this.localSettingsUpdate.next(this._localSettings);
+            localStorage.setItem(`Instance_${this.id}`, JSON.stringify(this._localSettings));
+        }
+    }
+    getLocalStorageSettings() {
+        try {
+            const localStorageSettingsString = localStorage.getItem(`Instance_${this.id}`);
+            if (localStorageSettingsString != null) {
+                this.localSettings.set(JSON.parse(localStorageSettingsString));
+            }
+            else {
+                this.localSettings.set({});
+            }
+        }
+        catch (error) {
+            this.msgService.error(error, 'Error parsing layoutConfig:');
+            this.localSettings.set({});
+        }
+    }
+    /**
+     * Checks if the content ID is present.
+     * @returns {boolean} True if the content ID is present, false otherwise.
+     */
+    get isContent() {
+        return this.topBarService.checkId('content');
+    }
+    /**
+     * Checks if the settings ID is present.
+     * @returns {boolean} True if the settings ID is present, false otherwise.
+     */
+    get isSettings() {
+        return this.topBarService.checkId('settings');
+    }
+    /**
+     * Checks if the security ID is present.
+     * @returns {boolean} True if the security ID is present, false otherwise.
+     */
+    get isSecurity() {
+        return this.topBarService.checkId('security');
+    }
+    /**
+     * Gets an instant translation for a key or an array of keys.
+     */
+    t(key, interpolateParams) {
+        return this.translateService.instant(key, interpolateParams);
+    }
+    /**
+     * Initializes the component and subscribes to local settings updates.
+     */
+    constructor() {
+        this.isInitialized = false;
+        this.moduleInstanceReloadPromise = Promise.resolve();
+        this.destroyRef = inject(DestroyRef);
+        this.securityService = inject(SecurityService);
+        this.httpClient = inject(HttpClient);
+        /**
+         * Provide access to app settings
+         */
+        this.layoutService = inject(LayoutService);
+        /**
+         * Provides access to topbar related functionality, such as managing visibility and content.
+         * @type {TopBarService}
+         */
+        this.topBarService = inject(TopBarService);
+        /**
+         * Provides access to information about the current route.
+         * This includes route parameters, data, and the route's path.
+         */
+        this.route = inject(ActivatedRoute);
+        /**
+         * Provides access to messaging services.
+         */
+        this.msgService = inject(MsgService);
+        /**
+         * Provides access to translation functionality.
+         */
+        this.translateService = inject(TranslateService);
+        /**
+         * Provides access to the application's title service.
+         */
+        this.appTitleService = inject(AppTitleService);
+        /**
+         * Reference to the ChangeDetector. Used to trigger change detection manually.
+         */
+        this.changeDetectorRef = inject(ChangeDetectorRef);
+        /**
+         * Represents a subscription to an observable.
+         * Manages the lifecycle of receiving data from the observable and allows unsubscribing to stop receiving data.
+         * @type {Subscription}
+         */
+        this.subscriptions = [];
+        /**
+         * Configuration object for backend storage
+         * @type {TBackendStoreSettings}
+         */
+        this.settings = {};
         /**
          * Configuration object for local storage.
          * @type {TLocalStoreSettings}
@@ -1020,7 +1424,10 @@ class BaseModuleComponent {
      */
     async getSettings() {
         try {
-            this.settings = await this.baseDataService.sendRequest(`${this.baseDataService.baseUrl}api/${this.controller}/get-module-instance-settings?id=${this.id}`);
+            if (this.id == null) {
+                return;
+            }
+            this.settings = await this.getModuleInstanceSettings();
         }
         catch (error) {
             this.msgService.error(error);
@@ -1032,8 +1439,11 @@ class BaseModuleComponent {
      * @return {Promise<void>} A promise that resolves when the settings are saved. Reject if an error occurs.
      */
     async saveSettings(settings) {
-        await this.baseDataService
-            .sendRequest(`api/${this.controller}/put-module-instance-settings`, 'PUT', {
+        if (this.id == null) {
+            this.msgService.error('Module id not passed!');
+            return;
+        }
+        await this.saveModuleInstanceSettings({
             id: this.id,
             settings: settings
         })
@@ -1065,7 +1475,7 @@ class BaseModuleComponent {
             return;
         }
         this.rightsSubscription = this.securityService.payload
-            .pipe(switchMap((payload) => from(this.securityDataService.getSecurity(controller, id)).pipe(map((securitySettings) => ({ payload, securitySettings })))), takeUntilDestroyed(this.destroyRef))
+            .pipe(switchMap((payload) => from(this.getSecurity(controller, id)).pipe(map((securitySettings) => ({ payload, securitySettings })))), takeUntilDestroyed(this.destroyRef))
             .subscribe({
             next: ({ payload, securitySettings }) => {
                 const roles = payload?.realm_access?.roles ?? [];
@@ -1096,6 +1506,62 @@ class BaseModuleComponent {
             .find((security) => security.code === code)
             ?.roles?.some((role) => roles.includes(role)) ?? false;
     }
+    getSecurity(controller = this.controller, id = this.id) {
+        if (!controller || id == null) {
+            return Promise.resolve([]);
+        }
+        return this.httpClient.request({
+            path: `/api/${controller}/get-security`,
+            method: 'GET',
+            query: { id },
+            secure: true,
+            format: 'json'
+        });
+    }
+    saveSecurity(request, controller = this.controller) {
+        return this.httpClient.request({
+            path: `/api/${controller}/put-security`,
+            method: 'PUT',
+            body: request,
+            secure: true,
+            type: ContentType.Json
+        });
+    }
+    getModuleInstanceSettings(controller = this.controller, id = this.id) {
+        return this.httpClient.request({
+            path: `/api/${controller}/get-module-instance-settings`,
+            method: 'GET',
+            query: { id },
+            secure: true,
+            format: 'json'
+        });
+    }
+    saveModuleInstanceSettings(request, controller = this.controller) {
+        return this.httpClient.request({
+            path: `/api/${controller}/put-module-instance-settings`,
+            method: 'PUT',
+            body: request,
+            secure: true,
+            type: ContentType.Json
+        });
+    }
+    getMigrations(controller = this.controller) {
+        return this.httpClient.request({
+            path: `/api/${controller}/get-migrations`,
+            method: 'GET',
+            secure: true,
+            format: 'json'
+        });
+    }
+    applyModuleMigration(request, controller = this.controller) {
+        return this.httpClient.request({
+            path: `/api/${controller}/apply-migration`,
+            method: 'POST',
+            body: request,
+            secure: true,
+            type: ContentType.Json
+        });
+    }
     async reloadModuleInstance() {
         this.moduleInstanceReloadPromise = this.moduleInstanceReloadPromise.then(async () => {
             await this.getSettings();
@@ -1112,11 +1578,66 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             args: [{ standalone: true, template: '' }]
         }], ctorParameters: () => [] });
 
+/* eslint-disable */
+/* tslint:disable */
+// @ts-nocheck
+class SecurityApi extends HttpClient {
+    constructor() {
+        super(...arguments);
+        this.getCurrentAuthSession = (params = {}) => this.request({
+            path: `/api/security/get-current-auth-session`,
+            method: "GET",
+            secure: true,
+            format: "json",
+            ...params,
+        });
+        this.createAuthSession = (params = {}) => this.request({
+            path: `/api/security/create-auth-session`,
+            method: "POST",
+            secure: true,
+            ...params,
+        });
+        this.deleteAuthSession = (params = {}) => this.request({
+            path: `/api/security/delete-auth-session`,
+            method: "POST",
+            secure: true,
+            ...params,
+        });
+        this.getAuthCsrfToken = (params = {}) => this.request({
+            path: `/api/security/get-auth-csrf-token`,
+            method: "GET",
+            secure: true,
+            format: "json",
+            ...params,
+        });
+        this.getKeycloakClientSettings = (params = {}) => this.request({
+            path: `/api/security/get-keycloak-client-settings`,
+            method: "GET",
+            secure: true,
+            format: "json",
+            ...params,
+        });
+        this.getRealmRoles = (params = {}) => this.request({
+            path: `/api/security/get-realm-roles`,
+            method: "GET",
+            secure: true,
+            format: "json",
+            ...params,
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityApi, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityApi }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityApi, decorators: [{
+            type: Injectable
+        }] });
+
 class SecurityComponent {
     constructor() {
         this.msgService = inject(MsgService);
-        this.dataService = inject(SecurityDataService);
         this.translateService = inject(TranslateService);
+        this.httpClient = inject(HttpClient);
+        this.securityApi = inject(SecurityApi);
         this.securityLoadToken = 0;
         this.securityData = [];
         this.roles = [];
@@ -1130,7 +1651,7 @@ class SecurityComponent {
         }
     }
     ngOnInit() {
-        this.dataService.getRealmRoles().then((result) => {
+        this.securityApi.getRealmRoles().then((result) => {
             this.roles = result;
         }, (error) => this.msgService.error(error));
     }
@@ -1147,7 +1668,7 @@ class SecurityComponent {
             id: this.id,
             securities: this.securityData
         };
-        this.dataService.saveSecurity(this.controller, request).then((result) => {
+        this.saveSecurity(this.controller, request).then((result) => {
             this.msgService.success(this.translateService.instant('securityComponent.savedSecurity'));
         }, (error) => this.msgService.error(error));
     }
@@ -1165,7 +1686,7 @@ class SecurityComponent {
             return;
         }
         try {
-            const result = await this.dataService.getSecurity(controller, id);
+            const result = await this.getSecurity(controller, id);
             if (loadToken === this.securityLoadToken) {
                 this.securityData = result;
             }
@@ -1176,6 +1697,24 @@ class SecurityComponent {
             }
         }
     }
+    getSecurity(controller, id) {
+        return this.httpClient.request({
+            path: `/api/${controller}/get-security`,
+            method: 'GET',
+            query: { id },
+            secure: true,
+            format: 'json'
+        });
+    }
+    saveSecurity(controller, request) {
+        return this.httpClient.request({
+            path: `/api/${controller}/put-security`,
+            method: 'PUT',
+            body: request,
+            secure: true,
+            type: ContentType.Json
+        });
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: SecurityComponent, isStandalone: true, selector: "security", inputs: { id: "id", controller: "controller" }, usesOnChanges: true, ngImport: i0, template: `
     <div class="flex flex-col md:flex-row gap-8">
@@ -1847,6 +2386,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }] });
 
+/* eslint-disable */
+/* tslint:disable */
+// @ts-nocheck
+class UserProfileApi extends HttpClient {
+    constructor() {
+        super(...arguments);
+        this.getUserPhoto = (query, params = {}) => this.request({
+            path: `/api/user-profile/get-user-photo`,
+            method: "GET",
+            query: query,
+            secure: true,
+            format: "blob",
+            ...params,
+        });
+        this.postUserPhoto = (data, params = {}) => this.request({
+            path: `/api/user-profile/post-user-photo`,
+            method: "POST",
+            body: data,
+            secure: true,
+            type: ContentType.FormData,
+            ...params,
+        });
+        this.getSettings = (params = {}) => this.request({
+            path: `/api/user-profile/get-settings`,
+            method: "GET",
+            secure: true,
+            format: "json",
+            ...params,
+        });
+        this.setSettings = (data, params = {}) => this.request({
+            path: `/api/user-profile/set-settings`,
+            method: "PUT",
+            body: data,
+            secure: true,
+            type: ContentType.Json,
+            ...params,
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UserProfileApi, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UserProfileApi }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UserProfileApi, decorators: [{
+            type: Injectable
+        }] });
+
 /**
  * UserService is responsible for retrieving and handling user-related data,
  * including the user's photo and short label for avatar display.
@@ -1854,7 +2438,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 class UserService {
     constructor() {
         this.securityService = inject(SecurityService);
-        this.baseDataService = inject(BaseDataService);
+        this.userProfileApi = inject(UserProfileApi);
         this.requestedPhotoEmail = null;
         /**
          * Stores the user's photo as a data URL or binary blob, depending on how it's processed.
@@ -1879,11 +2463,18 @@ class UserService {
         const data = this.securityService.getCurrentUser();
         const givenNameInitial = data?.given_name?.trim()?.[0];
         const familyNameInitial = data?.family_name?.trim()?.[0];
-        return `${givenNameInitial ?? ''}${familyNameInitial ?? ''}`.toUpperCase();
+        const displayNameInitials = this.getInitials(data?.displayName ?? data?.name ?? data?.userName ?? data?.preferred_username);
+        return `${givenNameInitial ?? ''}${familyNameInitial ?? ''}`.toUpperCase() || displayNameInitials;
     }
     get userName() {
         const data = this.securityService.getCurrentUser();
-        return [data?.given_name, data?.family_name].filter(Boolean).join(' ');
+        return [data?.given_name, data?.family_name].filter(Boolean).join(' ')
+            || data?.displayName
+            || data?.name
+            || data?.userName
+            || data?.preferred_username
+            || data?.email
+            || '';
     }
     /**
      * Initiates an HTTP request to fetch the user's photo based on their email,
@@ -1898,8 +2489,7 @@ class UserService {
             return;
         }
         this.requestedPhotoEmail = email;
-        const url = this.baseDataService.buildUrl(`api/user-profile/get-user-photo?email=${email}`);
-        this.baseDataService.getBlob(url).then((data) => {
+        this.userProfileApi.getUserPhoto({ email }, { format: 'blob' }).then((data) => {
             this.createImageFromBlob(data);
             this.photoLoaded = true;
         }, (error) => {
@@ -1921,6 +2511,16 @@ class UserService {
             reader.readAsDataURL(image);
         }
     }
+    getInitials(value) {
+        return value
+            ?.trim()
+            .split(/\s+/)
+            .filter(Boolean)
+            .slice(0, 2)
+            .map((part) => part[0])
+            .join('')
+            .toUpperCase() ?? '';
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UserService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UserService }); }
 }
@@ -2009,141 +2609,417 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             args: [{ providedIn: 'root' }]
         }] });
 
-class AppTopbar {
+/* eslint-disable */
+/* tslint:disable */
+// @ts-nocheck
+class NotificationApi extends HttpClient {
+    constructor() {
+        super(...arguments);
+        this.getNotificationByUser = (query, params = {}) => this.request({
+            path: `/api/notification/get-notification-by-user`,
+            method: "GET",
+            query: query,
+            secure: true,
+            format: "json",
+            ...params,
+        });
+        this.getNotificationCountByUser = (params = {}) => this.request({
+            path: `/api/notification/get-notification-count-by-user`,
+            method: "GET",
+            secure: true,
+            format: "json",
+            ...params,
+        });
+        this.markNotificationAsRead = ({ id, ...query }, params = {}) => this.request({
+            path: `/api/notification/mark-notification-as-read/${id}`,
+            method: "POST",
+            secure: true,
+            ...params,
+        });
+        this.getNotificationById = (query, params = {}) => this.request({
+            path: `/api/notification/get-notification-by-id`,
+            method: "GET",
+            query: query,
+            secure: true,
+            format: "json",
+            ...params,
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationApi, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationApi }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationApi, decorators: [{
+            type: Injectable
+        }] });
+
+class NotificationService {
     constructor() {
         this.securityService = inject(SecurityService);
-        this.topBarService = inject(TopBarService);
-        this.userService = inject(UserService);
-        this.layoutService = inject(LayoutService);
-        this.logoService = inject(LogoService);
+        this.msgService = inject(MsgService);
+        this.notificationApi = inject(NotificationApi);
+        this.unreadNotificationCount = signal(undefined, ...(ngDevMode ? [{ debugName: "unreadNotificationCount" }] : []));
+        this.connection = new signalR.HubConnectionBuilder()
+            .withUrl('/hubs/notification', {
+            withCredentials: true,
+            skipNegotiation: true,
+            transport: signalR.HttpTransportType.WebSockets
+        })
+            .configureLogging(signalR.LogLevel.Error)
+            .build();
+        this.connection.on('ReceiveNotification', (notification) => {
+            const opt = {
+                severity: notification.severity,
+                summary: notification.subject,
+                detail: notification.message,
+                life: 0
+            };
+            this.msgService.add(opt);
+            this.unreadNotificationCount.update((count) => (count ?? 0) + 1);
+        });
+        this.securityService.isAuthenticated().subscribe((authenticated) => {
+            if (!authenticated) {
+                this.unreadNotificationCount.set(undefined);
+                if (this.connection.state !== signalR.HubConnectionState.Disconnected) {
+                    this.connection.stop();
+                }
+                return;
+            }
+            this.loadUnreadNotificationCount();
+            if (this.connection.state === signalR.HubConnectionState.Disconnected) {
+                this.connection.start().catch((error) => console.error('Failed to start notification connection', error));
+                return;
+            }
+            this.connection.stop().then(() => {
+                this.connection.start().catch((error) => console.error('Failed to restart notification connection', error));
+            });
+        });
     }
-    toggleDarkMode() {
-        this.layoutService.layoutConfig.update((state) => ({
-            ...state,
-            darkTheme: !state.darkTheme
-        }));
+    loadUnreadNotificationCount() {
+        this.notificationApi
+            .getNotificationCountByUser()
+            .then((response) => this.unreadNotificationCount.set(response.count ?? 0))
+            .catch((error) => console.error('Failed to load notification count', error));
     }
-    logoutKeyDown($event) {
-        if ($event.key === 'Enter') {
-            this.securityService.logout();
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [] });
+
+class UserNotificationsComponent {
+    constructor() {
+        this.notifications = [];
+        this.totalCount = 0;
+        this.skip = 0;
+        this.take = 5;
+        this.loading = false;
+        this.notificationApi = inject(NotificationApi);
+        this.notificationService = inject(NotificationService);
+        this.msgService = inject(MsgService);
+        this.translateService = inject(TranslateService);
+        this.unreadNotificationCount = computed(() => this.notificationService.unreadNotificationCount() ?? 0, ...(ngDevMode ? [{ debugName: "unreadNotificationCount" }] : []));
+        this.unreadNotificationBadge = computed(() => {
+            const count = this.unreadNotificationCount();
+            return count > 99 ? '99+' : count.toString();
+        }, ...(ngDevMode ? [{ debugName: "unreadNotificationBadge" }] : []));
+    }
+    async toggle(event) {
+        this.popover?.toggle(event);
+        await this.loadNotifications();
+    }
+    async loadNotifications() {
+        this.loading = true;
+        try {
+            const response = await this.notificationApi.getNotificationByUser({
+                skip: this.skip,
+                take: this.take,
+                unreadOnly: true
+            });
+            this.notifications = response.notifications ?? [];
+            this.totalCount = response.totalCount ?? 0;
+        }
+        catch (error) {
+            this.msgService.error(error);
+        }
+        finally {
+            this.loading = false;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppTopbar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AppTopbar, isStandalone: true, selector: "app-topbar", ngImport: i0, template: ` <div class="layout-topbar">
-    <div class="layout-topbar-logo-container">
-      <button class="layout-menu-button layout-topbar-action" (click)="layoutService.onMenuToggle()">
-        <i class="pi pi-bars"></i>
-      </button>
-      <a class="layout-topbar-logo" id="oip-app-topbar-logo-link" routerLink="">
-        <ng-container
-          *ngComponentOutlet="logoService.getLogoComponent(); inputs: { width: 36, height: 36 }"></ng-container>
-        <span>{{ 'app-info.title' | translate }}</span>
-      </a>
-    </div>
-
-    @if (securityService.isAdmin() && topBarService.topBarItems.length > 0) {
-      <p-tabs class="layout-topbar-tabs ml-2" [(value)]="topBarService.activeId">
-        <p-tablist>
-          @for (tab of topBarService.availableTopBarItems; track tab.id) {
-            <p-tab id="oip-app-topbar-tab-{{ tab.id }}" [value]="tab.id">
-              <i class="pi {{ tab.icon }}"></i>
-              <span class="ml-2">{{ tab.caption }}</span>
-            </p-tab>
-          }
-        </p-tablist>
-      </p-tabs>
+    async onPageChange(event) {
+        this.skip = event.first ?? 0;
+        this.take = event.rows ?? this.take;
+        await this.loadNotifications();
     }
-    <div class="layout-topbar-actions">
-      <div class="layout-config-menu">
+    async markAsRead(notification) {
+        if (!notification.notificationUserId) {
+            return;
+        }
+        this.readingNotificationId = notification.notificationUserId;
+        try {
+            await this.notificationApi.markNotificationAsRead({ id: notification.notificationUserId });
+            this.msgService.success(this.translateService.instant('userNotifications.markedAsRead'));
+            this.notificationService.loadUnreadNotificationCount();
+            if (this.notifications.length === 1 && this.skip > 0) {
+                this.skip = Math.max(this.skip - this.take, 0);
+            }
+            await this.loadNotifications();
+        }
+        catch (error) {
+            this.msgService.error(error);
+        }
+        finally {
+            this.readingNotificationId = undefined;
+        }
+    }
+    getImportanceSeverity(importance) {
+        switch (importance) {
+            case 'Critical':
+            case 'High':
+                return 'danger';
+            case 'Medium':
+                return 'warn';
+            case 'Low':
+                return 'info';
+            default:
+                return 'secondary';
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UserNotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: UserNotificationsComponent, isStandalone: true, selector: "app-user-notifications", viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], ngImport: i0, template: `
+    <button
+      class="layout-topbar-action relative"
+      id="oip-app-topbar-notification-button"
+      type="button"
+      (click)="toggle($event)"
+      [attr.aria-label]="'Notifications: ' + unreadNotificationCount()">
+      <i class="pi pi-bell"></i>
+      @if (unreadNotificationCount() > 0) {
+        <p-badge
+          class="absolute -top-1 -right-1"
+          severity="danger"
+          [badgeSize]="'small'"
+          [value]="unreadNotificationBadge()" />
+      }
+    </button>
+
+    <p-popover #popover styleClass="w-[min(92vw,34rem)]">
+      <div class="flex items-center justify-between gap-3 mb-4">
+        <div class="font-semibold text-lg">
+          {{ 'userNotifications.title' | translate }}
+        </div>
         <p-button
-          class="layout-topbar-action"
-          id="oip-app-topbar-theme-button"
+          icon="pi pi-refresh"
+          rounded="true"
           severity="secondary"
-          type="button"
-          [rounded]="true"
-          [text]="true"
-          (click)="toggleDarkMode()">
-          <i
-            class="pi"
-            [ngClass]="{
-              'pi-moon': layoutService.isDarkTheme(),
-              'pi-sun': !layoutService.isDarkTheme()
-            }"></i>
-        </p-button>
-        <div class="relative">
-          <p-button
-            class="layout-topbar-action layout-topbar-action-highlight"
-            enterActiveClass="animate-scalein"
-            enterFromClass="hidden"
-            id="oip-app-topbar-palette-button"
-            leaveActiveClass="animate-fadeout"
-            leaveToClass="hidden"
-            pStyleClass="@next"
-            [hideOnOutsideClick]="true"
-            [rounded]="true">
-            <i class="pi pi-palette"></i>
-          </p-button>
-          <app-configurator />
+          text="true"
+          tooltipPosition="bottom"
+          [disabled]="loading"
+          [pTooltip]="'userNotifications.refresh' | translate"
+          (onClick)="loadNotifications()"></p-button>
+      </div>
+
+      @if (loading && notifications.length === 0) {
+        <div class="flex justify-center py-8">
+          <p-progressSpinner style="w-8 h-8"></p-progressSpinner>
+        </div>
+      } @else if (notifications.length === 0) {
+        <div class="text-center py-8 text-surface-500">
+          {{ 'userNotifications.empty' | translate }}
+        </div>
+      } @else {
+        <div class="flex flex-col gap-3 max-h-[26rem] overflow-y-auto pr-1">
+          @for (notification of notifications; track notification.notificationUserId) {
+            <div class="border border-surface-200 dark:border-surface-700 rounded-md p-3">
+              <div class="flex items-start justify-between gap-3">
+                <div class="min-w-0">
+                  <div class="font-medium leading-snug break-words">
+                    {{ notification.subject }}
+                  </div>
+                  <div class="text-xs text-surface-500 mt-1">
+                    {{ notification.createdAt | date: 'dd.MM.yyyy HH:mm' }}
+                  </div>
+                </div>
+                @if (notification.importance) {
+                  <p-tag
+                    class="shrink-0"
+                    [severity]="getImportanceSeverity(notification.importance)"
+                    [value]="notification.importance"></p-tag>
+                }
+              </div>
+
+              <div class="text-sm text-surface-700 dark:text-surface-200 mt-3 whitespace-pre-line break-words">
+                {{ notification.message }}
+              </div>
+
+              <div class="flex justify-end mt-3">
+                <p-button
+                  icon="pi pi-check"
+                  size="small"
+                  [label]="'userNotifications.markAsRead' | translate"
+                  [loading]="readingNotificationId === notification.notificationUserId"
+                  (onClick)="markAsRead(notification)"></p-button>
+              </div>
+            </div>
+          }
+        </div>
+
+        <p-paginator
+          styleClass="mt-3"
+          [first]="skip"
+          [rows]="take"
+          [totalRecords]="totalCount"
+          [rowsPerPageOptions]="[5, 10, 20]"
+          (onPageChange)="onPageChange($event)"></p-paginator>
+      }
+    </p-popover>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i1$3.Badge, selector: "p-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i3$1.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first", "appendTo"], outputs: ["onPageChange"] }, { kind: "component", type: Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UserNotificationsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'app-user-notifications',
+                    standalone: true,
+                    imports: [CommonModule, BadgeModule, ButtonModule, PaginatorModule, Popover, ProgressSpinnerModule, Tag, Tooltip, TranslatePipe],
+                    template: `
+    <button
+      class="layout-topbar-action relative"
+      id="oip-app-topbar-notification-button"
+      type="button"
+      (click)="toggle($event)"
+      [attr.aria-label]="'Notifications: ' + unreadNotificationCount()">
+      <i class="pi pi-bell"></i>
+      @if (unreadNotificationCount() > 0) {
+        <p-badge
+          class="absolute -top-1 -right-1"
+          severity="danger"
+          [badgeSize]="'small'"
+          [value]="unreadNotificationBadge()" />
+      }
+    </button>
+
+    <p-popover #popover styleClass="w-[min(92vw,34rem)]">
+      <div class="flex items-center justify-between gap-3 mb-4">
+        <div class="font-semibold text-lg">
+          {{ 'userNotifications.title' | translate }}
         </div>
+        <p-button
+          icon="pi pi-refresh"
+          rounded="true"
+          severity="secondary"
+          text="true"
+          tooltipPosition="bottom"
+          [disabled]="loading"
+          [pTooltip]="'userNotifications.refresh' | translate"
+          (onClick)="loadNotifications()"></p-button>
       </div>
 
-      <button
-        class="layout-topbar-menu-button layout-topbar-action"
-        enterActiveClass="animate-scalein"
-        enterFromClass="hidden"
-        id="oip-app-topbar-menu-expand-button"
-        leaveActiveClass="animate-fadeout"
-        leaveToClass="hidden"
-        pStyleClass="@next"
-        [hideOnOutsideClick]="true">
-        <i class="pi pi-ellipsis-v"></i>
-      </button>
+      @if (loading && notifications.length === 0) {
+        <div class="flex justify-center py-8">
+          <p-progressSpinner style="w-8 h-8"></p-progressSpinner>
+        </div>
+      } @else if (notifications.length === 0) {
+        <div class="text-center py-8 text-surface-500">
+          {{ 'userNotifications.empty' | translate }}
+        </div>
+      } @else {
+        <div class="flex flex-col gap-3 max-h-[26rem] overflow-y-auto pr-1">
+          @for (notification of notifications; track notification.notificationUserId) {
+            <div class="border border-surface-200 dark:border-surface-700 rounded-md p-3">
+              <div class="flex items-start justify-between gap-3">
+                <div class="min-w-0">
+                  <div class="font-medium leading-snug break-words">
+                    {{ notification.subject }}
+                  </div>
+                  <div class="text-xs text-surface-500 mt-1">
+                    {{ notification.createdAt | date: 'dd.MM.yyyy HH:mm' }}
+                  </div>
+                </div>
+                @if (notification.importance) {
+                  <p-tag
+                    class="shrink-0"
+                    [severity]="getImportanceSeverity(notification.importance)"
+                    [value]="notification.importance"></p-tag>
+                }
+              </div>
 
-      <div class="layout-topbar-menu hidden lg:block">
-        <div class="layout-topbar-menu-content">
-          <button
-            class="layout-topbar-action"
-            id="oip-app-topbar-logout-button"
-            type="button"
-            (click)="securityService.logout()"
-            (keydown)="logoutKeyDown($event)">
-            <i class="pi pi-sign-out"></i>
-            <span>{{ 'topbar.logout' | translate }}</span>
-          </button>
-          <button class="layout-topbar-action" routerLink="config">
-            <p-avatar
-              class="p-link flex align-items-center"
-              id="oip-app-topbar-user-avatar"
-              shape="circle"
-              size="normal"
-              [image]="userService.photoLoaded ? userService.photo : null"
-              >{{ !userService.photoLoaded ? userService.shortLabel : null }}
-            </p-avatar>
-            <span class="ml-2">{{ 'topbar.profile' | translate }}</span>
-          </button>
+              <div class="text-sm text-surface-700 dark:text-surface-200 mt-3 whitespace-pre-line break-words">
+                {{ notification.message }}
+              </div>
+
+              <div class="flex justify-end mt-3">
+                <p-button
+                  icon="pi pi-check"
+                  size="small"
+                  [label]="'userNotifications.markAsRead' | translate"
+                  [loading]="readingNotificationId === notification.notificationUserId"
+                  (onClick)="markAsRead(notification)"></p-button>
+              </div>
+            </div>
+          }
         </div>
-      </div>
-    </div>
-  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }, { kind: "component", type: Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: TabList, selector: "p-tablist" }, { kind: "component", type: Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i2$2.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppTopbar, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'app-topbar',
-                    standalone: true,
-                    imports: [
-                        RouterModule,
-                        CommonModule,
-                        StyleClassModule,
-                        AppConfiguratorComponent,
-                        Tabs,
-                        TabList,
-                        Tab,
-                        AvatarModule,
-                        ButtonModule,
-                        TranslatePipe
-                    ],
-                    template: ` <div class="layout-topbar">
+
+        <p-paginator
+          styleClass="mt-3"
+          [first]="skip"
+          [rows]="take"
+          [totalRecords]="totalCount"
+          [rowsPerPageOptions]="[5, 10, 20]"
+          (onPageChange)="onPageChange($event)"></p-paginator>
+      }
+    </p-popover>
+  `
+                }]
+        }], propDecorators: { popover: [{
+                type: ViewChild,
+                args: ['popover']
+            }] } });
+
+class AppTopbar {
+    constructor() {
+        this.securityService = inject(SecurityService);
+        this.topBarService = inject(TopBarService);
+        this.userService = inject(UserService);
+        this.layoutService = inject(LayoutService);
+        this.logoService = inject(LogoService);
+        this.confirmationService = inject(ConfirmationService);
+        this.translateService = inject(TranslateService);
+    }
+    toggleDarkMode() {
+        this.layoutService.layoutConfig.update((state) => ({
+            ...state,
+            darkTheme: !state.darkTheme
+        }));
+    }
+    logoutKeyDown($event) {
+        if ($event.key === 'Enter') {
+            $event.preventDefault();
+            this.confirmLogout();
+        }
+    }
+    confirmLogout() {
+        this.confirmationService.confirm({
+            header: this.translateService.instant('topbar.logoutConfirmHeader'),
+            message: this.translateService.instant('topbar.logoutConfirmMessage'),
+            icon: 'pi pi-sign-out',
+            rejectButtonProps: {
+                label: this.translateService.instant('topbar.logoutConfirmCancel'),
+                severity: 'secondary',
+                outlined: true
+            },
+            acceptButtonProps: {
+                label: this.translateService.instant('topbar.logoutConfirmAccept'),
+                severity: 'danger'
+            },
+            accept: () => {
+                this.securityService.logout();
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppTopbar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AppTopbar, isStandalone: true, selector: "app-topbar", providers: [ConfirmationService], ngImport: i0, template: ` <div class="layout-topbar">
+    <p-confirmDialog appendTo="body" />
     <div class="layout-topbar-logo-container">
       <button class="layout-menu-button layout-topbar-action" (click)="layoutService.onMenuToggle()">
         <i class="pi pi-bars"></i>
@@ -2169,6 +3045,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
     }
     <div class="layout-topbar-actions">
       <div class="layout-config-menu">
+        <app-user-notifications />
         <p-button
           class="layout-topbar-action"
           id="oip-app-topbar-theme-button"
@@ -2219,7 +3096,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             class="layout-topbar-action"
             id="oip-app-topbar-logout-button"
             type="button"
-            (click)="securityService.logout()"
+            (click)="confirmLogout()"
             (keydown)="logoutKeyDown($event)">
             <i class="pi pi-sign-out"></i>
             <span>{{ 'topbar.logout' | translate }}</span>
@@ -2238,232 +3115,167 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         </div>
       </div>
     </div>
-  </div>`
-                }]
-        }] });
-
-class FooterComponent {
-    constructor() {
-        this.logoService = inject(LogoService);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FooterComponent, isStandalone: true, selector: "app-footer", ngImport: i0, template: `
-    <div class="layout-footer">
-      <div class="flex justify-center flex-1">
-        <div class="mr-2 -my-0.5">
-          <ng-container
-            *ngComponentOutlet="logoService.getLogoComponent(); inputs: { width: 18, height: 18 }"></ng-container>
-        </div>
-        <span class="font-medium">{{ 'app-info.footer' | translate }}</span>
-      </div>
-      <p class="mr-auto">{{ 'app-info.version' | translate }}</p>
-    </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3$2.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }, { kind: "component", type: Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: TabList, selector: "p-tablist" }, { kind: "component", type: Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i2$2.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: UserNotificationsComponent, selector: "app-user-notifications" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppTopbar, decorators: [{
             type: Component,
             args: [{
-                    selector: 'app-footer',
-                    template: `
-    <div class="layout-footer">
-      <div class="flex justify-center flex-1">
-        <div class="mr-2 -my-0.5">
-          <ng-container
-            *ngComponentOutlet="logoService.getLogoComponent(); inputs: { width: 18, height: 18 }"></ng-container>
-        </div>
-        <span class="font-medium">{{ 'app-info.footer' | translate }}</span>
-      </div>
-      <p class="mr-auto">{{ 'app-info.version' | translate }}</p>
-    </div>
-  `,
-                    standalone: true,
-                    imports: [TranslatePipe, NgComponentOutlet]
-                }]
-        }] });
-
-/* eslint-disable */
-/* tslint:disable */
-// @ts-nocheck
-var ContentType;
-(function (ContentType) {
-    ContentType["Json"] = "application/json";
-    ContentType["JsonApi"] = "application/vnd.api+json";
-    ContentType["FormData"] = "multipart/form-data";
-    ContentType["UrlEncoded"] = "application/x-www-form-urlencoded";
-    ContentType["Text"] = "text/plain";
-})(ContentType || (ContentType = {}));
-class HttpClient {
-    constructor() {
-        this.securityService = inject(SecurityService);
-        this.layoutService = inject(LayoutService);
-        this.baseUrl = "";
-        this.securityData = null;
-        this.securityWorker = (securityData) => ({
-            headers: {
-                "Accept-language": this.layoutService.language()
-                    ? this.layoutService.language()
-                    : "en",
-                "X-Timezone": this.layoutService.timeZone(),
-                Authorization: `Bearer ${securityData}`,
-            },
-        });
-        this.abortControllers = new Map();
-        this.customFetch = (...fetchParams) => fetch(...fetchParams);
-        this.baseApiParams = {
-            credentials: "same-origin",
-            headers: {},
-            redirect: "follow",
-            referrerPolicy: "no-referrer",
-        };
-        this.setSecurityData = (data) => {
-            this.securityData = data;
-        };
-        this.contentFormatters = {
-            [ContentType.Json]: (input) => input !== null && (typeof input === "object" || typeof input === "string")
-                ? JSON.stringify(input)
-                : input,
-            [ContentType.JsonApi]: (input) => input !== null && (typeof input === "object" || typeof input === "string")
-                ? JSON.stringify(input)
-                : input,
-            [ContentType.Text]: (input) => input !== null && typeof input !== "string"
-                ? JSON.stringify(input)
-                : input,
-            [ContentType.FormData]: (input) => {
-                if (input instanceof FormData) {
-                    return input;
-                }
-                return Object.keys(input || {}).reduce((formData, key) => {
-                    const property = input[key];
-                    formData.append(key, property instanceof Blob
-                        ? property
-                        : typeof property === "object" && property !== null
-                            ? JSON.stringify(property)
-                            : `${property}`);
-                    return formData;
-                }, new FormData());
-            },
-            [ContentType.UrlEncoded]: (input) => this.toQueryString(input),
-        };
-        this.createAbortSignal = (cancelToken) => {
-            if (this.abortControllers.has(cancelToken)) {
-                const abortController = this.abortControllers.get(cancelToken);
-                if (abortController) {
-                    return abortController.signal;
-                }
-                return void 0;
-            }
-            const abortController = new AbortController();
-            this.abortControllers.set(cancelToken, abortController);
-            return abortController.signal;
-        };
-        this.abortRequest = (cancelToken) => {
-            const abortController = this.abortControllers.get(cancelToken);
-            if (abortController) {
-                abortController.abort();
-                this.abortControllers.delete(cancelToken);
-            }
-        };
-        this.request = async ({ body, secure, path, type, query, format, baseUrl, cancelToken, ...params }) => {
-            const secureParams = ((typeof secure === "boolean" ? secure : this.baseApiParams.secure) &&
-                this.securityWorker &&
-                (await this.securityWorker(this.securityData))) ||
-                {};
-            const requestParams = this.mergeRequestParams(params, secureParams);
-            const queryString = query && this.toQueryString(query);
-            const payloadFormatter = this.contentFormatters[type || ContentType.Json];
-            let responseFormat = format || requestParams.format;
-            return this.customFetch(`${baseUrl || this.baseUrl || ""}${path}${queryString ? `?${queryString}` : ""}`, {
-                ...requestParams,
-                headers: {
-                    ...(requestParams.headers || {}),
-                    ...(type && type !== ContentType.FormData
-                        ? { "Content-Type": type }
-                        : {}),
-                },
-                signal: (cancelToken
-                    ? this.createAbortSignal(cancelToken)
-                    : requestParams.signal) || null,
-                body: typeof body === "undefined" || body === null
-                    ? null
-                    : payloadFormatter(body),
-            }).then(async (response) => {
-                const r = response;
-                r.data = null;
-                r.error = null;
-                if (typeof E !== undefined && responseFormat === undefined)
-                    responseFormat = "json";
-                const responseToParse = responseFormat ? response.clone() : response;
-                const data = !responseFormat
-                    ? r
-                    : await responseToParse[responseFormat]()
-                        .then((data) => {
-                        if (r.ok) {
-                            r.data = data;
-                        }
-                        else {
-                            r.error = data;
-                        }
-                        return r;
-                    })
-                        .catch((e) => {
-                        r.error = e;
-                        return r;
-                    });
-                if (cancelToken) {
-                    this.abortControllers.delete(cancelToken);
-                }
-                if (!response.ok)
-                    throw data;
-                return data.data;
-            });
-        };
-        this.securityService.getAccessToken().subscribe((token) => {
-            this.securityData = token;
-        });
-    }
-    encodeQueryParam(key, value) {
-        const encodedKey = encodeURIComponent(key);
-        return `${encodedKey}=${encodeURIComponent(typeof value === "number" ? value : `${value}`)}`;
-    }
-    addQueryParam(query, key) {
-        return this.encodeQueryParam(key, query[key]);
-    }
-    addArrayQueryParam(query, key) {
-        const value = query[key];
-        return value.map((v) => this.encodeQueryParam(key, v)).join("&");
-    }
-    toQueryString(rawQuery) {
-        const query = rawQuery || {};
-        const keys = Object.keys(query).filter((key) => "undefined" !== typeof query[key]);
-        return keys
-            .map((key) => Array.isArray(query[key])
-            ? this.addArrayQueryParam(query, key)
-            : this.addQueryParam(query, key))
-            .join("&");
-    }
-    addQueryParams(rawQuery) {
-        const queryString = this.toQueryString(rawQuery);
-        return queryString ? `?${queryString}` : "";
+                    selector: 'app-topbar',
+                    standalone: true,
+                    imports: [
+                        RouterModule,
+                        CommonModule,
+                        StyleClassModule,
+                        AppConfiguratorComponent,
+                        Tabs,
+                        TabList,
+                        Tab,
+                        AvatarModule,
+                        ButtonModule,
+                        ConfirmDialog,
+                        UserNotificationsComponent,
+                        TranslatePipe
+                    ],
+                    template: ` <div class="layout-topbar">
+    <p-confirmDialog appendTo="body" />
+    <div class="layout-topbar-logo-container">
+      <button class="layout-menu-button layout-topbar-action" (click)="layoutService.onMenuToggle()">
+        <i class="pi pi-bars"></i>
+      </button>
+      <a class="layout-topbar-logo" id="oip-app-topbar-logo-link" routerLink="">
+        <ng-container
+          *ngComponentOutlet="logoService.getLogoComponent(); inputs: { width: 36, height: 36 }"></ng-container>
+        <span>{{ 'app-info.title' | translate }}</span>
+      </a>
+    </div>
+
+    @if (securityService.isAdmin() && topBarService.topBarItems.length > 0) {
+      <p-tabs class="layout-topbar-tabs ml-2" [(value)]="topBarService.activeId">
+        <p-tablist>
+          @for (tab of topBarService.availableTopBarItems; track tab.id) {
+            <p-tab id="oip-app-topbar-tab-{{ tab.id }}" [value]="tab.id">
+              <i class="pi {{ tab.icon }}"></i>
+              <span class="ml-2">{{ tab.caption }}</span>
+            </p-tab>
+          }
+        </p-tablist>
+      </p-tabs>
     }
-    mergeRequestParams(params1, params2) {
-        return {
-            ...this.baseApiParams,
-            ...params1,
-            ...(params2 || {}),
-            headers: {
-                ...(this.baseApiParams.headers || {}),
-                ...(params1.headers || {}),
-                ...((params2 && params2.headers) || {}),
-            },
-        };
+    <div class="layout-topbar-actions">
+      <div class="layout-config-menu">
+        <app-user-notifications />
+        <p-button
+          class="layout-topbar-action"
+          id="oip-app-topbar-theme-button"
+          severity="secondary"
+          type="button"
+          [rounded]="true"
+          [text]="true"
+          (click)="toggleDarkMode()">
+          <i
+            class="pi"
+            [ngClass]="{
+              'pi-moon': layoutService.isDarkTheme(),
+              'pi-sun': !layoutService.isDarkTheme()
+            }"></i>
+        </p-button>
+        <div class="relative">
+          <p-button
+            class="layout-topbar-action layout-topbar-action-highlight"
+            enterActiveClass="animate-scalein"
+            enterFromClass="hidden"
+            id="oip-app-topbar-palette-button"
+            leaveActiveClass="animate-fadeout"
+            leaveToClass="hidden"
+            pStyleClass="@next"
+            [hideOnOutsideClick]="true"
+            [rounded]="true">
+            <i class="pi pi-palette"></i>
+          </p-button>
+          <app-configurator />
+        </div>
+      </div>
+
+      <button
+        class="layout-topbar-menu-button layout-topbar-action"
+        enterActiveClass="animate-scalein"
+        enterFromClass="hidden"
+        id="oip-app-topbar-menu-expand-button"
+        leaveActiveClass="animate-fadeout"
+        leaveToClass="hidden"
+        pStyleClass="@next"
+        [hideOnOutsideClick]="true">
+        <i class="pi pi-ellipsis-v"></i>
+      </button>
+
+      <div class="layout-topbar-menu hidden lg:block">
+        <div class="layout-topbar-menu-content">
+          <button
+            class="layout-topbar-action"
+            id="oip-app-topbar-logout-button"
+            type="button"
+            (click)="confirmLogout()"
+            (keydown)="logoutKeyDown($event)">
+            <i class="pi pi-sign-out"></i>
+            <span>{{ 'topbar.logout' | translate }}</span>
+          </button>
+          <button class="layout-topbar-action" routerLink="config">
+            <p-avatar
+              class="p-link flex align-items-center"
+              id="oip-app-topbar-user-avatar"
+              shape="circle"
+              size="normal"
+              [image]="userService.photoLoaded ? userService.photo : null"
+              >{{ !userService.photoLoaded ? userService.shortLabel : null }}
+            </p-avatar>
+            <span class="ml-2">{{ 'topbar.profile' | translate }}</span>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>`,
+                    providers: [ConfirmationService]
+                }]
+        }] });
+
+class FooterComponent {
+    constructor() {
+        this.logoService = inject(LogoService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HttpClient, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HttpClient, providedIn: "root" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FooterComponent, isStandalone: true, selector: "app-footer", ngImport: i0, template: `
+    <div class="layout-footer">
+      <div class="flex justify-center flex-1">
+        <div class="mr-2 -my-0.5">
+          <ng-container
+            *ngComponentOutlet="logoService.getLogoComponent(); inputs: { width: 18, height: 18 }"></ng-container>
+        </div>
+        <span class="font-medium">{{ 'app-info.footer' | translate }}</span>
+      </div>
+      <p class="mr-auto">{{ 'app-info.version' | translate }}</p>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HttpClient, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: "root" }]
-        }], ctorParameters: () => [] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FooterComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'app-footer',
+                    template: `
+    <div class="layout-footer">
+      <div class="flex justify-center flex-1">
+        <div class="mr-2 -my-0.5">
+          <ng-container
+            *ngComponentOutlet="logoService.getLogoComponent(); inputs: { width: 18, height: 18 }"></ng-container>
+        </div>
+        <span class="font-medium">{{ 'app-info.footer' | translate }}</span>
+      </div>
+      <p class="mr-auto">{{ 'app-info.version' | translate }}</p>
+    </div>
+  `,
+                    standalone: true,
+                    imports: [TranslatePipe, NgComponentOutlet]
+                }]
+        }] });
 
 /* eslint-disable */
 /* tslint:disable */
@@ -2530,9 +3342,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             type: Injectable
         }] });
 
-class MenuService extends BaseDataService {
+class MenuService {
     constructor() {
-        super(...arguments);
         this.menuSource = new Subject();
         this.resetSource = new Subject();
         this.titleService = inject(AppTitleService);
@@ -2552,7 +3363,9 @@ class MenuService extends BaseDataService {
      */
     onMenuStateChange(event) {
         this.menuSource.next(event);
-        this.titleService.setTitle(event.item.label);
+        if (!event.item.items?.length) {
+            this.titleService.setTitle(event.item.label);
+        }
     }
     reset() {
         this.resetSource.next(true);
@@ -2575,7 +3388,7 @@ class MenuService extends BaseDataService {
     editModuleInstance(item) {
         return this.menuDataService.editModuleInstance(item);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuService }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuService, decorators: [{
@@ -2592,17 +3405,15 @@ class MenuItemComponent {
         this.confirmationService = inject(ConfirmationService);
         this.msgService = inject(MsgService);
         this.menuDataService = inject(MenuApi);
+        this.securityService = inject(SecurityService);
         this.active = false;
         this.subscriptions = [];
         this.localization = {};
         this.key = '';
         this.subscriptions.push(this.menuService.menuSource$.subscribe((value) => {
             Promise.resolve(null).then(() => {
-                if (value.routeEvent) {
-                    this.active = value.key === this.key || value.key.startsWith(this.key + '-');
-                }
-                else if (value.key !== this.key && !value.key.startsWith(this.key + '-')) {
-                    this.active = false;
+                if (value.routeEvent && (value.key === this.key || value.key.startsWith(this.key + '-'))) {
+                    this.active = true;
                 }
             });
         }));
@@ -2655,8 +3466,8 @@ class MenuItemComponent {
         }
         this.menuService.onMenuStateChange({ key: this.key, item: this.item });
     }
-    get submenuAnimation() {
-        return this.root || this.active ? 'expanded' : 'collapsed';
+    get isSubmenuExpanded() {
+        return this.root || this.active;
     }
     get activeClass() {
         return this.active && !this.root;
@@ -2668,6 +3479,11 @@ class MenuItemComponent {
         this.menuItemCreateDialogComponent.showDialog();
     }
     onContextMenu($event, item) {
+        if (!this.securityService.isAdmin()) {
+            return;
+        }
+        $event.stopPropagation();
+        $event.preventDefault();
         this.menuService.contextMenuItem = item;
         this.contextMenu.model = [
             {
@@ -2787,19 +3603,32 @@ class MenuItemComponent {
     hasVisiblePrev(currentItem) {
         const items = this.getItems(currentItem);
         const currentIndex = items.findIndex((item) => item.moduleInstanceId == currentItem.moduleInstanceId);
-        return currentIndex > 0;
+        return this.findPrevVisibleItem(items, currentIndex) !== -1;
     }
     getItems(currentItem) {
-        return !currentItem.parentId
-            ? this.menuService.menu
-            : this.menuService.menu.find((m) => m.moduleInstanceId == currentItem.parentId).items;
+        if (!currentItem.parentId) {
+            return this.menuService.menu;
+        }
+        return this.findItemByModuleInstanceId(this.menuService.menu, currentItem.parentId)?.items ?? [];
+    }
+    findItemByModuleInstanceId(items, moduleInstanceId) {
+        for (const item of items) {
+            if (item.moduleInstanceId == moduleInstanceId) {
+                return item;
+            }
+            const foundItem = this.findItemByModuleInstanceId(item.items ?? [], moduleInstanceId);
+            if (foundItem) {
+                return foundItem;
+            }
+        }
+        return null;
     }
     hasVisibleNext(currentItem) {
         const items = this.getItems(currentItem);
         const currentIndex = items.findIndex((item) => item.moduleInstanceId == currentItem.moduleInstanceId);
-        return currentIndex < items.length - 1;
+        return this.findNextVisibleIndex(items, currentIndex) !== -1;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$3.Router }, { token: MenuService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$4.Router }, { token: MenuService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: MenuItemComponent, isStandalone: true, selector: "[app-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey", menuItemCreateDialogComponent: "menuItemCreateDialogComponent", menuItemEditDialogComponent: "menuItemEditDialogComponent", contextMenu: "contextMenu" }, host: { properties: { "class.layout-root-menuitem": "this.root", "class.active-menuitem": "this.activeClass" } }, providers: [ConfirmationService], ngImport: i0, template: `
     <ng-container>
       <p-confirm-dialog />
@@ -2815,7 +3644,8 @@ class MenuItemComponent {
           [attr.href]="item.url"
           [attr.target]="item.target"
           [ngClass]="item.class"
-          (click)="itemClick($event)">
+          (click)="itemClick($event)"
+          (contextmenu)="onContextMenu($event, item)">
           <i class="layout-menuitem-icon" [ngClass]="item.icon"></i>
           <span class="layout-menuitem-text">{{ item.label }}</span>
           @if (item.items) {
@@ -2857,7 +3687,7 @@ class MenuItemComponent {
       }
 
       @if (item.items && item.visible !== false) {
-        <ul [@children]="submenuAnimation" (contextmenu)="onContextMenu($event, item)">
+        <ul class="layout-submenu" [class.layout-submenu-expanded]="isSubmenuExpanded">
           @for (child of item.items; track child; let i = $index) {
             <li
               app-menuitem
@@ -2872,17 +3702,7 @@ class MenuItemComponent {
         </ul>
       }
     </ng-container>
-  `, isInline: true, dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey", "menuItemCreateDialogComponent", "menuItemEditDialogComponent", "contextMenu"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }], animations: [
-            trigger('children', [
-                state('collapsed', style({
-                    height: '0'
-                })),
-                state('expanded', style({
-                    height: '*'
-                })),
-                transition('collapsed <=> expanded', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
-            ])
-        ] }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey", "menuItemCreateDialogComponent", "menuItemEditDialogComponent", "contextMenu"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$3.Ripple, selector: "[pRipple]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuItemComponent, decorators: [{
             type: Component,
@@ -2904,7 +3724,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
           [attr.href]="item.url"
           [attr.target]="item.target"
           [ngClass]="item.class"
-          (click)="itemClick($event)">
+          (click)="itemClick($event)"
+          (contextmenu)="onContextMenu($event, item)">
           <i class="layout-menuitem-icon" [ngClass]="item.icon"></i>
           <span class="layout-menuitem-text">{{ item.label }}</span>
           @if (item.items) {
@@ -2946,7 +3767,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
       }
 
       @if (item.items && item.visible !== false) {
-        <ul [@children]="submenuAnimation" (contextmenu)="onContextMenu($event, item)">
+        <ul class="layout-submenu" [class.layout-submenu-expanded]="isSubmenuExpanded">
           @for (child of item.items; track child; let i = $index) {
             <li
               app-menuitem
@@ -2962,21 +3783,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
       }
     </ng-container>
   `,
-                    animations: [
-                        trigger('children', [
-                            state('collapsed', style({
-                                height: '0'
-                            })),
-                            state('expanded', style({
-                                height: '*'
-                            })),
-                            transition('collapsed <=> expanded', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
-                        ])
-                    ],
                     imports: [RippleModule, NgClass, RouterLinkActive, RouterLink, ContextMenuModule, ConfirmDialog],
                     providers: [ConfirmationService]
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$3.Router }, { type: MenuService }], propDecorators: { item: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$4.Router }, { type: MenuService }], propDecorators: { item: [{
                 type: Input
             }], index: [{
                 type: Input
@@ -3002,9 +3812,21 @@ class MenuItemCreateDialogComponent {
     constructor() {
         this.menuService = inject(MenuService);
         this.menu = inject(MenuApi);
+        this.msgService = inject(MsgService);
         this.visibleChange = new EventEmitter();
         this.modules = [];
+        this.iconOptions = Object.values(PrimeIcons)
+            .filter((icon) => typeof icon === 'string')
+            .map((icon) => ({
+            label: icon.replace('pi pi-', ''),
+            value: icon
+        }))
+            .sort((left, right) => left.label.localeCompare(right.label));
         this.selectIcon = 'pi pi-box';
+        this.saving = false;
+    }
+    get canSave() {
+        return !this.saving && !!this.selectModule;
     }
     async ngOnInit() {
         this.modules = await this.menu.getModules();
@@ -3014,15 +3836,30 @@ class MenuItemCreateDialogComponent {
         this.visibleChange.emit(this.visible);
     }
     async save() {
+        if (this.saving) {
+            return;
+        }
+        if (!this.selectModule) {
+            return;
+        }
         const item = {
             moduleId: this.selectModule,
             label: this.label,
             icon: this.selectIcon,
             parentId: this.menuService.contextMenuItem?.moduleInstanceId
         };
-        await this.menuService.addModuleInstance(item);
-        await this.menuService.loadMenu();
-        this.hide();
+        this.saving = true;
+        try {
+            await this.menuService.addModuleInstance(item);
+            await this.menuService.loadMenu();
+            this.hide();
+        }
+        catch (error) {
+            this.msgService.errorFromException(error, 'Unexpected error');
+        }
+        finally {
+            this.saving = false;
+        }
     }
     hide() {
         this.visible = false;
@@ -3038,7 +3875,8 @@ class MenuItemCreateDialogComponent {
       header="{{ 'menuItemCreateDialogComponent.header' | translate }}"
       [modal]="true"
       [style]="{ width: '40rem' }"
-      [(visible)]="visible">
+      [(visible)]="visible"
+      (keydown.enter)="save()">
       @if (menuService.contextMenuItem) {
         <div class="flex items-center gap-4 mb-4 mt-1">
           <label class="font-semibold w-1/3" for="oip-menu-item-create-dialog-parent-input">
@@ -3077,24 +3915,47 @@ class MenuItemCreateDialogComponent {
         <label class="font-semibold w-1/3" for="oip-menu-item-create-dialog-icon">
           {{ 'menuItemCreateDialogComponent.icon' | translate }}
         </label>
-        <i class="{{ selectIcon }}"></i>
-        <input class="flex-auto" id="oip-menu-item-create-dialog-icon" pInputText [(ngModel)]="selectIcon" />
+        <p-select
+          appendTo="body"
+          class="flex-auto"
+          filterBy="label,value"
+          id="oip-menu-item-create-dialog-icon"
+          optionLabel="label"
+          optionValue="value"
+          scrollHeight="18rem"
+          [filter]="true"
+          [options]="iconOptions"
+          [(ngModel)]="selectIcon">
+          <ng-template let-icon pTemplate="selectedItem">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+          <ng-template let-icon pTemplate="item">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+        </p-select>
       </div>
       <div class="flex justify-end gap-2">
         <p-button
           id="oip-menu-item-create-cancel"
           label="{{ 'menuItemCreateDialogComponent.cancel' | translate }}"
           severity="secondary"
-          (click)="changeVisible()"
-          (keydown)="changeVisible()" />
+          [disabled]="saving"
+          (click)="changeVisible()" />
         <p-button
           id="oip-menu-item-create-save"
           label="{{ 'menuItemCreateDialogComponent.save' | translate }}"
-          (click)="save()"
-          (keydown)="save()" />
+          [disabled]="!canSave"
+          [loading]="saving"
+          (click)="save()" />
       </div>
     </p-dialog>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2$3.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$3.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i3$4.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuItemCreateDialogComponent, decorators: [{
             type: Component,
@@ -3107,7 +3968,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
       header="{{ 'menuItemCreateDialogComponent.header' | translate }}"
       [modal]="true"
       [style]="{ width: '40rem' }"
-      [(visible)]="visible">
+      [(visible)]="visible"
+      (keydown.enter)="save()">
       @if (menuService.contextMenuItem) {
         <div class="flex items-center gap-4 mb-4 mt-1">
           <label class="font-semibold w-1/3" for="oip-menu-item-create-dialog-parent-input">
@@ -3146,21 +4008,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         <label class="font-semibold w-1/3" for="oip-menu-item-create-dialog-icon">
           {{ 'menuItemCreateDialogComponent.icon' | translate }}
         </label>
-        <i class="{{ selectIcon }}"></i>
-        <input class="flex-auto" id="oip-menu-item-create-dialog-icon" pInputText [(ngModel)]="selectIcon" />
+        <p-select
+          appendTo="body"
+          class="flex-auto"
+          filterBy="label,value"
+          id="oip-menu-item-create-dialog-icon"
+          optionLabel="label"
+          optionValue="value"
+          scrollHeight="18rem"
+          [filter]="true"
+          [options]="iconOptions"
+          [(ngModel)]="selectIcon">
+          <ng-template let-icon pTemplate="selectedItem">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+          <ng-template let-icon pTemplate="item">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+        </p-select>
       </div>
       <div class="flex justify-end gap-2">
         <p-button
           id="oip-menu-item-create-cancel"
           label="{{ 'menuItemCreateDialogComponent.cancel' | translate }}"
           severity="secondary"
-          (click)="changeVisible()"
-          (keydown)="changeVisible()" />
+          [disabled]="saving"
+          (click)="changeVisible()" />
         <p-button
           id="oip-menu-item-create-save"
           label="{{ 'menuItemCreateDialogComponent.save' | translate }}"
-          (click)="save()"
-          (keydown)="save()" />
+          [disabled]="!canSave"
+          [loading]="saving"
+          (click)="save()" />
       </div>
     </p-dialog>
   `
@@ -3174,10 +4059,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 class MenuItemEditDialogComponent {
     constructor() {
         this.menuService = inject(MenuService);
-        this.securityDataService = inject(SecurityDataService);
+        this.securityApi = inject(SecurityApi);
+        this.msgService = inject(MsgService);
         this.visibleChange = new EventEmitter();
         this.modules = [];
         this.roles = [];
+        this.iconOptions = Object.values(PrimeIcons)
+            .filter((icon) => typeof icon === 'string')
+            .map((icon) => ({
+            label: icon.replace('pi pi-', ''),
+            value: icon
+        }))
+            .sort((left, right) => left.label.localeCompare(right.label));
         this.item = {
             icon: '',
             label: '',
@@ -3186,15 +4079,28 @@ class MenuItemEditDialogComponent {
             moduleInstanceId: 0,
             parentId: 0
         };
+        this.saving = false;
     }
     changeVisible() {
         this.visible = !this.visible;
         this.visibleChange.emit(this.visible);
     }
     async save() {
-        await this.menuService.editModuleInstance(this.item);
-        await this.menuService.loadMenu();
-        this.hide();
+        if (this.saving) {
+            return;
+        }
+        this.saving = true;
+        try {
+            await this.menuService.editModuleInstance(this.item);
+            await this.menuService.loadMenu();
+            this.hide();
+        }
+        catch (error) {
+            this.msgService.error(error);
+        }
+        finally {
+            this.saving = false;
+        }
     }
     hide() {
         this.visible = false;
@@ -3209,7 +4115,7 @@ class MenuItemEditDialogComponent {
             icon: this.menuService.contextMenuItem?.icon,
             viewRoles: this.menuService.contextMenuItem?.securities
         };
-        this.roles = await this.securityDataService.getRealmRoles();
+        this.roles = await this.securityApi.getRealmRoles();
         this.menuService.getModules().then((data) => {
             this.modules = data;
         });
@@ -3222,7 +4128,8 @@ class MenuItemEditDialogComponent {
       header="{{ 'menuItemEditDialogComponent.header' | translate }}"
       [modal]="true"
       [style]="{ width: '40rem' }"
-      [(visible)]="visible">
+      [(visible)]="visible"
+      (keydown.enter)="save()">
       <div class="flex items-center gap-4 mb-4 mt-1">
         <label class="font-semibold w-1/3" for="oip-menu-item-edit-dialog-menu-input">
           {{ 'menuItemEditDialogComponent.label' | translate }}
@@ -3239,8 +4146,30 @@ class MenuItemEditDialogComponent {
         <label class="font-semibold w-1/3" for="oip-menu-item-edit-dialog-icon">
           {{ 'menuItemEditDialogComponent.icon' | translate }}
         </label>
-        <i class="{{ item.icon }}"></i>
-        <input class="flex-auto" id="oip-menu-item-edit-dialog-icon" pInputText [(ngModel)]="item.icon" />
+        <p-select
+          appendTo="body"
+          class="flex-auto"
+          filterBy="label,value"
+          id="oip-menu-item-edit-dialog-icon"
+          optionLabel="label"
+          optionValue="value"
+          scrollHeight="18rem"
+          [filter]="true"
+          [options]="iconOptions"
+          [(ngModel)]="item.icon">
+          <ng-template let-icon pTemplate="selectedItem">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+          <ng-template let-icon pTemplate="item">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+        </p-select>
       </div>
 
       <div class="flex items-center gap-4 mb-4">
@@ -3262,21 +4191,22 @@ class MenuItemEditDialogComponent {
           id="oip-menu-item-edit-dialog-cancel-edit-button"
           label="{{ 'menuItemEditDialogComponent.cancel' | translate }}"
           severity="secondary"
-          (click)="changeVisible()"
-          (keydown)="changeVisible()" />
+          [disabled]="saving"
+          (click)="changeVisible()" />
         <p-button
           id="oip-menu-item-edit-dialog-save-edit-button"
           label="{{ 'menuItemEditDialogComponent.save' | translate }}"
-          (click)="save()"
-          (keydown)="save()" />
+          [disabled]="saving"
+          [loading]="saving"
+          (click)="save()" />
       </div>
     </p-dialog>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2$3.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$3.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i1.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i3$4.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i1.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuItemEditDialogComponent, decorators: [{
             type: Component,
             args: [{
-                    imports: [ButtonModule, DialogModule, InputTextModule, FormsModule, TranslatePipe, MultiSelectModule],
+                    imports: [ButtonModule, DialogModule, InputTextModule, SelectModule, FormsModule, TranslatePipe, MultiSelectModule],
                     selector: 'menu-item-edit-dialog',
                     standalone: true,
                     template: `
@@ -3284,7 +4214,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
       header="{{ 'menuItemEditDialogComponent.header' | translate }}"
       [modal]="true"
       [style]="{ width: '40rem' }"
-      [(visible)]="visible">
+      [(visible)]="visible"
+      (keydown.enter)="save()">
       <div class="flex items-center gap-4 mb-4 mt-1">
         <label class="font-semibold w-1/3" for="oip-menu-item-edit-dialog-menu-input">
           {{ 'menuItemEditDialogComponent.label' | translate }}
@@ -3301,8 +4232,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         <label class="font-semibold w-1/3" for="oip-menu-item-edit-dialog-icon">
           {{ 'menuItemEditDialogComponent.icon' | translate }}
         </label>
-        <i class="{{ item.icon }}"></i>
-        <input class="flex-auto" id="oip-menu-item-edit-dialog-icon" pInputText [(ngModel)]="item.icon" />
+        <p-select
+          appendTo="body"
+          class="flex-auto"
+          filterBy="label,value"
+          id="oip-menu-item-edit-dialog-icon"
+          optionLabel="label"
+          optionValue="value"
+          scrollHeight="18rem"
+          [filter]="true"
+          [options]="iconOptions"
+          [(ngModel)]="item.icon">
+          <ng-template let-icon pTemplate="selectedItem">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+          <ng-template let-icon pTemplate="item">
+            <div class="flex items-center gap-2">
+              <i [class]="icon.value"></i>
+              <span>{{ icon.label }}</span>
+            </div>
+          </ng-template>
+        </p-select>
       </div>
 
       <div class="flex items-center gap-4 mb-4">
@@ -3324,13 +4277,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
           id="oip-menu-item-edit-dialog-cancel-edit-button"
           label="{{ 'menuItemEditDialogComponent.cancel' | translate }}"
           severity="secondary"
-          (click)="changeVisible()"
-          (keydown)="changeVisible()" />
+          [disabled]="saving"
+          (click)="changeVisible()" />
         <p-button
           id="oip-menu-item-edit-dialog-save-edit-button"
           label="{{ 'menuItemEditDialogComponent.save' | translate }}"
-          (click)="save()"
-          (keydown)="save()" />
+          [disabled]="saving"
+          [loading]="saving"
+          (click)="save()" />
       </div>
     </p-dialog>
   `
@@ -3354,6 +4308,9 @@ class MenuComponent {
         this.menuItemCreateDialogComponent.showDialog();
     }
     onContextMenu($event) {
+        if (!this.securityService.isAdmin()) {
+            return;
+        }
         this.menuService.contextMenuItem = null;
         this.contextMenu.model = [
             {
@@ -3385,11 +4342,11 @@ class MenuComponent {
         }
       </ul>
     </div>
-    <p-contextMenu [target]="empty"/>
     @if (securityService.isAdmin()) {
+      <p-contextMenu [target]="empty"/>
       <menu-item-create-dialog/>
       <menu-item-edit-dialog/>
-    }`, isInline: true, dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey", "menuItemCreateDialogComponent", "menuItemEditDialogComponent", "contextMenu"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: i1$4.ContextMenu, selector: "p-contextMenu, p-contextmenu, p-context-menu", inputs: ["model", "triggerEvent", "target", "global", "style", "styleClass", "autoZIndex", "baseZIndex", "id", "breakpoint", "ariaLabel", "ariaLabelledBy", "pressDelay", "appendTo"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "component", type: MenuItemCreateDialogComponent, selector: "menu-item-create-dialog", inputs: ["visible"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: MenuItemEditDialogComponent, selector: "menu-item-edit-dialog", inputs: ["visible"], outputs: ["visibleChange"] }] }); }
+    }`, isInline: true, dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey", "menuItemCreateDialogComponent", "menuItemEditDialogComponent", "contextMenu"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: i1$5.ContextMenu, selector: "p-contextMenu, p-contextmenu, p-context-menu", inputs: ["model", "triggerEvent", "target", "global", "style", "styleClass", "autoZIndex", "baseZIndex", "id", "breakpoint", "ariaLabel", "ariaLabelledBy", "pressDelay", "appendTo"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "component", type: MenuItemCreateDialogComponent, selector: "menu-item-create-dialog", inputs: ["visible"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: MenuItemEditDialogComponent, selector: "menu-item-edit-dialog", inputs: ["visible"], outputs: ["visibleChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MenuComponent, decorators: [{
             type: Component,
@@ -3428,8 +4385,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         }
       </ul>
     </div>
-    <p-contextMenu [target]="empty"/>
     @if (securityService.isAdmin()) {
+      <p-contextMenu [target]="empty"/>
       <menu-item-create-dialog/>
       <menu-item-edit-dialog/>
     }`
@@ -3550,7 +4507,7 @@ class AppLayoutComponent {
       </div>
       <div class="layout-mask animate-fadein"></div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AppTopbar, selector: "app-topbar" }, { kind: "component", type: SidebarComponent, selector: "app-sidebar" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: FooterComponent, selector: "app-footer" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AppTopbar, selector: "app-topbar" }, { kind: "component", type: SidebarComponent, selector: "app-sidebar" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$4.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: FooterComponent, selector: "app-footer" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppLayoutComponent, decorators: [{
             type: Component,
@@ -3617,7 +4574,7 @@ class AppFloatingConfiguratorComponent {
         <app-configurator />
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3$2.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppFloatingConfiguratorComponent, decorators: [{
             type: Component,
@@ -3711,70 +4668,79 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 
 class UnauthorizedComponent {
     constructor() {
-        this.securityService = inject(SecurityService);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UnauthorizedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: UnauthorizedComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
-    <app-floating-configurator />
-    <div
-      class="bg-surface-50 dark:bg-surface-950 flex items-center justify-center min-h-screen min-w-[100vw] overflow-hidden">
-      <div class="flex flex-col items-center justify-center">
-        <div
-          style="border-radius: 56px; padding: 0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%)">
-          <div class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20" style="border-radius: 53px">
-            <div class="flex flex-col items-center justify-center">
-              <logo [height]="96" [width]="96" />
-            </div>
-            <div class="text-center mb-8">
-              <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">
-                {{ 'unauthorized.welcomeToOip' | translate }}
-              </div>
-              <span class="text-muted-color font-medium">{{ 'unauthorized.signInToContinue' | translate }}</span>
-            </div>
-            <div>
-              <p-button
-                id="oip-unauthorized-error-sign-in-button"
-                label="{{ 'unauthorized.signIn' | translate }}"
-                styleClass="w-full"
-                (click)="securityService.authorize()"></p-button>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
+        this.securityService = inject(SecurityService);
+        this.route = inject(ActivatedRoute);
+        this.router = inject(Router);
+    }
+    signIn() {
+        const returnUrl = this.route.snapshot.queryParamMap.get('returnUrl') || '/';
+        this.router.navigate(['/unauthorized'], {
+            queryParams: { returnUrl },
+            replaceUrl: true
+        }).then(() => this.securityService.authorize());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UnauthorizedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: UnauthorizedComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
+    <app-floating-configurator />
+    <div
+      class="bg-surface-50 dark:bg-surface-950 flex items-center justify-center min-h-screen min-w-[100vw] overflow-hidden">
+      <div class="flex flex-col items-center justify-center">
+        <div
+          style="border-radius: 56px; padding: 0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%)">
+          <div class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20" style="border-radius: 53px">
+            <div class="flex flex-col items-center justify-center">
+              <logo [height]="96" [width]="96" />
+            </div>
+            <div class="text-center mb-8">
+              <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">
+                {{ 'unauthorized.welcomeToOip' | translate }}
+              </div>
+              <span class="text-muted-color font-medium">{{ 'unauthorized.signInToContinue' | translate }}</span>
+            </div>
+            <div>
+              <p-button
+                id="oip-unauthorized-error-sign-in-button"
+                label="{{ 'unauthorized.signIn' | translate }}"
+                styleClass="w-full"
+                (click)="signIn()"></p-button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: RippleModule }, { kind: "component", type: LogoComponent, selector: "logo", inputs: ["width", "height"] }, { kind: "component", type: AppFloatingConfiguratorComponent, selector: "app-floating-configurator" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: UnauthorizedComponent, decorators: [{
             type: Component,
             args: [{
-                    template: `
-    <app-floating-configurator />
-    <div
-      class="bg-surface-50 dark:bg-surface-950 flex items-center justify-center min-h-screen min-w-[100vw] overflow-hidden">
-      <div class="flex flex-col items-center justify-center">
-        <div
-          style="border-radius: 56px; padding: 0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%)">
-          <div class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20" style="border-radius: 53px">
-            <div class="flex flex-col items-center justify-center">
-              <logo [height]="96" [width]="96" />
-            </div>
-            <div class="text-center mb-8">
-              <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">
-                {{ 'unauthorized.welcomeToOip' | translate }}
-              </div>
-              <span class="text-muted-color font-medium">{{ 'unauthorized.signInToContinue' | translate }}</span>
-            </div>
-            <div>
-              <p-button
-                id="oip-unauthorized-error-sign-in-button"
-                label="{{ 'unauthorized.signIn' | translate }}"
-                styleClass="w-full"
-                (click)="securityService.authorize()"></p-button>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
+                    template: `
+    <app-floating-configurator />
+    <div
+      class="bg-surface-50 dark:bg-surface-950 flex items-center justify-center min-h-screen min-w-[100vw] overflow-hidden">
+      <div class="flex flex-col items-center justify-center">
+        <div
+          style="border-radius: 56px; padding: 0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%)">
+          <div class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20" style="border-radius: 53px">
+            <div class="flex flex-col items-center justify-center">
+              <logo [height]="96" [width]="96" />
+            </div>
+            <div class="text-center mb-8">
+              <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">
+                {{ 'unauthorized.welcomeToOip' | translate }}
+              </div>
+              <span class="text-muted-color font-medium">{{ 'unauthorized.signInToContinue' | translate }}</span>
+            </div>
+            <div>
+              <p-button
+                id="oip-unauthorized-error-sign-in-button"
+                label="{{ 'unauthorized.signIn' | translate }}"
+                styleClass="w-full"
+                (click)="signIn()"></p-button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
   `,
                     imports: [
                         ButtonModule,
@@ -3819,7 +4785,7 @@ class ErrorComponent {
         </div>
       </div>
     </div>
-  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1$2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1$2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$3.Ripple, selector: "[pRipple]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ErrorComponent, decorators: [{
             type: Component,
@@ -3892,7 +4858,7 @@ class ProfileComponent {
         [auto]="true"
         (onUpload)="onBasicUploadAuto($event)" />
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i1$5.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "ngmodule", type: ImageModule }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i2$2.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i1$6.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "ngmodule", type: ImageModule }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i2$2.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ProfileComponent, decorators: [{
             type: Component,
@@ -3932,7 +4898,6 @@ class ConfigComponent {
         this.userService = inject(UserService);
         this.securityService = inject(SecurityService);
         this.menuService = inject(MenuService);
-        this.l10n = {};
         this.dateFormats = ['dd.MM.yyyy', 'dd.MM.yy', 'yyyy-MM-dd', 'dd.MMM.yyyy'];
         this.timeFormats = ['HH:mm:ss', 'HH:mm'];
         // @ts-ignore
@@ -3963,204 +4928,204 @@ class ConfigComponent {
         await this.menuService.loadMenu();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ConfigComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ConfigComponent, isStandalone: true, selector: "app-config", ngImport: i0, template: `
-    <div class="flex flex-col md:flex-row gap-4">
-      <div class="md:w-1/2">
-        <div class="card flex flex-col gap-4">
-          <div class="font-semibold text-xl">{{ 'config.profile' | translate }}</div>
-          <div class="flex justify-content-end flex-wrap">
-            {{ userService.userName }}
-          </div>
-          <label>
-            {{ 'config.photo' | translate }}
-            <span
-              class="pi pi-question-circle"
-              pTooltip="{{ 'config.usePhoto256x256Pixel' | translate }}"
-              tooltipPosition="right"></span>
-          </label>
-          <div class="flex justify-content-end flex-wrap">
-            <user-profile></user-profile>
-          </div>
-        </div>
-      </div>
-      <div class="md:w-1/2">
-        <div class="card flex flex-col gap-4">
-          <div class="font-semibold text-xl">{{ 'config.localization' | translate }}</div>
-          <label> {{ 'config.selectLanguage' | translate }} </label>
-          <div class="flex justify-content-end flex-wrap">
-            <p-select
-              class="w-full md:w-56"
-              optionLabel="name"
-              optionValue="code"
-              qa-id="oip-app-config-language-select"
-              [options]="l10nService.availableLanguages"
-              [(ngModel)]="selectedLanguage"
-              (onChange)="changeLanguage()">
-              <ng-template #selectedItem let-selectedOption>
-                <div class="flex items-center gap-2">
-                  <span [class]="selectedOption.icon"></span>
-                  <div>{{ selectedOption.name }}</div>
-                </div>
-              </ng-template>
-              <ng-template #item let-languages>
-                <div class="flex items-center gap-2">
-                  <span [class]="languages.icon"></span>
-                  <div>{{ languages.name }}</div>
-                </div>
-              </ng-template>
-            </p-select>
-          </div>
-          <div class="flex flex-col gap-5">
-            <div class="mt-5">{{ 'config.dateTimeFormat' | translate }}</div>
-            <p-select
-              class="w-full md:w-56"
-              qa-id="oip-app-config-date-format-select"
-              [options]="dateFormats"
-              [placeholder]="'config.dateFormat' | translate"
-              [(ngModel)]="selectedDateFormat"
-              (onChange)="changeDateFormat()" />
-            <p-select
-              class="w-full md:w-56"
-              qa-id="oip-app-config-time-format-select"
-              [options]="timeFormats"
-              [placeholder]="'config.timeFormat' | translate"
-              [(ngModel)]="selectedTimeFormat"
-              (onChange)="changeTimeFormat()" />
-            <div class="mt-5">{{ 'config.timeZone' | translate }}</div>
-            <p-select
-              class="w-full md:w-56"
-              qa-id="oip-app-config-timezone-select"
-              [filter]="true"
-              [options]="allTimeZones"
-              [placeholder]="'config.timeZone' | translate"
-              [virtualScroll]="true"
-              [virtualScrollItemSize]="34"
-              [(ngModel)]="selectedTimeZone"
-              (onChange)="changeTimeZone()" />
-          </div>
-        </div>
-      </div>
-      @if (securityService.isAdmin()) {
-        <div class="md:w-1/2">
-          <div class="card flex flex-col gap-4">
-            <div class="font-semibold text-xl">{{ 'config.menu' | translate }}</div>
-            <div class="flex items-center gap-2">
-              <label for="oip-app-config-admin-mode">{{ 'config.all' | translate }}</label>
-              <p-toggle-switch
-                id="oip-app-config-admin-mode"
-                [(ngModel)]="menuService.adminMode"
-                (onChange)="onSwitchChange()"></p-toggle-switch>
-            </div>
-            <div class="flex items-center gap-2">
-              <label for="oip-app-config-admin-mode">{{ 'config.moduleManagement' | translate }}</label>
-              <p-button icon="pi pi-cog" label="{{ 'config.goTo' | translate }}" routerLink="/modules" />
-            </div>
-          </div>
-        </div>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ConfigComponent, isStandalone: true, selector: "app-config", ngImport: i0, template: `
+    <div class="flex flex-col md:flex-row gap-4">
+      <div class="md:w-1/2">
+        <div class="card flex flex-col gap-4">
+          <div class="font-semibold text-xl">{{ 'config.profile' | translate }}</div>
+          <div class="flex justify-content-end flex-wrap">
+            {{ userService.userName }}
+          </div>
+          <label>
+            {{ 'config.photo' | translate }}
+            <span
+              class="pi pi-question-circle"
+              pTooltip="{{ 'config.usePhoto256x256Pixel' | translate }}"
+              tooltipPosition="right"></span>
+          </label>
+          <div class="flex justify-content-end flex-wrap">
+            <user-profile></user-profile>
+          </div>
+        </div>
+      </div>
+      <div class="md:w-1/2">
+        <div class="card flex flex-col gap-4">
+          <div class="font-semibold text-xl">{{ 'config.localization' | translate }}</div>
+          <label> {{ 'config.selectLanguage' | translate }} </label>
+          <div class="flex justify-content-end flex-wrap">
+            <p-select
+              class="w-full md:w-56"
+              optionLabel="name"
+              optionValue="code"
+              qa-id="oip-app-config-language-select"
+              [options]="l10nService.availableLanguages"
+              [(ngModel)]="selectedLanguage"
+              (onChange)="changeLanguage()">
+              <ng-template #selectedItem let-selectedOption>
+                <div class="flex items-center gap-2">
+                  <span [class]="selectedOption.icon"></span>
+                  <div>{{ selectedOption.name }}</div>
+                </div>
+              </ng-template>
+              <ng-template #item let-languages>
+                <div class="flex items-center gap-2">
+                  <span [class]="languages.icon"></span>
+                  <div>{{ languages.name }}</div>
+                </div>
+              </ng-template>
+            </p-select>
+          </div>
+          <div class="flex flex-col gap-5">
+            <div class="mt-5">{{ 'config.dateTimeFormat' | translate }}</div>
+            <p-select
+              class="w-full md:w-56"
+              qa-id="oip-app-config-date-format-select"
+              [options]="dateFormats"
+              [placeholder]="'config.dateFormat' | translate"
+              [(ngModel)]="selectedDateFormat"
+              (onChange)="changeDateFormat()" />
+            <p-select
+              class="w-full md:w-56"
+              qa-id="oip-app-config-time-format-select"
+              [options]="timeFormats"
+              [placeholder]="'config.timeFormat' | translate"
+              [(ngModel)]="selectedTimeFormat"
+              (onChange)="changeTimeFormat()" />
+            <div class="mt-5">{{ 'config.timeZone' | translate }}</div>
+            <p-select
+              class="w-full md:w-56"
+              qa-id="oip-app-config-timezone-select"
+              [filter]="true"
+              [options]="allTimeZones"
+              [placeholder]="'config.timeZone' | translate"
+              [virtualScroll]="true"
+              [virtualScrollItemSize]="34"
+              [(ngModel)]="selectedTimeZone"
+              (onChange)="changeTimeZone()" />
+          </div>
+        </div>
+      </div>
+      @if (securityService.isAdmin()) {
+        <div class="md:w-1/2">
+          <div class="card flex flex-col gap-4">
+            <div class="font-semibold text-xl">{{ 'config.menu' | translate }}</div>
+            <div class="flex items-center gap-2">
+              <label for="oip-app-config-admin-mode">{{ 'config.all' | translate }}</label>
+              <p-toggle-switch
+                id="oip-app-config-admin-mode"
+                [(ngModel)]="menuService.adminMode"
+                (onChange)="onSwitchChange()"></p-toggle-switch>
+            </div>
+            <div class="flex items-center gap-2">
+              <label for="oip-app-config-admin-mode">{{ 'config.moduleManagement' | translate }}</label>
+              <p-button icon="pi pi-cog" label="{{ 'config.goTo' | translate }}" routerLink="/modules" />
+            </div>
+          </div>
+        </div>
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "component", type: ProfileComponent, selector: "user-profile" }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i2$5.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ConfigComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-config',
-                    template: `
-    <div class="flex flex-col md:flex-row gap-4">
-      <div class="md:w-1/2">
-        <div class="card flex flex-col gap-4">
-          <div class="font-semibold text-xl">{{ 'config.profile' | translate }}</div>
-          <div class="flex justify-content-end flex-wrap">
-            {{ userService.userName }}
-          </div>
-          <label>
-            {{ 'config.photo' | translate }}
-            <span
-              class="pi pi-question-circle"
-              pTooltip="{{ 'config.usePhoto256x256Pixel' | translate }}"
-              tooltipPosition="right"></span>
-          </label>
-          <div class="flex justify-content-end flex-wrap">
-            <user-profile></user-profile>
-          </div>
-        </div>
-      </div>
-      <div class="md:w-1/2">
-        <div class="card flex flex-col gap-4">
-          <div class="font-semibold text-xl">{{ 'config.localization' | translate }}</div>
-          <label> {{ 'config.selectLanguage' | translate }} </label>
-          <div class="flex justify-content-end flex-wrap">
-            <p-select
-              class="w-full md:w-56"
-              optionLabel="name"
-              optionValue="code"
-              qa-id="oip-app-config-language-select"
-              [options]="l10nService.availableLanguages"
-              [(ngModel)]="selectedLanguage"
-              (onChange)="changeLanguage()">
-              <ng-template #selectedItem let-selectedOption>
-                <div class="flex items-center gap-2">
-                  <span [class]="selectedOption.icon"></span>
-                  <div>{{ selectedOption.name }}</div>
-                </div>
-              </ng-template>
-              <ng-template #item let-languages>
-                <div class="flex items-center gap-2">
-                  <span [class]="languages.icon"></span>
-                  <div>{{ languages.name }}</div>
-                </div>
-              </ng-template>
-            </p-select>
-          </div>
-          <div class="flex flex-col gap-5">
-            <div class="mt-5">{{ 'config.dateTimeFormat' | translate }}</div>
-            <p-select
-              class="w-full md:w-56"
-              qa-id="oip-app-config-date-format-select"
-              [options]="dateFormats"
-              [placeholder]="'config.dateFormat' | translate"
-              [(ngModel)]="selectedDateFormat"
-              (onChange)="changeDateFormat()" />
-            <p-select
-              class="w-full md:w-56"
-              qa-id="oip-app-config-time-format-select"
-              [options]="timeFormats"
-              [placeholder]="'config.timeFormat' | translate"
-              [(ngModel)]="selectedTimeFormat"
-              (onChange)="changeTimeFormat()" />
-            <div class="mt-5">{{ 'config.timeZone' | translate }}</div>
-            <p-select
-              class="w-full md:w-56"
-              qa-id="oip-app-config-timezone-select"
-              [filter]="true"
-              [options]="allTimeZones"
-              [placeholder]="'config.timeZone' | translate"
-              [virtualScroll]="true"
-              [virtualScrollItemSize]="34"
-              [(ngModel)]="selectedTimeZone"
-              (onChange)="changeTimeZone()" />
-          </div>
-        </div>
-      </div>
-      @if (securityService.isAdmin()) {
-        <div class="md:w-1/2">
-          <div class="card flex flex-col gap-4">
-            <div class="font-semibold text-xl">{{ 'config.menu' | translate }}</div>
-            <div class="flex items-center gap-2">
-              <label for="oip-app-config-admin-mode">{{ 'config.all' | translate }}</label>
-              <p-toggle-switch
-                id="oip-app-config-admin-mode"
-                [(ngModel)]="menuService.adminMode"
-                (onChange)="onSwitchChange()"></p-toggle-switch>
-            </div>
-            <div class="flex items-center gap-2">
-              <label for="oip-app-config-admin-mode">{{ 'config.moduleManagement' | translate }}</label>
-              <p-button icon="pi pi-cog" label="{{ 'config.goTo' | translate }}" routerLink="/modules" />
-            </div>
-          </div>
-        </div>
-      }
-    </div>
+                    template: `
+    <div class="flex flex-col md:flex-row gap-4">
+      <div class="md:w-1/2">
+        <div class="card flex flex-col gap-4">
+          <div class="font-semibold text-xl">{{ 'config.profile' | translate }}</div>
+          <div class="flex justify-content-end flex-wrap">
+            {{ userService.userName }}
+          </div>
+          <label>
+            {{ 'config.photo' | translate }}
+            <span
+              class="pi pi-question-circle"
+              pTooltip="{{ 'config.usePhoto256x256Pixel' | translate }}"
+              tooltipPosition="right"></span>
+          </label>
+          <div class="flex justify-content-end flex-wrap">
+            <user-profile></user-profile>
+          </div>
+        </div>
+      </div>
+      <div class="md:w-1/2">
+        <div class="card flex flex-col gap-4">
+          <div class="font-semibold text-xl">{{ 'config.localization' | translate }}</div>
+          <label> {{ 'config.selectLanguage' | translate }} </label>
+          <div class="flex justify-content-end flex-wrap">
+            <p-select
+              class="w-full md:w-56"
+              optionLabel="name"
+              optionValue="code"
+              qa-id="oip-app-config-language-select"
+              [options]="l10nService.availableLanguages"
+              [(ngModel)]="selectedLanguage"
+              (onChange)="changeLanguage()">
+              <ng-template #selectedItem let-selectedOption>
+                <div class="flex items-center gap-2">
+                  <span [class]="selectedOption.icon"></span>
+                  <div>{{ selectedOption.name }}</div>
+                </div>
+              </ng-template>
+              <ng-template #item let-languages>
+                <div class="flex items-center gap-2">
+                  <span [class]="languages.icon"></span>
+                  <div>{{ languages.name }}</div>
+                </div>
+              </ng-template>
+            </p-select>
+          </div>
+          <div class="flex flex-col gap-5">
+            <div class="mt-5">{{ 'config.dateTimeFormat' | translate }}</div>
+            <p-select
+              class="w-full md:w-56"
+              qa-id="oip-app-config-date-format-select"
+              [options]="dateFormats"
+              [placeholder]="'config.dateFormat' | translate"
+              [(ngModel)]="selectedDateFormat"
+              (onChange)="changeDateFormat()" />
+            <p-select
+              class="w-full md:w-56"
+              qa-id="oip-app-config-time-format-select"
+              [options]="timeFormats"
+              [placeholder]="'config.timeFormat' | translate"
+              [(ngModel)]="selectedTimeFormat"
+              (onChange)="changeTimeFormat()" />
+            <div class="mt-5">{{ 'config.timeZone' | translate }}</div>
+            <p-select
+              class="w-full md:w-56"
+              qa-id="oip-app-config-timezone-select"
+              [filter]="true"
+              [options]="allTimeZones"
+              [placeholder]="'config.timeZone' | translate"
+              [virtualScroll]="true"
+              [virtualScrollItemSize]="34"
+              [(ngModel)]="selectedTimeZone"
+              (onChange)="changeTimeZone()" />
+          </div>
+        </div>
+      </div>
+      @if (securityService.isAdmin()) {
+        <div class="md:w-1/2">
+          <div class="card flex flex-col gap-4">
+            <div class="font-semibold text-xl">{{ 'config.menu' | translate }}</div>
+            <div class="flex items-center gap-2">
+              <label for="oip-app-config-admin-mode">{{ 'config.all' | translate }}</label>
+              <p-toggle-switch
+                id="oip-app-config-admin-mode"
+                [(ngModel)]="menuService.adminMode"
+                (onChange)="onSwitchChange()"></p-toggle-switch>
+            </div>
+            <div class="flex items-center gap-2">
+              <label for="oip-app-config-admin-mode">{{ 'config.moduleManagement' | translate }}</label>
+              <p-button icon="pi pi-cog" label="{{ 'config.goTo' | translate }}" routerLink="/modules" />
+            </div>
+          </div>
+        </div>
+      }
+    </div>
   `,
                     imports: [
                         ProfileComponent,
@@ -4196,11 +5161,11 @@ class DbMigrationComponent extends BaseModuleComponent {
         });
     }
     async getData() {
-        return this.baseDataService.sendRequest(`api/${this.controller}/get-migrations`, 'GET');
+        return this.getMigrations();
     }
     async applyMigration(rowData) {
         const request = { name: rowData.name };
-        return this.baseDataService.sendRequest(`api/${this.controller}/apply-migration`, 'POST', request);
+        return this.applyModuleMigration(request);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DbMigrationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DbMigrationComponent, isStandalone: true, selector: "db-migration", providers: [ConfirmationService], usesInheritance: true, ngImport: i0, template: `
@@ -4281,7 +5246,7 @@ class DbMigrationComponent extends BaseModuleComponent {
     } @else if (isSecurity) {
       <security [controller]="controller" [id]="id"/>
     }
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$6.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$6.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1$6.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$6.CancelEditableRow, selector: "[pCancelEditableRow]" }, { kind: "component", type: i1$6.ColumnFilter, selector: "p-columnFilter, p-column-filter, p-columnfilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "filterOn", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: SecurityComponent, selector: "security", inputs: ["id", "controller"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$7.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$7.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1$7.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$7.CancelEditableRow, selector: "[pCancelEditableRow]" }, { kind: "component", type: i1$7.ColumnFilter, selector: "p-columnFilter, p-column-filter, p-columnfilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "filterOn", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: SecurityComponent, selector: "security", inputs: ["id", "controller"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DbMigrationComponent, decorators: [{
             type: Component,
@@ -4429,57 +5394,61 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 
 class AppModulesComponent {
     constructor() {
-        this.dataService = inject(BaseDataService);
         this.modules = [];
         this.msgService = inject(MsgService);
         this.confirmationService = inject(ConfirmationService);
         this.l10nService = inject(L10nService);
-        this.l10n = {};
         this.titleService = inject(AppTitleService);
         this.moduleService = inject(ModuleApi);
+        this.translationsReady = firstValueFrom(this.l10nService.loadComponentTranslations('app-modules'));
     }
     async ngOnInit() {
-        this.l10nService.get('app-modules').subscribe((l10n) => {
-            this.l10n = l10n;
-        });
-        this.titleService.setTitle(this.l10n.title);
+        await this.translationsReady;
+        this.titleService.setTitle(this.t('app-modules.title'));
         await this.refreshAction();
     }
     async refreshAction() {
         this.modules = await this.moduleService.getModulesWithLoadStatus();
     }
-    deleteModule(module) {
+    async deleteModule(module) {
+        await this.translationsReady;
         this.confirmationService.confirm({
-            header: this.l10n.confirm.header,
-            message: this.l10n.confirm.message,
+            header: this.t('app-modules.confirm.header'),
+            message: this.t('app-modules.confirm.message'),
             icon: 'pi pi-trash',
             rejectButtonProps: {
-                label: this.l10n.confirm.cancel,
+                label: this.t('app-modules.confirm.cancel'),
                 severity: 'secondary',
                 outlined: true
             },
             acceptButtonProps: {
-                label: this.l10n.confirm.delete,
+                label: this.t('app-modules.confirm.delete'),
                 severity: 'danger'
             },
             accept: async () => {
-                this.dataService
-                    .sendRequest(`api/module/delete`, 'DELETE', {
-                    moduleId: module.moduleId
-                })
-                    .then(() => this.refreshAction())
-                    .catch((error) => console.error(error));
-                this.msgService.success(this.l10n.messages.deleteSuccess);
+                try {
+                    await this.moduleService.delete({
+                        moduleId: module.moduleId
+                    });
+                    await this.refreshAction();
+                    this.msgService.success(this.t('app-modules.messages.deleteSuccess'));
+                }
+                catch (error) {
+                    this.msgService.error(error);
+                }
             }
         });
     }
+    t(key) {
+        return this.l10nService.instant(key);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppModulesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: AppModulesComponent, isStandalone: true, selector: "app-modules", providers: [ConfirmationService, ModuleApi], ngImport: i0, template: `
     <p-confirmDialog></p-confirmDialog>
     <div class="flex flex-col md:flex-row gap-4">
       <div class="card w-full">
         <div class="font-semibold text-xl mb-4">
-          {{ l10n.title }}
+          {{ 'app-modules.title' | translate }}
         </div>
         <div class="mb-4">
           <p-toolbar>
@@ -4528,7 +5497,7 @@ class AppModulesComponent {
         </p-table>
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$6.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i4$1.Toolbar, selector: "p-toolbar", inputs: ["styleClass", "ariaLabelledBy"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$7.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i4$2.Toolbar, selector: "p-toolbar", inputs: ["styleClass", "ariaLabelledBy"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppModulesComponent, decorators: [{
             type: Component,
@@ -4541,7 +5510,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
     <div class="flex flex-col md:flex-row gap-4">
       <div class="card w-full">
         <div class="font-semibold text-xl mb-4">
-          {{ l10n.title }}
+          {{ 'app-modules.title' | translate }}
         </div>
         <div class="mb-4">
           <p-toolbar>
@@ -4592,7 +5561,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
     </div>
   `
                 }]
-        }] });
+        }], ctorParameters: () => [] });
 
 /* eslint-disable */
 /* tslint:disable */
@@ -4600,17 +5569,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 class DiscussionApi extends HttpClient {
     constructor() {
         super(...arguments);
-        /**
-         * @description Gets comments by object type and object identifier.
-         *
-         * @tags Discussion
-         * @name getByObject
-         * @summary Gets comments by object type and object identifier.
-         * @request GET:/api/discussion/get-by-object
-         * @secure
-         * @response `200` `(CommentDto)[]` OK
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         */
         this.getByObject = (query, params = {}) => this.request({
             path: `/api/discussion/get-by-object`,
             method: "GET",
@@ -4619,18 +5577,6 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Gets a comment by identifier.
-         *
-         * @tags Discussion
-         * @name getById
-         * @summary Gets a comment by identifier.
-         * @request GET:/api/discussion/get-by-id
-         * @secure
-         * @response `200` `CommentDto` OK
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.getById = (query, params = {}) => this.request({
             path: `/api/discussion/get-by-id`,
             method: "GET",
@@ -4639,18 +5585,6 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Creates a new comment
-         *
-         * @tags Discussion
-         * @name create
-         * @summary Creates a new comment
-         * @request POST:/api/discussion/create
-         * @secure
-         * @response `200` `CommentDto` OK
-         * @response `400` `ApiExceptionResponse` Bad Request
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         */
         this.create = (data, params = {}) => this.request({
             path: `/api/discussion/create`,
             method: "POST",
@@ -4660,20 +5594,6 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Updates an existing comment.
-         *
-         * @tags Discussion
-         * @name update
-         * @summary Updates an existing comment.
-         * @request PUT:/api/discussion/update/{id}
-         * @secure
-         * @response `200` `CommentDto` OK
-         * @response `400` `ApiExceptionResponse` Bad Request
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `403` `ApiExceptionResponse` Forbidden
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.update = ({ id, ...query }, data, params = {}) => this.request({
             path: `/api/discussion/update/${id}`,
             method: "PUT",
@@ -4683,37 +5603,12 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Soft deletes a comment.
-         *
-         * @tags Discussion
-         * @name delete
-         * @summary Soft deletes a comment.
-         * @request DELETE:/api/discussion/delete/{id}
-         * @secure
-         * @response `204` `void` No Content
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `403` `ApiExceptionResponse` Forbidden
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.delete = ({ id, ...query }, params = {}) => this.request({
             path: `/api/discussion/delete/${id}`,
             method: "DELETE",
             secure: true,
             ...params,
         });
-        /**
-         * @description Gets edit history for a comment.
-         *
-         * @tags Discussion
-         * @name getHistory
-         * @summary Gets edit history for a comment.
-         * @request GET:/api/discussion/get-history/{id}
-         * @secure
-         * @response `200` `(CommentHistoryDto)[]` OK
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.getHistory = ({ id, ...query }, params = {}) => this.request({
             path: `/api/discussion/get-history/${id}`,
             method: "GET",
@@ -4721,20 +5616,6 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Uploads an attachment for a comment.
-         *
-         * @tags Discussion
-         * @name uploadAttachment
-         * @summary Uploads an attachment for a comment.
-         * @request POST:/api/discussion/upload-attachment
-         * @secure
-         * @response `200` `AttachmentDto` OK
-         * @response `400` `ApiExceptionResponse` Bad Request
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `403` `ApiExceptionResponse` Forbidden
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.uploadAttachment = (data, params = {}) => this.request({
             path: `/api/discussion/upload-attachment`,
             method: "POST",
@@ -4744,56 +5625,18 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Deletes an attachment.
-         *
-         * @tags Discussion
-         * @name deleteAttachment
-         * @summary Deletes an attachment.
-         * @request DELETE:/api/discussion/delete-attachment/{id}
-         * @secure
-         * @response `204` `void` No Content
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `403` `ApiExceptionResponse` Forbidden
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.deleteAttachment = ({ id, ...query }, params = {}) => this.request({
             path: `/api/discussion/delete-attachment/${id}`,
             method: "DELETE",
             secure: true,
             ...params,
         });
-        /**
-         * @description Downloads attachment content.
-         *
-         * @tags Discussion
-         * @name getAttachmentContent
-         * @summary Downloads attachment content.
-         * @request GET:/api/discussion/get-attachment-content/{id}
-         * @secure
-         * @response `200` `void` OK
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.getAttachmentContent = ({ id, ...query }, params = {}) => this.request({
             path: `/api/discussion/get-attachment-content/${id}`,
             method: "GET",
             secure: true,
             ...params,
         });
-        /**
-         * @description Adds or toggles a reaction for a comment.
-         *
-         * @tags Discussion
-         * @name addReaction
-         * @summary Adds or toggles a reaction for a comment.
-         * @request POST:/api/discussion/add-reaction
-         * @secure
-         * @response `200` `(CommentReactionDto)[]` OK
-         * @response `400` `ApiExceptionResponse` Bad Request
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.addReaction = (data, params = {}) => this.request({
             path: `/api/discussion/add-reaction`,
             method: "POST",
@@ -4803,18 +5646,6 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Removes a reaction from a comment.
-         *
-         * @tags Discussion
-         * @name removeReaction
-         * @summary Removes a reaction from a comment.
-         * @request DELETE:/api/discussion/remove-reaction
-         * @secure
-         * @response `200` `(CommentReactionDto)[]` OK
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         * @response `404` `ApiExceptionResponse` Not Found
-         */
         this.removeReaction = (query, params = {}) => this.request({
             path: `/api/discussion/remove-reaction`,
             method: "DELETE",
@@ -4823,18 +5654,6 @@ class DiscussionApi extends HttpClient {
             format: "json",
             ...params,
         });
-        /**
-         * @description Searches users that can be mentioned in a comment.
-         *
-         * @tags Discussion
-         * @name searchMentionUsers
-         * @summary Searches users that can be mentioned in a comment.
-         * @request GET:/api/discussion/search-mention-users
-         * @secure
-         * @response `200` `(MentionUserDto)[]` OK
-         * @response `400` `ApiExceptionResponse` Bad Request
-         * @response `401` `ApiExceptionResponse` Unauthorized
-         */
         this.searchMentionUsers = (query, params = {}) => this.request({
             path: `/api/discussion/search-mention-users`,
             method: "GET",
@@ -5597,7 +6416,7 @@ class DiscussionComponent {
         </div>
       }
     </section>
-  `, isInline: true, styles: [":host{display:block}.file-trigger{position:relative;display:inline-flex}.file-trigger input{position:absolute;inset:0;opacity:0;cursor:pointer}.markdown-preview,.history-markdown{word-break:break-word}.markdown-preview :is(h1,h2,h3),.history-markdown :is(h1,h2,h3){margin:0 0 .75rem;font-weight:600}.markdown-preview a,.history-markdown a{color:#2563eb;text-decoration:underline;text-underline-offset:.18em}.emoji-popover{display:flex;flex-wrap:wrap;gap:.5rem;max-width:16rem}.emoji-option{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;font-size:1.25rem;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i2$2.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "directive", type: i2$6.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i5.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "ngmodule", type: DividerModule }, { kind: "ngmodule", type: PanelModule }, { kind: "component", type: i6.Panel, selector: "p-panel", inputs: ["id", "toggleable", "header", "collapsed", "styleClass", "iconPos", "showHeader", "toggler", "transitionOptions", "toggleButtonProps"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i7.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i8.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i9.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "directive", type: Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block}.file-trigger{position:relative;display:inline-flex}.file-trigger input{position:absolute;inset:0;opacity:0;cursor:pointer}.markdown-preview,.history-markdown{word-break:break-word}.markdown-preview :is(h1,h2,h3),.history-markdown :is(h1,h2,h3){margin:0 0 .75rem;font-weight:600}.markdown-preview a,.history-markdown a{color:#2563eb;text-decoration:underline;text-underline-offset:.18em}.emoji-popover{display:flex;flex-wrap:wrap;gap:.5rem;max-width:16rem}.emoji-option{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;font-size:1.25rem;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i2$2.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i5$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "ngmodule", type: DividerModule }, { kind: "ngmodule", type: PanelModule }, { kind: "component", type: i6.Panel, selector: "p-panel", inputs: ["id", "toggleable", "header", "collapsed", "styleClass", "iconPos", "showHeader", "toggler", "transitionOptions", "toggleButtonProps"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i7.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i9.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "directive", type: Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DiscussionComponent, decorators: [{
             type: Component,
@@ -6123,31 +6942,14 @@ class AuthGuardService {
      *
      * @returns {Observable<boolean | UrlTree>} A stream resolving to true (allow), or UrlTree (redirect).
      */
-    canActivate() {
-        return combineLatest([this.oidcSecurityService.isAuthenticated(), this.oidcSecurityService.isTokenExpired()]).pipe(switchMap(([authenticated, tokenExpired]) => {
-            if (!authenticated) {
-                return of(this.router.parseUrl('/unauthorized'));
-            }
-            if (!tokenExpired) {
-                return of(true);
-            }
-            // Token is expired; attempt to refresh
-            return this.tryRefreshToken();
-        }));
+    canActivate(returnUrl = '/') {
+        this.oidcSecurityService.auth();
+        return this.oidcSecurityService.isAuthenticated().pipe(map((authenticated) => authenticated
+            ? true
+            : this.router.createUrlTree(['/unauthorized'], { queryParams: { returnUrl: this.getReturnUrl(returnUrl) } })));
     }
-    /**
-     * Attempts to refresh the session using the refresh token.
-     * If successful, allows route activation; otherwise, redirects to `/unauthorized`.
-     *
-     * @returns {boolean | UrlTree} A stream resolving to true or redirect UrlTree.
-     */
-    tryRefreshToken() {
-        return this.oidcSecurityService.forceRefreshSession().pipe(map((refreshSuccess) => {
-            return refreshSuccess ? true : this.router.parseUrl('/unauthorized');
-        }), catchError((err) => {
-            console.warn(err);
-            return of(this.router.parseUrl('/unauthorized'));
-        }));
+    getReturnUrl(returnUrl) {
+        return returnUrl.startsWith('/unauthorized') ? '/' : returnUrl;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AuthGuardService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AuthGuardService }); }
@@ -6156,80 +6958,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             type: Injectable
         }] });
 
-class SecurityStorageService {
-    read(key) {
-        return localStorage.getItem(key);
-    }
-    write(key, value) {
-        localStorage.setItem(key, value);
-    }
-    remove(key) {
-        localStorage.removeItem(key);
-    }
-    clear() {
-        localStorage.clear();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityStorageService }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurityStorageService, decorators: [{
-            type: Injectable
-        }] });
-
-class NotificationService {
-    constructor() {
-        this.securityService = inject(SecurityService);
-        this.msgService = inject(MsgService);
-        this.frontendConfig = inject(OIP_FRONTEND_CONFIG);
-        this.securityData = null;
-        this.connection = new signalR.HubConnectionBuilder()
-            .withUrl(this.resolveHubUrl(), {
-            accessTokenFactory: () => this.securityData ?? '',
-            skipNegotiation: true,
-            transport: signalR.HttpTransportType.WebSockets
-        })
-            .configureLogging(signalR.LogLevel.Error)
-            .build();
-        this.connection.on('ReceiveNotification', (notification) => {
-            const opt = {
-                severity: notification.severity,
-                summary: notification.subject,
-                detail: notification.message,
-                life: 0
-            };
-            this.msgService.add(opt);
-        });
-        this.securityService.getAccessToken().subscribe((token) => {
-            this.securityData = token;
-            if (!token) {
-                return;
-            }
-            if (this.connection.state === signalR.HubConnectionState.Disconnected) {
-                this.connection.start().catch((error) => console.error('Failed to start notification connection', error));
-                return;
-            }
-            this.connection.stop().then(() => {
-                this.connection.start().catch((error) => console.error('Failed to restart notification connection', error));
-            });
-        });
-    }
-    resolveHubUrl() {
-        if (this.frontendConfig.notificationHubUrl) {
-            return this.frontendConfig.notificationHubUrl;
-        }
-        if (this.frontendConfig.apiBaseUrl) {
-            return `${this.frontendConfig.apiBaseUrl.replace(/\/$/, '')}/hubs/notification`;
-        }
-        return '/hubs/notification';
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [] });
-
 /**
  * Prime-ng table filter service
  */
@@ -6304,73 +7032,96 @@ function replaceDefaults(themes) {
 
 const langIntercept = (req, next) => {
     const layoutService = inject(LayoutService);
+    const securityService = inject(SecurityService);
     const lang = layoutService.language() ? layoutService.language() : 'en';
-    const httpHeaders = req.headers.set('Accept-language', lang);
-    const authReq = req.clone({
-        headers: httpHeaders
+    const headers = req.headers
+        .set('Accept-language', lang)
+        .set('X-Timezone', layoutService.timeZone());
+    const reqWithCredentials = req.clone({
+        headers,
+        withCredentials: true
     });
-    return next(authReq);
+    if (!['POST', 'PUT', 'PATCH', 'DELETE'].includes(req.method.toUpperCase())) {
+        return next(reqWithCredentials);
+    }
+    if (req.url.includes('/api/security/create-auth-session') || req.url.includes('/api/security/get-auth-csrf-token')) {
+        return next(reqWithCredentials);
+    }
+    return securityService.getCsrfToken().pipe(take(1), switchMap((csrfToken) => next(csrfToken?.token
+        ? reqWithCredentials.clone({
+            headers: reqWithCredentials.headers.set(csrfToken.headerName, csrfToken.token)
+        })
+        : reqWithCredentials)));
 };
 
-class SecurePipe {
+const httpLoaderFactory = (http) => new TranslateHttpLoader(http);
+function provideOip() {
+    return makeEnvironmentProviders([
+        provideHttpClient(withInterceptors([langIntercept]), withFetch()),
+        { provide: LocationStrategy, useClass: PathLocationStrategy },
+        { provide: SecurityService, useClass: BffSecurityService },
+        AuthGuardService,
+        MessageService,
+        UserService,
+        NotificationService,
+        UserProfileApi,
+        SecurityApi,
+        NotificationApi,
+        importProvidersFrom([
+            TranslateModule.forRoot({
+                loader: {
+                    provide: TranslateLoader,
+                    useFactory: httpLoaderFactory,
+                    deps: [HttpClient$1]
+                }
+            })
+        ])
+    ]);
+}
+
+/* eslint-disable */
+/* tslint:disable */
+// @ts-nocheck
+class FolderModuleApi extends HttpClient {
     constructor() {
-        this.http = inject(HttpClient$1);
-        this.sanitizer = inject(DomSanitizer);
-    }
-    transform(url) {
-        return this.http
-            .get(url, { responseType: 'blob' })
-            .pipe(map$1((val) => this.sanitizer.bypassSecurityTrustUrl(URL.createObjectURL(val))));
+        super(...arguments);
+        this.getModuleInstanceSettings = (query, params = {}) => this.request({
+            path: `/api/folder-module/get-module-instance-settings`,
+            method: "GET",
+            query: query,
+            secure: true,
+            format: "json",
+            ...params,
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: SecurePipe, isStandalone: true, name: "secure" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FolderModuleApi, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FolderModuleApi }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SecurePipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    standalone: true,
-                    name: 'secure'
-                }]
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FolderModuleApi, decorators: [{
+            type: Injectable
         }] });
 
-const appendCurrentOriginSecureRoute = (secureRoutes) => {
-    const currentOriginRoute = `${window.location.origin}/`;
-    return Array.from(new Set([...(secureRoutes ?? []), currentOriginRoute]));
-};
-/**
- * Load keycloak settings from backend and save to sessionStorage
- * @param httpClient
- * @returns StsConfigHttpLoader
- */
-const httpLoaderAuthFactory = (httpClient) => {
-    const KEYCLOAK_SETTINGS_KEY = 'keycloak-client-settings';
-    const settingsStings = sessionStorage.getItem(KEYCLOAK_SETTINGS_KEY);
-    if (settingsStings) {
-        const config$ = new Observable((subscribe) => {
-            subscribe.next(JSON.parse(settingsStings));
+/* eslint-disable */
+/* tslint:disable */
+// @ts-nocheck
+class IframeModuleApi extends HttpClient {
+    constructor() {
+        super(...arguments);
+        this.getModuleInstanceSettings = (query, params = {}) => this.request({
+            path: `/api/iframe-module/get-module-instance-settings`,
+            method: "GET",
+            query: query,
+            secure: true,
+            format: "json",
+            ...params,
         });
-        return new StsConfigHttpLoader(config$);
-    }
-    else {
-        const config$ = httpClient.get(`api/security/get-keycloak-client-settings`).pipe(map$1((config) => {
-            const authConfig = {
-                authority: config.authority,
-                redirectUrl: window.location.origin,
-                postLogoutRedirectUri: window.location.origin,
-                clientId: config.clientId,
-                scope: config.scope,
-                responseType: config.responseType,
-                useRefreshToken: config.useRefreshToken,
-                silentRenew: config.silentRenew,
-                logLevel: config.logLevel,
-                secureRoutes: appendCurrentOriginSecureRoute(config.secureRoutes)
-            };
-            sessionStorage.setItem(KEYCLOAK_SETTINGS_KEY, JSON.stringify(authConfig));
-            return authConfig;
-        }));
-        return new StsConfigHttpLoader(config$);
     }
-};
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IframeModuleApi, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IframeModuleApi }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IframeModuleApi, decorators: [{
+            type: Injectable
+        }] });
 
 // Components
 
@@ -6378,5 +7129,5 @@ const httpLoaderAuthFactory = (httpClient) => {
  * Generated bundle index. Do not edit.
  */
 
-export { APP_THEME_PRESETS, APP_THEME_PRESETS_MERGE_MODE, AppConfiguratorComponent, AppFloatingConfiguratorComponent, AppLayoutComponent, AppModulesComponent, AppTopbar, AuthGuardService, BaseDataService, BaseModuleComponent, ConfigComponent, ContentType, DEFAULT_OIP_FRONTEND_CONFIG, DbMigrationComponent, DiscussionComponent, ErrorComponent, FooterComponent, HttpClient, IframeModuleComponent, KeycloakSecurityService, L10nService, LOGO_COMPONENT_TOKEN, LayoutService, LogoComponent, LogoService, MenuComponent, MenuService, MsgService, NotfoundComponent, NotificationService, OIP_FRONTEND_CONFIG, ProfileComponent, SecurePipe, SecurityComponent, SecurityDataService, SecurityService, SecurityStorageService, SidebarComponent, TableFilterService, TopBarService, UnauthorizedComponent, UserService, httpLoaderAuthFactory, langIntercept, mergeWithDefaults, provideAppThemes, provideLogoComponent, replaceDefaults };
+export { APP_THEME_PRESETS, APP_THEME_PRESETS_MERGE_MODE, AppConfiguratorComponent, AppFloatingConfiguratorComponent, AppLayoutComponent, AppModulesComponent, AppTopbar, AuthGuardService, BaseModuleComponent, BffSecurityService, ConfigComponent, ContentType, DbMigrationComponent, DiscussionComponent, ErrorComponent, FolderModuleApi, FooterComponent, HttpClient, IframeModuleApi, IframeModuleComponent, KeycloakSecurityService, L10nService, LOGO_COMPONENT_TOKEN, LayoutService, LogoComponent, LogoService, MenuComponent, MenuService, MsgService, NotfoundComponent, NotificationApi, NotificationService, ProfileComponent, SecurityApi, SecurityComponent, SecurityService, SidebarComponent, TableFilterService, TopBarService, UnauthorizedComponent, UserNotificationsComponent, UserProfileApi, UserService, convertToPrimeNgDateFormat, langIntercept, mergeWithDefaults, provideAppThemes, provideLogoComponent, provideOip, replaceDefaults };
 //# sourceMappingURL=oip-common.mjs.map