@openremote/manager 1.8.0-snapshot.20250723094757 → 1.8.0-snapshot.20250725120000

package/lib/pages/page-alarms.js

@@ -40,164 +40,164 @@ let PageAlarms = class PageAlarms extends Page {
     static get styles() {
         // language=CSS
         return [
-            css `
-                :host {
-                    flex: 1;
-                    width: 100%;
-                }
-
-                #wrapper {
-                    height: 100%;
-                    width: 100%;
-                    display: flex;
-                    flex-direction: column;
-                    overflow: auto;
-                }
-
-                #title {
-                    padding: 0 20px;
-                    font-size: 18px;
-                    font-weight: bold;
-                    margin: 10px 0;
-                    display: flex;
-                    align-items: center;
-                    color: var(--or-app-color3, ${unsafeCSS(DefaultColor3)});
-                    justify-content: space-between;
-                }
-
-                #title-alarm {
-                    display: flex;
-                    align-items: center;
-                    justify-content: flex-start;
-                    width: calc(100% - 52px);
-                    max-width: 1000px;
-                    margin: 20px auto;
-                    font-size: 18px;
-                    font-weight: bold;
-                }
-
-                .breadcrumb-container {
-                    width: calc(100% - 52px);
-                    max-width: 1000px;
-                    margin: 10px 20px 0 34px;
-                    display: flex;
-                    align-items: center;
-                }
-
-                .breadcrumb-clickable {
-                    cursor: pointer;
-                    color: var(--or-app-color4, ${unsafeCSS(DefaultColor4)});
-                }
-
-                .breadcrumb-arrow {
-                    margin: 0 5px -3px 5px;
-                    --or-icon-width: 16px;
-                    --or-icon-height: 16px;
-                }
-
-                .panel {
-                    width: calc(100% - 100px);
-                    max-width: 1000px;
-                    background-color: white;
-                    border: 1px solid #e5e5e5;
-                    border-radius: 5px;
-                    position: relative;
-                    margin: auto;
-                    padding: 12px 24px 24px;
-                }
-
-                .panel-title {
-                    text-transform: uppercase;
-                    font-weight: bolder;
-                    color: var(--or-app-color3, ${unsafeCSS(DefaultColor3)});
-                    line-height: 1em;
-                    /*margin-bottom: 10px;*/
-                    margin-top: 0;
-                    flex: 0 0 auto;
-                    letter-spacing: 0.025em;
-                    display: flex;
-                    align-items: center;
-                    min-height: 36px;
-                }
-
-                .alarm-input {
-                    margin-bottom: 12px;
-                }
-
-                #status-select, #severity-select {
-                    width: 180px;
-                }
-
-                #controls {
-                    flex: 0;
-                    display: flex;
-                    flex-direction: row;
-                    justify-content: space-between;
-                    align-items: center;
-                }
-
-                .controls-left {
-                    display: flex;
-                    align-items: center;
-                    width: 100%;
-                }
-
-                .controls-left > * {
-                    padding-right: 20px;
-                }
-
-                h5 {
-                    margin-top: 12px;
-                    margin-bottom: 6px;
-                }
-
-                or-icon {
-                    vertical-align: middle;
-                    --or-icon-width: 20px;
-                    --or-icon-height: 20px;
-                }
-
-                #table-container {
-                    margin-left: 20px;
-                    margin-right: 20px;
-                }
-
-                .row {
-                    display: flex;
-                    flex-direction: row;
-                    flex-wrap: wrap;
-                    margin: auto;
-                    flex: 1 1 0;
-                    gap: 16px;
-                    width: 100%;
-                }
-
-                .column {
-                    display: flex;
-                    flex-direction: column;
-                    margin: 0px;
-                    flex: 1 1 0;
-                }
-
-                #details-panel {
-                    min-width: 66%;
-                    height: max-content;
-                }
-
-                #prop-panel {
-                    min-width: 32%;
-                    height: fit-content;
-                }
-
-                .hidden {
-                    display: none;
-                    margin: 0 !important;
-                }
-
-                #title.hidden {
-                    display: none;
-                    margin: 0 !important;
-                }
+            css `
+                :host {
+                    flex: 1;
+                    width: 100%;
+                }
+
+                #wrapper {
+                    height: 100%;
+                    width: 100%;
+                    display: flex;
+                    flex-direction: column;
+                    overflow: auto;
+                }
+
+                #title {
+                    padding: 0 20px;
+                    font-size: 18px;
+                    font-weight: bold;
+                    margin: 10px 0;
+                    display: flex;
+                    align-items: center;
+                    color: var(--or-app-color3, ${unsafeCSS(DefaultColor3)});
+                    justify-content: space-between;
+                }
+
+                #title-alarm {
+                    display: flex;
+                    align-items: center;
+                    justify-content: flex-start;
+                    width: calc(100% - 52px);
+                    max-width: 1000px;
+                    margin: 20px auto;
+                    font-size: 18px;
+                    font-weight: bold;
+                }
+
+                .breadcrumb-container {
+                    width: calc(100% - 52px);
+                    max-width: 1000px;
+                    margin: 10px 20px 0 34px;
+                    display: flex;
+                    align-items: center;
+                }
+
+                .breadcrumb-clickable {
+                    cursor: pointer;
+                    color: var(--or-app-color4, ${unsafeCSS(DefaultColor4)});
+                }
+
+                .breadcrumb-arrow {
+                    margin: 0 5px -3px 5px;
+                    --or-icon-width: 16px;
+                    --or-icon-height: 16px;
+                }
+
+                .panel {
+                    width: calc(100% - 100px);
+                    max-width: 1000px;
+                    background-color: white;
+                    border: 1px solid #e5e5e5;
+                    border-radius: 5px;
+                    position: relative;
+                    margin: auto;
+                    padding: 12px 24px 24px;
+                }
+
+                .panel-title {
+                    text-transform: uppercase;
+                    font-weight: bolder;
+                    color: var(--or-app-color3, ${unsafeCSS(DefaultColor3)});
+                    line-height: 1em;
+                    /*margin-bottom: 10px;*/
+                    margin-top: 0;
+                    flex: 0 0 auto;
+                    letter-spacing: 0.025em;
+                    display: flex;
+                    align-items: center;
+                    min-height: 36px;
+                }
+
+                .alarm-input {
+                    margin-bottom: 12px;
+                }
+
+                #status-select, #severity-select {
+                    width: 180px;
+                }
+
+                #controls {
+                    flex: 0;
+                    display: flex;
+                    flex-direction: row;
+                    justify-content: space-between;
+                    align-items: center;
+                }
+
+                .controls-left {
+                    display: flex;
+                    align-items: center;
+                    width: 100%;
+                }
+
+                .controls-left > * {
+                    padding-right: 20px;
+                }
+
+                h5 {
+                    margin-top: 12px;
+                    margin-bottom: 6px;
+                }
+
+                or-icon {
+                    vertical-align: middle;
+                    --or-icon-width: 20px;
+                    --or-icon-height: 20px;
+                }
+
+                #table-container {
+                    margin-left: 20px;
+                    margin-right: 20px;
+                }
+
+                .row {
+                    display: flex;
+                    flex-direction: row;
+                    flex-wrap: wrap;
+                    margin: auto;
+                    flex: 1 1 0;
+                    gap: 16px;
+                    width: 100%;
+                }
+
+                .column {
+                    display: flex;
+                    flex-direction: column;
+                    margin: 0px;
+                    flex: 1 1 0;
+                }
+
+                #details-panel {
+                    min-width: 66%;
+                    height: max-content;
+                }
+
+                #prop-panel {
+                    min-width: 32%;
+                    height: fit-content;
+                }
+
+                .hidden {
+                    display: none;
+                    margin: 0 !important;
+                }
+
+                #title.hidden {
+                    display: none;
+                    margin: 0 !important;
+                }
             `
         ];
     }
@@ -305,7 +305,7 @@ let PageAlarms = class PageAlarms extends Page {
     render() {
         var _a, _b;
         if (!manager.authenticated) {
-            return html `
+            return html `
                 <or-translate value="notAuthenticated"/>`;
         }
         const disabled = false;
@@ -314,81 +314,81 @@ let PageAlarms = class PageAlarms extends Page {
         const readonly = readAlarms && !writeAlarms;
         const assignOnly = !readAlarms && !writeAlarms;
         this.config = { assignOnly: assignOnly };
-        return html `
-            <div id="wrapper">
-                <!-- Alarm Specific page -->
-                <div id="title" class="${this.creationState || this.alarm ? "hidden" : ""}">
-                    <div class="${this.creationState || this.alarm ? "hidden" : ""}"
-                         style="display: flex; align-items: center;">
-                        <or-icon icon="bell-outline" style="padding: 0 10px 0 4px;"></or-icon>
-                        <span>${this.alarm != undefined ? this.alarm.title : html `
-                            <or-translate value="alarm.alarm_plural"/>`}</span>
-                    </div>
-                    <div>
-                        <div id="controls">
-                            <div class="${this.creationState || this.alarm || assignOnly || readonly ? "hidden" : "panel-title"}"
-                                 style="justify-content: flex-end;">
-                                <or-mwc-input
-                                        outlined
-                                        class="${((_a = this._selectedIds) === null || _a === void 0 ? void 0 : _a.length) > 0 ? "" : "hidden"}"
-                                        style="margin: 0;"
-                                        type="${InputType.BUTTON}"
-                                        icon="delete"
-                                        @or-mwc-input-changed="${() => (this._deleteAlarms())}"
-                                ></or-mwc-input>
-                            </div>
-                            <div class="${((_b = this._selectedIds) === null || _b === void 0 ? void 0 : _b.length) > 0 ? "" : "hidden"}"
-                                 style="height:40px; border-right: 1px solid #e0e0e0; margin-right: 4px;"></div>
-                            <div class="${this.creationState || this.alarm ? "hidden" : "controls-left"}">
-                                <or-mwc-input .type="${InputType.CHECKBOX}" id="assign-check"
-                                              ?disabled="${disabled}" .label="${i18next.t("alarm.assignedToMe")}"
-                                              @or-mwc-input-changed="${(evt) => this._onAssignCheckChanged(evt.detail.value)}"
-                                              .value="${this.assign}"></or-mwc-input>
-                                <or-mwc-input .type="${InputType.SELECT}" id="severity-select" comfortable
-                                              ?disabled="${disabled}" .label="${i18next.t("alarm.severity")}"
-                                              @or-mwc-input-changed="${(evt) => this._onSeverityChanged(evt.detail.value)}"
-                                              .value="${this.severityValue}"
-                                              .options="${this._getSeverityOptions().map(s => s.label)}"></or-mwc-input>
-                                <or-mwc-input .type="${InputType.SELECT}" id="status-select" comfortable
-                                              ?disabled="${disabled}" .label="${i18next.t("alarm.status")}"
-                                              @or-mwc-input-changed="${(evt) => this._onStatusChanged(evt.detail.value)}"
-                                              .value="${this.statusValue}"
-                                              .options="${this._getStatusOptions().map(s => s.label)}"></or-mwc-input>
-
-                            </div>
-                            <div class="${this.creationState || this.alarm || assignOnly || readonly ? "hidden" : "panel-title"}"
-                                 style="justify-content: flex-end;">
-                                <or-mwc-input
-                                        type="${InputType.BUTTON}"
-                                        icon="plus"
-                                        label="${i18next.t("alarm.add")}"
-                                        @or-mwc-input-changed="${() => (this.creationState = { alarmModel: this.getNewAlarmModel() })}"
-                                ></or-mwc-input>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+        return html `
+            <div id="wrapper">
+                <!-- Alarm Specific page -->
+                <div id="title" class="${this.creationState || this.alarm ? "hidden" : ""}">
+                    <div class="${this.creationState || this.alarm ? "hidden" : ""}"
+                         style="display: flex; align-items: center;">
+                        <or-icon icon="bell-outline" style="padding: 0 10px 0 4px;"></or-icon>
+                        <span>${this.alarm != undefined ? this.alarm.title : html `
+                            <or-translate value="alarm.alarm_plural"/>`}</span>
+                    </div>
+                    <div>
+                        <div id="controls">
+                            <div class="${this.creationState || this.alarm || assignOnly || readonly ? "hidden" : "panel-title"}"
+                                 style="justify-content: flex-end;">
+                                <or-mwc-input
+                                        outlined
+                                        class="${((_a = this._selectedIds) === null || _a === void 0 ? void 0 : _a.length) > 0 ? "" : "hidden"}"
+                                        style="margin: 0;"
+                                        type="${InputType.BUTTON}"
+                                        icon="delete"
+                                        @or-mwc-input-changed="${() => (this._deleteAlarms())}"
+                                ></or-mwc-input>
+                            </div>
+                            <div class="${((_b = this._selectedIds) === null || _b === void 0 ? void 0 : _b.length) > 0 ? "" : "hidden"}"
+                                 style="height:40px; border-right: 1px solid #e0e0e0; margin-right: 4px;"></div>
+                            <div class="${this.creationState || this.alarm ? "hidden" : "controls-left"}">
+                                <or-mwc-input .type="${InputType.CHECKBOX}" id="assign-check"
+                                              ?disabled="${disabled}" .label="${i18next.t("alarm.assignedToMe")}"
+                                              @or-mwc-input-changed="${(evt) => this._onAssignCheckChanged(evt.detail.value)}"
+                                              .value="${this.assign}"></or-mwc-input>
+                                <or-mwc-input .type="${InputType.SELECT}" id="severity-select" comfortable
+                                              ?disabled="${disabled}" .label="${i18next.t("alarm.severity")}"
+                                              @or-mwc-input-changed="${(evt) => this._onSeverityChanged(evt.detail.value)}"
+                                              .value="${this.severityValue}"
+                                              .options="${this._getSeverityOptions().map(s => s.label)}"></or-mwc-input>
+                                <or-mwc-input .type="${InputType.SELECT}" id="status-select" comfortable
+                                              ?disabled="${disabled}" .label="${i18next.t("alarm.status")}"
+                                              @or-mwc-input-changed="${(evt) => this._onStatusChanged(evt.detail.value)}"
+                                              .value="${this.statusValue}"
+                                              .options="${this._getStatusOptions().map(s => s.label)}"></or-mwc-input>
+
+                            </div>
+                            <div class="${this.creationState || this.alarm || assignOnly || readonly ? "hidden" : "panel-title"}"
+                                 style="justify-content: flex-end;">
+                                <or-mwc-input
+                                        type="${InputType.BUTTON}"
+                                        icon="plus"
+                                        label="${i18next.t("alarm.add")}"
+                                        @or-mwc-input-changed="${() => (this.creationState = { alarmModel: this.getNewAlarmModel() })}"
+                                ></or-mwc-input>
+                            </div>
+                        </div>
+                    </div>
+                </div>
                 ${when(this.alarm || this.creationState, () => {
             var _a;
             const alarm = (_a = this.alarm) !== null && _a !== void 0 ? _a : this.creationState.alarmModel;
             return this.getSingleAlarmView(alarm, readonly);
         }, () => {
-            return html `
-                        <!-- List of Alarms page -->
-                        <div id="container">
-                            ${disabled ? html `
-                                <div id="msg">
-                                    <or-translate value="loading"/>
-                                </div>
-                            ` : html `
-                                <div id="table-container">
-                                    ${when(this._data, () => guard([this._data], () => this.getAlarmsTable(writeAlarms)))}
-                                </div>
-                            `}
-                        </div>
+            return html `
+                        <!-- List of Alarms page -->
+                        <div id="container">
+                            ${disabled ? html `
+                                <div id="msg">
+                                    <or-translate value="loading"/>
+                                </div>
+                            ` : html `
+                                <div id="table-container">
+                                    ${when(this._data, () => guard([this._data], () => this.getAlarmsTable(writeAlarms)))}
+                                </div>
+                            `}
+                        </div>
                     `;
-        })}
-            </div>
+        })}
+            </div>
         `;
     }
     getNewAlarmModel() {
@@ -431,16 +431,16 @@ let PageAlarms = class PageAlarms extends Page {
         });
     }
     getAlarmsTable(writeAlarms) {
-        return html `
-            <or-alarms-table .alarms=${this._data} .readonly=${!writeAlarms}
-                             @or-mwc-table-row-select="${(e) => this._onRowSelect(e)}"
-                             @or-mwc-table-row-click="${(e) => this._onRowClick(e)}"
-            ></or-alarms-table>
+        return html `
+            <or-alarms-table .alarms=${this._data} .readonly=${!writeAlarms}
+                             @or-mwc-table-row-select="${(e) => this._onRowSelect(e)}"
+                             @or-mwc-table-row-click="${(e) => this._onRowClick(e)}"
+            ></or-alarms-table>
         `;
     }
     _loadData() {
-        var _a;
         return __awaiter(this, void 0, void 0, function* () {
+            var _a;
             if (this._loading || (!manager.hasRole("read:alarms") && !manager.hasRole("write:alarms"))) {
                 return;
             }
@@ -508,7 +508,7 @@ let PageAlarms = class PageAlarms extends Page {
         });
     }
     getSingleAlarmView(alarm, readonly = true) {
-        return html `
+        return html `
             ${when(alarm.loaded, () => {
             return this.getSingleAlarmTemplate(alarm, readonly);
         }, () => {
@@ -517,146 +517,146 @@ let PageAlarms = class PageAlarms extends Page {
                 return this.getSingleAlarmTemplate(alarm, readonly);
             });
             const content = getTemplate();
-            return html `${until(content, html `
+            return html `${until(content, html `
                             <or-translate value="loading"/>`)} `;
-        })}
+        })}
         `;
     }
     getSingleAlarmTemplate(alarm, readonly = true) {
         var _a;
         const write = manager.hasRole("write:alarms");
-        return html `
-            <!-- Breadcrumb on top of the page-->
-            <div style="margin: 0 auto auto auto;
-                        width: calc(100% - 100px);
-                        max-width: 1000px;">
-                <div class="breadcrumb-container">
-                    <span class="breadcrumb-clickable" @click="${() => this.reset()}"
-                    ><or-translate value="alarm.alarm_plural"/></span>
-                    <or-icon class="breadcrumb-arrow" icon="chevron-right"></or-icon>
-                    <span style="margin-left: 2px;"
-                    >${this.alarm != undefined ? this.alarm.id : html `
-                        <or-translate value="alarm.creatingAlarm"/>`}</span>
-                </div>
-                <div id="title-alarm">
-                    <or-icon icon="bell-outline" style="margin-right: 10px; margin-left: 14px;"></or-icon>
-                    <span>${this.alarm != undefined ? this.alarm.title : html `
-                        <or-translate value="alarm.alarm_plural"/>`}</span>
-                </div>
-
-                <div class="panel" style="margin-top: 0">
-                    <div class="row">
-                        <div class="column" id="details-panel">
-                            <h5>
-                                <or-translate value="details"/>
-                            </h5>
-                            <!-- alarm details -->
-                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
-                                          .label="${i18next.t("alarm.title")}" required
-                                          .type="${InputType.TEXT}"
-                                          .value="${alarm.title}"
+        return html `
+            <!-- Breadcrumb on top of the page-->
+            <div style="margin: 0 auto auto auto;
+                        width: calc(100% - 100px);
+                        max-width: 1000px;">
+                <div class="breadcrumb-container">
+                    <span class="breadcrumb-clickable" @click="${() => this.reset()}"
+                    ><or-translate value="alarm.alarm_plural"/></span>
+                    <or-icon class="breadcrumb-arrow" icon="chevron-right"></or-icon>
+                    <span style="margin-left: 2px;"
+                    >${this.alarm != undefined ? this.alarm.id : html `
+                        <or-translate value="alarm.creatingAlarm"/>`}</span>
+                </div>
+                <div id="title-alarm">
+                    <or-icon icon="bell-outline" style="margin-right: 10px; margin-left: 14px;"></or-icon>
+                    <span>${this.alarm != undefined ? this.alarm.title : html `
+                        <or-translate value="alarm.alarm_plural"/>`}</span>
+                </div>
+
+                <div class="panel" style="margin-top: 0">
+                    <div class="row">
+                        <div class="column" id="details-panel">
+                            <h5>
+                                <or-translate value="details"/>
+                            </h5>
+                            <!-- alarm details -->
+                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
+                                          .label="${i18next.t("alarm.title")}" required
+                                          .type="${InputType.TEXT}"
+                                          .value="${alarm.title}"
                                           @or-mwc-input-changed="${(e) => {
             alarm.title = e.detail.value;
             this.onAlarmChanged(e);
-        }}"
-                            ></or-mwc-input>
-                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
-                                          .label="${i18next.t("alarm.content")}"
-                                          .type="${InputType.TEXTAREA}"
-                                          .value="${alarm.content}"
-                                          rows="12"
+        }}"
+                            ></or-mwc-input>
+                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
+                                          .label="${i18next.t("alarm.content")}"
+                                          .type="${InputType.TEXTAREA}"
+                                          .value="${alarm.content}"
+                                          rows="12"
                                           @or-mwc-input-changed="${(e) => {
             alarm.content = e.detail.value;
             this.onAlarmChanged(e);
-        }}"
-                            ></or-mwc-input>
-                        </div>
-                        <div class="column" id="prop-panel">
-                            <h5>
-                                <or-translate value="properties"/>
-                            </h5>
-                            <or-mwc-input class="alarm-input hidden" ?disabled="${true}"
-                                          ?comfortable=${!this.creationState}
-                                          .label="${i18next.t("createdOn")}"
-                                          .type="${InputType.DATETIME}"
-                                          .value="${new Date(alarm.createdOn)}"
-                            ></or-mwc-input>
-                            <or-mwc-input class="${this.creationState ? "hidden" : "alarm-input"}" ?disabled="${true}"
-                                          .label="${i18next.t("alarm.lastModified")}"
-                                          .type="${InputType.DATETIME}"
-                                          .value="${new Date(alarm.lastModified)}"
-                            ></or-mwc-input>
-                            <or-mwc-input class="alarm-input" ?disabled="${!write || this.creationState || this.alarm}"
-                                          .label="${i18next.t("alarm.source")}"
-                                          .type="${InputType.TEXT}"
-                                          .value="${this._getSourceText()}"
-                            ></or-mwc-input>
-                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
-                                          .label="${i18next.t("alarm.severity")}"
-                                          .type="${InputType.SELECT}"
-                                          .options="${this._getAddSeverityOptions().map(s => s.label)}"
-                                          .value="${this._getAddSeverityOptions().filter((obj) => obj.value === alarm.severity).map((obj) => obj.label)[0]}"
+        }}"
+                            ></or-mwc-input>
+                        </div>
+                        <div class="column" id="prop-panel">
+                            <h5>
+                                <or-translate value="properties"/>
+                            </h5>
+                            <or-mwc-input class="alarm-input hidden" ?disabled="${true}"
+                                          ?comfortable=${!this.creationState}
+                                          .label="${i18next.t("createdOn")}"
+                                          .type="${InputType.DATETIME}"
+                                          .value="${new Date(alarm.createdOn)}"
+                            ></or-mwc-input>
+                            <or-mwc-input class="${this.creationState ? "hidden" : "alarm-input"}" ?disabled="${true}"
+                                          .label="${i18next.t("alarm.lastModified")}"
+                                          .type="${InputType.DATETIME}"
+                                          .value="${new Date(alarm.lastModified)}"
+                            ></or-mwc-input>
+                            <or-mwc-input class="alarm-input" ?disabled="${!write || this.creationState || this.alarm}"
+                                          .label="${i18next.t("alarm.source")}"
+                                          .type="${InputType.TEXT}"
+                                          .value="${this._getSourceText()}"
+                            ></or-mwc-input>
+                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
+                                          .label="${i18next.t("alarm.severity")}"
+                                          .type="${InputType.SELECT}"
+                                          .options="${this._getAddSeverityOptions().map(s => s.label)}"
+                                          .value="${this._getAddSeverityOptions().filter((obj) => obj.value === alarm.severity).map((obj) => obj.label)[0]}"
                                           @or-mwc-input-changed="${(e) => {
             alarm.severity = this._getAddSeverityOptions().filter((obj) => obj.label === e.detail.value).map((obj) => obj.value)[0];
             this.onAlarmChanged(e);
-        }}"
-                            ></or-mwc-input>
-                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
-                                          .label="${i18next.t("alarm.status")}"
-                                          .type="${InputType.SELECT}"
-                                          .options="${this._getAddStatusOptions().map(s => s.label)}"
-                                          .value="${this._getAddStatusOptions().filter((obj) => obj.value === alarm.status).map((obj) => obj.label)[0]}"
+        }}"
+                            ></or-mwc-input>
+                            <or-mwc-input class="alarm-input" ?disabled="${!write}"
+                                          .label="${i18next.t("alarm.status")}"
+                                          .type="${InputType.SELECT}"
+                                          .options="${this._getAddStatusOptions().map(s => s.label)}"
+                                          .value="${this._getAddStatusOptions().filter((obj) => obj.value === alarm.status).map((obj) => obj.label)[0]}"
                                           @or-mwc-input-changed="${(e) => {
             alarm.status = this._getAddStatusOptions().filter((obj) => obj.label === e.detail.value).map((obj) => obj.value)[0];
             this.onAlarmChanged(e);
-        }}"
-                            ></or-mwc-input>
-                            <or-mwc-input class="alarm-input"
-                                          ?disabled="${!manager.hasRole("read:users") && !manager.hasRole("read:admin")}"
-                                          .label="${i18next.t("alarm.assignee")}"
-                                          .type="${InputType.SELECT}"
-                                          .options="${this._getUsers().map((obj) => obj.label)}"
-                                          .value="${this._getUsers().filter((obj) => obj.label === alarm.assigneeUsername).map((obj) => obj.label)[0]}"
+        }}"
+                            ></or-mwc-input>
+                            <or-mwc-input class="alarm-input"
+                                          ?disabled="${!manager.hasRole("read:users") && !manager.hasRole("read:admin")}"
+                                          .label="${i18next.t("alarm.assignee")}"
+                                          .type="${InputType.SELECT}"
+                                          .options="${this._getUsers().map((obj) => obj.label)}"
+                                          .value="${this._getUsers().filter((obj) => obj.label === alarm.assigneeUsername).map((obj) => obj.label)[0]}"
                                           @or-mwc-input-changed="${(e) => {
             alarm.assigneeId = this._getUsers().filter((obj) => obj.label === e.detail.value).map((obj) => obj.value)[0];
             this.onAlarmChanged(e);
-        }}"
-                            ></or-mwc-input>
-                            <div>
-                                <span style="margin: 0px auto 10px;"><or-translate value="linkedAssets"/>:</span>
-                                <or-mwc-input outlined ?disabled="${!manager.hasRole("write:alarms")}"
-                                              style="margin-left: 4px;"
-                                              .type="${InputType.BUTTON}"
+        }}"
+                            ></or-mwc-input>
+                            <div>
+                                <span style="margin: 0px auto 10px;"><or-translate value="linkedAssets"/>:</span>
+                                <or-mwc-input outlined ?disabled="${!manager.hasRole("write:alarms")}"
+                                              style="margin-left: 4px;"
+                                              .type="${InputType.BUTTON}"
                                               .label="${i18next.t("selectRestrictedAssets", {
             number: (_a = alarm.alarmAssetLinks) === null || _a === void 0 ? void 0 : _a.length,
-        })}"
-                                              @or-mwc-input-changed="${(ev) => this._openAssetSelector(ev, alarm, readonly)}"
-                                ></or-mwc-input>
-                            </div>
-                        </div>
-                    </div>
-                    <!-- Bottom controls (save/update and delete button) -->
-                    ${when(!(readonly && !this._saveAlarmPromise), () => html `
-                        <div class="row" style="justify-content: space-between; margin-top: 10px;">
-                            ${when((manager.hasRole("write:alarms")), () => html `
-                                <or-mwc-input class="alarm-input" style="margin: 0;" outlined
-                                              ?disabled="${!manager.hasRole("write:alarms") || !alarm.id}"
-                                              .label="${i18next.t("delete")}"
-                                              .type="${InputType.BUTTON}"
-                                              @or-mwc-input-changed="${() => this._deleteAlarm(this.alarm)}"
-                                ></or-mwc-input>
-                            `)}
-                            <div>
-                                <or-mwc-input class="alarm-input" style="margin: 0;" outlined
-                                              .label="${i18next.t("cancel")}"
-                                              .type="${InputType.BUTTON}"
-                                              @or-mwc-input-changed="${() => this.reset()}"
-                                ></or-mwc-input>
-                                <or-mwc-input id="savebtn"
-                                              style="margin: 0;"
-                                              raised class="alarm-input" disabled
-                                              .label="${i18next.t(alarm.id ? "save" : "create")}"
-                                              .type="${InputType.BUTTON}"
+        })}"
+                                              @or-mwc-input-changed="${(ev) => this._openAssetSelector(ev, alarm, readonly)}"
+                                ></or-mwc-input>
+                            </div>
+                        </div>
+                    </div>
+                    <!-- Bottom controls (save/update and delete button) -->
+                    ${when(!(readonly && !this._saveAlarmPromise), () => html `
+                        <div class="row" style="justify-content: space-between; margin-top: 10px;">
+                            ${when((manager.hasRole("write:alarms")), () => html `
+                                <or-mwc-input class="alarm-input" style="margin: 0;" outlined
+                                              ?disabled="${!manager.hasRole("write:alarms") || !alarm.id}"
+                                              .label="${i18next.t("delete")}"
+                                              .type="${InputType.BUTTON}"
+                                              @or-mwc-input-changed="${() => this._deleteAlarm(this.alarm)}"
+                                ></or-mwc-input>
+                            `)}
+                            <div>
+                                <or-mwc-input class="alarm-input" style="margin: 0;" outlined
+                                              .label="${i18next.t("cancel")}"
+                                              .type="${InputType.BUTTON}"
+                                              @or-mwc-input-changed="${() => this.reset()}"
+                                ></or-mwc-input>
+                                <or-mwc-input id="savebtn"
+                                              style="margin: 0;"
+                                              raised class="alarm-input" disabled
+                                              .label="${i18next.t(alarm.id ? "save" : "create")}"
+                                              .type="${InputType.BUTTON}"
                                               @or-mwc-input-changed="${(e) => {
             let error;
             this._saveAlarmPromise = this._createUpdateAlarm(alarm, alarm.id ? "update" : "create")
@@ -673,13 +673,13 @@ let PageAlarms = class PageAlarms extends Page {
             }).finally(() => {
                 this._saveAlarmPromise = undefined;
             });
-        }}"
-                                ></or-mwc-input>
-                            </div>
-                        </div>
-                    `)}
-                </div>
-            </div>
+        }}"
+                                ></or-mwc-input>
+                            </div>
+                        </div>
+                    `)}
+                </div>
+            </div>
             </div>`;
     }
     _getStatusOptions() {
@@ -821,23 +821,23 @@ let PageAlarms = class PageAlarms extends Page {
         };
         const dialog = showDialog(new OrMwcDialog()
             .setHeading(i18next.t("linkedAssets"))
-            .setContent(html `
-                        <or-asset-tree
-                                id="chart-asset-tree"
-                                readonly="true"
-                                .selectedIds="${(_a = alarm.alarmAssetLinks) === null || _a === void 0 ? void 0 : _a.map((al) => al.id.assetId)}"
-                                .showSortBtn="${false}"
-                                expandNodes
-                                checkboxes
+            .setContent(html `
+                        <or-asset-tree
+                                id="chart-asset-tree"
+                                readonly="true"
+                                .selectedIds="${(_a = alarm.alarmAssetLinks) === null || _a === void 0 ? void 0 : _a.map((al) => al.id.assetId)}"
+                                .showSortBtn="${false}"
+                                expandNodes
+                                checkboxes
                                 @or-asset-tree-request-selection="${(e) => {
             this.creationState ? e.detail.allow = true : e.detail.allow = false;
-        }}"
+        }}"
                                 @or-asset-tree-selection="${(e) => {
             if (!readonly) {
                 onAssetSelectionChanged(e);
             }
-        }}"
-                        ></or-asset-tree>
+        }}"
+                        ></or-asset-tree>
                     `)
             .setActions([
             {