import { unsafeCSS, LitElement, html } from "lit";
import { customElement } from "../../decorator.js";
import compentStyle from "./alert-list-details.css.js";
import { msg } from "@lit/localize";
import { property, query } from "lit/decorators.js";
import "../icon-button/icon-button.js";
import "../button/button.js";
import "../../icons/icon-silence-iec.js";
import "../../icons/icon-alerts.js";
import "../../icons/icon-alerts-shelf.js";
import "../../icons/icon-alerts-active.js";
import "../../icons/icon-alarm-rectified-iec.js";
import "../../icons/icon-unacknowledged.js";
import "../../icons/icon-alarm-noack-iec.js";
import "../../icons/icon-warning-noack-iec.js";
import "../alert-icon/alert-icon.js";
import { isAcknowledged, isActive, AlertType, comparePriorityAlerts, isShelved, isBlocked } from "../../types.js";
import { ObcTableCellType } from "../table/table.js";
import "../scrollbar/scrollbar.js";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __decorateClass = (decorators, target, key, kind) => {
  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
  for (var i = decorators.length - 1, decorator; i >= 0; i--)
    if (decorator = decorators[i])
      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
  if (kind && result) __defProp(target, key, result);
  return result;
};
var AlertListMode = /* @__PURE__ */ ((AlertListMode2) => {
  AlertListMode2["UNACKED"] = "unacked";
  AlertListMode2["ALL"] = "all";
  AlertListMode2["SHELVED"] = "shelved";
  AlertListMode2["BLOCKED"] = "blocked";
  AlertListMode2["RECTIFIED"] = "rectified";
  return AlertListMode2;
})(AlertListMode || {});
function getAlertListModeData(selectedMode) {
  if (selectedMode === "all")
    return {
      name: "all",
      title: msg("All"),
      emptyTitle: msg("No active alerts"),
      emptyIcon: html`<obi-alerts></obi-alerts>`,
      filter: (alert) => !isShelved(alert) && isActive(alert)
    };
  else if (selectedMode === "unacked")
    return {
      name: "unacked",
      title: msg("Unacked"),
      emptyTitle: msg("No unacknowledged alerts"),
      emptyIcon: html`<obi-unacknowledged></obi-unacknowledged>`,
      filter: (alert) => !isAcknowledged(alert) && isActive(alert) && alert.type !== AlertType.Caution && !isShelved(alert)
    };
  else if (selectedMode === "shelved")
    return {
      name: "shelved",
      title: msg("Shelved"),
      emptyTitle: msg("No shelved alerts"),
      emptyIcon: html`<obi-alerts-shelf></obi-alerts-shelf>`,
      filter: (alert) => isShelved(alert)
    };
  else if (selectedMode === "blocked")
    return {
      name: "blocked",
      title: msg("Blocked"),
      emptyTitle: msg("No blocked alerts"),
      emptyIcon: html`<obi-alerts-active></obi-alerts-active>`,
      filter: (alert) => isBlocked(alert)
    };
  else if (selectedMode === "rectified")
    return {
      name: "rectified",
      title: msg("Rectified"),
      emptyTitle: msg("No rectified alerts"),
      emptyIcon: html`<obi-alarm-rectified-iec></obi-alarm-rectified-iec>`,
      filter: (alert) => !isActive(alert)
    };
  else throw new Error("Invalid selected mode");
}
function canAckFilter(filter) {
  return (alert) => !isAcknowledged(alert) && !alert.noAck && alert.type !== AlertType.Caution && filter(alert);
}
let ObcAlertListDetails = class extends LitElement {
  constructor() {
    super(...arguments);
    this.selectedMode = "all";
    this.alerts = [];
    this.showTime = false;
    this.timeFormatter = (time) => time.toLocaleTimeString(void 0, { hour12: false });
    this.small = false;
  }
  getVisibleAlerts() {
    const visibleElements = this.alertList.getAllVisibleRows().map((id) => this.alerts.find((alert) => alert.id === id)).filter((alert) => alert !== void 0);
    return visibleElements;
  }
  onRowClick(e) {
    const row = this.alerts.find((alert) => alert.id === e.detail.row.id);
    if (row) {
      this.dispatchEvent(
        new CustomEvent("row-click", { detail: { alert: row } })
      );
    }
  }
  onCellButtonClick(e) {
    const row = this.alerts.find((alert) => alert.id === e.detail.rowId);
    if (row) {
      this.dispatchEvent(
        new CustomEvent("ack-click", {
          detail: { alert: row },
          bubbles: false
        })
      );
    }
  }
  get columns() {
    if (this.small) {
      const columns = [
        {
          label: "status",
          key: "status",
          sortDirection: "desc",
          sortable: true,
          compareFunction: (_a, _b, aRow, bRow) => {
            const aAlert = this.alerts.find((alert) => alert.id === aRow.id);
            const bAlert = this.alerts.find((alert) => alert.id === bRow.id);
            if (aAlert && bAlert) {
              return comparePriorityAlerts(aAlert, bAlert);
            }
            return 0;
          }
        }
      ];
      if (this.showTime) {
        columns.push({
          label: "Activated",
          key: "time"
        });
      }
      columns.push({
        label: "ACK-status",
        key: "action"
      });
      return columns;
    } else {
      const columns = [
        {
          label: "status",
          key: "status",
          sortDirection: "desc",
          sortable: true,
          compareFunction: (_a, _b, aRow, bRow) => {
            const aAlert = this.alerts.find((alert) => alert.id === aRow.id);
            const bAlert = this.alerts.find((alert) => alert.id === bRow.id);
            if (aAlert && bAlert) {
              return comparePriorityAlerts(aAlert, bAlert);
            }
            return 0;
          }
        },
        {
          label: "ACK-status",
          key: "action",
          dividerRight: true
        }
      ];
      if (this.showTime) {
        columns.push({
          label: "Activated",
          key: "time",
          sortable: true,
          compareFunction: (_a, _b, aRow, bRow) => {
            const aAlert = this.alerts.find((alert) => alert.id === aRow.id);
            const bAlert = this.alerts.find((alert) => alert.id === bRow.id);
            if (aAlert && bAlert) {
              const aTime = new Date(aAlert.time);
              const bTime = new Date(bAlert.time);
              return aTime.getTime() - bTime.getTime();
            }
            return 0;
          }
        });
      }
      columns.push({
        label: "Tag ID",
        key: "tagId",
        sortable: true,
        compareFunction: (a, b) => {
          const aText = a?.type === ObcTableCellType.Regular ? String(a.text ?? "") : "";
          const bText = b?.type === ObcTableCellType.Regular ? String(b.text ?? "") : "";
          return aText.localeCompare(bText);
        }
      });
      return columns;
    }
  }
  get metadata() {
    return getAlertListModeData(this.selectedMode);
  }
  get filteredAlerts() {
    return this.alerts.filter(this.metadata.filter);
  }
  render() {
    const selectedList = this.metadata;
    const data = this.filteredAlerts.map((alert) => {
      let action = {
        type: ObcTableCellType.Regular
      };
      if (!isAcknowledged(alert) && isActive(alert) && [AlertType.Alarm, AlertType.Warning].includes(alert.type)) {
        if (alert.noAck) {
          const icon = alert.type === AlertType.Alarm ? html`<obi-alarm-noack-iec usecsscolor></obi-alarm-noack-iec>` : html`<obi-warning-noack-iec
                  usecsscolor
                ></obi-warning-noack-iec>`;
          action = {
            type: ObcTableCellType.Regular,
            largeIcon: true,
            icon,
            align: "center"
          };
        } else {
          action = {
            type: ObcTableCellType.Button,
            text: msg("ACK")
          };
        }
      }
      const status = {
        type: ObcTableCellType.Regular,
        largeIcon: true,
        text: alert.text,
        title: alert.source,
        noWrap: true,
        icon: html`<obc-alert-icon
          .type=${alert.type}
          .acknowledged=${isAcknowledged(alert)}
          .active=${isActive(alert)}
        ></obc-alert-icon>`
      };
      const time = this.showTime ? {
        type: ObcTableCellType.Regular,
        text: this.timeFormatter(alert.time),
        align: "center",
        neutral: true
      } : void 0;
      const tagId = this.small ? void 0 : {
        type: ObcTableCellType.Regular,
        text: "#" + alert.id,
        align: "right"
      };
      return {
        id: alert.id,
        status,
        time,
        action,
        tagId
      };
    });
    return html`
      <div class="wrapper ${this.small ? "small" : ""}">
        ${data.length > 0 ? html` <obc-table
                class="alert-list"
                .data=${data}
                .columns=${this.columns}
                .striped=${true}
                .showHeader=${!this.small}
                @row-click=${this.onRowClick}
                @cell-button-click=${this.onCellButtonClick}
              ></obc-table>
              <div class="spacer"></div>` : html` <div class="empty-list">
              <div class="icon">${selectedList.emptyIcon}</div>
              <div class="empty-title">${selectedList.emptyTitle}</div>
            </div>`}
      </div>
    `;
  }
};
ObcAlertListDetails.styles = unsafeCSS(compentStyle);
__decorateClass([
  property({ type: String })
], ObcAlertListDetails.prototype, "selectedMode", 2);
__decorateClass([
  property({ type: Array })
], ObcAlertListDetails.prototype, "alerts", 2);
__decorateClass([
  property({ type: Boolean })
], ObcAlertListDetails.prototype, "showTime", 2);
__decorateClass([
  property({ attribute: false })
], ObcAlertListDetails.prototype, "timeFormatter", 2);
__decorateClass([
  property({ type: Boolean })
], ObcAlertListDetails.prototype, "small", 2);
__decorateClass([
  query("obc-table")
], ObcAlertListDetails.prototype, "alertList", 2);
ObcAlertListDetails = __decorateClass([
  customElement("obc-alert-list-details")
], ObcAlertListDetails);
export {
  AlertListMode,
  ObcAlertListDetails,
  canAckFilter,
  getAlertListModeData
};
//# sourceMappingURL=alert-list-details.js.map
