@smarterplan/ngx-smarterplan-core 1.2.39 → 1.2.46

package/fesm2020/smarterplan-ngx-smarterplan-core.mjs

@@ -350,6 +350,7 @@ var CommentType;
     CommentType["YOUTUBE"] = "YOUTUBE";
     CommentType["URL_SHOP"] = "URL_SHOP";
     CommentType["EMBED"] = "EMBED";
+    CommentType["IFRAME"] = "IFRAME";
 })(CommentType || (CommentType = {}));
 var StatusEquipment;
 (function (StatusEquipment) {
@@ -8764,10 +8765,10 @@ class RangeDatePickerComponent {
     }
 }
 RangeDatePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: RangeDatePickerComponent, deps: [{ token: i1$2.NgbCalendar }, { token: i1$2.NgbDateParserFormatter }, { token: FilterService }, { token: AmplifyCacheService }], target: i0.ɵɵFactoryTarget.Component });
-RangeDatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: RangeDatePickerComponent, selector: "lib-range-date-picker", inputs: { cacheName: "cacheName" }, ngImport: i0, template: "<form class=\"form-inline\">\r\n    <div class=\"mb-3 hidden\">\r\n        <div class=\"input-group\">\r\n            <input name=\"datepicker\" class=\"form-control\" ngbDatepicker #datepicker=\"ngbDatepicker\"\r\n                [autoClose]=\"'outside'\" (dateSelect)=\"onDateSelection($event)\" [displayMonths]=\"2\" [dayTemplate]=\"t\"\r\n                outsideDays=\"hidden\" [startDate]=\"fromDate!\" tabindex=\"-1\">\r\n            <ng-template #t let-date let-focused=\"focused\">\r\n                <span class=\"custom-day\" [class.focused]=\"focused\" [class.range]=\"isRange(date)\"\r\n                    [class.faded]=\"isHovered(date) || isInside(date)\" (mouseenter)=\"hoveredDate = date\"\r\n                    (mouseleave)=\"hoveredDate = null\">\r\n                    {{ date.day }}\r\n                </span>\r\n            </ng-template>\r\n        </div>\r\n    </div>\r\n    <div>\r\n        <div class=\"input-group\">\r\n            <input #dpFromDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpFromDate\"\r\n                [value]=\"fromDate | formatDateNumberToDigits\"\r\n                (input)=\"fromDate = validateInput(fromDate, dpFromDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"mb-3 ms-2\">\r\n        <div class=\"input-group\">\r\n            <input #dpToDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpToDate\"\r\n                [value]=\"toDate | formatDateNumberToDigits\" (input)=\"toDate = validateInput(toDate, dpToDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"confirmation-button\">\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onApply()\"\r\n            *ngIf=\"!isDateFilterApplied || dateChanged\">\r\n            {{'Apply' | translate}}\r\n        </button>\r\n        <span class=\"appliedText ms-3\" *ngIf=\"isDateFilterApplied && !dateChanged\">\r\n            <span class=\"iconify\" data-icon=\"ion:checkmark\" data-width=\"15\" data-height=\"15\"></span>\r\n            {{\"Applied\" | translate}}\r\n        </span>\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onClearDates()\">{{'Clear' |\r\n            translate}}</button>\r\n    </div>\r\n</form>", styles: [".mb-3.hidden{width:0;margin:0;border:none;padding:0}.custom-day{text-align:center;padding:.185rem .25rem;display:inline-block;height:2rem;width:2rem}.custom-day.focused{background-color:#e6e6e6}.custom-day.range,.custom-day:hover{background-color:var(--smarterplan-primary-lighter);color:#fff}.custom-day.faded{background-color:var(--smarterplan-primary-transparent)}.calendar{height:100%}.appliedText,.appliedText span{color:var(--smarterplan-primary)}@media (max-width: 767px){.form-inline{flex-direction:column}.mb-3{margin-bottom:15px}}.mb-3.hidden{opacity:0}.confirmation-button{display:flex}\n"], directives: [{ type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "formatDateNumberToDigits": FormatDateNumberToDigitsPipe, "translate": i1.TranslatePipe } });
+RangeDatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: RangeDatePickerComponent, selector: "lib-range-date-picker", inputs: { cacheName: "cacheName" }, ngImport: i0, template: "<form class=\"form-inline\">\r\n    <div class=\"mb-3 hidden\">\r\n        <div class=\"input-group\">\r\n            <input name=\"datepicker\" class=\"form-control\" ngbDatepicker #datepicker=\"ngbDatepicker\"\r\n                [autoClose]=\"'outside'\" (dateSelect)=\"onDateSelection($event)\" [displayMonths]=\"2\" [dayTemplate]=\"t\"\r\n                outsideDays=\"hidden\" [startDate]=\"fromDate!\" tabindex=\"-1\">\r\n            <ng-template #t let-date let-focused=\"focused\">\r\n                <span class=\"custom-day\" [class.focused]=\"focused\" [class.range]=\"isRange(date)\"\r\n                    [class.faded]=\"isHovered(date) || isInside(date)\" (mouseenter)=\"hoveredDate = date\"\r\n                    (mouseleave)=\"hoveredDate = null\">\r\n                    {{ date.day }}\r\n                </span>\r\n            </ng-template>\r\n        </div>\r\n    </div>\r\n    <div>\r\n        <div class=\"input-group\">\r\n            <input #dpFromDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpFromDate\"\r\n                [value]=\"fromDate | formatDateNumberToDigits\"\r\n                (input)=\"fromDate = validateInput(fromDate, dpFromDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"mb-3 ms-0 ms-md-2\">\r\n        <div class=\"input-group\">\r\n            <input #dpToDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpToDate\"\r\n                [value]=\"toDate | formatDateNumberToDigits\" (input)=\"toDate = validateInput(toDate, dpToDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"confirmation-button\">\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onApply()\"\r\n            *ngIf=\"!isDateFilterApplied || dateChanged\">\r\n            {{'Apply' | translate}}\r\n        </button>\r\n        <span class=\"appliedText ms-3\" *ngIf=\"isDateFilterApplied && !dateChanged\">\r\n            <span class=\"iconify\" data-icon=\"ion:checkmark\" data-width=\"15\" data-height=\"15\"></span>\r\n            {{\"Applied\" | translate}}\r\n        </span>\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onClearDates()\">{{'Clear' |\r\n            translate}}</button>\r\n    </div>\r\n</form>\r\n", styles: [".mb-3.hidden{width:0;margin:0;border:none;padding:0}.custom-day{text-align:center;padding:.185rem .25rem;display:inline-block;height:2rem;width:2rem}.custom-day.focused{background-color:#e6e6e6}.custom-day.range,.custom-day:hover{background-color:var(--smarterplan-primary-lighter);color:#fff}.custom-day.faded{background-color:var(--smarterplan-primary-transparent)}.calendar{height:100%}.appliedText,.appliedText span{color:var(--smarterplan-primary)}@media (max-width: 767px){.form-inline{flex-direction:column}.mb-3{margin-bottom:15px}}.mb-3.hidden{opacity:0}.confirmation-button{display:flex;padding:.5rem}\n"], directives: [{ type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "formatDateNumberToDigits": FormatDateNumberToDigitsPipe, "translate": i1.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: RangeDatePickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-range-date-picker', template: "<form class=\"form-inline\">\r\n    <div class=\"mb-3 hidden\">\r\n        <div class=\"input-group\">\r\n            <input name=\"datepicker\" class=\"form-control\" ngbDatepicker #datepicker=\"ngbDatepicker\"\r\n                [autoClose]=\"'outside'\" (dateSelect)=\"onDateSelection($event)\" [displayMonths]=\"2\" [dayTemplate]=\"t\"\r\n                outsideDays=\"hidden\" [startDate]=\"fromDate!\" tabindex=\"-1\">\r\n            <ng-template #t let-date let-focused=\"focused\">\r\n                <span class=\"custom-day\" [class.focused]=\"focused\" [class.range]=\"isRange(date)\"\r\n                    [class.faded]=\"isHovered(date) || isInside(date)\" (mouseenter)=\"hoveredDate = date\"\r\n                    (mouseleave)=\"hoveredDate = null\">\r\n                    {{ date.day }}\r\n                </span>\r\n            </ng-template>\r\n        </div>\r\n    </div>\r\n    <div>\r\n        <div class=\"input-group\">\r\n            <input #dpFromDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpFromDate\"\r\n                [value]=\"fromDate | formatDateNumberToDigits\"\r\n                (input)=\"fromDate = validateInput(fromDate, dpFromDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"mb-3 ms-2\">\r\n        <div class=\"input-group\">\r\n            <input #dpToDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpToDate\"\r\n                [value]=\"toDate | formatDateNumberToDigits\" (input)=\"toDate = validateInput(toDate, dpToDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"confirmation-button\">\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onApply()\"\r\n            *ngIf=\"!isDateFilterApplied || dateChanged\">\r\n            {{'Apply' | translate}}\r\n        </button>\r\n        <span class=\"appliedText ms-3\" *ngIf=\"isDateFilterApplied && !dateChanged\">\r\n            <span class=\"iconify\" data-icon=\"ion:checkmark\" data-width=\"15\" data-height=\"15\"></span>\r\n            {{\"Applied\" | translate}}\r\n        </span>\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onClearDates()\">{{'Clear' |\r\n            translate}}</button>\r\n    </div>\r\n</form>", styles: [".mb-3.hidden{width:0;margin:0;border:none;padding:0}.custom-day{text-align:center;padding:.185rem .25rem;display:inline-block;height:2rem;width:2rem}.custom-day.focused{background-color:#e6e6e6}.custom-day.range,.custom-day:hover{background-color:var(--smarterplan-primary-lighter);color:#fff}.custom-day.faded{background-color:var(--smarterplan-primary-transparent)}.calendar{height:100%}.appliedText,.appliedText span{color:var(--smarterplan-primary)}@media (max-width: 767px){.form-inline{flex-direction:column}.mb-3{margin-bottom:15px}}.mb-3.hidden{opacity:0}.confirmation-button{display:flex}\n"] }]
+            args: [{ selector: 'lib-range-date-picker', template: "<form class=\"form-inline\">\r\n    <div class=\"mb-3 hidden\">\r\n        <div class=\"input-group\">\r\n            <input name=\"datepicker\" class=\"form-control\" ngbDatepicker #datepicker=\"ngbDatepicker\"\r\n                [autoClose]=\"'outside'\" (dateSelect)=\"onDateSelection($event)\" [displayMonths]=\"2\" [dayTemplate]=\"t\"\r\n                outsideDays=\"hidden\" [startDate]=\"fromDate!\" tabindex=\"-1\">\r\n            <ng-template #t let-date let-focused=\"focused\">\r\n                <span class=\"custom-day\" [class.focused]=\"focused\" [class.range]=\"isRange(date)\"\r\n                    [class.faded]=\"isHovered(date) || isInside(date)\" (mouseenter)=\"hoveredDate = date\"\r\n                    (mouseleave)=\"hoveredDate = null\">\r\n                    {{ date.day }}\r\n                </span>\r\n            </ng-template>\r\n        </div>\r\n    </div>\r\n    <div>\r\n        <div class=\"input-group\">\r\n            <input #dpFromDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpFromDate\"\r\n                [value]=\"fromDate | formatDateNumberToDigits\"\r\n                (input)=\"fromDate = validateInput(fromDate, dpFromDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"mb-3 ms-0 ms-md-2\">\r\n        <div class=\"input-group\">\r\n            <input #dpToDate class=\"form-control\" placeholder=\"dd/MM/yyyy\" name=\"dpToDate\"\r\n                [value]=\"toDate | formatDateNumberToDigits\" (input)=\"toDate = validateInput(toDate, dpToDate.value)\">\r\n            <div class=\"input-group-append\">\r\n                <button class=\"btn btn-outline-secondary calendar\" (click)=\"datepicker.toggle()\" type=\"button\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"confirmation-button\">\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onApply()\"\r\n            *ngIf=\"!isDateFilterApplied || dateChanged\">\r\n            {{'Apply' | translate}}\r\n        </button>\r\n        <span class=\"appliedText ms-3\" *ngIf=\"isDateFilterApplied && !dateChanged\">\r\n            <span class=\"iconify\" data-icon=\"ion:checkmark\" data-width=\"15\" data-height=\"15\"></span>\r\n            {{\"Applied\" | translate}}\r\n        </span>\r\n        <button class=\"btn btn-outline-primary rounded-pill ms-3\" (click)=\"onClearDates()\">{{'Clear' |\r\n            translate}}</button>\r\n    </div>\r\n</form>\r\n", styles: [".mb-3.hidden{width:0;margin:0;border:none;padding:0}.custom-day{text-align:center;padding:.185rem .25rem;display:inline-block;height:2rem;width:2rem}.custom-day.focused{background-color:#e6e6e6}.custom-day.range,.custom-day:hover{background-color:var(--smarterplan-primary-lighter);color:#fff}.custom-day.faded{background-color:var(--smarterplan-primary-transparent)}.calendar{height:100%}.appliedText,.appliedText span{color:var(--smarterplan-primary)}@media (max-width: 767px){.form-inline{flex-direction:column}.mb-3{margin-bottom:15px}}.mb-3.hidden{opacity:0}.confirmation-button{display:flex;padding:.5rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$2.NgbCalendar }, { type: i1$2.NgbDateParserFormatter }, { type: FilterService }, { type: AmplifyCacheService }]; }, propDecorators: { cacheName: [{
                 type: Input
             }] } });
@@ -10195,6 +10196,7 @@ class FeatureService extends BaseObjectService {
         this.setAudio(feature);
         this.setExternalLinks(feature);
         this.setEmbeds(feature);
+        this.setIframes(feature);
         this.isBookingPlace(feature);
         return feature;
     }
@@ -10375,6 +10377,21 @@ class FeatureService extends BaseObjectService {
         }
         feature.embeds = embeds;
     }
+    setIframes(feature) {
+        const iframeComments = feature.comments.items
+            .filter((com) => com.type === CommentType.IFRAME)
+            .sort((a, b) => a.index - b.index);
+        const iframes = [];
+        for (const iframe of iframeComments) {
+            iframes.push({
+                path: iframe.externalLink,
+                title: iframe.title,
+                description: iframe.description,
+                showInTag: iframe.shownInTag,
+            });
+        }
+        feature.iframes = iframes;
+    }
     async getFirstFeatureForSpace(spaceID) {
         const features = await this.getFeaturesForSpace(spaceID);
         const first = features.find((feat) => feat.index === 1);
@@ -11275,10 +11292,10 @@ class MenuBarComponent {
     }
 }
 MenuBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: MenuBarComponent, deps: [{ token: i1$1.Router }, { token: LocaleService }, { token: BaseUserService }, { token: NavigatorService }, { token: SupportService }, { token: BaseVisibilityService }], target: i0.ɵɵFactoryTarget.Component });
-MenuBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: MenuBarComponent, selector: "lib-menu-bar", ngImport: i0, template: "<div id=\"menu-bar\">\r\n  <div *ngIf=\"!isVisitor\">\r\n    <nav class=\"navbar navbar-expand-md navbar-light p-0\">\r\n      <div class=\"container-fluid\" *ngIf=\"isVisible\">\r\n        <div class=\"navbar-brand\" [routerLink]=\"['/dashboard']\">\r\n          <img alt=\"\" src=\"../assets/images/logos/logo-rvb-straight.png\">\r\n        </div>\r\n        <button class=\"navbar-toggler\" data-bs-target=\".navbar-collapse\" data-bs-toggle=\"collapse\" type=\"button\">\r\n          <span class=\"navbar-toggler-icon\"></span>\r\n        </button>\r\n        <div class=\"collapse navbar-collapse\">\r\n          <form class=\"form-inline ms-3 form-container \">\r\n            <input class=\"form-control search-button\" placeholder=\"keyword\" id=\"mainSearchBar\" type=\"text\">\r\n            <button class=\"btn btn-outline-primary rounded-pill me-2\" (click)=\"onSubmit()\">{{'Search' |\r\n              translate}}</button>\r\n            <lib-range-date-picker cacheName=\"mainDate\"></lib-range-date-picker>\r\n            <div class=\"change-position-button\">\r\n              <input type=\"checkbox\" class=\"btn-check\" id=\"btn-check-outlined\" autocomplete=\"off\">\r\n              <label class=\"btn btn-outline-primary\" (click)=\"onChangePositionClick()\"\r\n                for=\"btn-check-outlined\">{{\"Change position\" | translate}}</label>\r\n            </div>\r\n          </form>\r\n          <div class=\"ms-auto nav-item dropdown\">\r\n            <div class=\"profile_pic dropdown-toggle\" data-testid=\"dropdown-menu-button\" data-bs-toggle=\"dropdown\">\r\n              <lib-avatar></lib-avatar>\r\n            </div>\r\n            <div class=\"dropdown-menu dropdown-menu-right\">\r\n              <p *ngIf=\"user && mission\" class=\"p-2\">\r\n                <span class=\"username\">{{ user.displayName }}</span><br />\r\n                <span class=\"user-role\">{{ mission.role }}</span><br />\r\n                <span class=\"org\">{{ mission.organisation ? mission.organisation.name : \"No organisation\" |\r\n                  translate}}</span>\r\n              </p>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <!-- <a class=\"dropdown-item\" routerLink=\"/debug\" *ngIf=\"isManager\">Debug</a> -->\r\n              <a class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/dashboard\">{{'Data management' | translate}}</a>\r\n              <a class=\"dropdown-item\" data-testid=\"user-management-btn\" routerLink=\"/admin\" *ngIf=\"isManager\">\r\n                {{'Users management' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/profile\">\r\n                {{'Profile' | translate}}</a>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n              <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n                translate}}</button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </nav>\r\n    <lib-navigation-bar *ngIf=\"isVisible && isChangePositionVisible\"></lib-navigation-bar>\r\n  </div>\r\n  <div *ngIf=\"isVisitor && isVisible\">\r\n    <div class=\"visitor-div\">\r\n      <div class=\"logo-container\" data-testid=\"dropdown-menu-button\">\r\n        <img class=\"img-logo\" alt=\"SmarterPlanLogo\" src=\"../assets/images/logos/logo-reserve.png\">\r\n      </div>\r\n      <div class=\"avatar-container-menu\">\r\n        <div class=\"profile_pic dropdown-toggle\" data-bs-toggle=\"dropdown\">\r\n          <lib-avatar></lib-avatar>\r\n        </div>\r\n        <div class=\"dropdown-menu dropdown-menu-right\">\r\n          <button class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</button>\r\n          <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n          <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n            translate}}</button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["#menu-bar{position:sticky;top:0;z-index:200}.navbar{z-index:200}.navbar-brand{padding-top:5px;padding-bottom:5px;cursor:pointer}.navbar-brand img{height:70px}.profile_pic{border-radius:50%;height:45px;width:45px;margin:8px;border:.2px solid #969696}.navbar-nav .profile-pic-container .dropdown-menu{position:absolute}.navbar.second-nav{z-index:199;background-color:var(--smarterplan-primary)}.profile_pic.dropdown-toggle:after{display:none}.navbar-light{border-bottom:1px solid var(--smarterplan-primary);background-color:#fff}input,select{margin-right:15px}.select{background:transparent;border:none;color:#fff;margin:6px 20px 0;width:auto}button{background-color:#fff;color:var(--smarterplan-primary);padding:5px 10px}button:disabled,button[disabled]{color:#c04f4f}.navbar-toggler{margin-right:1em}.icon{height:40px;width:40px;color:var(--smarterplan-primary)}.search-button{width:auto}.visitor-div{background-color:var(--smarterplan-primary);height:60px;display:flex;justify-content:space-between}.logo-container,.img-logo{height:100%}.change-position-button{margin-left:2rem}.change-position-button label,.change-position-button .btn-check:checked,.change-position-button .btn-check:focus,.change-position-button .btn-outline-primary,.change-position-button .btn{box-shadow:none!important;outline:0}.change-position-button label{border-radius:16px}.change-position-button .btn-check:checked+.btn{background-color:var(--smarterplan-primary);color:#fff!important}@media (min-width: 1200px){.navbar-brand img{height:100px}.profile_pic{height:60px;width:60px;margin:15px}.search-button{width:500px}}@media (min-width: 992px) and (max-width: 1199.98px){.navbar-brand img{height:80px}.profile_pic{height:50px;width:50px;margin:12px}.search-button{width:400px}}@media (min-width: 768px) and (max-width: 991.98px){.navbar-brand img{height:60px}.profile_pic{height:40px;width:40px;margin:10px}.search-button{width:300px}}@media (max-width: 767.98px){.navbar-brand img{height:50px}.profile_pic{height:30px;width:30px;margin:8px}.search-button{width:200px}}.form-container{margin:.5rem 0}\n"], components: [{ type: RangeDatePickerComponent, selector: "lib-range-date-picker", inputs: ["cacheName"] }, { type: AvatarComponent, selector: "lib-avatar", inputs: ["size", "userID"] }, { type: NavigationBarComponent, selector: "lib-navigation-bar" }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.NgbNavbar, selector: ".navbar" }, { type: i1$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "translate": i1.TranslatePipe } });
+MenuBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: MenuBarComponent, selector: "lib-menu-bar", ngImport: i0, template: "<div id=\"menu-bar\">\r\n  <div *ngIf=\"!isVisitor\">\r\n    <nav class=\"navbar navbar-expand-md navbar-light p-0\">\r\n      <div class=\"container-fluid\" *ngIf=\"isVisible\">\r\n        <div class=\"navbar-brand\" [routerLink]=\"['/dashboard']\">\r\n          <img alt=\"\" src=\"../assets/images/logos/logo-rvb-straight.png\">\r\n        </div>\r\n        <button class=\"navbar-toggler\" data-bs-target=\".navbar-collapse\" data-bs-toggle=\"collapse\" type=\"button\">\r\n          <span class=\"navbar-toggler-icon\"></span>\r\n        </button>\r\n        <div class=\"collapse navbar-collapse\">\r\n          <form class=\"form-inline ms-3 form-container \">\r\n            <input class=\"form-control search-button\" placeholder=\"keyword\" id=\"mainSearchBar\" type=\"text\">\r\n            <button class=\"btn btn-outline-primary rounded-pill me-2\" (click)=\"onSubmit()\">{{'Search' |\r\n              translate}}</button>\r\n            <lib-range-date-picker cacheName=\"mainDate\"></lib-range-date-picker>\r\n            <div class=\"change-position-button\">\r\n              <input type=\"checkbox\" class=\"btn-check\" id=\"btn-check-outlined\" autocomplete=\"off\">\r\n              <label class=\"btn btn-outline-primary\" (click)=\"onChangePositionClick()\"\r\n                for=\"btn-check-outlined\">{{\"Change position\" | translate}}</label>\r\n            </div>\r\n          </form>\r\n          <div class=\"ms-auto nav-item dropdown profile_pic-container\">\r\n            <div class=\"profile_pic dropdown-toggle\" data-testid=\"dropdown-menu-button\" data-bs-toggle=\"dropdown\">\r\n              <lib-avatar></lib-avatar>\r\n            </div>\r\n            <div class=\"dropdown-menu dropdown-menu-right\">\r\n              <p *ngIf=\"user && mission\" class=\"p-2\">\r\n                <span class=\"username\">{{ user.displayName }}</span><br />\r\n                <span class=\"user-role\">{{ mission.role }}</span><br />\r\n                <span class=\"org\">{{ mission.organisation ? mission.organisation.name : \"No organisation\" |\r\n                  translate}}</span>\r\n              </p>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <!-- <a class=\"dropdown-item\" routerLink=\"/debug\" *ngIf=\"isManager\">Debug</a> -->\r\n              <a class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/dashboard\">{{'Data management' | translate}}</a>\r\n              <a class=\"dropdown-item\" data-testid=\"user-management-btn\" routerLink=\"/admin\" *ngIf=\"isManager\">\r\n                {{'Users management' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/profile\">\r\n                {{'Profile' | translate}}</a>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n              <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n                translate}}</button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </nav>\r\n    <lib-navigation-bar *ngIf=\"isVisible && isChangePositionVisible\"></lib-navigation-bar>\r\n  </div>\r\n  <div *ngIf=\"isVisitor && isVisible\">\r\n    <div class=\"visitor-div\">\r\n      <div class=\"logo-container\" data-testid=\"dropdown-menu-button\">\r\n        <img class=\"img-logo\" alt=\"SmarterPlanLogo\" src=\"../assets/images/logos/logo-reserve.png\">\r\n      </div>\r\n      <div class=\"avatar-container-menu\">\r\n        <div class=\"profile_pic dropdown-toggle\" data-bs-toggle=\"dropdown\">\r\n          <lib-avatar></lib-avatar>\r\n        </div>\r\n        <div class=\"dropdown-menu dropdown-menu-right\">\r\n          <button class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</button>\r\n          <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n          <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n            translate}}</button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["#menu-bar{position:sticky;top:0;z-index:200}.navbar{z-index:200}.navbar-brand{padding-top:5px;padding-bottom:5px;cursor:pointer}.navbar-brand img{height:70px}.profile_pic{border-radius:50%;height:45px;width:45px;margin:8px;border:.2px solid #969696}.navbar-nav .profile-pic-container .dropdown-menu{position:absolute}.navbar.second-nav{z-index:199;background-color:var(--smarterplan-primary)}.profile_pic.dropdown-toggle:after{display:none}.navbar-light{border-bottom:1px solid var(--smarterplan-primary);background-color:#fff}.navbar form{width:100%;margin:0;padding:0}input,select{margin-right:15px}.select{background:transparent;border:none;color:#fff;margin:6px 20px 0;width:auto}button{background-color:#fff;color:var(--smarterplan-primary);padding:5px 10px}button:disabled,button[disabled]{color:#c04f4f}.navbar-toggler{margin-right:1em}.icon{height:40px;width:40px;color:var(--smarterplan-primary)}.search-button{width:auto}.visitor-div{background-color:var(--smarterplan-primary);height:60px;display:flex;justify-content:space-between}.profile_pic-container{margin-right:1em}.logo-container,.img-logo{height:100%}.change-position-button{margin-left:2rem}.change-position-button label,.change-position-button .btn-check:checked,.change-position-button .btn-check:focus,.change-position-button .btn-outline-primary,.change-position-button .btn{box-shadow:none!important;outline:0}.change-position-button label{border-radius:16px}.change-position-button .btn-check:checked+.btn{background-color:var(--smarterplan-primary);color:#fff!important}@media (min-width: 1200px){.navbar-brand img{height:100px}.profile_pic{height:60px;width:60px;margin:15px}.search-button{width:500px}}@media (min-width: 992px) and (max-width: 1199.98px){.navbar-brand img{height:80px}.profile_pic{height:50px;width:50px;margin:12px}.search-button{width:400px}}@media (min-width: 768px) and (max-width: 991.98px){.navbar-brand img{height:60px}.profile_pic{height:40px;width:40px;margin:10px}.search-button{width:300px}}@media (max-width: 767.98px){.navbar-brand img{height:50px}.profile_pic{height:30px;width:30px;margin:8px}.search-button{width:200px}}.form-container{margin:.5rem 0}.navbar-collapse.show{display:flex;padding-bottom:.5rem}\n"], components: [{ type: RangeDatePickerComponent, selector: "lib-range-date-picker", inputs: ["cacheName"] }, { type: AvatarComponent, selector: "lib-avatar", inputs: ["size", "userID"] }, { type: NavigationBarComponent, selector: "lib-navigation-bar" }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.NgbNavbar, selector: ".navbar" }, { type: i1$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "translate": i1.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: MenuBarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-menu-bar', template: "<div id=\"menu-bar\">\r\n  <div *ngIf=\"!isVisitor\">\r\n    <nav class=\"navbar navbar-expand-md navbar-light p-0\">\r\n      <div class=\"container-fluid\" *ngIf=\"isVisible\">\r\n        <div class=\"navbar-brand\" [routerLink]=\"['/dashboard']\">\r\n          <img alt=\"\" src=\"../assets/images/logos/logo-rvb-straight.png\">\r\n        </div>\r\n        <button class=\"navbar-toggler\" data-bs-target=\".navbar-collapse\" data-bs-toggle=\"collapse\" type=\"button\">\r\n          <span class=\"navbar-toggler-icon\"></span>\r\n        </button>\r\n        <div class=\"collapse navbar-collapse\">\r\n          <form class=\"form-inline ms-3 form-container \">\r\n            <input class=\"form-control search-button\" placeholder=\"keyword\" id=\"mainSearchBar\" type=\"text\">\r\n            <button class=\"btn btn-outline-primary rounded-pill me-2\" (click)=\"onSubmit()\">{{'Search' |\r\n              translate}}</button>\r\n            <lib-range-date-picker cacheName=\"mainDate\"></lib-range-date-picker>\r\n            <div class=\"change-position-button\">\r\n              <input type=\"checkbox\" class=\"btn-check\" id=\"btn-check-outlined\" autocomplete=\"off\">\r\n              <label class=\"btn btn-outline-primary\" (click)=\"onChangePositionClick()\"\r\n                for=\"btn-check-outlined\">{{\"Change position\" | translate}}</label>\r\n            </div>\r\n          </form>\r\n          <div class=\"ms-auto nav-item dropdown\">\r\n            <div class=\"profile_pic dropdown-toggle\" data-testid=\"dropdown-menu-button\" data-bs-toggle=\"dropdown\">\r\n              <lib-avatar></lib-avatar>\r\n            </div>\r\n            <div class=\"dropdown-menu dropdown-menu-right\">\r\n              <p *ngIf=\"user && mission\" class=\"p-2\">\r\n                <span class=\"username\">{{ user.displayName }}</span><br />\r\n                <span class=\"user-role\">{{ mission.role }}</span><br />\r\n                <span class=\"org\">{{ mission.organisation ? mission.organisation.name : \"No organisation\" |\r\n                  translate}}</span>\r\n              </p>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <!-- <a class=\"dropdown-item\" routerLink=\"/debug\" *ngIf=\"isManager\">Debug</a> -->\r\n              <a class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/dashboard\">{{'Data management' | translate}}</a>\r\n              <a class=\"dropdown-item\" data-testid=\"user-management-btn\" routerLink=\"/admin\" *ngIf=\"isManager\">\r\n                {{'Users management' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/profile\">\r\n                {{'Profile' | translate}}</a>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n              <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n                translate}}</button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </nav>\r\n    <lib-navigation-bar *ngIf=\"isVisible && isChangePositionVisible\"></lib-navigation-bar>\r\n  </div>\r\n  <div *ngIf=\"isVisitor && isVisible\">\r\n    <div class=\"visitor-div\">\r\n      <div class=\"logo-container\" data-testid=\"dropdown-menu-button\">\r\n        <img class=\"img-logo\" alt=\"SmarterPlanLogo\" src=\"../assets/images/logos/logo-reserve.png\">\r\n      </div>\r\n      <div class=\"avatar-container-menu\">\r\n        <div class=\"profile_pic dropdown-toggle\" data-bs-toggle=\"dropdown\">\r\n          <lib-avatar></lib-avatar>\r\n        </div>\r\n        <div class=\"dropdown-menu dropdown-menu-right\">\r\n          <button class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</button>\r\n          <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n          <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n            translate}}</button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["#menu-bar{position:sticky;top:0;z-index:200}.navbar{z-index:200}.navbar-brand{padding-top:5px;padding-bottom:5px;cursor:pointer}.navbar-brand img{height:70px}.profile_pic{border-radius:50%;height:45px;width:45px;margin:8px;border:.2px solid #969696}.navbar-nav .profile-pic-container .dropdown-menu{position:absolute}.navbar.second-nav{z-index:199;background-color:var(--smarterplan-primary)}.profile_pic.dropdown-toggle:after{display:none}.navbar-light{border-bottom:1px solid var(--smarterplan-primary);background-color:#fff}input,select{margin-right:15px}.select{background:transparent;border:none;color:#fff;margin:6px 20px 0;width:auto}button{background-color:#fff;color:var(--smarterplan-primary);padding:5px 10px}button:disabled,button[disabled]{color:#c04f4f}.navbar-toggler{margin-right:1em}.icon{height:40px;width:40px;color:var(--smarterplan-primary)}.search-button{width:auto}.visitor-div{background-color:var(--smarterplan-primary);height:60px;display:flex;justify-content:space-between}.logo-container,.img-logo{height:100%}.change-position-button{margin-left:2rem}.change-position-button label,.change-position-button .btn-check:checked,.change-position-button .btn-check:focus,.change-position-button .btn-outline-primary,.change-position-button .btn{box-shadow:none!important;outline:0}.change-position-button label{border-radius:16px}.change-position-button .btn-check:checked+.btn{background-color:var(--smarterplan-primary);color:#fff!important}@media (min-width: 1200px){.navbar-brand img{height:100px}.profile_pic{height:60px;width:60px;margin:15px}.search-button{width:500px}}@media (min-width: 992px) and (max-width: 1199.98px){.navbar-brand img{height:80px}.profile_pic{height:50px;width:50px;margin:12px}.search-button{width:400px}}@media (min-width: 768px) and (max-width: 991.98px){.navbar-brand img{height:60px}.profile_pic{height:40px;width:40px;margin:10px}.search-button{width:300px}}@media (max-width: 767.98px){.navbar-brand img{height:50px}.profile_pic{height:30px;width:30px;margin:8px}.search-button{width:200px}}.form-container{margin:.5rem 0}\n"] }]
+            args: [{ selector: 'lib-menu-bar', template: "<div id=\"menu-bar\">\r\n  <div *ngIf=\"!isVisitor\">\r\n    <nav class=\"navbar navbar-expand-md navbar-light p-0\">\r\n      <div class=\"container-fluid\" *ngIf=\"isVisible\">\r\n        <div class=\"navbar-brand\" [routerLink]=\"['/dashboard']\">\r\n          <img alt=\"\" src=\"../assets/images/logos/logo-rvb-straight.png\">\r\n        </div>\r\n        <button class=\"navbar-toggler\" data-bs-target=\".navbar-collapse\" data-bs-toggle=\"collapse\" type=\"button\">\r\n          <span class=\"navbar-toggler-icon\"></span>\r\n        </button>\r\n        <div class=\"collapse navbar-collapse\">\r\n          <form class=\"form-inline ms-3 form-container \">\r\n            <input class=\"form-control search-button\" placeholder=\"keyword\" id=\"mainSearchBar\" type=\"text\">\r\n            <button class=\"btn btn-outline-primary rounded-pill me-2\" (click)=\"onSubmit()\">{{'Search' |\r\n              translate}}</button>\r\n            <lib-range-date-picker cacheName=\"mainDate\"></lib-range-date-picker>\r\n            <div class=\"change-position-button\">\r\n              <input type=\"checkbox\" class=\"btn-check\" id=\"btn-check-outlined\" autocomplete=\"off\">\r\n              <label class=\"btn btn-outline-primary\" (click)=\"onChangePositionClick()\"\r\n                for=\"btn-check-outlined\">{{\"Change position\" | translate}}</label>\r\n            </div>\r\n          </form>\r\n          <div class=\"ms-auto nav-item dropdown profile_pic-container\">\r\n            <div class=\"profile_pic dropdown-toggle\" data-testid=\"dropdown-menu-button\" data-bs-toggle=\"dropdown\">\r\n              <lib-avatar></lib-avatar>\r\n            </div>\r\n            <div class=\"dropdown-menu dropdown-menu-right\">\r\n              <p *ngIf=\"user && mission\" class=\"p-2\">\r\n                <span class=\"username\">{{ user.displayName }}</span><br />\r\n                <span class=\"user-role\">{{ mission.role }}</span><br />\r\n                <span class=\"org\">{{ mission.organisation ? mission.organisation.name : \"No organisation\" |\r\n                  translate}}</span>\r\n              </p>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <!-- <a class=\"dropdown-item\" routerLink=\"/debug\" *ngIf=\"isManager\">Debug</a> -->\r\n              <a class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/dashboard\">{{'Data management' | translate}}</a>\r\n              <a class=\"dropdown-item\" data-testid=\"user-management-btn\" routerLink=\"/admin\" *ngIf=\"isManager\">\r\n                {{'Users management' | translate}}</a>\r\n              <a class=\"dropdown-item\" routerLink=\"/profile\">\r\n                {{'Profile' | translate}}</a>\r\n              <div class=\"dropdown-divider\"></div>\r\n              <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n              <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n                translate}}</button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </nav>\r\n    <lib-navigation-bar *ngIf=\"isVisible && isChangePositionVisible\"></lib-navigation-bar>\r\n  </div>\r\n  <div *ngIf=\"isVisitor && isVisible\">\r\n    <div class=\"visitor-div\">\r\n      <div class=\"logo-container\" data-testid=\"dropdown-menu-button\">\r\n        <img class=\"img-logo\" alt=\"SmarterPlanLogo\" src=\"../assets/images/logos/logo-reserve.png\">\r\n      </div>\r\n      <div class=\"avatar-container-menu\">\r\n        <div class=\"profile_pic dropdown-toggle\" data-bs-toggle=\"dropdown\">\r\n          <lib-avatar></lib-avatar>\r\n        </div>\r\n        <div class=\"dropdown-menu dropdown-menu-right\">\r\n          <button class=\"dropdown-item\" (click)=\"localeService.modal()\">{{'Language' | translate}}</button>\r\n          <button class=\"dropdown-item\" (click)=\"openSupportForm()\">{{\"Help\" | translate}}</button>\r\n          <button data-testid=\"logout-auth-btn\" class=\"dropdown-item\" (click)=\"signOut()\">{{\"Logout\" |\r\n            translate}}</button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["#menu-bar{position:sticky;top:0;z-index:200}.navbar{z-index:200}.navbar-brand{padding-top:5px;padding-bottom:5px;cursor:pointer}.navbar-brand img{height:70px}.profile_pic{border-radius:50%;height:45px;width:45px;margin:8px;border:.2px solid #969696}.navbar-nav .profile-pic-container .dropdown-menu{position:absolute}.navbar.second-nav{z-index:199;background-color:var(--smarterplan-primary)}.profile_pic.dropdown-toggle:after{display:none}.navbar-light{border-bottom:1px solid var(--smarterplan-primary);background-color:#fff}.navbar form{width:100%;margin:0;padding:0}input,select{margin-right:15px}.select{background:transparent;border:none;color:#fff;margin:6px 20px 0;width:auto}button{background-color:#fff;color:var(--smarterplan-primary);padding:5px 10px}button:disabled,button[disabled]{color:#c04f4f}.navbar-toggler{margin-right:1em}.icon{height:40px;width:40px;color:var(--smarterplan-primary)}.search-button{width:auto}.visitor-div{background-color:var(--smarterplan-primary);height:60px;display:flex;justify-content:space-between}.profile_pic-container{margin-right:1em}.logo-container,.img-logo{height:100%}.change-position-button{margin-left:2rem}.change-position-button label,.change-position-button .btn-check:checked,.change-position-button .btn-check:focus,.change-position-button .btn-outline-primary,.change-position-button .btn{box-shadow:none!important;outline:0}.change-position-button label{border-radius:16px}.change-position-button .btn-check:checked+.btn{background-color:var(--smarterplan-primary);color:#fff!important}@media (min-width: 1200px){.navbar-brand img{height:100px}.profile_pic{height:60px;width:60px;margin:15px}.search-button{width:500px}}@media (min-width: 992px) and (max-width: 1199.98px){.navbar-brand img{height:80px}.profile_pic{height:50px;width:50px;margin:12px}.search-button{width:400px}}@media (min-width: 768px) and (max-width: 991.98px){.navbar-brand img{height:60px}.profile_pic{height:40px;width:40px;margin:10px}.search-button{width:300px}}@media (max-width: 767.98px){.navbar-brand img{height:50px}.profile_pic{height:30px;width:30px;margin:8px}.search-button{width:200px}}.form-container{margin:.5rem 0}.navbar-collapse.show{display:flex;padding-bottom:.5rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: LocaleService }, { type: BaseUserService }, { type: NavigatorService }, { type: SupportService }, { type: BaseVisibilityService }]; } });
 
 class NgxSmarterplanCoreModule {