npm - @smarterplan/ngx-smarterplan-admin - Versions diffs - 0.1.35 → 0.1.37 - Mend

@smarterplan/ngx-smarterplan-admin 0.1.35 → 0.1.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/fesm2020/smarterplan-ngx-smarterplan-admin.mjs CHANGED Viewed

@@ -3,7 +3,7 @@ import { Injectable, Component, Input, EventEmitter, Output, ViewChild, NgModule
 import * as i2 from '@angular/forms';
 import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i1 from '@smarterplan/ngx-smarterplan-core';
-import { RoleStatus, ProfileEntity, removeNullKeysFromObject, stringLocaleToEnum, enumToArray, Locale, LevelStatus, EmailStatus, getSignedFile, deleteFromS3, uploadFileToS3, filterUniqueArrayByID, waitUntil, DomainType, textValidator, noEmptyValidator, floatValidator, sortAlphabeticallyOnName, validEmail, NgxSmarterplanCoreModule } from '@smarterplan/ngx-smarterplan-core';
+import { RoleStatus, ProfileEntity, removeNullKeysFromObject, stringLocaleToEnum, enumToArray, Locale, textValidator, noEmptyValidator, floatValidator, LevelStatus, EmailStatus, getSignedFile, deleteFromS3, uploadFileToS3, filterUniqueArrayByID, waitUntil, DomainType, sortAlphabeticallyOnName, validEmail, NgxSmarterplanCoreModule } from '@smarterplan/ngx-smarterplan-core';
 import * as i3 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
 import * as i4 from '@angular/common';
@@ -265,7 +265,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
             }] } });
 class FormMissionComponent {
-    constructor(fb, spaceService, userService, domainService, organisationService, zoneService, hashtagService, localeService) {
+    constructor(fb, spaceService, userService, domainService, organisationService, zoneService, hashtagService, localeService, validatorsService) {
         this.fb = fb;
         this.spaceService = spaceService;
         this.userService = userService;
@@ -274,6 +274,7 @@ class FormMissionComponent {
         this.zoneService = zoneService;
         this.hashtagService = hashtagService;
         this.localeService = localeService;
+        this.validatorsService = validatorsService;
         this.addedMissionInput = new EventEmitter();
         this.availableHashtags = [];
         this.isGuide = false;
@@ -319,7 +320,19 @@ class FormMissionComponent {
         return this.missionForm.get("role");
     }
     async initFormForEdit() {
+        let startDate = '';
+        let endDate = '';
         const m = this.missionToEdit;
+        if (m.startDateTime) {
+            const date = DateTime.fromISO(m.startDateTime);
+            this.missionTimeStart = (date.hour * 60 + date.minute) * 60 * 1000;
+            startDate = date.toMillis() - this.missionTimeStart;
+        }
+        if (m.endDateTime) {
+            const date = DateTime.fromISO(m.endDateTime);
+            this.missionTimeEnd = (date.hour * 60 + date.minute) * 60 * 1000;
+            endDate = date.toMillis() - this.missionTimeEnd;
+        }
         this.userForMissionID = m.userID;
         this.availableSpaces = await this.spaceService.getAllowedSpacesForOrg(this.missionToEdit.organisationID, this.currentUserOrganisation.id);
         await this.setHashtags(m.spaceID);
@@ -328,27 +341,19 @@ class FormMissionComponent {
             organisation: [{ value: m.organisation.name, disabled: true }],
             organisationID: m.organisationID,
             orderedOrganisationID: m.orderedOrganisationID,
-            role: [m.role],
+            role: [m.role, Validators.required],
             level: [m.level],
-            space: [m.spaceID],
-            description: [m.description],
+            space: [m.spaceID, Validators.required],
+            description: [m.description, [textValidator(), noEmptyValidator()]],
             domains: [m.domains],
             zone: [m.zoneID],
             locale: [m.locale],
+            startDate: [startDate, [floatValidator()]],
+            endDate: [endDate, [floatValidator()]],
         });
         if (m.hashtags && m.hashtags.length > 0) {
             this.addedHashtags = this.availableHashtags.filter((hashtag) => m.hashtags.includes(hashtag.id));
         }
-        if (m.startDateTime) {
-            const date = DateTime.fromISO(m.startDateTime);
-            this.missionTimeStart = (date.hour * 60 + date.minute) * 60 * 1000;
-            this.startDate = date.toMillis() - this.missionTimeStart;
-        }
-        if (m.endDateTime) {
-            const date = DateTime.fromISO(m.endDateTime);
-            this.missionTimeEnd = (date.hour * 60 + date.minute) * 60 * 1000;
-            this.endDate = date.toMillis() - this.missionTimeEnd;
-        }
         this.onSpaceClick();
     }
     async onSpaceClick() {
@@ -362,18 +367,20 @@ class FormMissionComponent {
     async initEmptyForm() {
         this.availableSpaces = await this.spaceService.getAllowedSpacesForOrg(this.organisationForMission.id, this.currentUserOrganisation.id);
         this.missionForm = this.fb.group({
-            role: [null, Validators.required],
+            role: ['', Validators.required],
             level: [LevelStatus.MINIMUM],
             organisation: [
                 { value: this.organisationForMission.name, disabled: true },
             ],
             organisationID: this.organisationForMission.id,
             orderedOrganisationID: this.currentUserOrganisation.id,
-            space: [null, Validators.required],
-            zone: [null],
-            description: [""],
+            space: ['', Validators.required],
+            zone: [''],
+            description: ["", [textValidator(), noEmptyValidator()]],
             domains: [null],
             locale: [this.currentLocale],
+            startDate: ['', [floatValidator()]],
+            endDate: ['', [floatValidator()]],
         });
     }
     onHashtagClick(hashtag) {
@@ -399,13 +406,13 @@ class FormMissionComponent {
         }
         let startDateString;
         let endDateString;
-        if (this.startDate) {
-            const dateHourStartNumber = this.startDate + this.missionTimeStart;
+        if (formValue.startDate) {
+            const dateHourStartNumber = formValue.startDate + this.missionTimeStart;
             const startDate = DateTime.fromMillis(dateHourStartNumber);
             startDateString = startDate.toISO();
         }
-        if (this.endDate) {
-            const dateHourEndNumber = this.endDate + this.missionTimeEnd;
+        if (formValue.endDate) {
+            const dateHourEndNumber = formValue.endDate + this.missionTimeEnd;
             const endDate = DateTime.fromMillis(dateHourEndNumber);
             endDateString = endDate.toISO();
         }
@@ -440,12 +447,12 @@ class FormMissionComponent {
         this.addedMissionInput.emit(null);
     }
 }
-FormMissionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: FormMissionComponent, deps: [{ token: i2.FormBuilder }, { token: i1.SpaceService }, { token: i1.BaseUserService }, { token: i1.DomainService }, { token: i1.OrganisationService }, { token: i1.ZoneService }, { token: i1.HashtagService }, { token: i1.LocaleService }], target: i0.ɵɵFactoryTarget.Component });
-FormMissionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: FormMissionComponent, selector: "lib-form-mission", inputs: { missionToEdit: "missionToEdit", organisationForMission: "organisationForMission", isSP: "isSP", userForMissionID: "userForMissionID", currentUserOrganisation: "currentUserOrganisation" }, outputs: { addedMissionInput: "addedMissionInput" }, ngImport: i0, template: "<div class=\"form-containter\" *ngIf=\"missionForm\">\r\n    <div style=\"margin-top: 1rem;\">\r\n        <h4>{{ 'Mission details' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"missionForm\">\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Organisation' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <input type=\"text\" class=\"form-control\" formControlName=\"organisation\">\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\" *ngIf=\"isSP\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Ordered by' | translate }}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"orderedOrganisationID\">\r\n                    <option *ngFor=\"let org of allOrgs\" [ngValue]=\"org.id\">\r\n                        {{ org.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <textarea class=\"form-control\" formControlName=\"description\" rows=\"10\"></textarea>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Role' | translate}}*</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"role\" [class.is-invalid]=\"role.invalid && role.touched\">\r\n                    <option *ngFor=\"let r of availableRoles\" [ngValue]=\"r\">\r\n                        {{ r }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    {{'Role is required' | translate}}.\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\"\r\n            *ngIf=\"missionForm.get('role').value !== 'VISITOR_MUSEUM' && missionForm.get('role').value !== 'GUIDE_MUSEUM'\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Domains' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"domains\">\r\n                <select class=\"form-control\" multiple formControlName=\"domains\">\r\n                    <option *ngFor=\"let domain of domains\" [ngValue]=\"domain.id\">\r\n                        {{ domain.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Access level' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"level\">\r\n                    <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                        {{ level }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"availableSpaces\">\r\n                <select class=\"form-control\" required formControlName=\"space\" (change)=\"onSpaceClick()\" \r\n                [class.is-invalid]=\"spaceID.invalid && spaceID.touched\">\r\n                    <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                        {{ space.name }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    {{'Location is required' | translate}}.\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                {{ 'No locations available' | translate}}\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"zonesForSpace; else noSpace\">\r\n                <select class=\"form-control\" formControlName=\"zone\">\r\n                    <option [ngValue]=\"defaultZone.id\">\r\n                        {{ 'All zones' | translate }}\r\n                    </option>\r\n                    <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                        {{ zone.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n            <ng-template #noSpace>\r\n                <div class=\"col-sm-8 hint-container\">\r\n                    <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </ng-template>\r\n        </div>\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" formControlName=\"locale\">\r\n                    <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                    <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                        {{ locale }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n        <!-- Hashtags are available after Space is set -->\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}} </p>\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                    {{'No hashtags created for this location' | translate}} </p>\r\n                <div *ngIf=\"availableHashtags.length > 0\">\r\n                    <ul class=\"keywordsDisplay no-border\">\r\n                        <div class=\"keywordsdisplayContainer\">\r\n                            <li *ngFor=\"let hashtag of availableHashtags\"\r\n                                [class]=\"hashtagAdded(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                (click)=\"onHashtagClick(hashtag)\" style=\"cursor: pointer;\"\r\n                                ngbTooltip=\"{{hashtagAdded(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                {{hashtag.name}}\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                    <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                    <ul class=\"keywordsDisplay\">\r\n                        <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                            <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}\r\n                                <a type=\"button\" class=\"closeButton\" (click)=\"removeHashtag(hashtag)\">\r\n                                    <span class=\"crossItem\"></span>\r\n                                </a>\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8 hint-container\" *ngIf=\"!spaceID.value\">\r\n                <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" [(ngModel)]=\"startDate\" ngbDatepicker\r\n                    #d1=\"ngbDatepicker\" [ngModelOptions]=\"{standalone: true}\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" [(ngModel)]=\"endDate\" ngbDatepicker\r\n                    #d2=\"ngbDatepicker\" [ngModelOptions]=\"{standalone: true}\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" class=\"btn btn-outline-primary rounded-pill mr-3 action-button\"\r\n                >{{'Save' | translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' |\r\n                translate}}</button>\r\n        </div>\r\n    </form>\r\n</div>", styles: [".form-containter{padding:0rem 1rem;margin-bottom:2rem}.checkbox-apply{margin-top:calc(.375rem + 1px)}.keywordsDisplay{min-height:40px}.hint{margin:0!important}.hint-container{display:flex;align-items:center}.crossItem{margin:0;padding:0;border:0;background:none;position:relative;width:7px;height:20px}.crossItem:before,.crossItem:after{content:\"\";position:absolute;top:6.25px;left:0;right:0;height:1.5px;background:#fff;border-radius:1.5px}.crossItem:before{transform:rotate(45deg)}.crossItem:after{transform:rotate(-45deg)}.crossItem span{display:block}.btn-control-div .btn{width:8rem}.timeZoneContainer{align-items:center}.timeZoneContainer span{margin-left:5px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}\n"], components: [{ type: i4$1.NgbTimepicker, selector: "ngb-timepicker", inputs: ["meridian", "spinners", "seconds", "hourStep", "minuteStep", "secondStep", "readonlyInputs", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { type: i4$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { type: i4$1.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: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe } });
+FormMissionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: FormMissionComponent, deps: [{ token: i2.FormBuilder }, { token: i1.SpaceService }, { token: i1.BaseUserService }, { token: i1.DomainService }, { token: i1.OrganisationService }, { token: i1.ZoneService }, { token: i1.HashtagService }, { token: i1.LocaleService }, { token: i1.ValidatorsService }], target: i0.ɵɵFactoryTarget.Component });
+FormMissionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: FormMissionComponent, selector: "lib-form-mission", inputs: { missionToEdit: "missionToEdit", organisationForMission: "organisationForMission", isSP: "isSP", userForMissionID: "userForMissionID", currentUserOrganisation: "currentUserOrganisation" }, outputs: { addedMissionInput: "addedMissionInput" }, ngImport: i0, template: "<div class=\"form-containter\" *ngIf=\"missionForm\">\r\n    <div style=\"margin-top: 1rem;\">\r\n        <h4>{{ 'Mission details' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"missionForm\">\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Organisation' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <input type=\"text\"  data-testid=\"form-mission-organisation\" class=\"form-control\" formControlName=\"organisation\">\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\" *ngIf=\"isSP\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Ordered by' | translate }}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"orderedOrganisationID\">\r\n                    <option *ngFor=\"let org of allOrgs\" [ngValue]=\"org.id\">\r\n                        {{ org.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <textarea class=\"form-control\" formControlName=\"description\" rows=\"10\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['description'])\"\r\n                    data-testid=\"form-mission-description\"></textarea>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-description-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['description'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['description'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Role' | translate}}*</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"role\" data-testid=\"form-mission-role\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['role'])\">\r\n                    <option *ngFor=\"let r of availableRoles\" [ngValue]=\"r\">\r\n                        {{ r }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-role-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['role'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['role'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\"\r\n            *ngIf=\"missionForm.get('role').value !== 'VISITOR_MUSEUM' && missionForm.get('role').value !== 'GUIDE_MUSEUM'\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Domains' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"domains\">\r\n                <select class=\"form-control\" multiple formControlName=\"domains\">\r\n                    <option *ngFor=\"let domain of domains\" [ngValue]=\"domain.id\">\r\n                        {{ domain.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Access level' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"level\" data-testid=\"form-mission-level\">\r\n                    <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                        {{ level }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"availableSpaces\">\r\n                <select class=\"form-control\" required formControlName=\"space\" (change)=\"onSpaceClick()\"\r\n                    data-testid=\"form-mission-space\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['space'])\">\r\n                    <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                        {{ space.name }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-space-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['space'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['space'])\"></span>\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                {{ 'No locations available' | translate}}\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"zonesForSpace; else noSpace\">\r\n                <select class=\"form-control\" formControlName=\"zone\" data-testid=\"form-mission-zone\">\r\n                    <option [ngValue]=\"defaultZone.id\">\r\n                        {{ 'All zones' | translate }}\r\n                    </option>\r\n                    <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                        {{ zone.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n            <ng-template #noSpace>\r\n                <div class=\"col-sm-8 hint-container\">\r\n                    <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </ng-template>\r\n        </div>\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" formControlName=\"locale\">\r\n                    <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                    <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                        {{ locale }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n        <!-- Hashtags are available after Space is set -->\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}} </p>\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                    {{'No hashtags created for this location' | translate}} </p>\r\n                <div *ngIf=\"availableHashtags.length > 0\">\r\n                    <ul class=\"keywordsDisplay no-border\">\r\n                        <div class=\"keywordsdisplayContainer\">\r\n                            <li *ngFor=\"let hashtag of availableHashtags\"\r\n                                [class]=\"hashtagAdded(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                (click)=\"onHashtagClick(hashtag)\" style=\"cursor: pointer;\"\r\n                                ngbTooltip=\"{{hashtagAdded(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                {{hashtag.name}}\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                    <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                    <ul class=\"keywordsDisplay\">\r\n                        <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                            <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}\r\n                                <a type=\"button\" class=\"closeButton\" (click)=\"removeHashtag(hashtag)\">\r\n                                    <span class=\"crossItem\"></span>\r\n                                </a>\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8 hint-container\" *ngIf=\"!spaceID.value\">\r\n                <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"startDate\" ngbDatepicker\r\n                    #d1=\"ngbDatepicker\" data-testid=\"form-mission-startDate\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['startDate'])\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                </div>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-startDate-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['startDate'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['startDate'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" ngbDatepicker #d2=\"ngbDatepicker\"\r\n                    formControlName=\"endDate\" data-testid=\"form-mission-endDate\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['endDate'])\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                </div>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-endDate-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['endDate'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['endDate'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" [disabled]=\"missionForm.invalid\"\r\n                class=\"btn btn-outline-primary rounded-pill mr-3 action-button\"\r\n                data-testid=\"form-mission-submit-btn\">{{'Save' |\r\n                translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\" data-testid=\"form-mission-cancel-btn\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' |\r\n                translate}}</button>\r\n        </div>\r\n    </form>\r\n</div>", styles: [".form-containter{padding:0rem 1rem;margin-bottom:2rem}.checkbox-apply{margin-top:calc(.375rem + 1px)}.keywordsDisplay{min-height:40px}.hint{margin:0!important}.hint-container{display:flex;align-items:center}.crossItem{margin:0;padding:0;border:0;background:none;position:relative;width:7px;height:20px}.crossItem:before,.crossItem:after{content:\"\";position:absolute;top:6.25px;left:0;right:0;height:1.5px;background:#fff;border-radius:1.5px}.crossItem:before{transform:rotate(45deg)}.crossItem:after{transform:rotate(-45deg)}.crossItem span{display:block}.btn-control-div .btn{width:8rem}.timeZoneContainer{align-items:center}.timeZoneContainer span{margin-left:5px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}\n"], components: [{ type: i4$1.NgbTimepicker, selector: "ngb-timepicker", inputs: ["meridian", "spinners", "seconds", "hourStep", "minuteStep", "secondStep", "readonlyInputs", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { type: i4$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { type: i4$1.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: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: FormMissionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-form-mission', template: "<div class=\"form-containter\" *ngIf=\"missionForm\">\r\n    <div style=\"margin-top: 1rem;\">\r\n        <h4>{{ 'Mission details' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"missionForm\">\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Organisation' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <input type=\"text\" class=\"form-control\" formControlName=\"organisation\">\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\" *ngIf=\"isSP\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Ordered by' | translate }}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"orderedOrganisationID\">\r\n                    <option *ngFor=\"let org of allOrgs\" [ngValue]=\"org.id\">\r\n                        {{ org.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <textarea class=\"form-control\" formControlName=\"description\" rows=\"10\"></textarea>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Role' | translate}}*</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"role\" [class.is-invalid]=\"role.invalid && role.touched\">\r\n                    <option *ngFor=\"let r of availableRoles\" [ngValue]=\"r\">\r\n                        {{ r }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    {{'Role is required' | translate}}.\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\"\r\n            *ngIf=\"missionForm.get('role').value !== 'VISITOR_MUSEUM' && missionForm.get('role').value !== 'GUIDE_MUSEUM'\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Domains' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"domains\">\r\n                <select class=\"form-control\" multiple formControlName=\"domains\">\r\n                    <option *ngFor=\"let domain of domains\" [ngValue]=\"domain.id\">\r\n                        {{ domain.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Access level' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"level\">\r\n                    <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                        {{ level }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"availableSpaces\">\r\n                <select class=\"form-control\" required formControlName=\"space\" (change)=\"onSpaceClick()\" \r\n                [class.is-invalid]=\"spaceID.invalid && spaceID.touched\">\r\n                    <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                        {{ space.name }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    {{'Location is required' | translate}}.\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                {{ 'No locations available' | translate}}\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"zonesForSpace; else noSpace\">\r\n                <select class=\"form-control\" formControlName=\"zone\">\r\n                    <option [ngValue]=\"defaultZone.id\">\r\n                        {{ 'All zones' | translate }}\r\n                    </option>\r\n                    <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                        {{ zone.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n            <ng-template #noSpace>\r\n                <div class=\"col-sm-8 hint-container\">\r\n                    <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </ng-template>\r\n        </div>\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" formControlName=\"locale\">\r\n                    <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                    <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                        {{ locale }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n        <!-- Hashtags are available after Space is set -->\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}} </p>\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                    {{'No hashtags created for this location' | translate}} </p>\r\n                <div *ngIf=\"availableHashtags.length > 0\">\r\n                    <ul class=\"keywordsDisplay no-border\">\r\n                        <div class=\"keywordsdisplayContainer\">\r\n                            <li *ngFor=\"let hashtag of availableHashtags\"\r\n                                [class]=\"hashtagAdded(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                (click)=\"onHashtagClick(hashtag)\" style=\"cursor: pointer;\"\r\n                                ngbTooltip=\"{{hashtagAdded(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                {{hashtag.name}}\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                    <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                    <ul class=\"keywordsDisplay\">\r\n                        <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                            <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}\r\n                                <a type=\"button\" class=\"closeButton\" (click)=\"removeHashtag(hashtag)\">\r\n                                    <span class=\"crossItem\"></span>\r\n                                </a>\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8 hint-container\" *ngIf=\"!spaceID.value\">\r\n                <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" [(ngModel)]=\"startDate\" ngbDatepicker\r\n                    #d1=\"ngbDatepicker\" [ngModelOptions]=\"{standalone: true}\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" [(ngModel)]=\"endDate\" ngbDatepicker\r\n                    #d2=\"ngbDatepicker\" [ngModelOptions]=\"{standalone: true}\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" class=\"btn btn-outline-primary rounded-pill mr-3 action-button\"\r\n                >{{'Save' | translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' |\r\n                translate}}</button>\r\n        </div>\r\n    </form>\r\n</div>", styles: [".form-containter{padding:0rem 1rem;margin-bottom:2rem}.checkbox-apply{margin-top:calc(.375rem + 1px)}.keywordsDisplay{min-height:40px}.hint{margin:0!important}.hint-container{display:flex;align-items:center}.crossItem{margin:0;padding:0;border:0;background:none;position:relative;width:7px;height:20px}.crossItem:before,.crossItem:after{content:\"\";position:absolute;top:6.25px;left:0;right:0;height:1.5px;background:#fff;border-radius:1.5px}.crossItem:before{transform:rotate(45deg)}.crossItem:after{transform:rotate(-45deg)}.crossItem span{display:block}.btn-control-div .btn{width:8rem}.timeZoneContainer{align-items:center}.timeZoneContainer span{margin-left:5px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i2.FormBuilder }, { type: i1.SpaceService }, { type: i1.BaseUserService }, { type: i1.DomainService }, { type: i1.OrganisationService }, { type: i1.ZoneService }, { type: i1.HashtagService }, { type: i1.LocaleService }]; }, propDecorators: { missionToEdit: [{
+            args: [{ selector: 'lib-form-mission', template: "<div class=\"form-containter\" *ngIf=\"missionForm\">\r\n    <div style=\"margin-top: 1rem;\">\r\n        <h4>{{ 'Mission details' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"missionForm\">\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Organisation' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <input type=\"text\"  data-testid=\"form-mission-organisation\" class=\"form-control\" formControlName=\"organisation\">\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\" *ngIf=\"isSP\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Ordered by' | translate }}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"orderedOrganisationID\">\r\n                    <option *ngFor=\"let org of allOrgs\" [ngValue]=\"org.id\">\r\n                        {{ org.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <textarea class=\"form-control\" formControlName=\"description\" rows=\"10\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['description'])\"\r\n                    data-testid=\"form-mission-description\"></textarea>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-description-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['description'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['description'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Role' | translate}}*</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"role\" data-testid=\"form-mission-role\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['role'])\">\r\n                    <option *ngFor=\"let r of availableRoles\" [ngValue]=\"r\">\r\n                        {{ r }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-role-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['role'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['role'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\"\r\n            *ngIf=\"missionForm.get('role').value !== 'VISITOR_MUSEUM' && missionForm.get('role').value !== 'GUIDE_MUSEUM'\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Domains' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"domains\">\r\n                <select class=\"form-control\" multiple formControlName=\"domains\">\r\n                    <option *ngFor=\"let domain of domains\" [ngValue]=\"domain.id\">\r\n                        {{ domain.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Access level' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" required formControlName=\"level\" data-testid=\"form-mission-level\">\r\n                    <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                        {{ level }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"availableSpaces\">\r\n                <select class=\"form-control\" required formControlName=\"space\" (change)=\"onSpaceClick()\"\r\n                    data-testid=\"form-mission-space\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['space'])\">\r\n                    <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                        {{ space.name }}\r\n                    </option>\r\n                </select>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-space-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['space'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['space'])\"></span>\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                {{ 'No locations available' | translate}}\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"zonesForSpace; else noSpace\">\r\n                <select class=\"form-control\" formControlName=\"zone\" data-testid=\"form-mission-zone\">\r\n                    <option [ngValue]=\"defaultZone.id\">\r\n                        {{ 'All zones' | translate }}\r\n                    </option>\r\n                    <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                        {{ zone.name }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n            <ng-template #noSpace>\r\n                <div class=\"col-sm-8 hint-container\">\r\n                    <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </ng-template>\r\n        </div>\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n            <div class=\"col-sm-8\">\r\n                <select class=\"form-control\" formControlName=\"locale\">\r\n                    <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                    <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                        {{ locale }}\r\n                    </option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n        <!-- Hashtags are available after Space is set -->\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n            <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}} </p>\r\n                <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                    {{'No hashtags created for this location' | translate}} </p>\r\n                <div *ngIf=\"availableHashtags.length > 0\">\r\n                    <ul class=\"keywordsDisplay no-border\">\r\n                        <div class=\"keywordsdisplayContainer\">\r\n                            <li *ngFor=\"let hashtag of availableHashtags\"\r\n                                [class]=\"hashtagAdded(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                (click)=\"onHashtagClick(hashtag)\" style=\"cursor: pointer;\"\r\n                                ngbTooltip=\"{{hashtagAdded(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                {{hashtag.name}}\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                    <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                    <ul class=\"keywordsDisplay\">\r\n                        <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                            <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}\r\n                                <a type=\"button\" class=\"closeButton\" (click)=\"removeHashtag(hashtag)\">\r\n                                    <span class=\"crossItem\"></span>\r\n                                </a>\r\n                            </li>\r\n                        </div>\r\n                    </ul>\r\n                </div>\r\n            </div>\r\n            <div class=\"col-sm-8 hint-container\" *ngIf=\"!spaceID.value\">\r\n                <p class=\"hint keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"startDate\" ngbDatepicker\r\n                    #d1=\"ngbDatepicker\" data-testid=\"form-mission-startDate\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['startDate'])\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                </div>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-startDate-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['startDate'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['startDate'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission Start Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Date' | translate}}</label>\r\n            <div class=\"input-group col-sm-8\">\r\n                <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" ngbDatepicker #d2=\"ngbDatepicker\"\r\n                    formControlName=\"endDate\" data-testid=\"form-mission-endDate\"\r\n                    [class.is-invalid]=\"validatorsService.isControlError(missionForm.controls['endDate'])\">\r\n                <div class=\"input-group-append\">\r\n                    <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                </div>\r\n                <div class=\"invalid-feedback\">\r\n                    <span data-testid=\"form-mission-endDate-invalid\"\r\n                        [translate]=\"validatorsService.getError(missionForm.controls['endDate'])\"\r\n                        *ngIf=\" validatorsService.isControlError(missionForm.controls['endDate'])\"></span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"form-group row\">\r\n            <label class=\"col-sm-4 col-form-label\">{{'Mission End Time' | translate}}</label>\r\n            <div class=\"input-group col-sm-8 timeZoneContainer\">\r\n                <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" [disabled]=\"missionForm.invalid\"\r\n                class=\"btn btn-outline-primary rounded-pill mr-3 action-button\"\r\n                data-testid=\"form-mission-submit-btn\">{{'Save' |\r\n                translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\" data-testid=\"form-mission-cancel-btn\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' |\r\n                translate}}</button>\r\n        </div>\r\n    </form>\r\n</div>", styles: [".form-containter{padding:0rem 1rem;margin-bottom:2rem}.checkbox-apply{margin-top:calc(.375rem + 1px)}.keywordsDisplay{min-height:40px}.hint{margin:0!important}.hint-container{display:flex;align-items:center}.crossItem{margin:0;padding:0;border:0;background:none;position:relative;width:7px;height:20px}.crossItem:before,.crossItem:after{content:\"\";position:absolute;top:6.25px;left:0;right:0;height:1.5px;background:#fff;border-radius:1.5px}.crossItem:before{transform:rotate(45deg)}.crossItem:after{transform:rotate(-45deg)}.crossItem span{display:block}.btn-control-div .btn{width:8rem}.timeZoneContainer{align-items:center}.timeZoneContainer span{margin-left:5px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i2.FormBuilder }, { type: i1.SpaceService }, { type: i1.BaseUserService }, { type: i1.DomainService }, { type: i1.OrganisationService }, { type: i1.ZoneService }, { type: i1.HashtagService }, { type: i1.LocaleService }, { type: i1.ValidatorsService }]; }, propDecorators: { missionToEdit: [{
                 type: Input
             }], organisationForMission: [{
                 type: Input
@@ -1137,12 +1144,15 @@ class UserComponent {
         const secondMessage = this.translate.instant('secondTokenMessage');
         alert(firstMessage + user.user.displayName + secondMessage);
     }
+    getStringNoSpace(data) {
+        return data.replace(/\s/g, '');
+    }
 }
 UserComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: UserComponent, deps: [{ token: i1.BaseUserService }, { token: i1.MissionService }, { token: i1.DomainService }, { token: i1.OrganisationService }, { token: i4$1.NgbModal }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-UserComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: UserComponent, selector: "lib-user", ngImport: i0, template: "<div class=\"dashboard-tab\">\r\n  <div class=\"header-dashboard-tab\">\r\n    <h3>{{'Users' | translate}}</h3>\r\n    <!-- <app-search-bar *ngIf=\"!hideList\" [searchable]=\"orgsUsersMissions\" objectType=\"USER\"\r\n        (searchEvent)=\"applyResultsSearchBar($event)\">\r\n      </app-search-bar> -->\r\n    <hr>\r\n  </div>\r\n  <div class=\"row\">\r\n    <div class=\"col-md-8 col-lg-6\">\r\n      <div class=\"row ml-0 mb-2\" *ngIf=\"!hideList\">\r\n        <button class=\"btn btn-outline-primary rounded-pill add-button\" *ngIf=\"isManager && !isGuide\" (click)=\"onAddOrg()\">\r\n          {{'Add user to new organisation' | translate}}</button>\r\n      </div>\r\n      <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n        <lib-loader></lib-loader>\r\n      </div>\r\n      <div *ngIf=\"!hideList\">\r\n        <ul class=\"list-group list-group-flush\" *ngIf=\"filteredOrgsUsersMissions\">\r\n          <li class=\"list-group-item list-group-item-action\" *ngFor=\"let o of filteredOrgsUsersMissions\">\r\n            <div class=\"d-flex justify-content-between align-items-center font-weight-bold\"\r\n              ngbTooltip=\"See details and users\" style=\"cursor: pointer;\" (click)=\"onToggleDetailOrg(o.org.id, o.org)\">\r\n              {{o.org.name}} <small *ngIf=\"o.org.id == currentOrg.id\">({{'My organisation' | translate}})</small>\r\n              <small *ngIf=\"isSP && clientsSP.includes(o.org.id)\">({{'Client of SmarterPlan' | translate}})</small>\r\n              <small *ngIf=\"isSP && getOrderedOrg(o.org.id)\">({{'Client of ' | translate}}\r\n                {{getOrderedOrg(o.org.id)}})</small>\r\n              <lib-chevron [conditionShowing]=\"detailsOrg==o.org.id\"></lib-chevron>\r\n            </div>\r\n            <div class=\"missions\" *ngIf=\"detailsOrg==o.org.id\">\r\n              <div class='d-flex'>\r\n                <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3\" (click)=\"onAdd(o.org)\">{{'Add user' |\r\n                  translate}}</button>\r\n              </div>\r\n\r\n              <ul class=\"list-group list-group-flush\">\r\n                <li class=\"list-group-item list-group-item-action\" *ngFor=\"let a of o.users\"\r\n                  (click)=\"onToggleDetailUser(a.user.id)\">\r\n                  <div class=\"d-flex justify-content-between align-items-center\">\r\n                    {{a.user.displayName}}\r\n                    <lib-chevron [conditionShowing]=\"detailsUser==a.user.id\"></lib-chevron>\r\n                  </div>\r\n\r\n                  <div *ngIf=\"detailsUser==a.user.id\">\r\n                    <div class=\"ml-3\">\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{'Email' | translate}}: {{a.user.email }}\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\"\r\n                          (click)=\"onAddForUser(o.org, a.user)\">{{'Add new mission' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\" (click)=\"onClearToken(a)\">\r\n                          {{'Clear Token' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\"\r\n                          (click)=\"onDeleteUser(a.user)\">{{'Delete user' | translate}}</button>\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{ a.missions.length > 0 ? ('Current Missions' | translate) : ('No missions' | translate)}}\r\n                      </div>\r\n                    </div>\r\n                    <ul class=\"list-group list-group-flush\">\r\n                      <li class=\"list-group-item\" *ngFor=\"let mis of a.missions\">\r\n                        <ul class=\"list-group list-group-flush\">\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.description\">\r\n                            {{'Description' | translate}}: {{mis.description}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.templateMissionID\">\r\n                            {{'Attendee of tour' | translate}}: {{mis.templateMission.title}}</li>\r\n\r\n                          <li class=\"list-group-item bg-transparent\">{{'Role' | translate}}: {{ mis.role }}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.hashtags && mis.hashtags.length> 0\">\r\n                            {{'Hashtags' | translate}}: <ul class=\"keywordsDisplay no-border\">\r\n                              <div class=\"keywordsdisplayContainer\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of mis.hashtags\">\r\n                                  {{ hashtag | hashtagFromID | async }}</li>\r\n                              </div>\r\n                            </ul>\r\n                          </li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}: {{\r\n                            mis.locale ? mis.locale : ('Not applicable' | translate)}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}: {{\r\n                            mis.level}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Ordered by' | translate }}: {{\r\n                            mis.orderedOrganisation.name}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.domains\">{{'Domains' | translate }}:\r\n                            {{mis.domains ?\r\n                            domainIdsToStringForMission(mis) : (\"No data\" | translate) }}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized location' | translate }}:\r\n                            {{ mis.space ? mis.space.name : \"No location\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized zone' | translate }}:\r\n                            {{ mis.zone ? mis.zone.name : \"All zones allowed\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Starts' | translate }}:\r\n                            {{ mis.startDateTime ? (mis.startDateTime | timeDateString: \"day_time_zone\" | async) :\r\n                            \"No data\" | translate}}, {{'Ends' | translate}}: {{ mis.endDateTime\r\n                            ? (mis.endDateTime | timeDateString: \"day_time_zone\" | async)\r\n                            : \"No data\" | translate}}.\r\n                          </li>\r\n                        </ul>\r\n                        <div class=\"action-button-container\">\r\n                          <button type=\"button\" class=\"btn btn-outline-primary rounded-pill mr-2 action-button\"\r\n                            (click)=\"onEdit(mis)\">{{'Edit' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" *ngIf=\"mis.role === 'VISITOR' || mis.role === 'VISITOR_MUSEUM'\"\r\n                            class=\"btn btn-outline-primary rounded-pill mr-2 action-button share-visitor-button\"\r\n                            (click)=\"onSetForShareableLink(a.user, mis)\">{{'Generate Shareable Link' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                            (click)=\"onDeleteMission(mis)\">{{'Delete' | translate}}</button>\r\n                        </div>\r\n                      </li>\r\n                    </ul>\r\n                  </div>\r\n                </li>\r\n              </ul>\r\n            </div>\r\n          </li>\r\n        </ul>\r\n      </div>\r\n\r\n      <div *ngIf=\"create\">\r\n        <lib-user-mission-form [addToOrganisation]=\"addToOrg\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (added)=\"userAdded($event)\">\r\n        </lib-user-mission-form>\r\n      </div>\r\n      <div *ngIf=\"edit\">\r\n        <lib-form-mission [missionToEdit]=\"missionToEdit\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (addedMissionInput)=\"onMissionEdited($event)\"></lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"createForExistingUser\">\r\n        <lib-form-mission [organisationForMission]=\"addToOrg\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          [userForMissionID]=\"userForAddingMission.id\" (addedMissionInput)=\"onMissionCreated($event)\">\r\n        </lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"isAddingOrg || isAddingToExistingOrg\">\r\n        <lib-form-organisation [currentOrg]=\"currentOrg\" [currentUser]=\"me\" [existing]=\"isAddingToExistingOrg\"\r\n          (added)=\"orgAdded($event)\"></lib-form-organisation>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"col-md-4 col-lg-6\" *ngIf=\"orgSelectedDetails && !isGuide\">\r\n      <lib-detail-organisation [org]=\"orgSelectedDetails\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n        (orgChanged)='orgAdded($event)'></lib-detail-organisation>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}.action-button-container .share-visitor-button{width:-moz-fit-content;width:fit-content}\n"], components: [{ type: i1.LoaderComponent, selector: "lib-loader" }, { type: ChevronComponent, selector: "lib-chevron", inputs: ["conditionShowing"] }, { type: UserMissionFormComponent, selector: "lib-user-mission-form", inputs: ["addToOrganisation", "isSP", "createForExistingUser", "currentOrg"], outputs: ["added"] }, { type: FormMissionComponent, selector: "lib-form-mission", inputs: ["missionToEdit", "organisationForMission", "isSP", "userForMissionID", "currentUserOrganisation"], outputs: ["addedMissionInput"] }, { type: FormOrganisationComponent, selector: "lib-form-organisation", inputs: ["currentOrg", "currentUser", "existing"], outputs: ["added"] }, { type: DetailOrganisationComponent, selector: "lib-detail-organisation", inputs: ["org", "currentOrg", "isSP"], outputs: ["orgChanged"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }], pipes: { "translate": i3.TranslatePipe, "async": i4.AsyncPipe, "hashtagFromID": i1.HashtagFromIdPipe, "timeDateString": i1.TimeDateToLocalStringPipe } });
+UserComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: UserComponent, selector: "lib-user", ngImport: i0, template: "<div class=\"dashboard-tab\">\r\n  <div class=\"header-dashboard-tab\">\r\n    <h3>{{'Users' | translate}}</h3>\r\n    <!-- <app-search-bar *ngIf=\"!hideList\" [searchable]=\"orgsUsersMissions\" objectType=\"USER\"\r\n        (searchEvent)=\"applyResultsSearchBar($event)\">\r\n      </app-search-bar> -->\r\n    <hr>\r\n  </div>\r\n  <div class=\"row\">\r\n    <div class=\"col-md-8 col-lg-6\">\r\n      <div class=\"row ml-0 mb-2\" *ngIf=\"!hideList\">\r\n        <button class=\"btn btn-outline-primary rounded-pill add-button\" *ngIf=\"isManager && !isGuide\" (click)=\"onAddOrg()\">\r\n          {{'Add user to new organisation' | translate}}</button>\r\n      </div>\r\n      <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n        <lib-loader></lib-loader>\r\n      </div>\r\n      <div *ngIf=\"!hideList\">\r\n        <ul class=\"list-group list-group-flush\" *ngIf=\"filteredOrgsUsersMissions\" data-testid=\"mission-organisation-list\">\r\n          <li class=\"list-group-item list-group-item-action\" *ngFor=\"let o of filteredOrgsUsersMissions\">\r\n            <div class=\"d-flex justify-content-between align-items-center font-weight-bold\"\r\n              ngbTooltip=\"See details and users\" style=\"cursor: pointer;\" (click)=\"onToggleDetailOrg(o.org.id, o.org)\">\r\n              {{o.org.name}} <small *ngIf=\"o.org.id == currentOrg.id\">({{'My organisation' | translate}})</small>\r\n              <small *ngIf=\"isSP && clientsSP.includes(o.org.id)\">({{'Client of SmarterPlan' | translate}})</small>\r\n              <small *ngIf=\"isSP && getOrderedOrg(o.org.id)\">({{'Client of ' | translate}}\r\n                {{getOrderedOrg(o.org.id)}})</small>\r\n              <lib-chevron [conditionShowing]=\"detailsOrg==o.org.id\"  [ngClass]=\"[getStringNoSpace(o.org.name)]\"></lib-chevron>\r\n            </div>\r\n            <div class=\"missions\" *ngIf=\"detailsOrg==o.org.id\">\r\n              <div class='d-flex'>\r\n                <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3\" (click)=\"onAdd(o.org)\">{{'Add user' |\r\n                  translate}}</button>\r\n              </div>\r\n\r\n              <ul class=\"list-group list-group-flush\" data-testid=\"mission-user-list\">\r\n                <li class=\"list-group-item list-group-item-action\" *ngFor=\"let a of o.users\"\r\n                  (click)=\"onToggleDetailUser(a.user.id)\">\r\n                  <div class=\"d-flex justify-content-between align-items-center\">\r\n                    {{a.user.displayName}}\r\n                    <lib-chevron [conditionShowing]=\"detailsUser==a.user.id\" [ngClass]=\"[getStringNoSpace(a.user.displayName)]\"></lib-chevron>\r\n                  </div>\r\n\r\n                  <div *ngIf=\"detailsUser==a.user.id\">\r\n                    <div class=\"ml-3\">\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{'Email' | translate}}: {{a.user.email }}\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\" data-testid=\"mission-new-btn\"\r\n                          (click)=\"onAddForUser(o.org, a.user)\">{{'Add new mission' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\" (click)=\"onClearToken(a)\">\r\n                          {{'Clear Token' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\"\r\n                          (click)=\"onDeleteUser(a.user)\">{{'Delete user' | translate}}</button>\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{ a.missions.length > 0 ? ('Current Missions' | translate) : ('No missions' | translate)}}\r\n                      </div>\r\n                    </div>\r\n                    <ul class=\"list-group list-group-flush\">\r\n                      <li class=\"list-group-item\" *ngFor=\"let mis of a.missions\">\r\n                        <ul class=\"list-group list-group-flush\">\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.description\">\r\n                            {{'Description' | translate}}: {{mis.description}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.templateMissionID\">\r\n                            {{'Attendee of tour' | translate}}: {{mis.templateMission.title}}</li>\r\n\r\n                          <li class=\"list-group-item bg-transparent\">{{'Role' | translate}}: {{ mis.role }}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.hashtags && mis.hashtags.length> 0\">\r\n                            {{'Hashtags' | translate}}: <ul class=\"keywordsDisplay no-border\">\r\n                              <div class=\"keywordsdisplayContainer\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of mis.hashtags\">\r\n                                  {{ hashtag | hashtagFromID | async }}</li>\r\n                              </div>\r\n                            </ul>\r\n                          </li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}: {{\r\n                            mis.locale ? mis.locale : ('Not applicable' | translate)}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}: {{\r\n                            mis.level}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Ordered by' | translate }}: {{\r\n                            mis.orderedOrganisation.name}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.domains\">{{'Domains' | translate }}:\r\n                            {{mis.domains ?\r\n                            domainIdsToStringForMission(mis) : (\"No data\" | translate) }}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized location' | translate }}:\r\n                            {{ mis.space ? mis.space.name : \"No location\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized zone' | translate }}:\r\n                            {{ mis.zone ? mis.zone.name : \"All zones allowed\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Starts' | translate }}:\r\n                            {{ mis.startDateTime ? (mis.startDateTime | timeDateString: \"day_time_zone\" | async) :\r\n                            \"No data\" | translate}}, {{'Ends' | translate}}: {{ mis.endDateTime\r\n                            ? (mis.endDateTime | timeDateString: \"day_time_zone\" | async)\r\n                            : \"No data\" | translate}}.\r\n                          </li>\r\n                        </ul>\r\n                        <div class=\"action-button-container\" >\r\n                          <button type=\"button\" data-testid=\"edit-mission-btn\" class=\"btn btn-outline-primary rounded-pill mr-2 action-button\"\r\n                            (click)=\"onEdit(mis)\">{{'Edit' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" *ngIf=\"mis.role === 'VISITOR' || mis.role === 'VISITOR_MUSEUM'\"\r\n                            class=\"btn btn-outline-primary rounded-pill mr-2 action-button share-visitor-button\"\r\n                            (click)=\"onSetForShareableLink(a.user, mis)\">{{'Generate Shareable Link' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                            (click)=\"onDeleteMission(mis)\">{{'Delete' | translate}}</button>\r\n                        </div>\r\n                      </li>\r\n                    </ul>\r\n                  </div>\r\n                </li>\r\n              </ul>\r\n            </div>\r\n          </li>\r\n        </ul>\r\n      </div>\r\n\r\n      <div *ngIf=\"create\">\r\n        <lib-user-mission-form [addToOrganisation]=\"addToOrg\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (added)=\"userAdded($event)\">\r\n        </lib-user-mission-form>\r\n      </div>\r\n      <div *ngIf=\"edit\">\r\n        <lib-form-mission [missionToEdit]=\"missionToEdit\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (addedMissionInput)=\"onMissionEdited($event)\"></lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"createForExistingUser\">\r\n        <lib-form-mission [organisationForMission]=\"addToOrg\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          [userForMissionID]=\"userForAddingMission.id\" (addedMissionInput)=\"onMissionCreated($event)\">\r\n        </lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"isAddingOrg || isAddingToExistingOrg\">\r\n        <lib-form-organisation [currentOrg]=\"currentOrg\" [currentUser]=\"me\" [existing]=\"isAddingToExistingOrg\"\r\n          (added)=\"orgAdded($event)\"></lib-form-organisation>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"col-md-4 col-lg-6\" *ngIf=\"orgSelectedDetails && !isGuide\">\r\n      <lib-detail-organisation [org]=\"orgSelectedDetails\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n        (orgChanged)='orgAdded($event)'></lib-detail-organisation>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}.action-button-container .share-visitor-button{width:-moz-fit-content;width:fit-content}\n"], components: [{ type: i1.LoaderComponent, selector: "lib-loader" }, { type: ChevronComponent, selector: "lib-chevron", inputs: ["conditionShowing"] }, { type: UserMissionFormComponent, selector: "lib-user-mission-form", inputs: ["addToOrganisation", "isSP", "createForExistingUser", "currentOrg"], outputs: ["added"] }, { type: FormMissionComponent, selector: "lib-form-mission", inputs: ["missionToEdit", "organisationForMission", "isSP", "userForMissionID", "currentUserOrganisation"], outputs: ["addedMissionInput"] }, { type: FormOrganisationComponent, selector: "lib-form-organisation", inputs: ["currentOrg", "currentUser", "existing"], outputs: ["added"] }, { type: DetailOrganisationComponent, selector: "lib-detail-organisation", inputs: ["org", "currentOrg", "isSP"], outputs: ["orgChanged"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "translate": i3.TranslatePipe, "async": i4.AsyncPipe, "hashtagFromID": i1.HashtagFromIdPipe, "timeDateString": i1.TimeDateToLocalStringPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: UserComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-user', template: "<div class=\"dashboard-tab\">\r\n  <div class=\"header-dashboard-tab\">\r\n    <h3>{{'Users' | translate}}</h3>\r\n    <!-- <app-search-bar *ngIf=\"!hideList\" [searchable]=\"orgsUsersMissions\" objectType=\"USER\"\r\n        (searchEvent)=\"applyResultsSearchBar($event)\">\r\n      </app-search-bar> -->\r\n    <hr>\r\n  </div>\r\n  <div class=\"row\">\r\n    <div class=\"col-md-8 col-lg-6\">\r\n      <div class=\"row ml-0 mb-2\" *ngIf=\"!hideList\">\r\n        <button class=\"btn btn-outline-primary rounded-pill add-button\" *ngIf=\"isManager && !isGuide\" (click)=\"onAddOrg()\">\r\n          {{'Add user to new organisation' | translate}}</button>\r\n      </div>\r\n      <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n        <lib-loader></lib-loader>\r\n      </div>\r\n      <div *ngIf=\"!hideList\">\r\n        <ul class=\"list-group list-group-flush\" *ngIf=\"filteredOrgsUsersMissions\">\r\n          <li class=\"list-group-item list-group-item-action\" *ngFor=\"let o of filteredOrgsUsersMissions\">\r\n            <div class=\"d-flex justify-content-between align-items-center font-weight-bold\"\r\n              ngbTooltip=\"See details and users\" style=\"cursor: pointer;\" (click)=\"onToggleDetailOrg(o.org.id, o.org)\">\r\n              {{o.org.name}} <small *ngIf=\"o.org.id == currentOrg.id\">({{'My organisation' | translate}})</small>\r\n              <small *ngIf=\"isSP && clientsSP.includes(o.org.id)\">({{'Client of SmarterPlan' | translate}})</small>\r\n              <small *ngIf=\"isSP && getOrderedOrg(o.org.id)\">({{'Client of ' | translate}}\r\n                {{getOrderedOrg(o.org.id)}})</small>\r\n              <lib-chevron [conditionShowing]=\"detailsOrg==o.org.id\"></lib-chevron>\r\n            </div>\r\n            <div class=\"missions\" *ngIf=\"detailsOrg==o.org.id\">\r\n              <div class='d-flex'>\r\n                <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3\" (click)=\"onAdd(o.org)\">{{'Add user' |\r\n                  translate}}</button>\r\n              </div>\r\n\r\n              <ul class=\"list-group list-group-flush\">\r\n                <li class=\"list-group-item list-group-item-action\" *ngFor=\"let a of o.users\"\r\n                  (click)=\"onToggleDetailUser(a.user.id)\">\r\n                  <div class=\"d-flex justify-content-between align-items-center\">\r\n                    {{a.user.displayName}}\r\n                    <lib-chevron [conditionShowing]=\"detailsUser==a.user.id\"></lib-chevron>\r\n                  </div>\r\n\r\n                  <div *ngIf=\"detailsUser==a.user.id\">\r\n                    <div class=\"ml-3\">\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{'Email' | translate}}: {{a.user.email }}\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\"\r\n                          (click)=\"onAddForUser(o.org, a.user)\">{{'Add new mission' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\" (click)=\"onClearToken(a)\">\r\n                          {{'Clear Token' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\"\r\n                          (click)=\"onDeleteUser(a.user)\">{{'Delete user' | translate}}</button>\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{ a.missions.length > 0 ? ('Current Missions' | translate) : ('No missions' | translate)}}\r\n                      </div>\r\n                    </div>\r\n                    <ul class=\"list-group list-group-flush\">\r\n                      <li class=\"list-group-item\" *ngFor=\"let mis of a.missions\">\r\n                        <ul class=\"list-group list-group-flush\">\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.description\">\r\n                            {{'Description' | translate}}: {{mis.description}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.templateMissionID\">\r\n                            {{'Attendee of tour' | translate}}: {{mis.templateMission.title}}</li>\r\n\r\n                          <li class=\"list-group-item bg-transparent\">{{'Role' | translate}}: {{ mis.role }}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.hashtags && mis.hashtags.length> 0\">\r\n                            {{'Hashtags' | translate}}: <ul class=\"keywordsDisplay no-border\">\r\n                              <div class=\"keywordsdisplayContainer\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of mis.hashtags\">\r\n                                  {{ hashtag | hashtagFromID | async }}</li>\r\n                              </div>\r\n                            </ul>\r\n                          </li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}: {{\r\n                            mis.locale ? mis.locale : ('Not applicable' | translate)}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}: {{\r\n                            mis.level}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Ordered by' | translate }}: {{\r\n                            mis.orderedOrganisation.name}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.domains\">{{'Domains' | translate }}:\r\n                            {{mis.domains ?\r\n                            domainIdsToStringForMission(mis) : (\"No data\" | translate) }}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized location' | translate }}:\r\n                            {{ mis.space ? mis.space.name : \"No location\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized zone' | translate }}:\r\n                            {{ mis.zone ? mis.zone.name : \"All zones allowed\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Starts' | translate }}:\r\n                            {{ mis.startDateTime ? (mis.startDateTime | timeDateString: \"day_time_zone\" | async) :\r\n                            \"No data\" | translate}}, {{'Ends' | translate}}: {{ mis.endDateTime\r\n                            ? (mis.endDateTime | timeDateString: \"day_time_zone\" | async)\r\n                            : \"No data\" | translate}}.\r\n                          </li>\r\n                        </ul>\r\n                        <div class=\"action-button-container\">\r\n                          <button type=\"button\" class=\"btn btn-outline-primary rounded-pill mr-2 action-button\"\r\n                            (click)=\"onEdit(mis)\">{{'Edit' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" *ngIf=\"mis.role === 'VISITOR' || mis.role === 'VISITOR_MUSEUM'\"\r\n                            class=\"btn btn-outline-primary rounded-pill mr-2 action-button share-visitor-button\"\r\n                            (click)=\"onSetForShareableLink(a.user, mis)\">{{'Generate Shareable Link' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                            (click)=\"onDeleteMission(mis)\">{{'Delete' | translate}}</button>\r\n                        </div>\r\n                      </li>\r\n                    </ul>\r\n                  </div>\r\n                </li>\r\n              </ul>\r\n            </div>\r\n          </li>\r\n        </ul>\r\n      </div>\r\n\r\n      <div *ngIf=\"create\">\r\n        <lib-user-mission-form [addToOrganisation]=\"addToOrg\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (added)=\"userAdded($event)\">\r\n        </lib-user-mission-form>\r\n      </div>\r\n      <div *ngIf=\"edit\">\r\n        <lib-form-mission [missionToEdit]=\"missionToEdit\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (addedMissionInput)=\"onMissionEdited($event)\"></lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"createForExistingUser\">\r\n        <lib-form-mission [organisationForMission]=\"addToOrg\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          [userForMissionID]=\"userForAddingMission.id\" (addedMissionInput)=\"onMissionCreated($event)\">\r\n        </lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"isAddingOrg || isAddingToExistingOrg\">\r\n        <lib-form-organisation [currentOrg]=\"currentOrg\" [currentUser]=\"me\" [existing]=\"isAddingToExistingOrg\"\r\n          (added)=\"orgAdded($event)\"></lib-form-organisation>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"col-md-4 col-lg-6\" *ngIf=\"orgSelectedDetails && !isGuide\">\r\n      <lib-detail-organisation [org]=\"orgSelectedDetails\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n        (orgChanged)='orgAdded($event)'></lib-detail-organisation>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}.action-button-container .share-visitor-button{width:-moz-fit-content;width:fit-content}\n"] }]
+            args: [{ selector: 'lib-user', template: "<div class=\"dashboard-tab\">\r\n  <div class=\"header-dashboard-tab\">\r\n    <h3>{{'Users' | translate}}</h3>\r\n    <!-- <app-search-bar *ngIf=\"!hideList\" [searchable]=\"orgsUsersMissions\" objectType=\"USER\"\r\n        (searchEvent)=\"applyResultsSearchBar($event)\">\r\n      </app-search-bar> -->\r\n    <hr>\r\n  </div>\r\n  <div class=\"row\">\r\n    <div class=\"col-md-8 col-lg-6\">\r\n      <div class=\"row ml-0 mb-2\" *ngIf=\"!hideList\">\r\n        <button class=\"btn btn-outline-primary rounded-pill add-button\" *ngIf=\"isManager && !isGuide\" (click)=\"onAddOrg()\">\r\n          {{'Add user to new organisation' | translate}}</button>\r\n      </div>\r\n      <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n        <lib-loader></lib-loader>\r\n      </div>\r\n      <div *ngIf=\"!hideList\">\r\n        <ul class=\"list-group list-group-flush\" *ngIf=\"filteredOrgsUsersMissions\" data-testid=\"mission-organisation-list\">\r\n          <li class=\"list-group-item list-group-item-action\" *ngFor=\"let o of filteredOrgsUsersMissions\">\r\n            <div class=\"d-flex justify-content-between align-items-center font-weight-bold\"\r\n              ngbTooltip=\"See details and users\" style=\"cursor: pointer;\" (click)=\"onToggleDetailOrg(o.org.id, o.org)\">\r\n              {{o.org.name}} <small *ngIf=\"o.org.id == currentOrg.id\">({{'My organisation' | translate}})</small>\r\n              <small *ngIf=\"isSP && clientsSP.includes(o.org.id)\">({{'Client of SmarterPlan' | translate}})</small>\r\n              <small *ngIf=\"isSP && getOrderedOrg(o.org.id)\">({{'Client of ' | translate}}\r\n                {{getOrderedOrg(o.org.id)}})</small>\r\n              <lib-chevron [conditionShowing]=\"detailsOrg==o.org.id\"  [ngClass]=\"[getStringNoSpace(o.org.name)]\"></lib-chevron>\r\n            </div>\r\n            <div class=\"missions\" *ngIf=\"detailsOrg==o.org.id\">\r\n              <div class='d-flex'>\r\n                <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3\" (click)=\"onAdd(o.org)\">{{'Add user' |\r\n                  translate}}</button>\r\n              </div>\r\n\r\n              <ul class=\"list-group list-group-flush\" data-testid=\"mission-user-list\">\r\n                <li class=\"list-group-item list-group-item-action\" *ngFor=\"let a of o.users\"\r\n                  (click)=\"onToggleDetailUser(a.user.id)\">\r\n                  <div class=\"d-flex justify-content-between align-items-center\">\r\n                    {{a.user.displayName}}\r\n                    <lib-chevron [conditionShowing]=\"detailsUser==a.user.id\" [ngClass]=\"[getStringNoSpace(a.user.displayName)]\"></lib-chevron>\r\n                  </div>\r\n\r\n                  <div *ngIf=\"detailsUser==a.user.id\">\r\n                    <div class=\"ml-3\">\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{'Email' | translate}}: {{a.user.email }}\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\" data-testid=\"mission-new-btn\"\r\n                          (click)=\"onAddForUser(o.org, a.user)\">{{'Add new mission' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\" (click)=\"onClearToken(a)\">\r\n                          {{'Clear Token' | translate}}</button>\r\n                        <button type=\"button\" class=\"btn btn-primary rounded-pill\"\r\n                          (click)=\"onDeleteUser(a.user)\">{{'Delete user' | translate}}</button>\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n                        {{ a.missions.length > 0 ? ('Current Missions' | translate) : ('No missions' | translate)}}\r\n                      </div>\r\n                    </div>\r\n                    <ul class=\"list-group list-group-flush\">\r\n                      <li class=\"list-group-item\" *ngFor=\"let mis of a.missions\">\r\n                        <ul class=\"list-group list-group-flush\">\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.description\">\r\n                            {{'Description' | translate}}: {{mis.description}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.templateMissionID\">\r\n                            {{'Attendee of tour' | translate}}: {{mis.templateMission.title}}</li>\r\n\r\n                          <li class=\"list-group-item bg-transparent\">{{'Role' | translate}}: {{ mis.role }}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.hashtags && mis.hashtags.length> 0\">\r\n                            {{'Hashtags' | translate}}: <ul class=\"keywordsDisplay no-border\">\r\n                              <div class=\"keywordsdisplayContainer\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of mis.hashtags\">\r\n                                  {{ hashtag | hashtagFromID | async }}</li>\r\n                              </div>\r\n                            </ul>\r\n                          </li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}: {{\r\n                            mis.locale ? mis.locale : ('Not applicable' | translate)}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}: {{\r\n                            mis.level}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Ordered by' | translate }}: {{\r\n                            mis.orderedOrganisation.name}}</li>\r\n                          <li class=\"list-group-item bg-transparent\" *ngIf=\"mis.domains\">{{'Domains' | translate }}:\r\n                            {{mis.domains ?\r\n                            domainIdsToStringForMission(mis) : (\"No data\" | translate) }}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized location' | translate }}:\r\n                            {{ mis.space ? mis.space.name : \"No location\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Authorized zone' | translate }}:\r\n                            {{ mis.zone ? mis.zone.name : \"All zones allowed\" | translate}}</li>\r\n                          <li class=\"list-group-item bg-transparent\">{{'Starts' | translate }}:\r\n                            {{ mis.startDateTime ? (mis.startDateTime | timeDateString: \"day_time_zone\" | async) :\r\n                            \"No data\" | translate}}, {{'Ends' | translate}}: {{ mis.endDateTime\r\n                            ? (mis.endDateTime | timeDateString: \"day_time_zone\" | async)\r\n                            : \"No data\" | translate}}.\r\n                          </li>\r\n                        </ul>\r\n                        <div class=\"action-button-container\" >\r\n                          <button type=\"button\" data-testid=\"edit-mission-btn\" class=\"btn btn-outline-primary rounded-pill mr-2 action-button\"\r\n                            (click)=\"onEdit(mis)\">{{'Edit' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" *ngIf=\"mis.role === 'VISITOR' || mis.role === 'VISITOR_MUSEUM'\"\r\n                            class=\"btn btn-outline-primary rounded-pill mr-2 action-button share-visitor-button\"\r\n                            (click)=\"onSetForShareableLink(a.user, mis)\">{{'Generate Shareable Link' |\r\n                            translate}}</button>\r\n                          <button type=\"button\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                            (click)=\"onDeleteMission(mis)\">{{'Delete' | translate}}</button>\r\n                        </div>\r\n                      </li>\r\n                    </ul>\r\n                  </div>\r\n                </li>\r\n              </ul>\r\n            </div>\r\n          </li>\r\n        </ul>\r\n      </div>\r\n\r\n      <div *ngIf=\"create\">\r\n        <lib-user-mission-form [addToOrganisation]=\"addToOrg\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (added)=\"userAdded($event)\">\r\n        </lib-user-mission-form>\r\n      </div>\r\n      <div *ngIf=\"edit\">\r\n        <lib-form-mission [missionToEdit]=\"missionToEdit\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          (addedMissionInput)=\"onMissionEdited($event)\"></lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"createForExistingUser\">\r\n        <lib-form-mission [organisationForMission]=\"addToOrg\" [currentUserOrganisation]=\"currentOrg\" [isSP]=\"isSP\"\r\n          [userForMissionID]=\"userForAddingMission.id\" (addedMissionInput)=\"onMissionCreated($event)\">\r\n        </lib-form-mission>\r\n      </div>\r\n      <div *ngIf=\"isAddingOrg || isAddingToExistingOrg\">\r\n        <lib-form-organisation [currentOrg]=\"currentOrg\" [currentUser]=\"me\" [existing]=\"isAddingToExistingOrg\"\r\n          (added)=\"orgAdded($event)\"></lib-form-organisation>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"col-md-4 col-lg-6\" *ngIf=\"orgSelectedDetails && !isGuide\">\r\n      <lib-detail-organisation [org]=\"orgSelectedDetails\" [currentOrg]=\"currentOrg\" [isSP]=\"isSP\"\r\n        (orgChanged)='orgAdded($event)'></lib-detail-organisation>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px}.action-button-container .share-visitor-button{width:-moz-fit-content;width:fit-content}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.BaseUserService }, { type: i1.MissionService }, { type: i1.DomainService }, { type: i1.OrganisationService }, { type: i4$1.NgbModal }, { type: i3.TranslateService }]; } });
 class TemplateComponent {
@@ -1344,10 +1354,10 @@ class TemplateComponent {
     }
 }
 TemplateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: TemplateComponent, deps: [{ token: i2$1.ActivatedRoute }, { token: i2.FormBuilder }, { token: i1.BaseUserService }, { token: i1.SpaceService }, { token: i1.ZoneService }, { token: i4.Location }, { token: i1.HashtagService }, { token: i3.TranslateService }, { token: i1.TemplateService }, { token: i1.ValidatorsService }], target: i0.ɵɵFactoryTarget.Component });
-TemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: TemplateComponent, selector: "lib-template", inputs: { currentOrg: "currentOrg", editTemplate: "editTemplate", zoneID: "zoneID" }, outputs: { updatedTemplate: "updatedTemplate", createdTemplate: "createdTemplate" }, ngImport: i0, template: "<div class=\"form-container\" *ngIf=\"form\">\r\n    <div>\r\n        <h4>{{ 'Visit Template' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"form\">\r\n        <div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Visit Title' | translate}} *</label>\r\n                <div class=\"col-sm-8\">\r\n                    <input type=\"text\" class=\"form-control\"\r\n                        placeholder=\"Edvard Munch - \u00AB Un po\u00E8me d\u2019amour, de vie et de mort \u00BB\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['title'])\"\r\n                        formControlName=\"title\" data-testid=\"form-template-title\">\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-title-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['title'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['title'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <textarea class=\"form-control\" formControlName=\"description\" style=\"height:200px\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['description'])\"\r\n                        data-testid=\"form-template-description\"\r\n                        placeholder=\"Cette visite d\u20191h30 vous pr\u00E9sentera les \u0153uvres embl\u00E9matiques du c\u00E9l\u00E8bre peintre norv\u00E9gien Edvard Munch (1863-1944)...\"></textarea>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-description-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['description'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['description'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"locale\">\r\n                        <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                        <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                            {{ locale }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Level' | translate}}*</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"level\">\r\n                        <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                            {{ level }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"availableSpaces && !inputZone\">\r\n                    <select class=\"form-control\" formControlName=\"space\" (change)=\"onSpaceClick()\"\r\n                        data-testid=\"form-template-space\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['space'])\">\r\n                        <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                            {{ space.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-space-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['space'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['space'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                    {{ 'No locations available' | translate}}\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.space.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length > 0 && !inputZone\">\r\n                    <select class=\"form-control\" required formControlName=\"zone\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['zone'])\"\r\n                        data-testid=\"form-template-zone\">\r\n                        <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                            {{ zone.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-zone-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['zone'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['zone'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length === 0 && !inputZone\">\r\n                    <p class=\"warning col-form-label\">{{\"No Museum Zones found for this location\"| translate}}</p>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}}\r\n                    </p>\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                        {{'No hashtags created for this location' | translate}} </p>\r\n                    <div *ngIf=\"availableHashtags.length > 0\">\r\n                        <ul class=\"keywordsDisplay no-border\">\r\n                            <div class=\"keywordsdisplayContainer\">\r\n                                <li [class]=\"addedHashtags.includes(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                    *ngFor=\"let hashtag of availableHashtags\" (click)=\"onHashtagClick(hashtag)\"\r\n                                    style=\"cursor: pointer;\"\r\n                                    ngbTooltip=\"{{addedHashtags.includes(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                    {{hashtag.name}}</li>\r\n                            </div>\r\n                        </ul>\r\n                        <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                        <ul class=\"keywordsDisplay\">\r\n                            <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}</li>\r\n                            </div>\r\n                        </ul>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!spaceID.value\">\r\n                    <p class=\"keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"startDate\" ngbDatepicker\r\n                        data-testid=\"form-template-startDate\" #d1=\"ngbDatepicker\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['startDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-startDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['startDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['startDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\">\r\n                    </ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"endDate\" ngbDatepicker\r\n                        data-testid=\"form-template-endDate\" #d2=\"ngbDatepicker\" [class.is-invalid]=\"validatorsService.isControlError(form.controls['endDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-endDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['endDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['endDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                [disabled]=\"this.working || form.invalid\" data-testid=\"form-template-submit-btn\">{{'Save' |\r\n                translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\" [disabled]=\"this.working\" data-testid=\"form-template-cancel-btn\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' | translate}}</button>\r\n        </div>\r\n\r\n    </form>\r\n</div>", styles: [".form-container{margin:2rem 0rem}.form-container .btn-control-div .btn{width:8rem}.warning{margin:0;color:red}.keywordsDisplay{min-height:40px}.keywordsRules{margin-bottom:2px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"], components: [{ type: i4$1.NgbTimepicker, selector: "ngb-timepicker", inputs: ["meridian", "spinners", "seconds", "hourStep", "minuteStep", "secondStep", "readonlyInputs", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { type: i4$1.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: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe } });
+TemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: TemplateComponent, selector: "lib-template", inputs: { currentOrg: "currentOrg", editTemplate: "editTemplate", zoneID: "zoneID" }, outputs: { updatedTemplate: "updatedTemplate", createdTemplate: "createdTemplate" }, ngImport: i0, template: "<div class=\"form-container\" *ngIf=\"form\">\r\n    <div>\r\n        <h4>{{ 'Visit Template' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"form\">\r\n        <div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Visit Title' | translate}} *</label>\r\n                <div class=\"col-sm-8\">\r\n                    <input type=\"text\" class=\"form-control\"\r\n                        placeholder=\"Edvard Munch - \u00AB Un po\u00E8me d\u2019amour, de vie et de mort \u00BB\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['title'])\"\r\n                        formControlName=\"title\" data-testid=\"form-template-title\">\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-title-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['title'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['title'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <textarea class=\"form-control\" formControlName=\"description\" style=\"height:200px\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['description'])\"\r\n                        data-testid=\"form-template-description\"\r\n                        placeholder=\"Cette visite d\u20191h30 vous pr\u00E9sentera les \u0153uvres embl\u00E9matiques du c\u00E9l\u00E8bre peintre norv\u00E9gien Edvard Munch (1863-1944)...\"></textarea>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-description-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['description'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['description'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"locale\">\r\n                        <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                        <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                            {{ locale }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Level' | translate}}*</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"level\">\r\n                        <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                            {{ level }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"availableSpaces && !inputZone\">\r\n                    <select class=\"form-control\" formControlName=\"space\" (change)=\"onSpaceClick()\"\r\n                        data-testid=\"form-template-space\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['space'])\">\r\n                        <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                            {{ space.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-space-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['space'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['space'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                    {{ 'No locations available' | translate}}\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.space.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length > 0 && !inputZone\">\r\n                    <select class=\"form-control\" required formControlName=\"zone\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['zone'])\"\r\n                        data-testid=\"form-template-zone\">\r\n                        <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                            {{ zone.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-zone-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['zone'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['zone'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length === 0 && !inputZone\">\r\n                    <p class=\"warning col-form-label\">{{\"No Museum Zones found for this location\"| translate}}</p>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}}\r\n                    </p>\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                        {{'No hashtags created for this location' | translate}} </p>\r\n                    <div *ngIf=\"availableHashtags.length > 0\">\r\n                        <ul class=\"keywordsDisplay no-border\">\r\n                            <div class=\"keywordsdisplayContainer\">\r\n                                <li [class]=\"addedHashtags.includes(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                    *ngFor=\"let hashtag of availableHashtags\" (click)=\"onHashtagClick(hashtag)\"\r\n                                    style=\"cursor: pointer;\"\r\n                                    ngbTooltip=\"{{addedHashtags.includes(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                    {{hashtag.name}}</li>\r\n                            </div>\r\n                        </ul>\r\n                        <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                        <ul class=\"keywordsDisplay\">\r\n                            <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}</li>\r\n                            </div>\r\n                        </ul>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!spaceID.value\">\r\n                    <p class=\"keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"startDate\" ngbDatepicker\r\n                        data-testid=\"form-template-startDate\" #d1=\"ngbDatepicker\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['startDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-startDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['startDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['startDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\">\r\n                    </ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"endDate\" ngbDatepicker\r\n                         #d2=\"ngbDatepicker\" data-testid=\"form-template-endDate\" [class.is-invalid]=\"validatorsService.isControlError(form.controls['endDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-endDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['endDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['endDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                [disabled]=\"this.working || form.invalid\" data-testid=\"form-template-submit-btn\">{{'Save' |\r\n                translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\" [disabled]=\"this.working\" data-testid=\"form-template-cancel-btn\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' | translate}}</button>\r\n        </div>\r\n\r\n    </form>\r\n</div>", styles: [".form-container{margin:2rem 0rem}.form-container .btn-control-div .btn{width:8rem}.warning{margin:0;color:red}.keywordsDisplay{min-height:40px}.keywordsRules{margin-bottom:2px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"], components: [{ type: i4$1.NgbTimepicker, selector: "ngb-timepicker", inputs: ["meridian", "spinners", "seconds", "hourStep", "minuteStep", "secondStep", "readonlyInputs", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { type: i4$1.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: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: TemplateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-template', template: "<div class=\"form-container\" *ngIf=\"form\">\r\n    <div>\r\n        <h4>{{ 'Visit Template' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"form\">\r\n        <div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Visit Title' | translate}} *</label>\r\n                <div class=\"col-sm-8\">\r\n                    <input type=\"text\" class=\"form-control\"\r\n                        placeholder=\"Edvard Munch - \u00AB Un po\u00E8me d\u2019amour, de vie et de mort \u00BB\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['title'])\"\r\n                        formControlName=\"title\" data-testid=\"form-template-title\">\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-title-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['title'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['title'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <textarea class=\"form-control\" formControlName=\"description\" style=\"height:200px\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['description'])\"\r\n                        data-testid=\"form-template-description\"\r\n                        placeholder=\"Cette visite d\u20191h30 vous pr\u00E9sentera les \u0153uvres embl\u00E9matiques du c\u00E9l\u00E8bre peintre norv\u00E9gien Edvard Munch (1863-1944)...\"></textarea>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-description-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['description'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['description'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"locale\">\r\n                        <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                        <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                            {{ locale }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Level' | translate}}*</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"level\">\r\n                        <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                            {{ level }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"availableSpaces && !inputZone\">\r\n                    <select class=\"form-control\" formControlName=\"space\" (change)=\"onSpaceClick()\"\r\n                        data-testid=\"form-template-space\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['space'])\">\r\n                        <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                            {{ space.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-space-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['space'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['space'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                    {{ 'No locations available' | translate}}\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.space.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length > 0 && !inputZone\">\r\n                    <select class=\"form-control\" required formControlName=\"zone\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['zone'])\"\r\n                        data-testid=\"form-template-zone\">\r\n                        <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                            {{ zone.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-zone-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['zone'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['zone'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length === 0 && !inputZone\">\r\n                    <p class=\"warning col-form-label\">{{\"No Museum Zones found for this location\"| translate}}</p>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}}\r\n                    </p>\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                        {{'No hashtags created for this location' | translate}} </p>\r\n                    <div *ngIf=\"availableHashtags.length > 0\">\r\n                        <ul class=\"keywordsDisplay no-border\">\r\n                            <div class=\"keywordsdisplayContainer\">\r\n                                <li [class]=\"addedHashtags.includes(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                    *ngFor=\"let hashtag of availableHashtags\" (click)=\"onHashtagClick(hashtag)\"\r\n                                    style=\"cursor: pointer;\"\r\n                                    ngbTooltip=\"{{addedHashtags.includes(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                    {{hashtag.name}}</li>\r\n                            </div>\r\n                        </ul>\r\n                        <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                        <ul class=\"keywordsDisplay\">\r\n                            <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}</li>\r\n                            </div>\r\n                        </ul>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!spaceID.value\">\r\n                    <p class=\"keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"startDate\" ngbDatepicker\r\n                        data-testid=\"form-template-startDate\" #d1=\"ngbDatepicker\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['startDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-startDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['startDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['startDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\">\r\n                    </ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"endDate\" ngbDatepicker\r\n                        data-testid=\"form-template-endDate\" #d2=\"ngbDatepicker\" [class.is-invalid]=\"validatorsService.isControlError(form.controls['endDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-endDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['endDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['endDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                [disabled]=\"this.working || form.invalid\" data-testid=\"form-template-submit-btn\">{{'Save' |\r\n                translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\" [disabled]=\"this.working\" data-testid=\"form-template-cancel-btn\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' | translate}}</button>\r\n        </div>\r\n\r\n    </form>\r\n</div>", styles: [".form-container{margin:2rem 0rem}.form-container .btn-control-div .btn{width:8rem}.warning{margin:0;color:red}.keywordsDisplay{min-height:40px}.keywordsRules{margin-bottom:2px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"] }]
+            args: [{ selector: 'lib-template', template: "<div class=\"form-container\" *ngIf=\"form\">\r\n    <div>\r\n        <h4>{{ 'Visit Template' | translate }}</h4>\r\n    </div>\r\n    <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"form\">\r\n        <div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Visit Title' | translate}} *</label>\r\n                <div class=\"col-sm-8\">\r\n                    <input type=\"text\" class=\"form-control\"\r\n                        placeholder=\"Edvard Munch - \u00AB Un po\u00E8me d\u2019amour, de vie et de mort \u00BB\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['title'])\"\r\n                        formControlName=\"title\" data-testid=\"form-template-title\">\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-title-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['title'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['title'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Description' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <textarea class=\"form-control\" formControlName=\"description\" style=\"height:200px\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['description'])\"\r\n                        data-testid=\"form-template-description\"\r\n                        placeholder=\"Cette visite d\u20191h30 vous pr\u00E9sentera les \u0153uvres embl\u00E9matiques du c\u00E9l\u00E8bre peintre norv\u00E9gien Edvard Munch (1863-1944)...\"></textarea>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-description-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['description'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['description'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Language' | translate}}</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"locale\">\r\n                        <option [ngValue]=\"null\">{{'Not applicable' | translate}}</option>\r\n                        <option *ngFor=\"let locale of locales\" [ngValue]=\"locale\">\r\n                            {{ locale }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Level' | translate}}*</label>\r\n                <div class=\"col-sm-8\">\r\n                    <select class=\"form-control\" formControlName=\"level\">\r\n                        <option *ngFor=\"let level of availableLevels\" [ngValue]=\"level\">\r\n                            {{ level }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized location' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"availableSpaces && !inputZone\">\r\n                    <select class=\"form-control\" formControlName=\"space\" (change)=\"onSpaceClick()\"\r\n                        data-testid=\"form-template-space\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['space'])\">\r\n                        <option *ngFor=\"let space of availableSpaces\" [ngValue]=\"space.id\">\r\n                            {{ space.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-space-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['space'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['space'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!availableSpaces\">\r\n                    {{ 'No locations available' | translate}}\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.space.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{ 'Authorized zone' | translate }}*</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length > 0 && !inputZone\">\r\n                    <select class=\"form-control\" required formControlName=\"zone\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['zone'])\"\r\n                        data-testid=\"form-template-zone\">\r\n                        <option *ngFor=\"let zone of zonesForSpace\" [ngValue]=\"zone.id\">\r\n                            {{ zone.name }}\r\n                        </option>\r\n                    </select>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-zone-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['zone'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['zone'])\"></span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"zonesForSpace && zonesForSpace.length === 0 && !inputZone\">\r\n                    <p class=\"warning col-form-label\">{{\"No Museum Zones found for this location\"| translate}}</p>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"inputZone\">\r\n                    <input type=\"text\" class=\"form-control\" [value]=\"inputZone.name\" disabled>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Hashtags' | translate}}</label>\r\n                <div class=\"col-sm-8\" *ngIf=\"spaceID.value\">\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length > 0\">{{'Available hashtags' | translate}}\r\n                    </p>\r\n                    <p class=\"keywordsRules\" *ngIf=\"availableHashtags.length === 0\">\r\n                        {{'No hashtags created for this location' | translate}} </p>\r\n                    <div *ngIf=\"availableHashtags.length > 0\">\r\n                        <ul class=\"keywordsDisplay no-border\">\r\n                            <div class=\"keywordsdisplayContainer\">\r\n                                <li [class]=\"addedHashtags.includes(hashtag) ? 'keywordsItem added' : 'keywordsItem'\"\r\n                                    *ngFor=\"let hashtag of availableHashtags\" (click)=\"onHashtagClick(hashtag)\"\r\n                                    style=\"cursor: pointer;\"\r\n                                    ngbTooltip=\"{{addedHashtags.includes(hashtag) ? ('Remove'|translate) : ('Add'|translate) }}\">\r\n                                    {{hashtag.name}}</li>\r\n                            </div>\r\n                        </ul>\r\n                        <p class=\"keywordsRules\">{{'Added hashtags' | translate}} </p>\r\n                        <ul class=\"keywordsDisplay\">\r\n                            <div class=\"keywordsdisplayContainer\" *ngIf=\"addedHashtags.length> 0\">\r\n                                <li class=\"keywordsItem\" *ngFor=\"let hashtag of addedHashtags\">{{ hashtag.name }}</li>\r\n                            </div>\r\n                        </ul>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-sm-8\" *ngIf=\"!spaceID.value\">\r\n                    <p class=\"keywordsRules\">{{'You need to choose the location first' | translate}} </p>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"startDate\" ngbDatepicker\r\n                        data-testid=\"form-template-startDate\" #d1=\"ngbDatepicker\"\r\n                        [class.is-invalid]=\"validatorsService.isControlError(form.controls['startDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d1.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-startDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['startDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['startDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'Start Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeStart\" [ngModelOptions]=\"{standalone: true}\">\r\n                    </ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Date' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <input class=\"form-control\" placeholder=\"dd/mm/yyyy\" formControlName=\"endDate\" ngbDatepicker\r\n                         #d2=\"ngbDatepicker\" data-testid=\"form-template-endDate\" [class.is-invalid]=\"validatorsService.isControlError(form.controls['endDate'])\">\r\n                    <div class=\"input-group-append\">\r\n                        <button class=\"btn btn-outline-secondary calendar\" (click)=\"d2.toggle()\" type=\"button\"></button>\r\n                    </div>\r\n                    <div class=\"invalid-feedback\">\r\n                        <span data-testid=\"form-template-endDate-invalid\"\r\n                            [translate]=\"validatorsService.getError(form.controls['endDate'])\"\r\n                            *ngIf=\" validatorsService.isControlError(form.controls['endDate'])\"></span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <div class=\"form-group row\">\r\n                <label class=\"col-sm-4 col-form-label\">{{'End Time' | translate}}</label>\r\n                <div class=\"input-group col-sm-8\">\r\n                    <ngb-timepicker [(ngModel)]=\"missionTimeEnd\" [ngModelOptions]=\"{standalone: true}\"></ngb-timepicker>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"btn-control-div action-button-container\">\r\n            <button type=\"submit\" class=\"btn btn-outline-primary rounded-pill action-button\"\r\n                [disabled]=\"this.working || form.invalid\" data-testid=\"form-template-submit-btn\">{{'Save' |\r\n                translate}}</button>\r\n            <button type=\"button\" (click)=\"onCancel()\" [disabled]=\"this.working\" data-testid=\"form-template-cancel-btn\"\r\n                class=\"btn btn-outline-primary rounded-pill action-button\">{{'Cancel' | translate}}</button>\r\n        </div>\r\n\r\n    </form>\r\n</div>", styles: [".form-container{margin:2rem 0rem}.form-container .btn-control-div .btn{width:8rem}.warning{margin:0;color:red}.keywordsDisplay{min-height:40px}.keywordsRules{margin-bottom:2px}.form-group{margin:1.5rem 0}label.col-sm-4.col-form-label{width:200px;min-width:200px}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i2$1.ActivatedRoute }, { type: i2.FormBuilder }, { type: i1.BaseUserService }, { type: i1.SpaceService }, { type: i1.ZoneService }, { type: i4.Location }, { type: i1.HashtagService }, { type: i3.TranslateService }, { type: i1.TemplateService }, { type: i1.ValidatorsService }]; }, propDecorators: { currentOrg: [{
                 type: Input
             }], editTemplate: [{
@@ -1723,10 +1733,10 @@ class VisitorComponent {
     }
 }
 VisitorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: VisitorComponent, deps: [{ token: i1.BaseUserService }, { token: i1.MissionService }, { token: i2$1.Router }, { token: i3.TranslateService }, { token: i1.SpaceService }, { token: i1.ZoneService }, { token: i4$1.NgbModal }, { token: i1.TemplateService }], target: i0.ɵɵFactoryTarget.Component });
-VisitorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: VisitorComponent, selector: "lib-visitor", viewQueries: [{ propertyName: "modal", first: true, predicate: ["deleteUsers"], descendants: true }], ngImport: i0, template: "<div class=\"dashboard-tab\">\r\n    <div class=\"header-dashboard-tab\">\r\n        <h3>{{'Museum Visitors' | translate}}</h3>\r\n        <!-- <app-search-bar [searchable]=\"allZoneTemplatesMap\" objectType=\"TEMPLATE\"\r\n            (searchEvent)=\"applyResultsSearchBar($event)\">\r\n        </app-search-bar> -->\r\n        <hr>\r\n    </div>\r\n    <div class=\"row\">\r\n        <div class=\"col-md-8 col-lg-7\">\r\n            <div class=\"row ml-0 mb-2\">\r\n                <h4 class=\"header-small\">{{'Itineraries' | translate}}</h4>\r\n            </div>\r\n            <div class=\"row ml-0 mb-2\" *ngIf=\"!editing && !creating\">\r\n                <button class=\"btn btn-outline-primary rounded-pill ml-3 add-button\" (click)=\"onCreateTemplate()\"\r\n                    data-testid=\"new-museum-template-btn\">\r\n                    {{'Create template for new itinerary' | translate}}</button>\r\n            </div>\r\n            <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n                <lib-loader></lib-loader>\r\n            </div>\r\n            <div *ngIf=\"!editing && !creating\">\r\n                <ul class=\"list-group list-group-flush\">\r\n                    <li class=\"list-group-item\" *ngFor=\"let pair of allZoneTemplatesMapFiltered | keyvalue\">\r\n                        <h4>{{pair.key.name}} <span style=\"font-size:0.8em\"> - {{pair.key.space.name}}</span> </h4>\r\n                        <div class=\"d-flex justify-content-between align-items-center\"\r\n                            (click)=\"onToggleMissionsForZone(pair.key.id)\">\r\n                            <ng-container *ngIf=\"pair.value.length <= 1\">\r\n                                {{pair.value.length}} {{'visit template found' | translate}}\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"pair.value.length > 1\">\r\n                                {{pair.value.length}} {{'visit templates found' | translate}}\r\n                            </ng-container>\r\n                            <lib-chevron data-testid=\"open-museum-zone-btn\" [conditionShowing]=\"detailsForZones.includes(pair.key.id)\"></lib-chevron>\r\n\r\n                        </div>\r\n                        <div *ngIf=\"detailsForZones.includes(pair.key.id)\">\r\n                            <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3 ml-2\"\r\n                                (click)=\"onAddNewTemplateToZone(pair.key)\">{{'Add new template' | translate}}</button>\r\n\r\n                            <ul class=\"container-fluid list-group list-group-flush\">\r\n                                <li class=\"list-group-item\" *ngFor=\"let template of pair.value\">\r\n                                    <div class=\"d-flex justify-content-between align-items-center\"\r\n                                        (click)=\"onToggleTemplateDetails(template)\">\r\n                                        <h5>{{template.title}}</h5>\r\n                                        <lib-chevron data-testid=\"open-museum-template-btn\" [conditionShowing]=\"templateShowing === template.id\"></lib-chevron>\r\n                                    </div>\r\n                                    <div *ngIf=\"templateShowing === template.id\">\r\n                                        <ul class=\"list-group list-group-flush\">\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Description' | translate }}:\r\n                                                {{ template.description}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}:\r\n                                                {{ template.locale ? template.locale : ('Not applicable' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"template.hashtags && template.hashtags.length> 0\">\r\n                                                {{'Hashtags' | translate}}:\r\n                                                <ul class=\"keywordsDisplay no-border\">\r\n                                                    <div class=\"keywordsdisplayContainer\"\r\n                                                        *ngIf=\"template.hashtags.length> 0\">\r\n                                                        <li class=\"keywordsItem\"\r\n                                                            *ngFor=\"let hashtag of template.hashtags\">{{\r\n                                                            hashtag | hashtagFromID | async }}</li>\r\n                                                    </div>\r\n                                                </ul>\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}:\r\n                                                {{ template.level}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Planned at' | translate }} :\r\n                                                {{ template.startDateTime ? (template.startDateTime |\r\n                                                timeDateString:\"day_time_zone\" | async) :\r\n                                                \"No data\" | translate }} -\r\n                                                {{ template.endDateTime ?\r\n                                                (template.endDateTime | timeDateString:\"day_time_zone\" | async) : \"No\r\n                                                data\" |\r\n                                                translate}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">\r\n                                                {{'Effective start/end time ' | translate }}:\r\n                                                {{ template.realStartedAt ? (template.realStartedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}} /\r\n                                                {{ template.realEndedAt ? (template.realEndedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"allTemplateMissionsMap.get(template.id)\">\r\n                                                {{'Visitors created' |\r\n                                                translate}}:{{allTemplateMissionsMap.get(template.id).length}}\r\n                                                <lib-csv-export [headers]=\"csvHeaders\" [title]=\"'Users'\"\r\n                                                    buttonLabel=\"Download users\"\r\n                                                    [rowsInput]=\"generateCSVUsers(template)\">\r\n                                                </lib-csv-export>\r\n                                            </li>\r\n\r\n                                        </ul>\r\n                                        <div class=\"action-button-container\">\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\"\r\n                                                    ngbDropdownToggle>{{'Manage users' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\r\n                                                    <button (click)=\"onGenerateBatch(template)\" ngbDropdownItem>\r\n                                                        {{'Create users from this template' | translate}}</button>\r\n                                                    <button (click)=\"onSendInvitation(template)\" ngbDropdownItem>\r\n                                                        {{'Send invitation to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onSendUpdate(template)\" ngbDropdownItem>\r\n                                                        {{'Send update to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDeleteUsers(template)\" ngbDropdownItem>\r\n                                                        {{'Remove users' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop2=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdown2\" data-testid=\"open-dropdown2-museum-template-btn\"\r\n                                                    ngbDropdownToggle>{{'Manage template' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdown2\">\r\n                                                    <button (click)=\"onEditTemplate(template)\" ngbDropdownItem data-testid=\"edit-museum-template-btn\">\r\n                                                        {{'Edit template' | translate}}</button>\r\n                                                    <button (click)=\"onCleanTimeTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Clean effective times' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onArchiveTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Archive template' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onCancelTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Cancel visit' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDuplicateTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Duplicate' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                        </div>\r\n                                        <!-- <button type=\"button\" class=\"btn btn-primary rounded-pill mr-2 ml-auto\"\r\n                                            (click)=\"onEdit(mis)\">\r\n                                            {{'Edit' | translate}}</button>\r\n                                        <button class=\"btn btn-primary rounded-pill mt-3 mb-3 ml-auto\"\r\n                                            (click)=\"onArchiveTemplate(mis)\">{{'Archive' | translate}}</button> -->\r\n                                    </div>\r\n\r\n                                </li>\r\n                            </ul>\r\n                        </div>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <div *ngIf=\"editing\">\r\n                <lib-template [editTemplate]=\"templateToEdit\" [currentOrg]=\"currentOrg\"\r\n                    (updatedTemplate)=\"onUpdatedTemplate($event)\"></lib-template>\r\n            </div>\r\n            <div *ngIf=\"creating\">\r\n                <lib-template [currentOrg]=\"currentOrg\" [zoneID]=\"zoneIDForNewTemplate\"\r\n                    (createdTemplate)=\"onCreatedTemplate($event)\"></lib-template>\r\n            </div>\r\n        </div>\r\n        <div class=\"col-md-4 col-lg-5\" *ngIf=\"isAddingBatch\">\r\n            <lib-create-batch [template]=\"chosenTemplate\" (createdMissions)=\"onUpdatedEvent($event)\"></lib-create-batch>\r\n        </div>\r\n        <ng-template #deleteUsers let-modal>\r\n            <div class=\"modal-header\">\r\n                <h4 class=\"modal-title\" id=\"modal-basic-title\">{{\"Delete users\" | translate}}\r\n                </h4>\r\n                <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"modalRef.close()\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div class=\"column align-items-center\">\r\n                    <div class=\"row\" style=\"padding: 0 1.25rem;\">\r\n                        <ul class=\"container-fluid list-group list-group-flush\">\r\n                            <li class=\"list-group-item\" *ngFor=\"let object of currentTemplateUsers\">\r\n                                <input type=\"checkbox\" [(ngModel)]=\"object.checked\"> {{object.profile.email}}\r\n                            </li>\r\n                        </ul>\r\n                    </div>\r\n\r\n                    <div class=\"row\" style=\"padding: 1.25rem;\">\r\n                        <button class=\"btn btn-outline-primary rounded-pill mr-4\" (click)=\"onDeleteChosen()\">{{\"Apply\" |\r\n                            translate}}\r\n                        </button>\r\n                        <button class=\"btn btn-outline-primary rounded-pill\" (click)=\"modalRef.close()\">{{\"Cancel\" |\r\n                            translate}}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"], components: [{ type: i1.LoaderComponent, selector: "lib-loader" }, { type: ChevronComponent, selector: "lib-chevron", inputs: ["conditionShowing"] }, { type: i1.CsvExportComponent, selector: "lib-csv-export", inputs: ["headers", "rowsInput", "getRows", "title", "buttonLabel"] }, { type: TemplateComponent, selector: "lib-template", inputs: ["currentOrg", "editTemplate", "zoneID"], outputs: ["updatedTemplate", "createdTemplate"] }, { type: CreateBatchComponent, selector: "lib-create-batch", inputs: ["template"], outputs: ["createdMissions"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { type: i4$1.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { type: i4$1.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { type: i4$1.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["disabled"] }, { type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe, "keyvalue": i4.KeyValuePipe, "async": i4.AsyncPipe, "hashtagFromID": i1.HashtagFromIdPipe, "timeDateString": i1.TimeDateToLocalStringPipe } });
+VisitorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: VisitorComponent, selector: "lib-visitor", viewQueries: [{ propertyName: "modal", first: true, predicate: ["deleteUsers"], descendants: true }], ngImport: i0, template: "<div class=\"dashboard-tab\">\r\n    <div class=\"header-dashboard-tab\">\r\n        <h3>{{'Museum Visitors' | translate}}</h3>\r\n        <!-- <app-search-bar [searchable]=\"allZoneTemplatesMap\" objectType=\"TEMPLATE\"\r\n            (searchEvent)=\"applyResultsSearchBar($event)\">\r\n        </app-search-bar> -->\r\n        <hr>\r\n    </div>\r\n    <div class=\"row\">\r\n        <div class=\"col-md-8 col-lg-7\">\r\n            <div class=\"row ml-0 mb-2\">\r\n                <h4 class=\"header-small\">{{'Itineraries' | translate}}</h4>\r\n            </div>\r\n            <div class=\"row ml-0 mb-2\" *ngIf=\"!editing && !creating\">\r\n                <button class=\"btn btn-outline-primary rounded-pill ml-3 add-button\" (click)=\"onCreateTemplate()\"\r\n                    data-testid=\"new-museum-template-btn\">\r\n                    {{'Create template for new itinerary' | translate}}</button>\r\n            </div>\r\n            <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n                <lib-loader></lib-loader>\r\n            </div>\r\n            <div *ngIf=\"!editing && !creating\">\r\n                <ul class=\"list-group list-group-flush\" data-testid=\"open-museum-zone-btn\">\r\n                    <li class=\"list-group-item\" *ngFor=\"let pair of allZoneTemplatesMapFiltered | keyvalue\">\r\n                        <h4>{{pair.key.name}} <span style=\"font-size:0.8em\"> - {{pair.key.space.name}}</span> </h4>\r\n                        <div class=\"d-flex justify-content-between align-items-center\"\r\n                            (click)=\"onToggleMissionsForZone(pair.key.id)\">\r\n                            <ng-container *ngIf=\"pair.value.length <= 1\">\r\n                                {{pair.value.length}} {{'visit template found' | translate}}\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"pair.value.length > 1\">\r\n                                {{pair.value.length}} {{'visit templates found' | translate}}\r\n                            </ng-container>\r\n                            <lib-chevron [ngClass]=\"[pair.key.name]\"  [conditionShowing]=\"detailsForZones.includes(pair.key.id)\"></lib-chevron>\r\n\r\n                        </div>\r\n                        <div *ngIf=\"detailsForZones.includes(pair.key.id)\">\r\n                            <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3 ml-2\"\r\n                                (click)=\"onAddNewTemplateToZone(pair.key)\">{{'Add new template' | translate}}</button>\r\n\r\n                            <ul class=\"container-fluid list-group list-group-flush\">\r\n                                <li class=\"list-group-item\" *ngFor=\"let template of pair.value\">\r\n                                    <div class=\"d-flex justify-content-between align-items-center\"\r\n                                        (click)=\"onToggleTemplateDetails(template)\">\r\n                                        <h5>{{template.title}}</h5>\r\n                                        <lib-chevron data-testid=\"open-museum-template-btn\" [conditionShowing]=\"templateShowing === template.id\"></lib-chevron>\r\n                                    </div>\r\n                                    <div *ngIf=\"templateShowing === template.id\">\r\n                                        <ul class=\"list-group list-group-flush\">\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Description' | translate }}:\r\n                                                {{ template.description}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}:\r\n                                                {{ template.locale ? template.locale : ('Not applicable' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"template.hashtags && template.hashtags.length> 0\">\r\n                                                {{'Hashtags' | translate}}:\r\n                                                <ul class=\"keywordsDisplay no-border\">\r\n                                                    <div class=\"keywordsdisplayContainer\"\r\n                                                        *ngIf=\"template.hashtags.length> 0\">\r\n                                                        <li class=\"keywordsItem\"\r\n                                                            *ngFor=\"let hashtag of template.hashtags\">{{\r\n                                                            hashtag | hashtagFromID | async }}</li>\r\n                                                    </div>\r\n                                                </ul>\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}:\r\n                                                {{ template.level}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Planned at' | translate }} :\r\n                                                {{ template.startDateTime ? (template.startDateTime |\r\n                                                timeDateString:\"day_time_zone\" | async) :\r\n                                                \"No data\" | translate }} -\r\n                                                {{ template.endDateTime ?\r\n                                                (template.endDateTime | timeDateString:\"day_time_zone\" | async) : \"No\r\n                                                data\" |\r\n                                                translate}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">\r\n                                                {{'Effective start/end time ' | translate }}:\r\n                                                {{ template.realStartedAt ? (template.realStartedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}} /\r\n                                                {{ template.realEndedAt ? (template.realEndedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"allTemplateMissionsMap.get(template.id)\">\r\n                                                {{'Visitors created' |\r\n                                                translate}}:{{allTemplateMissionsMap.get(template.id).length}}\r\n                                                <lib-csv-export [headers]=\"csvHeaders\" [title]=\"'Users'\"\r\n                                                    buttonLabel=\"Download users\"\r\n                                                    [rowsInput]=\"generateCSVUsers(template)\">\r\n                                                </lib-csv-export>\r\n                                            </li>\r\n\r\n                                        </ul>\r\n                                        <div class=\"action-button-container\">\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\"\r\n                                                    ngbDropdownToggle>{{'Manage users' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\r\n                                                    <button (click)=\"onGenerateBatch(template)\" ngbDropdownItem>\r\n                                                        {{'Create users from this template' | translate}}</button>\r\n                                                    <button (click)=\"onSendInvitation(template)\" ngbDropdownItem>\r\n                                                        {{'Send invitation to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onSendUpdate(template)\" ngbDropdownItem>\r\n                                                        {{'Send update to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDeleteUsers(template)\" ngbDropdownItem>\r\n                                                        {{'Remove users' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop2=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdown2\" data-testid=\"open-dropdown2-museum-template-btn\"\r\n                                                    ngbDropdownToggle>{{'Manage template' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdown2\">\r\n                                                    <button (click)=\"onEditTemplate(template)\" ngbDropdownItem data-testid=\"edit-museum-template-btn\">\r\n                                                        {{'Edit template' | translate}}</button>\r\n                                                    <button (click)=\"onCleanTimeTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Clean effective times' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onArchiveTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Archive template' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onCancelTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Cancel visit' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDuplicateTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Duplicate' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                        </div>\r\n                                        <!-- <button type=\"button\" class=\"btn btn-primary rounded-pill mr-2 ml-auto\"\r\n                                            (click)=\"onEdit(mis)\">\r\n                                            {{'Edit' | translate}}</button>\r\n                                        <button class=\"btn btn-primary rounded-pill mt-3 mb-3 ml-auto\"\r\n                                            (click)=\"onArchiveTemplate(mis)\">{{'Archive' | translate}}</button> -->\r\n                                    </div>\r\n\r\n                                </li>\r\n                            </ul>\r\n                        </div>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <div *ngIf=\"editing\">\r\n                <lib-template [editTemplate]=\"templateToEdit\" [currentOrg]=\"currentOrg\"\r\n                    (updatedTemplate)=\"onUpdatedTemplate($event)\"></lib-template>\r\n            </div>\r\n            <div *ngIf=\"creating\">\r\n                <lib-template [currentOrg]=\"currentOrg\" [zoneID]=\"zoneIDForNewTemplate\"\r\n                    (createdTemplate)=\"onCreatedTemplate($event)\"></lib-template>\r\n            </div>\r\n        </div>\r\n        <div class=\"col-md-4 col-lg-5\" *ngIf=\"isAddingBatch\">\r\n            <lib-create-batch [template]=\"chosenTemplate\" (createdMissions)=\"onUpdatedEvent($event)\"></lib-create-batch>\r\n        </div>\r\n        <ng-template #deleteUsers let-modal>\r\n            <div class=\"modal-header\">\r\n                <h4 class=\"modal-title\" id=\"modal-basic-title\">{{\"Delete users\" | translate}}\r\n                </h4>\r\n                <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"modalRef.close()\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div class=\"column align-items-center\">\r\n                    <div class=\"row\" style=\"padding: 0 1.25rem;\">\r\n                        <ul class=\"container-fluid list-group list-group-flush\">\r\n                            <li class=\"list-group-item\" *ngFor=\"let object of currentTemplateUsers\">\r\n                                <input type=\"checkbox\" [(ngModel)]=\"object.checked\"> {{object.profile.email}}\r\n                            </li>\r\n                        </ul>\r\n                    </div>\r\n\r\n                    <div class=\"row\" style=\"padding: 1.25rem;\">\r\n                        <button class=\"btn btn-outline-primary rounded-pill mr-4\" (click)=\"onDeleteChosen()\">{{\"Apply\" |\r\n                            translate}}\r\n                        </button>\r\n                        <button class=\"btn btn-outline-primary rounded-pill\" (click)=\"modalRef.close()\">{{\"Cancel\" |\r\n                            translate}}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"], components: [{ type: i1.LoaderComponent, selector: "lib-loader" }, { type: ChevronComponent, selector: "lib-chevron", inputs: ["conditionShowing"] }, { type: i1.CsvExportComponent, selector: "lib-csv-export", inputs: ["headers", "rowsInput", "getRows", "title", "buttonLabel"] }, { type: TemplateComponent, selector: "lib-template", inputs: ["currentOrg", "editTemplate", "zoneID"], outputs: ["updatedTemplate", "createdTemplate"] }, { type: CreateBatchComponent, selector: "lib-create-batch", inputs: ["template"], outputs: ["createdMissions"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4$1.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { type: i4$1.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { type: i4$1.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { type: i4$1.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["disabled"] }, { type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe, "keyvalue": i4.KeyValuePipe, "async": i4.AsyncPipe, "hashtagFromID": i1.HashtagFromIdPipe, "timeDateString": i1.TimeDateToLocalStringPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: VisitorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-visitor', template: "<div class=\"dashboard-tab\">\r\n    <div class=\"header-dashboard-tab\">\r\n        <h3>{{'Museum Visitors' | translate}}</h3>\r\n        <!-- <app-search-bar [searchable]=\"allZoneTemplatesMap\" objectType=\"TEMPLATE\"\r\n            (searchEvent)=\"applyResultsSearchBar($event)\">\r\n        </app-search-bar> -->\r\n        <hr>\r\n    </div>\r\n    <div class=\"row\">\r\n        <div class=\"col-md-8 col-lg-7\">\r\n            <div class=\"row ml-0 mb-2\">\r\n                <h4 class=\"header-small\">{{'Itineraries' | translate}}</h4>\r\n            </div>\r\n            <div class=\"row ml-0 mb-2\" *ngIf=\"!editing && !creating\">\r\n                <button class=\"btn btn-outline-primary rounded-pill ml-3 add-button\" (click)=\"onCreateTemplate()\"\r\n                    data-testid=\"new-museum-template-btn\">\r\n                    {{'Create template for new itinerary' | translate}}</button>\r\n            </div>\r\n            <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n                <lib-loader></lib-loader>\r\n            </div>\r\n            <div *ngIf=\"!editing && !creating\">\r\n                <ul class=\"list-group list-group-flush\">\r\n                    <li class=\"list-group-item\" *ngFor=\"let pair of allZoneTemplatesMapFiltered | keyvalue\">\r\n                        <h4>{{pair.key.name}} <span style=\"font-size:0.8em\"> - {{pair.key.space.name}}</span> </h4>\r\n                        <div class=\"d-flex justify-content-between align-items-center\"\r\n                            (click)=\"onToggleMissionsForZone(pair.key.id)\">\r\n                            <ng-container *ngIf=\"pair.value.length <= 1\">\r\n                                {{pair.value.length}} {{'visit template found' | translate}}\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"pair.value.length > 1\">\r\n                                {{pair.value.length}} {{'visit templates found' | translate}}\r\n                            </ng-container>\r\n                            <lib-chevron data-testid=\"open-museum-zone-btn\" [conditionShowing]=\"detailsForZones.includes(pair.key.id)\"></lib-chevron>\r\n\r\n                        </div>\r\n                        <div *ngIf=\"detailsForZones.includes(pair.key.id)\">\r\n                            <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3 ml-2\"\r\n                                (click)=\"onAddNewTemplateToZone(pair.key)\">{{'Add new template' | translate}}</button>\r\n\r\n                            <ul class=\"container-fluid list-group list-group-flush\">\r\n                                <li class=\"list-group-item\" *ngFor=\"let template of pair.value\">\r\n                                    <div class=\"d-flex justify-content-between align-items-center\"\r\n                                        (click)=\"onToggleTemplateDetails(template)\">\r\n                                        <h5>{{template.title}}</h5>\r\n                                        <lib-chevron data-testid=\"open-museum-template-btn\" [conditionShowing]=\"templateShowing === template.id\"></lib-chevron>\r\n                                    </div>\r\n                                    <div *ngIf=\"templateShowing === template.id\">\r\n                                        <ul class=\"list-group list-group-flush\">\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Description' | translate }}:\r\n                                                {{ template.description}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}:\r\n                                                {{ template.locale ? template.locale : ('Not applicable' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"template.hashtags && template.hashtags.length> 0\">\r\n                                                {{'Hashtags' | translate}}:\r\n                                                <ul class=\"keywordsDisplay no-border\">\r\n                                                    <div class=\"keywordsdisplayContainer\"\r\n                                                        *ngIf=\"template.hashtags.length> 0\">\r\n                                                        <li class=\"keywordsItem\"\r\n                                                            *ngFor=\"let hashtag of template.hashtags\">{{\r\n                                                            hashtag | hashtagFromID | async }}</li>\r\n                                                    </div>\r\n                                                </ul>\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}:\r\n                                                {{ template.level}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Planned at' | translate }} :\r\n                                                {{ template.startDateTime ? (template.startDateTime |\r\n                                                timeDateString:\"day_time_zone\" | async) :\r\n                                                \"No data\" | translate }} -\r\n                                                {{ template.endDateTime ?\r\n                                                (template.endDateTime | timeDateString:\"day_time_zone\" | async) : \"No\r\n                                                data\" |\r\n                                                translate}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">\r\n                                                {{'Effective start/end time ' | translate }}:\r\n                                                {{ template.realStartedAt ? (template.realStartedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}} /\r\n                                                {{ template.realEndedAt ? (template.realEndedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"allTemplateMissionsMap.get(template.id)\">\r\n                                                {{'Visitors created' |\r\n                                                translate}}:{{allTemplateMissionsMap.get(template.id).length}}\r\n                                                <lib-csv-export [headers]=\"csvHeaders\" [title]=\"'Users'\"\r\n                                                    buttonLabel=\"Download users\"\r\n                                                    [rowsInput]=\"generateCSVUsers(template)\">\r\n                                                </lib-csv-export>\r\n                                            </li>\r\n\r\n                                        </ul>\r\n                                        <div class=\"action-button-container\">\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\"\r\n                                                    ngbDropdownToggle>{{'Manage users' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\r\n                                                    <button (click)=\"onGenerateBatch(template)\" ngbDropdownItem>\r\n                                                        {{'Create users from this template' | translate}}</button>\r\n                                                    <button (click)=\"onSendInvitation(template)\" ngbDropdownItem>\r\n                                                        {{'Send invitation to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onSendUpdate(template)\" ngbDropdownItem>\r\n                                                        {{'Send update to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDeleteUsers(template)\" ngbDropdownItem>\r\n                                                        {{'Remove users' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop2=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdown2\" data-testid=\"open-dropdown2-museum-template-btn\"\r\n                                                    ngbDropdownToggle>{{'Manage template' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdown2\">\r\n                                                    <button (click)=\"onEditTemplate(template)\" ngbDropdownItem data-testid=\"edit-museum-template-btn\">\r\n                                                        {{'Edit template' | translate}}</button>\r\n                                                    <button (click)=\"onCleanTimeTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Clean effective times' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onArchiveTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Archive template' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onCancelTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Cancel visit' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDuplicateTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Duplicate' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                        </div>\r\n                                        <!-- <button type=\"button\" class=\"btn btn-primary rounded-pill mr-2 ml-auto\"\r\n                                            (click)=\"onEdit(mis)\">\r\n                                            {{'Edit' | translate}}</button>\r\n                                        <button class=\"btn btn-primary rounded-pill mt-3 mb-3 ml-auto\"\r\n                                            (click)=\"onArchiveTemplate(mis)\">{{'Archive' | translate}}</button> -->\r\n                                    </div>\r\n\r\n                                </li>\r\n                            </ul>\r\n                        </div>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <div *ngIf=\"editing\">\r\n                <lib-template [editTemplate]=\"templateToEdit\" [currentOrg]=\"currentOrg\"\r\n                    (updatedTemplate)=\"onUpdatedTemplate($event)\"></lib-template>\r\n            </div>\r\n            <div *ngIf=\"creating\">\r\n                <lib-template [currentOrg]=\"currentOrg\" [zoneID]=\"zoneIDForNewTemplate\"\r\n                    (createdTemplate)=\"onCreatedTemplate($event)\"></lib-template>\r\n            </div>\r\n        </div>\r\n        <div class=\"col-md-4 col-lg-5\" *ngIf=\"isAddingBatch\">\r\n            <lib-create-batch [template]=\"chosenTemplate\" (createdMissions)=\"onUpdatedEvent($event)\"></lib-create-batch>\r\n        </div>\r\n        <ng-template #deleteUsers let-modal>\r\n            <div class=\"modal-header\">\r\n                <h4 class=\"modal-title\" id=\"modal-basic-title\">{{\"Delete users\" | translate}}\r\n                </h4>\r\n                <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"modalRef.close()\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div class=\"column align-items-center\">\r\n                    <div class=\"row\" style=\"padding: 0 1.25rem;\">\r\n                        <ul class=\"container-fluid list-group list-group-flush\">\r\n                            <li class=\"list-group-item\" *ngFor=\"let object of currentTemplateUsers\">\r\n                                <input type=\"checkbox\" [(ngModel)]=\"object.checked\"> {{object.profile.email}}\r\n                            </li>\r\n                        </ul>\r\n                    </div>\r\n\r\n                    <div class=\"row\" style=\"padding: 1.25rem;\">\r\n                        <button class=\"btn btn-outline-primary rounded-pill mr-4\" (click)=\"onDeleteChosen()\">{{\"Apply\" |\r\n                            translate}}\r\n                        </button>\r\n                        <button class=\"btn btn-outline-primary rounded-pill\" (click)=\"modalRef.close()\">{{\"Cancel\" |\r\n                            translate}}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"] }]
+            args: [{ selector: 'lib-visitor', template: "<div class=\"dashboard-tab\">\r\n    <div class=\"header-dashboard-tab\">\r\n        <h3>{{'Museum Visitors' | translate}}</h3>\r\n        <!-- <app-search-bar [searchable]=\"allZoneTemplatesMap\" objectType=\"TEMPLATE\"\r\n            (searchEvent)=\"applyResultsSearchBar($event)\">\r\n        </app-search-bar> -->\r\n        <hr>\r\n    </div>\r\n    <div class=\"row\">\r\n        <div class=\"col-md-8 col-lg-7\">\r\n            <div class=\"row ml-0 mb-2\">\r\n                <h4 class=\"header-small\">{{'Itineraries' | translate}}</h4>\r\n            </div>\r\n            <div class=\"row ml-0 mb-2\" *ngIf=\"!editing && !creating\">\r\n                <button class=\"btn btn-outline-primary rounded-pill ml-3 add-button\" (click)=\"onCreateTemplate()\"\r\n                    data-testid=\"new-museum-template-btn\">\r\n                    {{'Create template for new itinerary' | translate}}</button>\r\n            </div>\r\n            <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n                <lib-loader></lib-loader>\r\n            </div>\r\n            <div *ngIf=\"!editing && !creating\">\r\n                <ul class=\"list-group list-group-flush\" data-testid=\"open-museum-zone-btn\">\r\n                    <li class=\"list-group-item\" *ngFor=\"let pair of allZoneTemplatesMapFiltered | keyvalue\">\r\n                        <h4>{{pair.key.name}} <span style=\"font-size:0.8em\"> - {{pair.key.space.name}}</span> </h4>\r\n                        <div class=\"d-flex justify-content-between align-items-center\"\r\n                            (click)=\"onToggleMissionsForZone(pair.key.id)\">\r\n                            <ng-container *ngIf=\"pair.value.length <= 1\">\r\n                                {{pair.value.length}} {{'visit template found' | translate}}\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"pair.value.length > 1\">\r\n                                {{pair.value.length}} {{'visit templates found' | translate}}\r\n                            </ng-container>\r\n                            <lib-chevron [ngClass]=\"[pair.key.name]\"  [conditionShowing]=\"detailsForZones.includes(pair.key.id)\"></lib-chevron>\r\n\r\n                        </div>\r\n                        <div *ngIf=\"detailsForZones.includes(pair.key.id)\">\r\n                            <button class=\"btn btn-outline-primary rounded-pill mt-3 mb-3 ml-2\"\r\n                                (click)=\"onAddNewTemplateToZone(pair.key)\">{{'Add new template' | translate}}</button>\r\n\r\n                            <ul class=\"container-fluid list-group list-group-flush\">\r\n                                <li class=\"list-group-item\" *ngFor=\"let template of pair.value\">\r\n                                    <div class=\"d-flex justify-content-between align-items-center\"\r\n                                        (click)=\"onToggleTemplateDetails(template)\">\r\n                                        <h5>{{template.title}}</h5>\r\n                                        <lib-chevron data-testid=\"open-museum-template-btn\" [conditionShowing]=\"templateShowing === template.id\"></lib-chevron>\r\n                                    </div>\r\n                                    <div *ngIf=\"templateShowing === template.id\">\r\n                                        <ul class=\"list-group list-group-flush\">\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Description' | translate }}:\r\n                                                {{ template.description}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Language' | translate }}:\r\n                                                {{ template.locale ? template.locale : ('Not applicable' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"template.hashtags && template.hashtags.length> 0\">\r\n                                                {{'Hashtags' | translate}}:\r\n                                                <ul class=\"keywordsDisplay no-border\">\r\n                                                    <div class=\"keywordsdisplayContainer\"\r\n                                                        *ngIf=\"template.hashtags.length> 0\">\r\n                                                        <li class=\"keywordsItem\"\r\n                                                            *ngFor=\"let hashtag of template.hashtags\">{{\r\n                                                            hashtag | hashtagFromID | async }}</li>\r\n                                                    </div>\r\n                                                </ul>\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Access level' | translate }}:\r\n                                                {{ template.level}}</li>\r\n                                            <li class=\"list-group-item bg-transparent\">{{'Planned at' | translate }} :\r\n                                                {{ template.startDateTime ? (template.startDateTime |\r\n                                                timeDateString:\"day_time_zone\" | async) :\r\n                                                \"No data\" | translate }} -\r\n                                                {{ template.endDateTime ?\r\n                                                (template.endDateTime | timeDateString:\"day_time_zone\" | async) : \"No\r\n                                                data\" |\r\n                                                translate}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\">\r\n                                                {{'Effective start/end time ' | translate }}:\r\n                                                {{ template.realStartedAt ? (template.realStartedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}} /\r\n                                                {{ template.realEndedAt ? (template.realEndedAt |\r\n                                                timeDateString:\"day_time_zone\" | async) : ('No data' | translate)}}\r\n                                            </li>\r\n                                            <li class=\"list-group-item bg-transparent\"\r\n                                                *ngIf=\"allTemplateMissionsMap.get(template.id)\">\r\n                                                {{'Visitors created' |\r\n                                                translate}}:{{allTemplateMissionsMap.get(template.id).length}}\r\n                                                <lib-csv-export [headers]=\"csvHeaders\" [title]=\"'Users'\"\r\n                                                    buttonLabel=\"Download users\"\r\n                                                    [rowsInput]=\"generateCSVUsers(template)\">\r\n                                                </lib-csv-export>\r\n                                            </li>\r\n\r\n                                        </ul>\r\n                                        <div class=\"action-button-container\">\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\"\r\n                                                    ngbDropdownToggle>{{'Manage users' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\r\n                                                    <button (click)=\"onGenerateBatch(template)\" ngbDropdownItem>\r\n                                                        {{'Create users from this template' | translate}}</button>\r\n                                                    <button (click)=\"onSendInvitation(template)\" ngbDropdownItem>\r\n                                                        {{'Send invitation to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onSendUpdate(template)\" ngbDropdownItem>\r\n                                                        {{'Send update to all users' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDeleteUsers(template)\" ngbDropdownItem>\r\n                                                        {{'Remove users' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                            <div class=\"d-inline-block mr-2 action-button\" ngbDropdown\r\n                                                #myDrop2=\"ngbDropdown\">\r\n                                                <button class=\"btn btn-label-file rounded-pill\" id=\"dropdown2\" data-testid=\"open-dropdown2-museum-template-btn\"\r\n                                                    ngbDropdownToggle>{{'Manage template' |\r\n                                                    translate}}</button>\r\n                                                <div ngbDropdownMenu aria-labelledby=\"dropdown2\">\r\n                                                    <button (click)=\"onEditTemplate(template)\" ngbDropdownItem data-testid=\"edit-museum-template-btn\">\r\n                                                        {{'Edit template' | translate}}</button>\r\n                                                    <button (click)=\"onCleanTimeTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Clean effective times' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onArchiveTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Archive template' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onCancelTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Cancel visit' | translate}}\r\n                                                    </button>\r\n                                                    <button (click)=\"onDuplicateTemplate(template)\" ngbDropdownItem>\r\n                                                        {{'Duplicate' | translate}}\r\n                                                    </button>\r\n                                                </div>\r\n                                            </div>\r\n                                        </div>\r\n                                        <!-- <button type=\"button\" class=\"btn btn-primary rounded-pill mr-2 ml-auto\"\r\n                                            (click)=\"onEdit(mis)\">\r\n                                            {{'Edit' | translate}}</button>\r\n                                        <button class=\"btn btn-primary rounded-pill mt-3 mb-3 ml-auto\"\r\n                                            (click)=\"onArchiveTemplate(mis)\">{{'Archive' | translate}}</button> -->\r\n                                    </div>\r\n\r\n                                </li>\r\n                            </ul>\r\n                        </div>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <div *ngIf=\"editing\">\r\n                <lib-template [editTemplate]=\"templateToEdit\" [currentOrg]=\"currentOrg\"\r\n                    (updatedTemplate)=\"onUpdatedTemplate($event)\"></lib-template>\r\n            </div>\r\n            <div *ngIf=\"creating\">\r\n                <lib-template [currentOrg]=\"currentOrg\" [zoneID]=\"zoneIDForNewTemplate\"\r\n                    (createdTemplate)=\"onCreatedTemplate($event)\"></lib-template>\r\n            </div>\r\n        </div>\r\n        <div class=\"col-md-4 col-lg-5\" *ngIf=\"isAddingBatch\">\r\n            <lib-create-batch [template]=\"chosenTemplate\" (createdMissions)=\"onUpdatedEvent($event)\"></lib-create-batch>\r\n        </div>\r\n        <ng-template #deleteUsers let-modal>\r\n            <div class=\"modal-header\">\r\n                <h4 class=\"modal-title\" id=\"modal-basic-title\">{{\"Delete users\" | translate}}\r\n                </h4>\r\n                <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"modalRef.close()\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div class=\"column align-items-center\">\r\n                    <div class=\"row\" style=\"padding: 0 1.25rem;\">\r\n                        <ul class=\"container-fluid list-group list-group-flush\">\r\n                            <li class=\"list-group-item\" *ngFor=\"let object of currentTemplateUsers\">\r\n                                <input type=\"checkbox\" [(ngModel)]=\"object.checked\"> {{object.profile.email}}\r\n                            </li>\r\n                        </ul>\r\n                    </div>\r\n\r\n                    <div class=\"row\" style=\"padding: 1.25rem;\">\r\n                        <button class=\"btn btn-outline-primary rounded-pill mr-4\" (click)=\"onDeleteChosen()\">{{\"Apply\" |\r\n                            translate}}\r\n                        </button>\r\n                        <button class=\"btn btn-outline-primary rounded-pill\" (click)=\"modalRef.close()\">{{\"Cancel\" |\r\n                            translate}}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n</div>", styles: [".add-button{width:-moz-fit-content;width:fit-content;margin-left:.5rem}li.ml-4{margin-left:3rem}.action-button-container{display:flex;justify-content:space-evenly}.action-button-container .action-button{width:145px!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.BaseUserService }, { type: i1.MissionService }, { type: i2$1.Router }, { type: i3.TranslateService }, { type: i1.SpaceService }, { type: i1.ZoneService }, { type: i4$1.NgbModal }, { type: i1.TemplateService }]; }, propDecorators: { modal: [{
                 type: ViewChild,
                 args: ["deleteUsers"]