@open-rlb/ng-app 3.1.11 → 3.1.12

package/fesm2022/open-rlb-ng-app.mjs

@@ -1,7 +1,7 @@
-import * as i1$3 from '@angular/common/http';
+import * as i1$2 from '@angular/common/http';
 import { HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Inject, Optional, EventEmitter, importProvidersFrom, makeStateKey, makeEnvironmentProviders, Pipe, Input, Component, PLATFORM_ID, NgModule, Directive, inject, isDevMode, provideAppInitializer } from '@angular/core';
+import { InjectionToken, Injectable, Inject, Optional, inject, EventEmitter, importProvidersFrom, makeStateKey, makeEnvironmentProviders, Pipe, Input, Component, PLATFORM_ID, NgModule, Directive, isDevMode, provideAppInitializer } from '@angular/core';
 import * as i2 from '@angular/router';
 import { NavigationEnd, RoutesRecognized, RouterModule, Router, provideRouter } from '@angular/router';
 import * as i1$4 from '@angular/service-worker';
@@ -9,15 +9,17 @@ import { provideServiceWorker } from '@angular/service-worker';
 import * as i1$8 from '@ngrx/effects';
 import { createEffect, ofType, provideEffects } from '@ngrx/effects';
 import * as i1$1 from '@ngrx/store';
-import { createActionGroup, props, emptyProps, Store, createFeature, createReducer, on, provideStore, provideState } from '@ngrx/store';
+import { createActionGroup, props, emptyProps, createFeature, createReducer, on, provideStore, provideState } from '@ngrx/store';
 import * as i2$1 from '@open-rlb/ng-bootstrap';
 import { RLB_TRANSLATION_SERVICE, RlbBootstrapModule, ModalDirective, ToastDirective, ModalRegistryOptions, ToastRegistryOptions, provideRlbBootstrap } from '@open-rlb/ng-bootstrap';
 import * as i1$5 from 'angular-auth-oidc-client';
 import { AbstractLoggerService, AuthModule, provideAuth, AuthInterceptor, AbstractSecurityStorage } from 'angular-auth-oidc-client';
 import * as i1 from 'ngx-cookie-service-ssr';
 import { filter, switchMap, map, BehaviorSubject, of, share, lastValueFrom, from, zip, EMPTY, catchError, Observable, tap, shareReplay, distinctUntilChanged, take } from 'rxjs';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import * as i1$2 from '@ngx-translate/core';
+import { signalStore, withState, withMethods, patchState } from '@ngrx/signals';
+import { tapResponse } from '@ngrx/operators';
+import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
+import * as i1$3 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
 import { provideTranslateHttpLoader } from '@ngx-translate/http-loader';
 import * as i1$6 from '@angular/common';
@@ -409,6 +411,73 @@ const initialAclState = {
     error: null
 };
 
+class AdminApiService {
+    constructor(httpClient, config, aclConfig) {
+        this.httpClient = httpClient;
+        this.config = config;
+        this.aclConfig = aclConfig;
+    }
+    resourcesByUser$() {
+        if (!this.aclConfig) {
+            throw new Error("ACL configuration is missing. Provide 'acl' in ProjectConfiguration.");
+        }
+        const endpoint = this.config.endpoints?.[this.aclConfig.endpointKey];
+        if (!endpoint) {
+            throw new Error(`Endpoint '${this.aclConfig.endpointKey}' not found in configuration.`);
+        }
+        const url = `${endpoint.baseUrl}/${this.aclConfig.path}`;
+        return this.httpClient.get(url).pipe(
+        //this.errorManagementService.manageUI('error', 'dialog')
+        );
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AdminApiService, deps: [{ token: i1$2.HttpClient }, { token: RLB_CFG, optional: true }, { token: RLB_CFG_ACL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AdminApiService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AdminApiService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [RLB_CFG]
+                }] }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [RLB_CFG_ACL]
+                }] }] });
+
+//import { ErrorManagementService } from "../../services/errors/error-management.service";
+const AclStore = signalStore({ providedIn: 'root' }, withState(initialAclState), withMethods((store, adminApi = inject(AdminApiService)) => ({
+    // REUSABLE LOGIC: Will be used in guard
+    hasPermission: (resourceName, action) => {
+        const resources = store.resources();
+        if (!resources)
+            return false;
+        return resources.some(product => product.resources.some(res => {
+            const matchName = res.resourceId === resourceName || res.resourceName === resourceName;
+            if (!action)
+                return matchName;
+            return matchName && res.actions.includes(action);
+        }));
+    },
+    // Replaces legacy ngrx action and the effect
+    loadACL() {
+        patchState(store, { loading: true, loaded: false });
+        return adminApi.resourcesByUser$().pipe(
+        //errorManagement.manageUI('error', 'dialog'),
+        tapResponse({
+            next: (resources) => patchState(store, { resources, loaded: true, loading: false }),
+            error: (error) => {
+                console.error('ACL Load Failed', error);
+                patchState(store, { error, loaded: true, loading: false });
+            },
+        }));
+    },
+    reset: () => patchState(store, initialAclState)
+})));
+
 class AbstractSupportService {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AbstractSupportService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AbstractSupportService }); }
@@ -747,13 +816,13 @@ class LanguageService {
             default: return '';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: LanguageService, deps: [{ token: i1$2.TranslateService }, { token: CookiesService }, { token: RLB_CFG_I18N, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: LanguageService, deps: [{ token: i1$3.TranslateService }, { token: CookiesService }, { token: RLB_CFG_I18N, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: LanguageService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: LanguageService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }, { type: CookiesService }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$3.TranslateService }, { type: CookiesService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [RLB_CFG_I18N]
                 }, {
@@ -959,7 +1028,7 @@ class StrapiService {
         }));
         return this.cache.getData(__r, `strapiPage/${lang}/${cid}`, this.cmsOptions.chacheDuration || 3600);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: StrapiService, deps: [{ token: i1$3.HttpClient }, { token: LocalCacheService }, { token: RLB_CFG_CMS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: StrapiService, deps: [{ token: i1$2.HttpClient }, { token: LocalCacheService }, { token: RLB_CFG_CMS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: StrapiService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: StrapiService, decorators: [{
@@ -967,7 +1036,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1$3.HttpClient }, { type: LocalCacheService }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: LocalCacheService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [RLB_CFG_CMS]
                 }, {
@@ -1065,13 +1134,13 @@ class RlbTranslateAdapterService {
     instant(key, params) {
         return this.translateService.instant(key, params);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: RlbTranslateAdapterService, deps: [{ token: i1$2.TranslateService }, { token: i2$1.UniqueIdService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: RlbTranslateAdapterService, deps: [{ token: i1$3.TranslateService }, { token: i2$1.UniqueIdService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: RlbTranslateAdapterService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: RlbTranslateAdapterService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }, { type: i2$1.UniqueIdService }] });
+        }], ctorParameters: () => [{ type: i1$3.TranslateService }, { type: i2$1.UniqueIdService }] });
 
 function provideRlbI18n(i18n) {
     if (!i18n)
@@ -1380,43 +1449,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
                 }]
         }] });
 
-class AdminApiService {
-    constructor(httpClient, config, aclConfig) {
-        this.httpClient = httpClient;
-        this.config = config;
-        this.aclConfig = aclConfig;
-    }
-    resourcesByUser$() {
-        if (!this.aclConfig) {
-            throw new Error("ACL configuration is missing. Provide 'acl' in ProjectConfiguration.");
-        }
-        const endpoint = this.config.endpoints?.[this.aclConfig.endpointKey];
-        if (!endpoint) {
-            throw new Error(`Endpoint '${this.aclConfig.endpointKey}' not found in configuration.`);
-        }
-        const url = `${endpoint.baseUrl}/${this.aclConfig.path}`;
-        return this.httpClient.get(url).pipe(
-        //this.errorManagementService.manageUI('error', 'dialog')
-        );
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AdminApiService, deps: [{ token: i1$3.HttpClient }, { token: RLB_CFG, optional: true }, { token: RLB_CFG_ACL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AdminApiService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AdminApiService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$3.HttpClient }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [RLB_CFG]
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [RLB_CFG_ACL]
-                }] }] });
-
 class AuthenticationService {
     constructor(oidcSecurityService, cookiesService, router, parseJwtService, store, log, localStorage, adminApi, envConfig, authConfig, appconfig) {
         this.oidcSecurityService = oidcSecurityService;
@@ -1430,6 +1462,7 @@ class AuthenticationService {
         this.envConfig = envConfig;
         this.authConfig = authConfig;
         this.appconfig = appconfig;
+        this.aclStore = inject(AclStore);
         this.logger = this.log.for(this.constructor.name);
         this.logger.log('AuthenticationService initialized');
     }
@@ -1450,13 +1483,9 @@ class AuthenticationService {
                 this.store.dispatch(AuthActions.setCurrentProvider({
                     currentProvider: authenticatedConfig.configId
                 }));
-                // Only fetch ACL if config is provided
                 if (this.appconfig.acl) {
-                    this.store.dispatch(AclActions.loadACL());
-                    return this.adminApi.resourcesByUser$().pipe(tap(resources => {
-                        this.store.dispatch(AclActions.loadACLSuccess({ resources }));
-                        this.handleRedirect();
-                    }), map(() => responses), catchError(() => of(responses)));
+                    // SignalStore methods can trigger the API call
+                    return this.aclStore.loadACL().pipe(tap(() => this.handleRedirect()), map(() => responses));
                 }
                 else {
                     this.handleRedirect();
@@ -1703,7 +1732,7 @@ class CmsComponent {
         return md;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: CmsComponent, deps: [{ token: StrapiService }, { token: LanguageService }, { token: RLB_CFG_CMS, optional: true }, { token: AbstractMdService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: CmsComponent, isStandalone: false, selector: "rlb-cms-template", inputs: { contentId: "contentId", breadcrumb: "breadcrumb" }, ngImport: i0, template: "<div>\n  @if (page) {\n    <div class=\"container\">\n      @if (breadcrumb) {\n        <div class=\"row my-4\">\n          <div class=\"col-12\">\n            <rlb-breadcrumb [items]=\"breadcrumb\"></rlb-breadcrumb>\n          </div>\n        </div>\n      }\n      <div class=\"row my-4\">\n        <div class=\"col-12\">\n          <h1 class=\"text-center\">{{page.Title}}</h1>\n        </div>\n      </div>\n      @if (page.Content) {\n        <div class=\"row my-4\">\n          <div class=\"col-12\">\n            <div [innerHTML]=\"page.Content \"></div>\n          </div>\n        </div>\n      }\n      @if (page.page_tabs.length>0) {\n        <div class=\"row my-4\">\n          <div class=\"col-12\">\n            <rlb-tabs>\n              @for (tab of page.page_tabs; track tab.id; let i = $index) {\n                <rlb-tab [target]=\"'cms-tab-'+i\">\n                  {{tab.Title}}\n                </rlb-tab>\n              }\n            </rlb-tabs>\n            <rlb-tab-content>\n              @for (tab of page.page_tabs; track tab.id; let i = $index) {\n                <rlb-tab-pane [id]=\"'cms-tab-'+i\">\n                  <div class=\"container-fluid\">\n                    @if (tab.Content) {\n                      <div class=\"row my-4\">\n                        <div class=\"col-12\">\n                          <div [innerHTML]=\"tab.Content \"></div>\n                        </div>\n                      </div>\n                    }\n                    @for (step of tab.steps; track step.ContentId; let i = $index) {\n                      <div class=\"row my-4 mx-auto card-steps\"\n                        style=\"max-width: 350px; border-bottom: 1px solid rgb(192, 198, 204);\">\n                        <div class=\"col-8\">\n                          <div class=\"pb-2\">\n                            <div style=\"height: 54px; min-width: 54px; width: 54px; border: 5px solid rgb(192, 198, 204);\"\n                              class=\"round-counter\">\n                              <span class=\"red\">{{i+1}}</span>\n                            </div>\n                          </div>\n                          <div>\n                            <div [innerHTML]=\"step.Content \"></div>\n                          </div>\n                        </div>\n                        <div class=\"col-4 pb-2\">\n                          <img [src]=\"step.Picture.url|cms\">\n                        </div>\n                      </div>\n                    }\n                    @if (tab.faqs.length>0) {\n                      <div class=\"row my-4\">\n                        <div class=\"col-12\">\n                          <h2 class=\"py-3\">{{tab.FaqTitle}}</h2>\n                        </div>\n                      </div>\n                    }\n                    @if (tab.faqs.length>0 && tab.FaqContent) {\n                      <div class=\"row my-4\">\n                        <div class=\"col-12\">\n                          <div [innerHTML]=\"tab.FaqContent \"></div>\n                        </div>\n                      </div>\n                    }\n                    @if (tab.faqs.length>0) {\n                      <div class=\"row   my-4\">\n                        <div class=\"col-12\">\n                          <rlb-accordion>\n                            @for (faq of tab.faqs; track faq) {\n                              <div rlb-accordion-item [expanded]=\"true\">\n                                <rlb-accordion-header>\n                                  {{faq.Title}}\n                                </rlb-accordion-header>\n                                <div rlb-accordion-body>\n                                  <div [innerHTML]=\"faq.Content\"> </div>\n                                </div>\n                              </div>\n                            }\n                          </rlb-accordion>\n                        </div>\n                      </div>\n                    }\n                    <div class=\"row   my-4\">\n                      <div class=\"col-12\">\n                        <span>\n                          <a routerLink=\"/support\">\n                            <i class=\"bi bi-info-circle-fill\" style=\"margin-bottom: -6px;margin-right: 6px;\"></i>\n                            <span>{{'pages.support.infoPage' | translate}}</span>\n                          </a>\n                        </span>\n                      </div>\n                    </div>\n                    @if (page.topics.length>0) {\n                      <div class=\"row my-4\" style=\"padding: 4px\">\n                        @for (topic of page.topics; track topic.ContentId) {\n                          <div class=\"col-lg-6 col-md-12 col-sm-12 col-xs-12\">\n                            <a [routerLink]=\"'/informations/'+topic.page.ContentId\" style=\"color: inherit;text-decoration: none;\">\n                              <div class=\"card mb-4\" style=\"min-height: 230px;\">\n                                <img [src]=\"topic.Picture.url | cms\" class=\"card-img-top\"\n                                  style=\"height: 91px; margin: 16px -16px;\">\n                                  <div class=\"card-body\">\n                                    <h5 class=\"card-title\">{{topic.Title}}</h5>\n                                    <div class=\"card-text\" [innerHTML]=\"topic.Content \"></div>\n                                  </div>\n                                </div>\n                              </a>\n                            </div>\n                          }\n                        </div>\n                      }\n                    </div>\n                  </rlb-tab-pane>\n                }\n              </rlb-tab-content>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n", styles: [""], dependencies: [{ kind: "component", type: i2$1.BreadcrumbComponent, selector: "rlb-breadcrumb", inputs: ["divider", "items", "cssClasses"] }, { kind: "component", type: i2$1.AccordionComponent, selector: "rlb-accordion", inputs: ["flush", "always-open", "id"] }, { kind: "component", type: i2$1.AccordionItemComponent, selector: "div[rlb-accordion-item]", inputs: ["name", "expanded", "class", "style", "status"], outputs: ["statusChange"] }, { kind: "component", type: i2$1.AccordionHeaderComponent, selector: "rlb-accordion-header" }, { kind: "component", type: i2$1.AccordionBodyComponent, selector: "div[rlb-accordion-body]" }, { kind: "component", type: i2$1.TabsComponent, selector: "rlb-tabs", inputs: ["horizontal-alignment", "view", "vertical", "fill", "id", "class"] }, { kind: "component", type: i2$1.TabComponent, selector: "rlb-tab", inputs: ["active", "disabled", "target", "class"] }, { kind: "component", type: i2$1.TabContentComponent, selector: "rlb-tab-content" }, { kind: "component", type: i2$1.TabPaneComponent, selector: "rlb-tab-pane", inputs: ["id", "active", "fade"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: CmsPipe, name: "cms" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: CmsComponent, isStandalone: false, selector: "rlb-cms-template", inputs: { contentId: "contentId", breadcrumb: "breadcrumb" }, ngImport: i0, template: "<div>\n  @if (page) {\n    <div class=\"container\">\n      @if (breadcrumb) {\n        <div class=\"row my-4\">\n          <div class=\"col-12\">\n            <rlb-breadcrumb [items]=\"breadcrumb\"></rlb-breadcrumb>\n          </div>\n        </div>\n      }\n      <div class=\"row my-4\">\n        <div class=\"col-12\">\n          <h1 class=\"text-center\">{{page.Title}}</h1>\n        </div>\n      </div>\n      @if (page.Content) {\n        <div class=\"row my-4\">\n          <div class=\"col-12\">\n            <div [innerHTML]=\"page.Content \"></div>\n          </div>\n        </div>\n      }\n      @if (page.page_tabs.length>0) {\n        <div class=\"row my-4\">\n          <div class=\"col-12\">\n            <rlb-tabs>\n              @for (tab of page.page_tabs; track tab.id; let i = $index) {\n                <rlb-tab [target]=\"'cms-tab-'+i\">\n                  {{tab.Title}}\n                </rlb-tab>\n              }\n            </rlb-tabs>\n            <rlb-tab-content>\n              @for (tab of page.page_tabs; track tab.id; let i = $index) {\n                <rlb-tab-pane [id]=\"'cms-tab-'+i\">\n                  <div class=\"container-fluid\">\n                    @if (tab.Content) {\n                      <div class=\"row my-4\">\n                        <div class=\"col-12\">\n                          <div [innerHTML]=\"tab.Content \"></div>\n                        </div>\n                      </div>\n                    }\n                    @for (step of tab.steps; track step.ContentId; let i = $index) {\n                      <div class=\"row my-4 mx-auto card-steps\"\n                        style=\"max-width: 350px; border-bottom: 1px solid rgb(192, 198, 204);\">\n                        <div class=\"col-8\">\n                          <div class=\"pb-2\">\n                            <div style=\"height: 54px; min-width: 54px; width: 54px; border: 5px solid rgb(192, 198, 204);\"\n                              class=\"round-counter\">\n                              <span class=\"red\">{{i+1}}</span>\n                            </div>\n                          </div>\n                          <div>\n                            <div [innerHTML]=\"step.Content \"></div>\n                          </div>\n                        </div>\n                        <div class=\"col-4 pb-2\">\n                          <img [src]=\"step.Picture.url|cms\">\n                        </div>\n                      </div>\n                    }\n                    @if (tab.faqs.length>0) {\n                      <div class=\"row my-4\">\n                        <div class=\"col-12\">\n                          <h2 class=\"py-3\">{{tab.FaqTitle}}</h2>\n                        </div>\n                      </div>\n                    }\n                    @if (tab.faqs.length>0 && tab.FaqContent) {\n                      <div class=\"row my-4\">\n                        <div class=\"col-12\">\n                          <div [innerHTML]=\"tab.FaqContent \"></div>\n                        </div>\n                      </div>\n                    }\n                    @if (tab.faqs.length>0) {\n                      <div class=\"row   my-4\">\n                        <div class=\"col-12\">\n                          <rlb-accordion>\n                            @for (faq of tab.faqs; track faq) {\n                              <div rlb-accordion-item [expanded]=\"true\">\n                                <rlb-accordion-header>\n                                  {{faq.Title}}\n                                </rlb-accordion-header>\n                                <div rlb-accordion-body>\n                                  <div [innerHTML]=\"faq.Content\"> </div>\n                                </div>\n                              </div>\n                            }\n                          </rlb-accordion>\n                        </div>\n                      </div>\n                    }\n                    <div class=\"row   my-4\">\n                      <div class=\"col-12\">\n                        <span>\n                          <a routerLink=\"/support\">\n                            <i class=\"bi bi-info-circle-fill\" style=\"margin-bottom: -6px;margin-right: 6px;\"></i>\n                            <span>{{'pages.support.infoPage' | translate}}</span>\n                          </a>\n                        </span>\n                      </div>\n                    </div>\n                    @if (page.topics.length>0) {\n                      <div class=\"row my-4\" style=\"padding: 4px\">\n                        @for (topic of page.topics; track topic.ContentId) {\n                          <div class=\"col-lg-6 col-md-12 col-sm-12 col-xs-12\">\n                            <a [routerLink]=\"'/informations/'+topic.page.ContentId\" style=\"color: inherit;text-decoration: none;\">\n                              <div class=\"card mb-4\" style=\"min-height: 230px;\">\n                                <img [src]=\"topic.Picture.url | cms\" class=\"card-img-top\"\n                                  style=\"height: 91px; margin: 16px -16px;\">\n                                  <div class=\"card-body\">\n                                    <h5 class=\"card-title\">{{topic.Title}}</h5>\n                                    <div class=\"card-text\" [innerHTML]=\"topic.Content \"></div>\n                                  </div>\n                                </div>\n                              </a>\n                            </div>\n                          }\n                        </div>\n                      }\n                    </div>\n                  </rlb-tab-pane>\n                }\n              </rlb-tab-content>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n", styles: [""], dependencies: [{ kind: "component", type: i2$1.BreadcrumbComponent, selector: "rlb-breadcrumb", inputs: ["divider", "items", "cssClasses"] }, { kind: "component", type: i2$1.AccordionComponent, selector: "rlb-accordion", inputs: ["flush", "always-open", "id"] }, { kind: "component", type: i2$1.AccordionItemComponent, selector: "div[rlb-accordion-item]", inputs: ["name", "expanded", "class", "style", "status"], outputs: ["statusChange"] }, { kind: "component", type: i2$1.AccordionHeaderComponent, selector: "rlb-accordion-header" }, { kind: "component", type: i2$1.AccordionBodyComponent, selector: "div[rlb-accordion-body]" }, { kind: "component", type: i2$1.TabsComponent, selector: "rlb-tabs", inputs: ["horizontal-alignment", "view", "vertical", "fill", "id", "class"] }, { kind: "component", type: i2$1.TabComponent, selector: "rlb-tab", inputs: ["active", "disabled", "target", "class"] }, { kind: "component", type: i2$1.TabContentComponent, selector: "rlb-tab-content" }, { kind: "component", type: i2$1.TabPaneComponent, selector: "rlb-tab-pane", inputs: ["id", "active", "fade"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: CmsPipe, name: "cms" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: CmsComponent, decorators: [{
             type: Component,
@@ -1747,7 +1776,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
 
 class NotFoundComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.3", type: NotFoundComponent, isStandalone: false, selector: "rlb-not-found", ngImport: i0, template: "<div class=\"container\" style=\"height:calc(100vh - 58px);\">\n  <div class=\"align-center\">\n    <div class=\"text-center\">\n      <h1 class=\"text-primary\">\n        {{ 'pages.notFound.title' | translate }}\n      </h1>\n      <p>{{ 'pages.notFound.content' | translate }}</p><a href=\"/\" class=\"btn btn-outline-primary\">\n        <span>\n          {{ 'pages.notFound.button' | translate }}\n        </span></a>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.3", type: NotFoundComponent, isStandalone: false, selector: "rlb-not-found", ngImport: i0, template: "<div class=\"container\" style=\"height:calc(100vh - 58px);\">\n  <div class=\"align-center\">\n    <div class=\"text-center\">\n      <h1 class=\"text-primary\">\n        {{ 'pages.notFound.title' | translate }}\n      </h1>\n      <p>{{ 'pages.notFound.content' | translate }}</p><a href=\"/\" class=\"btn btn-outline-primary\">\n        <span>\n          {{ 'pages.notFound.button' | translate }}\n        </span></a>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NotFoundComponent, decorators: [{
             type: Component,
@@ -1792,7 +1821,7 @@ class SupportComponent {
     }
     ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: SupportComponent, deps: [{ token: AbstractSupportService }, { token: i1$6.Location }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.3", type: SupportComponent, isStandalone: false, selector: "rlb-support", ngImport: i0, template: "<div class=\"container mt-2 mb-5\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'pages.support.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n      style=\"font-size: 25px;font-weight: 600;\" (click)=\"backClicked()\"></i>\n  </div>\n  <form [formGroup]=\"supportForm\" class=\"needs-validation\" (ngSubmit)=\"sendSupport(supportForm.value)\">\n    <rlb-list class=\"settings\">\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.name' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\" size=\"small\" formControlName=\"name\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.email' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\"  size=\"small\" formControlName=\"email\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.subject' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\"  size=\"small\" formControlName=\"subject\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.message' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\"  size=\"small\" formControlName=\"message\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.legal' | translate}}</h6>\n            <span>{{ 'pages.support.infoPage' | translate}}</span>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-switch size=\"small\" formControlName=\"legal\" />\n          </div>\n        </div>\n      </rlb-list-item>\n    </rlb-list>\n  </form>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.SwitchComponent, selector: "rlb-switch", inputs: ["disabled", "readonly", "size", "id"] }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemComponent, selector: "rlb-list-item", inputs: ["active", "disabled", "action"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.3", type: SupportComponent, isStandalone: false, selector: "rlb-support", ngImport: i0, template: "<div class=\"container mt-2 mb-5\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'pages.support.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n      style=\"font-size: 25px;font-weight: 600;\" (click)=\"backClicked()\"></i>\n  </div>\n  <form [formGroup]=\"supportForm\" class=\"needs-validation\" (ngSubmit)=\"sendSupport(supportForm.value)\">\n    <rlb-list class=\"settings\">\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.name' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\" size=\"small\" formControlName=\"name\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.email' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\"  size=\"small\" formControlName=\"email\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.subject' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\"  size=\"small\" formControlName=\"subject\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.message' | translate}}</h6>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-input type=\"text\"  size=\"small\" formControlName=\"message\" />\n          </div>\n        </div>\n      </rlb-list-item>\n      <rlb-list-item class=\"settings-item\">\n        <div class=\"d-flex justify-content-between\">\n          <div class=\"settings-text\">\n            <h6 class=\"mt-1\">{{ 'pages.support.legal' | translate}}</h6>\n            <span>{{ 'pages.support.infoPage' | translate}}</span>\n          </div>\n          <div class=\"settings-control\">\n            <rlb-switch size=\"small\" formControlName=\"legal\" />\n          </div>\n        </div>\n      </rlb-list-item>\n    </rlb-list>\n  </form>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.SwitchComponent, selector: "rlb-switch", inputs: ["disabled", "readonly", "size", "id"] }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemComponent, selector: "rlb-list-item", inputs: ["active", "disabled", "action"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: SupportComponent, decorators: [{
             type: Component,
@@ -1983,7 +2012,7 @@ class AppTemplateComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AppTemplateComponent, deps: [{ token: RLB_CFG_ENV }, { token: i1$1.Store }, { token: AppsService }, { token: AuthenticationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: AppTemplateComponent, isStandalone: false, selector: "rlb-app-template", inputs: { modalContainerId: ["modal-container-id", "modalContainerId"], toastContainerIds: ["toast-container-ids", "toastContainerIds"] }, ngImport: i0, template: "<div class=\"rlb-app\">\n  @if (navVisible$ | async) {\n    @if (navVisible$ | async) {\n      <rlb-navbar expand=\"lg\" class=\"border-bottom py-1 rlb-navbar\">\n        @if (navHeader$ | async) {\n          <a rlb-navbar-brand href=\"#\">{{ navHeader$ | async }}</a>\n        }\n        @if (navSearchVisible$ | async) {\n          <rlb-navbar-form>\n            <rlb-input-group class=\"my-1 mx-3\" validate>\n              <rlb-input type=\"search\" class=\"search-input\" placeholder=\"Search\" [(ngModel)]=\"navSearchText\"\n                (keyup.enter)=\"setNavbarSearchText(navSearchText)\" name=\"search\" size=\"small\">\n                <button after rlb-button outline type=\"submit\" (click)=\"setNavbarSearchText(navSearchText)\" size=\"sm\">\n                  <i class=\"bi bi-search\"></i>\n                </button>\n              </rlb-input>\n            </rlb-input-group>\n          </rlb-navbar-form>\n        }\n        <rlb-navbar-items class=\"ms-lg-auto\">\n          @for (navComponent of navLeftItems$ | async; track navComponent) {\n            <ng-container ngProjectAs=\"rlb-navbar-item\">\n              <ng-container *ngComponentOutlet=\"navComponent | leftComponent\"></ng-container>\n            </ng-container>\n          }\n        </rlb-navbar-items>\n        <rlb-navbar-items>\n          @for (navComponent of navRightItems$ | async; track navComponent) {\n            <ng-container ngProjectAs=\"rlb-navbar-item\">\n              <ng-container *ngComponentOutlet=\"navComponent | rightComponent\"></ng-container>\n            </ng-container>\n          }\n          @if ((separatorVisible$ | async)) {\n            <rlb-navbar-separator />\n          }\n          @if ((navbarHasLogin$ | async) && !(isAuth$ | async)) {\n            <rlb-navbar-item (click)=\"loginNav($event)\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') |translate\">\n                <i class=\" bi bi-box-arrow-in-left\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.account.login' | translate}}</span>\n            </rlb-navbar-item>\n          }\n          @if ( (navbarHasLogin$ | async) && (isAuth$ | async)) {\n            <rlb-navbar-item [router-link]=\"'/profile'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.title') |translate\">\n                <i class=\"bi bi-person\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.account.title' | translate}}</span>\n            </rlb-navbar-item>\n          }\n          @if (navbarHasSettings$ | async) {\n            <rlb-navbar-item [router-link]=\"'/setting'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.settings.title') |translate\">\n                <i class=\"bi bi-gear\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.settings.title' | translate}}</span>\n            </rlb-navbar-item>\n          }\n          @if ((navbarHasApps$ | async) && apps.length > 1) {\n            <rlb-navbar-item [router-link]=\"'/apps'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.apps.button') |translate\">\n                <i class=\"bi bi-grid-3x3-gap-fill\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.apps.button' | translate}}</span>\n            </rlb-navbar-item>\n          }\n        </rlb-navbar-items>\n      </rlb-navbar>\n    }\n  }\n  <div class=\"rlb-main-wrapper\">\n    @if ((sidebarVisible$ | async)) {\n      <rlb-sidebar id=\"sidebar\" class=\"rlb-sidebar\">\n        @for (item of  (sidebarItems$ | async); track item) {\n          <rlb-sidebar-item\n            [icon]=\"item.icon\" [link]=\"item.url\"\n            [title]=\"item.title\" [label]=\"item.label\"\n            [badgeCounter]=\"item.badgeCounter\"\n            (click)=\"onSideBarItemClick(item)\"\n            >\n            {{item.label}}\n            @for (subitem of item.items || []; track subitem) {\n              <rlb-sidebar-item\n                [icon]=\"subitem.icon\"\n                [link]=\"subitem.url\"\n                [title]=\"subitem.title\"\n                [label]=\"subitem.label\"\n                [badgeCounter]=\"subitem.badgeCounter\"\n                (click)=\"onSideBarItemClick(subitem)\"\n                >\n                {{subitem.label}}\n              </rlb-sidebar-item>\n            }\n          </rlb-sidebar-item>\n        }\n      </rlb-sidebar>\n    }\n    <div class=\"rlb-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n@if (modalContainerId) {\n  <rlb-modal-container [id]=\"modalContainerId\" />\n}\n\n@if (toastContainerIds) {\n  @if (toastContainerIds.constructor.name === 'Array') {\n    @for (toastContainerId of toastContainerIds | asMulti; track toastContainerId) {\n      <rlb-toast-container [id]=\"toastContainerId\" />\n    }\n  } @else {\n    <rlb-toast-container class=\"position-fixed bottom-0 end-0 p-3\" [id]=\"toastContainerIds | asSingle\" />\n  }\n}\n", styles: [".separator{border-left:1px solid;padding:0 2px}\n"], dependencies: [{ kind: "directive", type: i1$6.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.InputGroupComponent, selector: "rlb-input-group", inputs: ["text", "validate", "size"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[rlb-button], a[rlb-button]", inputs: ["color", "size", "disabled", "outline", "isLink"] }, { kind: "directive", type: i2$1.TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltip-placement", "tooltip-class", "tooltip-html"] }, { kind: "directive", type: i2$1.NavbarBrandDirective, selector: "[rlb-navbar-brand]" }, { kind: "component", type: i2$1.NavbarComponent, selector: "rlb-navbar", inputs: ["dark", "color", "placement", "expand", "class", "enable-dropdown-toggler"] }, { kind: "component", type: i2$1.NavbarFormComponent, selector: "rlb-navbar-form", inputs: ["role", "class"] }, { kind: "component", type: i2$1.NavbarItemsComponent, selector: "rlb-navbar-items", inputs: ["scroll", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarItemComponent, selector: "rlb-navbar-item", inputs: ["disabled", "router-link", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarSeparatorComponent, selector: "rlb-navbar-separator", inputs: ["class"] }, { kind: "component", type: i2$1.SidebarComponent, selector: "rlb-sidebar", inputs: ["rounded"] }, { kind: "component", type: i2$1.SidebarItemComponent, selector: "rlb-sidebar-item", inputs: ["title", "icon", "label", "link", "badgeCounter"], outputs: ["click"] }, { kind: "component", type: i2$1.ModalContainerComponent, selector: "rlb-modal-container", inputs: ["id"] }, { kind: "component", type: i2$1.ToastContainerComponent, selector: "rlb-toast-container", inputs: ["id"] }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsMultiPipe, name: "asMulti" }, { kind: "pipe", type: AsSinglePipe, name: "asSingle" }, { kind: "pipe", type: LeftComponentPipe, name: "leftComponent" }, { kind: "pipe", type: RightComponentPipe, name: "rightComponent" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: AppTemplateComponent, isStandalone: false, selector: "rlb-app-template", inputs: { modalContainerId: ["modal-container-id", "modalContainerId"], toastContainerIds: ["toast-container-ids", "toastContainerIds"] }, ngImport: i0, template: "<div class=\"rlb-app\">\n  @if (navVisible$ | async) {\n    @if (navVisible$ | async) {\n      <rlb-navbar expand=\"lg\" class=\"border-bottom py-1 rlb-navbar\">\n        @if (navHeader$ | async) {\n          <a rlb-navbar-brand href=\"#\">{{ navHeader$ | async }}</a>\n        }\n        @if (navSearchVisible$ | async) {\n          <rlb-navbar-form>\n            <rlb-input-group class=\"my-1 mx-3\" validate>\n              <rlb-input type=\"search\" class=\"search-input\" placeholder=\"Search\" [(ngModel)]=\"navSearchText\"\n                (keyup.enter)=\"setNavbarSearchText(navSearchText)\" name=\"search\" size=\"small\">\n                <button after rlb-button outline type=\"submit\" (click)=\"setNavbarSearchText(navSearchText)\" size=\"sm\">\n                  <i class=\"bi bi-search\"></i>\n                </button>\n              </rlb-input>\n            </rlb-input-group>\n          </rlb-navbar-form>\n        }\n        <rlb-navbar-items class=\"ms-lg-auto\">\n          @for (navComponent of navLeftItems$ | async; track navComponent) {\n            <ng-container ngProjectAs=\"rlb-navbar-item\">\n              <ng-container *ngComponentOutlet=\"navComponent | leftComponent\"></ng-container>\n            </ng-container>\n          }\n        </rlb-navbar-items>\n        <rlb-navbar-items>\n          @for (navComponent of navRightItems$ | async; track navComponent) {\n            <ng-container ngProjectAs=\"rlb-navbar-item\">\n              <ng-container *ngComponentOutlet=\"navComponent | rightComponent\"></ng-container>\n            </ng-container>\n          }\n          @if ((separatorVisible$ | async)) {\n            <rlb-navbar-separator />\n          }\n          @if ((navbarHasLogin$ | async) && !(isAuth$ | async)) {\n            <rlb-navbar-item (click)=\"loginNav($event)\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.login') |translate\">\n                <i class=\" bi bi-box-arrow-in-left\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.account.login' | translate}}</span>\n            </rlb-navbar-item>\n          }\n          @if ( (navbarHasLogin$ | async) && (isAuth$ | async)) {\n            <rlb-navbar-item [router-link]=\"'/profile'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.account.title') |translate\">\n                <i class=\"bi bi-person\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.account.title' | translate}}</span>\n            </rlb-navbar-item>\n          }\n          @if (navbarHasSettings$ | async) {\n            <rlb-navbar-item [router-link]=\"'/setting'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.settings.title') |translate\">\n                <i class=\"bi bi-gear\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.settings.title' | translate}}</span>\n            </rlb-navbar-item>\n          }\n          @if ((navbarHasApps$ | async) && apps.length > 1) {\n            <rlb-navbar-item [router-link]=\"'/apps'\">\n              <span tooltip-placement=\"bottom\" [tooltip]=\"('core.apps.button') |translate\">\n                <i class=\"bi bi-grid-3x3-gap-fill\"></i>\n              </span>\n              <span class=\"ms-1 d-lg-none\">{{'core.apps.button' | translate}}</span>\n            </rlb-navbar-item>\n          }\n        </rlb-navbar-items>\n      </rlb-navbar>\n    }\n  }\n  <div class=\"rlb-main-wrapper\">\n    @if ((sidebarVisible$ | async)) {\n      <rlb-sidebar id=\"sidebar\" class=\"rlb-sidebar\">\n        @for (item of  (sidebarItems$ | async); track item) {\n          <rlb-sidebar-item\n            [icon]=\"item.icon\" [link]=\"item.url\"\n            [title]=\"item.title\" [label]=\"item.label\"\n            [badgeCounter]=\"item.badgeCounter\"\n            (click)=\"onSideBarItemClick(item)\"\n            >\n            {{item.label}}\n            @for (subitem of item.items || []; track subitem) {\n              <rlb-sidebar-item\n                [icon]=\"subitem.icon\"\n                [link]=\"subitem.url\"\n                [title]=\"subitem.title\"\n                [label]=\"subitem.label\"\n                [badgeCounter]=\"subitem.badgeCounter\"\n                (click)=\"onSideBarItemClick(subitem)\"\n                >\n                {{subitem.label}}\n              </rlb-sidebar-item>\n            }\n          </rlb-sidebar-item>\n        }\n      </rlb-sidebar>\n    }\n    <div class=\"rlb-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n@if (modalContainerId) {\n  <rlb-modal-container [id]=\"modalContainerId\" />\n}\n\n@if (toastContainerIds) {\n  @if (toastContainerIds.constructor.name === 'Array') {\n    @for (toastContainerId of toastContainerIds | asMulti; track toastContainerId) {\n      <rlb-toast-container [id]=\"toastContainerId\" />\n    }\n  } @else {\n    <rlb-toast-container class=\"position-fixed bottom-0 end-0 p-3\" [id]=\"toastContainerIds | asSingle\" />\n  }\n}\n", styles: [".separator{border-left:1px solid;padding:0 2px}\n"], dependencies: [{ kind: "directive", type: i1$6.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.InputGroupComponent, selector: "rlb-input-group", inputs: ["text", "validate", "size"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[rlb-button], a[rlb-button]", inputs: ["color", "size", "disabled", "outline", "isLink"] }, { kind: "directive", type: i2$1.TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltip-placement", "tooltip-class", "tooltip-html"] }, { kind: "directive", type: i2$1.NavbarBrandDirective, selector: "[rlb-navbar-brand]" }, { kind: "component", type: i2$1.NavbarComponent, selector: "rlb-navbar", inputs: ["dark", "color", "placement", "expand", "class", "enable-dropdown-toggler"] }, { kind: "component", type: i2$1.NavbarFormComponent, selector: "rlb-navbar-form", inputs: ["role", "class"] }, { kind: "component", type: i2$1.NavbarItemsComponent, selector: "rlb-navbar-items", inputs: ["scroll", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarItemComponent, selector: "rlb-navbar-item", inputs: ["disabled", "router-link", "class"], outputs: ["click"] }, { kind: "component", type: i2$1.NavbarSeparatorComponent, selector: "rlb-navbar-separator", inputs: ["class"] }, { kind: "component", type: i2$1.SidebarComponent, selector: "rlb-sidebar", inputs: ["rounded"] }, { kind: "component", type: i2$1.SidebarItemComponent, selector: "rlb-sidebar-item", inputs: ["title", "icon", "label", "link", "badgeCounter"], outputs: ["click"] }, { kind: "component", type: i2$1.ModalContainerComponent, selector: "rlb-modal-container", inputs: ["id"] }, { kind: "component", type: i2$1.ToastContainerComponent, selector: "rlb-toast-container", inputs: ["id"] }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsMultiPipe, name: "asMulti" }, { kind: "pipe", type: AsSinglePipe, name: "asSingle" }, { kind: "pipe", type: LeftComponentPipe, name: "leftComponent" }, { kind: "pipe", type: RightComponentPipe, name: "rightComponent" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AppTemplateComponent, decorators: [{
             type: Component,
@@ -2378,7 +2407,7 @@ class ModalAppsComponent {
           </li>
         }
       </ul>
-    </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "directive", type: i2$1.TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltip-placement", "tooltip-class", "tooltip-html"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "directive", type: i2$1.TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltip-placement", "tooltip-class", "tooltip-html"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ModalAppsComponent, decorators: [{
             type: Component,
@@ -2426,7 +2455,7 @@ class AppSelectorComponent {
         return this.authService.isAuthenticated$;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AppSelectorComponent, deps: [{ token: i1$6.Location }, { token: AppsService }, { token: AuthenticationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: AppSelectorComponent, isStandalone: true, selector: "rlb-app-selector", ngImport: i0, template: "<div class=\"container mt-2\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.apps.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y cur\"\n    style=\"font-size: 25px;font-weight: 600;\" (click)=\"backClicked()\"></i>\n  </div>\n  <rlb-list>\n    @for (app of apps; track app.id) {\n      <ng-container ngProjectAs=\"rlb-list-item-image\">\n        @if (app.core) {\n          <ng-container ngProjectAs=\"rlb-list-item-image\">\n            <rlb-list-item-image [icon]=\"app.core.icon\" [avatar-size]=\"35\"\n              [line-1]=\"(app.core.title | translate) + (app.data?.appName ? ' - ' + app.data?.appName : '')\"\n              [disabled]=\"!app.enabled && (app.core.auth && !(auth$ | async))\" [line-2]=\"app.core.description | translate\"\n              (click)=\"selectApp(app)\">\n            </rlb-list-item-image>\n          </ng-container>\n        }\n      </ng-container>\n    }\n  </rlb-list>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemImageComponent, selector: "rlb-list-item-image", inputs: ["active", "disabled", "counter-empty", "counter-pill", "counter-border", "avatar-size", "username", "line-1", "line-2", "avatar", "counter", "counter-color", "icon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: AppSelectorComponent, isStandalone: true, selector: "rlb-app-selector", ngImport: i0, template: "<div class=\"container mt-2\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.apps.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y cur\"\n    style=\"font-size: 25px;font-weight: 600;\" (click)=\"backClicked()\"></i>\n  </div>\n  <rlb-list>\n    @for (app of apps; track app.id) {\n      <ng-container ngProjectAs=\"rlb-list-item-image\">\n        @if (app.core) {\n          <ng-container ngProjectAs=\"rlb-list-item-image\">\n            <rlb-list-item-image [icon]=\"app.core.icon\" [avatar-size]=\"35\"\n              [line-1]=\"(app.core.title | translate) + (app.data?.appName ? ' - ' + app.data?.appName : '')\"\n              [disabled]=\"!app.enabled && (app.core.auth && !(auth$ | async))\" [line-2]=\"app.core.description | translate\"\n              (click)=\"selectApp(app)\">\n            </rlb-list-item-image>\n          </ng-container>\n        }\n      </ng-container>\n    }\n  </rlb-list>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemImageComponent, selector: "rlb-list-item-image", inputs: ["active", "disabled", "counter-empty", "counter-pill", "counter-border", "avatar-size", "username", "line-1", "line-2", "avatar", "counter", "counter-color", "icon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AppSelectorComponent, decorators: [{
             type: Component,
@@ -2494,32 +2523,14 @@ const oauthGuard = (route, state) => {
 };
 
 const permissionGuard = (route) => {
-    console.log("permission guard", route);
-    const store = inject(Store);
+    const store = inject(AclStore);
     const router = inject(Router);
-    // Get requirements from route data
-    const requiredResource = route.data['resource'];
-    const requiredAction = route.data['action'];
-    return store.select(state => state[aclFeatureKey]).pipe(
-    // Wait until the Initializer/Effect has actually finished loading the data
-    filter((acl) => acl.loaded), take(1), map((acl) => {
-        console.log("permission guard map", JSON.stringify(acl));
-        if (!acl.resources)
-            return router.createUrlTree(['/not-found']);
-        const hasPermission = acl.resources.some(product => product.resources.some(res => {
-            const matchName = res.resourceId === requiredResource || res.resourceName === requiredResource;
-            if (!requiredAction) {
-                return matchName;
-            }
-            return matchName && res.actions.includes(requiredAction);
-        }));
-        if (hasPermission) {
-            return true;
-        }
-        // Redirect on failure
-        console.warn(`Access denied for resource: ${requiredResource}`);
-        return router.createUrlTree(['/notFound']);
-    }));
+    const resource = route.data['resource'];
+    const action = route.data['action'];
+    // toObservable helps wait for 'loaded' to be true
+    return toObservable(store.loaded).pipe(filter(Boolean), take(1), map(() => store.hasPermission(resource, action)
+        ? true
+        : router.createUrlTree(['/notFound'])));
 };
 
 const SESSION_RT = 'RT';
@@ -2675,7 +2686,7 @@ class OauthPasswordService {
             }, r.expires_in * 1000 - 60000);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: OauthPasswordService, deps: [{ token: i1$3.HttpClient }, { token: AuthenticationService }, { token: AppLoggerService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: OauthPasswordService, deps: [{ token: i1$2.HttpClient }, { token: AuthenticationService }, { token: AppLoggerService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: OauthPasswordService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: OauthPasswordService, decorators: [{
@@ -2683,7 +2694,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1$3.HttpClient }, { type: AuthenticationService }, { type: AppLoggerService }] });
+        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: AuthenticationService }, { type: AppLoggerService }] });
 
 const oauthPasswordGuard = (route, state) => {
     const auth = inject(OauthPasswordService);
@@ -2765,7 +2776,7 @@ class KeycloakProfileService {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: KeycloakProfileService, deps: [{ token: i1$3.HttpClient }, { token: AuthenticationService }, { token: ErrorManagementService }, { token: i1$5.OidcSecurityService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: KeycloakProfileService, deps: [{ token: i1$2.HttpClient }, { token: AuthenticationService }, { token: ErrorManagementService }, { token: i1$5.OidcSecurityService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: KeycloakProfileService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: KeycloakProfileService, decorators: [{
@@ -2773,7 +2784,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: i1$3.HttpClient }, { type: AuthenticationService }, { type: ErrorManagementService }, { type: i1$5.OidcSecurityService }] });
+        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: AuthenticationService }, { type: ErrorManagementService }, { type: i1$5.OidcSecurityService }] });
 
 class UserAccountComponent {
     constructor(_location, store, keycloakProfileService, modalService, languageService, authService, router) {
@@ -2833,7 +2844,7 @@ class UserAccountComponent {
         this.keycloakProfileService.configureOTP();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: UserAccountComponent, deps: [{ token: i1$6.Location }, { token: i1$1.Store }, { token: KeycloakProfileService }, { token: i2$1.ModalService }, { token: LanguageService }, { token: AuthenticationService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: UserAccountComponent, isStandalone: true, selector: "rlb-user-account", ngImport: i0, template: "<div class=\"container mt-2 mb-5\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.account.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n    style=\"font-size: 25px;font-weight: 600;\" (click)=\"backClicked()\"></i>\n    <button rlb-button outline size=\"sm\" class=\"position-absolute end-0 top-50 translate-middle-y\"\n      (click)=\"updateProfile()\">\n      <i class=\"bi bi-floppy\"></i>\n    </button>\n  </div>\n  <rlb-list class=\"settings\">\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.username' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.username\" disabled />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.email' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.email\" />\n          }\n          @if (!keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" readonly />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.firstName' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.firstName\" />\n          }\n          @if (!keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" readonly />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.lastName' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.lastName\" />\n          }\n          @if (!keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" readonly />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.logout' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          <button size=\"sm\" rlb-button (click)=\"logout()\" class=\"w-100\">\n            <i class=\"bi bi-box-arrow-right\"></i>\n          {{ 'core.account.logout' | translate}}</button>\n        </div>\n      </div>\n    </rlb-list-item>\n  </rlb-list>\n  @if (keyCloakUser) {\n    <div class=\"container text-center position-relative mt-5 mb-2\">\n      <h3>{{ 'core.account.credentials.title' | translate}}</h3>\n    </div>\n    @for (type of keycloakCredentials; track type) {\n      <div class=\"container position-relative my-3\">\n        <h6>{{ ('core.account.credentials.'+type?.type) | translate }}</h6>\n        @if (type.type === 'otp') {\n          <button rlb-button size=\"sm\"\n            class=\"position-absolute end-0 top-50 translate-middle-y\" (click)=\"configureOTP()\">\n            {{ 'core.account.credentials.addOTP' | translate}}\n          </button>\n        }\n      </div>\n      <rlb-list class=\"settings mb-5\">\n        @for (cred of type.userCredentialMetadatas; track cred.credential.id) {\n          <rlb-list-item class=\"settings-item\">\n            <div class=\"row\">\n              <div class=\"col-12\">\n                <dl class=\"row signed-in-device-grid\">\n                  <div class=\"col-md-1\">\n                    <i class=\"bi bi-key\" style=\"font-size: 35px;\"></i>\n                  </div>\n                  <div class=\"col-md-5\">\n                    <dt>\n                      <span class=\"text-muted\">\n                        {{ 'core.account.credentials.name' | translate }}\n                      </span>\n                    </dt>\n                    <dd>{{cred.credential.userLabel || cred.credential.type}}</dd>\n                  </div>\n                  <div class=\"col-md-4\">\n                    <dt>\n                      <span class=\"text-muted\">\n                        {{'core.account.credentials.created' | translate}}\n                      </span>\n                    </dt>\n                    <dd>{{cred.credential.createdDate | date:'dd:MM:yyyy HH:mm' }}</dd>\n                  </div>\n                  <div class=\"col-md-2\">\n                    <dt><span class=\"text-muted\">{{'core.account.credentials.actions' |\n                    translate}}</span></dt>\n                    <dd>\n                      @if (type.removeable) {\n                        <button size=\"sm\" rlb-button class=\"w-100\" color=\"danger\"\n                          (click)=\"removeCredential(type.type, cred.credential.id)\">\n                          <i class=\"bi bi-trash\"></i>\n                          {{ 'core.account.credentials.delete' | translate}}\n                        </button>\n                      }\n                      @if (!type.removeable) {\n                        <button size=\"sm\" rlb-button class=\"w-100\" outline\n                          (click)=\"updatePassword()\">\n                          <i class=\"bi bi-trash\"></i>\n                          {{ 'core.account.credentials.update' | translate}}\n                        </button>\n                      }\n                    </dd>\n                  </div>\n                </dl>\n              </div>\n            </div>\n          </rlb-list-item>\n        }\n        @if (type.userCredentialMetadatas.length === 0) {\n          <rlb-list-item>\n            <div class=\"d-flex justify-content-center\">\n              <div class=\"settings-text\">\n                <h6 class=\"mt-1\">{{ 'core.account.credentials.noCredentials' | translate}}</h6>\n              </div>\n            </div>\n          </rlb-list-item>\n        }\n      </rlb-list>\n    }\n    <div class=\"container text-center position-relative mt-5 mb-3\">\n      <h3>{{ 'core.account.session.title' | translate}}</h3>\n    </div>\n    <rlb-list class=\"settings\">\n      @for (d of keyCloakDevices; track d.id) {\n        <rlb-list-item class=\"settings-item\">\n          <div class=\"row mb-2\">\n            <div class=\"col-1\">\n              <i class=\"bi bi-laptop\" style=\"font-size: 35px;\"></i>\n            </div>\n            <div class=\"col-11\">\n              <span class=\"session-title\">{{d.os}} {{d.osVersion}} - {{d.browser}}</span>\n              @if (d.current) {\n                <span class=\"badge bg-success ms-3\">\n                  <span class=\"badge-content\">\n                    {{ 'core.account.session.current' | translate}}\n                  </span>\n                </span>\n              }\n            </div>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12\">\n              <dl class=\"row signed-in-device-grid\">\n                <div class=\" col-md-1\">\n                </div>\n                <div class=\" col-md-2\">\n                  <dt><span class=\"text-muted\">{{ 'core.account.session.ip' | translate }}</span>\n                </dt>\n                <dd>{{d.ipAddress}}</dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt>\n                  <span class=\"text-muted\">\n                    {{'core.account.session.lastAccess' | translate}}\n                  </span>\n                </dt>\n                <dd>{{d.lastAccess*1000 | date:'dd/MM/yyyy - HH:mm'}}</dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt><span class=\"text-muted\">{{'core.account.session.applications' |\n                translate}}</span></dt>\n                <dd>{{d.clientslist }} </dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt><span class=\"text-muted\">{{'core.account.session.started' |\n                translate}}</span></dt>\n                <dd>{{d.started*1000 | date:'dd/MM/yyyy - HH:mm'}}</dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt><span class=\"text-muted\">{{'core.account.session.expires' |\n                translate}}</span></dt>\n                <dd>{{d.expires*1000 | date:'dd/MM/yyyy - HH:mm'}}</dd>\n              </div>\n            </dl>\n          </div>\n        </div>\n      </rlb-list-item>\n    }\n  </rlb-list>\n}\n</div>\n", styles: [".settings .settings-item .settings-control{width:40%}\n"], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[rlb-button], a[rlb-button]", inputs: ["color", "size", "disabled", "outline", "isLink"] }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemComponent, selector: "rlb-list-item", inputs: ["active", "disabled", "action"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$6.DatePipe, name: "date" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: UserAccountComponent, isStandalone: true, selector: "rlb-user-account", ngImport: i0, template: "<div class=\"container mt-2 mb-5\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.account.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n    style=\"font-size: 25px;font-weight: 600;\" (click)=\"backClicked()\"></i>\n    <button rlb-button outline size=\"sm\" class=\"position-absolute end-0 top-50 translate-middle-y\"\n      (click)=\"updateProfile()\">\n      <i class=\"bi bi-floppy\"></i>\n    </button>\n  </div>\n  <rlb-list class=\"settings\">\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.username' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.username\" disabled />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.email' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.email\" />\n          }\n          @if (!keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" readonly />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.firstName' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.firstName\" />\n          }\n          @if (!keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" readonly />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.lastName' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          @if (keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" [(ngModel)]=\"keyCloakUser.lastName\" />\n          }\n          @if (!keyCloakUser) {\n            <rlb-input size=\"small\" type=\"text\" readonly />\n          }\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.account.logout' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          <button size=\"sm\" rlb-button (click)=\"logout()\" class=\"w-100\">\n            <i class=\"bi bi-box-arrow-right\"></i>\n          {{ 'core.account.logout' | translate}}</button>\n        </div>\n      </div>\n    </rlb-list-item>\n  </rlb-list>\n  @if (keyCloakUser) {\n    <div class=\"container text-center position-relative mt-5 mb-2\">\n      <h3>{{ 'core.account.credentials.title' | translate}}</h3>\n    </div>\n    @for (type of keycloakCredentials; track type) {\n      <div class=\"container position-relative my-3\">\n        <h6>{{ ('core.account.credentials.'+type?.type) | translate }}</h6>\n        @if (type.type === 'otp') {\n          <button rlb-button size=\"sm\"\n            class=\"position-absolute end-0 top-50 translate-middle-y\" (click)=\"configureOTP()\">\n            {{ 'core.account.credentials.addOTP' | translate}}\n          </button>\n        }\n      </div>\n      <rlb-list class=\"settings mb-5\">\n        @for (cred of type.userCredentialMetadatas; track cred.credential.id) {\n          <rlb-list-item class=\"settings-item\">\n            <div class=\"row\">\n              <div class=\"col-12\">\n                <dl class=\"row signed-in-device-grid\">\n                  <div class=\"col-md-1\">\n                    <i class=\"bi bi-key\" style=\"font-size: 35px;\"></i>\n                  </div>\n                  <div class=\"col-md-5\">\n                    <dt>\n                      <span class=\"text-muted\">\n                        {{ 'core.account.credentials.name' | translate }}\n                      </span>\n                    </dt>\n                    <dd>{{cred.credential.userLabel || cred.credential.type}}</dd>\n                  </div>\n                  <div class=\"col-md-4\">\n                    <dt>\n                      <span class=\"text-muted\">\n                        {{'core.account.credentials.created' | translate}}\n                      </span>\n                    </dt>\n                    <dd>{{cred.credential.createdDate | date:'dd:MM:yyyy HH:mm' }}</dd>\n                  </div>\n                  <div class=\"col-md-2\">\n                    <dt><span class=\"text-muted\">{{'core.account.credentials.actions' |\n                    translate}}</span></dt>\n                    <dd>\n                      @if (type.removeable) {\n                        <button size=\"sm\" rlb-button class=\"w-100\" color=\"danger\"\n                          (click)=\"removeCredential(type.type, cred.credential.id)\">\n                          <i class=\"bi bi-trash\"></i>\n                          {{ 'core.account.credentials.delete' | translate}}\n                        </button>\n                      }\n                      @if (!type.removeable) {\n                        <button size=\"sm\" rlb-button class=\"w-100\" outline\n                          (click)=\"updatePassword()\">\n                          <i class=\"bi bi-trash\"></i>\n                          {{ 'core.account.credentials.update' | translate}}\n                        </button>\n                      }\n                    </dd>\n                  </div>\n                </dl>\n              </div>\n            </div>\n          </rlb-list-item>\n        }\n        @if (type.userCredentialMetadatas.length === 0) {\n          <rlb-list-item>\n            <div class=\"d-flex justify-content-center\">\n              <div class=\"settings-text\">\n                <h6 class=\"mt-1\">{{ 'core.account.credentials.noCredentials' | translate}}</h6>\n              </div>\n            </div>\n          </rlb-list-item>\n        }\n      </rlb-list>\n    }\n    <div class=\"container text-center position-relative mt-5 mb-3\">\n      <h3>{{ 'core.account.session.title' | translate}}</h3>\n    </div>\n    <rlb-list class=\"settings\">\n      @for (d of keyCloakDevices; track d.id) {\n        <rlb-list-item class=\"settings-item\">\n          <div class=\"row mb-2\">\n            <div class=\"col-1\">\n              <i class=\"bi bi-laptop\" style=\"font-size: 35px;\"></i>\n            </div>\n            <div class=\"col-11\">\n              <span class=\"session-title\">{{d.os}} {{d.osVersion}} - {{d.browser}}</span>\n              @if (d.current) {\n                <span class=\"badge bg-success ms-3\">\n                  <span class=\"badge-content\">\n                    {{ 'core.account.session.current' | translate}}\n                  </span>\n                </span>\n              }\n            </div>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12\">\n              <dl class=\"row signed-in-device-grid\">\n                <div class=\" col-md-1\">\n                </div>\n                <div class=\" col-md-2\">\n                  <dt><span class=\"text-muted\">{{ 'core.account.session.ip' | translate }}</span>\n                </dt>\n                <dd>{{d.ipAddress}}</dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt>\n                  <span class=\"text-muted\">\n                    {{'core.account.session.lastAccess' | translate}}\n                  </span>\n                </dt>\n                <dd>{{d.lastAccess*1000 | date:'dd/MM/yyyy - HH:mm'}}</dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt><span class=\"text-muted\">{{'core.account.session.applications' |\n                translate}}</span></dt>\n                <dd>{{d.clientslist }} </dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt><span class=\"text-muted\">{{'core.account.session.started' |\n                translate}}</span></dt>\n                <dd>{{d.started*1000 | date:'dd/MM/yyyy - HH:mm'}}</dd>\n              </div>\n              <div class=\"col-md-2\">\n                <dt><span class=\"text-muted\">{{'core.account.session.expires' |\n                translate}}</span></dt>\n                <dd>{{d.expires*1000 | date:'dd/MM/yyyy - HH:mm'}}</dd>\n              </div>\n            </dl>\n          </div>\n        </div>\n      </rlb-list-item>\n    }\n  </rlb-list>\n}\n</div>\n", styles: [".settings .settings-item .settings-control{width:40%}\n"], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.InputComponent, selector: "rlb-input", inputs: ["disabled", "readonly", "before-text", "placeholder", "type", "size", "name", "max", "min", "step", "date-type", "timezone", "id", "extValidation", "enable-validation"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[rlb-button], a[rlb-button]", inputs: ["color", "size", "disabled", "outline", "isLink"] }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemComponent, selector: "rlb-list-item", inputs: ["active", "disabled", "action"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$6.DatePipe, name: "date" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: UserAccountComponent, decorators: [{
             type: Component,
@@ -2883,7 +2894,7 @@ class SettingsCoreComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: SettingsCoreComponent, deps: [{ token: i1$6.Location }, { token: i2$1.ToastService }, { token: LanguageService }, { token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: SettingsCoreComponent, isStandalone: true, selector: "rlb-settings-core", ngImport: i0, template: "<div class=\"container mt-2\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.settings.generalTitle' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n    (click)=\"backClicked()\" style=\"font-size: 25px;font-weight: 600;\"></i>\n  </div>\n  <rlb-list class=\"settings\">\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.settings.generalTheme' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          <rlb-switch size=\"small\" [(ngModel)]=\"darkMode\" class=\"mt-2\" />\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.settings.generalLanguage' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          <rlb-select size=\"small\" [(ngModel)]=\"currentLanguage\">\n            @for (l of languages; track l.value) {\n              <rlb-option [value]=\"l.value\">{{l.label}}</rlb-option>\n            }\n          </rlb-select>\n        </div>\n      </div>\n    </rlb-list-item>\n  </rlb-list>\n</div>\n", styles: [".settings .settings-item .settings-control{width:40%}.settings .settings-item .settings-control ::ng-deep rlb-switch .form-check{display:block;margin-left:auto}\n"], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.SwitchComponent, selector: "rlb-switch", inputs: ["disabled", "readonly", "size", "id"] }, { kind: "component", type: i2$1.SelectComponent, selector: "rlb-select", inputs: ["placeholder", "size", "disabled", "readonly", "multiple", "display", "id", "enable-validation"] }, { kind: "component", type: i2$1.OptionComponent, selector: "rlb-option", inputs: ["disabled", "value", "class"] }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemComponent, selector: "rlb-list-item", inputs: ["active", "disabled", "action"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: SettingsCoreComponent, isStandalone: true, selector: "rlb-settings-core", ngImport: i0, template: "<div class=\"container mt-2\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.settings.generalTitle' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n    (click)=\"backClicked()\" style=\"font-size: 25px;font-weight: 600;\"></i>\n  </div>\n  <rlb-list class=\"settings\">\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.settings.generalTheme' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          <rlb-switch size=\"small\" [(ngModel)]=\"darkMode\" class=\"mt-2\" />\n        </div>\n      </div>\n    </rlb-list-item>\n    <rlb-list-item class=\"settings-item\">\n      <div class=\"d-flex justify-content-between\">\n        <div class=\"settings-text\">\n          <h6 class=\"mt-1\">{{ 'core.settings.generalLanguage' | translate}}</h6>\n        </div>\n        <div class=\"settings-control\">\n          <rlb-select size=\"small\" [(ngModel)]=\"currentLanguage\">\n            @for (l of languages; track l.value) {\n              <rlb-option [value]=\"l.value\">{{l.label}}</rlb-option>\n            }\n          </rlb-select>\n        </div>\n      </div>\n    </rlb-list-item>\n  </rlb-list>\n</div>\n", styles: [".settings .settings-item .settings-control{width:40%}.settings .settings-item .settings-control ::ng-deep rlb-switch .form-check{display:block;margin-left:auto}\n"], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.SwitchComponent, selector: "rlb-switch", inputs: ["disabled", "readonly", "size", "id"] }, { kind: "component", type: i2$1.SelectComponent, selector: "rlb-select", inputs: ["placeholder", "size", "disabled", "readonly", "multiple", "display", "id", "enable-validation"] }, { kind: "component", type: i2$1.OptionComponent, selector: "rlb-option", inputs: ["disabled", "value", "class"] }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemComponent, selector: "rlb-list-item", inputs: ["active", "disabled", "action"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: SettingsCoreComponent, decorators: [{
             type: Component,
@@ -2913,7 +2924,7 @@ class SettingsListComponent {
         return this.authService.isAuthenticated$;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: SettingsListComponent, deps: [{ token: i1$6.Location }, { token: AppsService }, { token: AuthenticationService }, { token: RLB_CFG_PAGES, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: SettingsListComponent, isStandalone: true, selector: "rlb-settings-list", ngImport: i0, template: "<div class=\"container mt-2\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.settings.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n    (click)=\"backClicked()\" style=\"font-size: 25px;font-weight: 600;\"></i>\n  </div>\n  <rlb-list>\n    <rlb-list-item-image icon=\"bi bi-gear\" [avatar-size]=\"35\" [line-1]=\" 'core.settings.generalTitle' | translate\"\n      [routerLink]=\"'/setting/general'\" [line-2]=\" 'core.settings.generalDescription' | translate\">\n    </rlb-list-item-image>\n    @for (app of apps; track app.id) {\n      <ng-container ngProjectAs=\"rlb-list-item-image\">\n        @if (app.settings) {\n          <ng-container ngProjectAs=\"rlb-list-item-image\">\n            <rlb-list-item-image [icon]=\"app.settings.icon\" [avatar-size]=\"35\"\n              [line-1]=\"(app.settings.title | translate) + (app.data?.appName ? ' - ' + app.data?.appName : '')\"\n              [disabled]=\"!app.enabled && (app.settings.auth && !(auth$ | async))\"\n              [line-2]=\"app.settings.description | translate\" (click)=\"selectApp(app)\">\n            </rlb-list-item-image>\n          </ng-container>\n        }\n      </ng-container>\n    }\n  </rlb-list>\n\n  @if (pages?.['status']?.path || pages?.['logger']?.path) {\n    <rlb-list class=\"mt-5\">\n      @if (pages?.['status']?.path) {\n        <rlb-list-item-image icon=\"bi bi-check2-circle\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.status' | translate\" [routerLink]=\"'/status'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['logger']?.path) {\n        <rlb-list-item-image icon=\"bi bi-file-text\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.logger' | translate\" [routerLink]=\"'/logger'\">\n        </rlb-list-item-image>\n      }\n    </rlb-list>\n  }\n\n  @if (pages?.['privacy']?.path || pages?.['cookies']?.path || pages?.['terms']?.path || pages?.['support']?.path) {\n    <rlb-list class=\"mt-4\"\n      >\n      @if (pages?.['privacy']?.path) {\n        <rlb-list-item-image icon=\"bi bi-shield-check\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.privacy' | translate\" [routerLink]=\"'/privacy'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['cookies']?.path) {\n        <rlb-list-item-image icon=\"bi bi bi-cookie\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.cookies' | translate\" [routerLink]=\"'/cookies'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['terms']?.path) {\n        <rlb-list-item-image icon=\"bi bi-vector-pen\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.legal' | translate\" [routerLink]=\"'/terms'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['support']?.path) {\n        <rlb-list-item-image icon=\"bi bi-chat-quote\" [avatar-size]=\"18\"\n          [line-1]=\" 'core.settings.support' | translate\" [routerLink]=\"'/support'\">\n        </rlb-list-item-image>\n      }\n    </rlb-list>\n  }\n</div>\n", styles: [".settings .settings-item .settings-control{width:40%}\n"], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemImageComponent, selector: "rlb-list-item-image", inputs: ["active", "disabled", "counter-empty", "counter-pill", "counter-border", "avatar-size", "username", "line-1", "line-2", "avatar", "counter", "counter-color", "icon"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: SettingsListComponent, isStandalone: true, selector: "rlb-settings-list", ngImport: i0, template: "<div class=\"container mt-2\">\n  <div class=\"container text-center position-relative my-3\">\n    <h3>{{ 'core.settings.title' | translate}}</h3>\n    <i role=\"button\" class=\"bi bi-chevron-left position-absolute start-0 top-50 translate-middle-y\"\n    (click)=\"backClicked()\" style=\"font-size: 25px;font-weight: 600;\"></i>\n  </div>\n  <rlb-list>\n    <rlb-list-item-image icon=\"bi bi-gear\" [avatar-size]=\"35\" [line-1]=\" 'core.settings.generalTitle' | translate\"\n      [routerLink]=\"'/setting/general'\" [line-2]=\" 'core.settings.generalDescription' | translate\">\n    </rlb-list-item-image>\n    @for (app of apps; track app.id) {\n      <ng-container ngProjectAs=\"rlb-list-item-image\">\n        @if (app.settings) {\n          <ng-container ngProjectAs=\"rlb-list-item-image\">\n            <rlb-list-item-image [icon]=\"app.settings.icon\" [avatar-size]=\"35\"\n              [line-1]=\"(app.settings.title | translate) + (app.data?.appName ? ' - ' + app.data?.appName : '')\"\n              [disabled]=\"!app.enabled && (app.settings.auth && !(auth$ | async))\"\n              [line-2]=\"app.settings.description | translate\" (click)=\"selectApp(app)\">\n            </rlb-list-item-image>\n          </ng-container>\n        }\n      </ng-container>\n    }\n  </rlb-list>\n\n  @if (pages?.['status']?.path || pages?.['logger']?.path) {\n    <rlb-list class=\"mt-5\">\n      @if (pages?.['status']?.path) {\n        <rlb-list-item-image icon=\"bi bi-check2-circle\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.status' | translate\" [routerLink]=\"'/status'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['logger']?.path) {\n        <rlb-list-item-image icon=\"bi bi-file-text\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.logger' | translate\" [routerLink]=\"'/logger'\">\n        </rlb-list-item-image>\n      }\n    </rlb-list>\n  }\n\n  @if (pages?.['privacy']?.path || pages?.['cookies']?.path || pages?.['terms']?.path || pages?.['support']?.path) {\n    <rlb-list class=\"mt-4\"\n      >\n      @if (pages?.['privacy']?.path) {\n        <rlb-list-item-image icon=\"bi bi-shield-check\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.privacy' | translate\" [routerLink]=\"'/privacy'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['cookies']?.path) {\n        <rlb-list-item-image icon=\"bi bi bi-cookie\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.cookies' | translate\" [routerLink]=\"'/cookies'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['terms']?.path) {\n        <rlb-list-item-image icon=\"bi bi-vector-pen\" [avatar-size]=\"18\"\n          [line-1]=\"'core.settings.legal' | translate\" [routerLink]=\"'/terms'\">\n        </rlb-list-item-image>\n      }\n      @if (pages?.['support']?.path) {\n        <rlb-list-item-image icon=\"bi bi-chat-quote\" [avatar-size]=\"18\"\n          [line-1]=\" 'core.settings.support' | translate\" [routerLink]=\"'/support'\">\n        </rlb-list-item-image>\n      }\n    </rlb-list>\n  }\n</div>\n", styles: [".settings .settings-item .settings-control{width:40%}\n"], dependencies: [{ kind: "ngmodule", type: RlbAppModule }, { kind: "component", type: i2$1.ListComponent, selector: "rlb-list", inputs: ["disabled", "numbered", "flush", "horizontal"] }, { kind: "component", type: i2$1.ListItemImageComponent, selector: "rlb-list-item-image", inputs: ["active", "disabled", "counter-empty", "counter-pill", "counter-border", "avatar-size", "username", "line-1", "line-2", "avatar", "counter", "counter-color", "icon"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$6.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: SettingsListComponent, decorators: [{
             type: Component,