var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/index.tsx
var DeviceDetailDrawer_exports = {};
__export(DeviceDetailDrawer_exports, {
  default: () => DeviceDetailDrawer_default
});
module.exports = __toCommonJS(DeviceDetailDrawer_exports);
var import_react = __toESM(require("react"));
var import_antd = require("antd");
var import_materials = require("@pisell/materials");
var import_icons = require("@ant-design/icons");
var import_classnames = __toESM(require("classnames"));
var import_index = require("./index.less");
var EMPTY_VALUE = "-";
var BYTE_PER_GB = 1024 * 1024 * 1024;
var REPORT_GROUPS = [
  {
    key: "software",
    fields: [{ key: "name" }, { key: "version" }]
  },
  {
    key: "battery",
    fields: [
      {
        key: "level",
        value: (data, getText) => renderBatteryValue(data, getText)
      }
    ]
  },
  {
    key: "network",
    fields: [
      { key: "type" },
      { key: "local_ip" },
      { key: "gateway" },
      { key: "subnet_mask" },
      { key: "ssid" }
    ]
  },
  {
    key: "hardware",
    fields: [{ key: "model" }, { key: "os_version" }]
  },
  {
    key: "storage",
    fields: [
      { key: "used", value: (data) => formatStorageValue(data.used) },
      { key: "total", value: (data) => formatStorageValue(data.total) }
    ]
  }
];
var isPlainObject = (value) => Object.prototype.toString.call(value) === "[object Object]";
var getReportText = (getText, key) => getText(`pisell2.saas.device-planning.detail.report.${key}`);
var formatReportValue = (value, getText) => {
  if (value === null || value === void 0 || value === "") {
    return EMPTY_VALUE;
  }
  if (typeof value === "boolean") {
    return getText(
      `pisell2.saas.device-planning.detail.${value ? "yes" : "no"}`
    );
  }
  if (Array.isArray(value) || isPlainObject(value)) {
    return /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__json-value" }, JSON.stringify(value));
  }
  return String(value);
};
var formatStorageValue = (value) => {
  const byteValue = typeof value === "number" || typeof value === "string" ? Number(value) : Number.NaN;
  if (!Number.isFinite(byteValue)) {
    return EMPTY_VALUE;
  }
  const gbValue = byteValue / BYTE_PER_GB;
  const text = gbValue >= 10 ? String(Math.round(gbValue)) : gbValue.toFixed(2).replace(/\.?0+$/, "");
  return `${text} GB`;
};
var formatLastSeen = (value) => typeof value === "string" && value.trim() ? value : EMPTY_VALUE;
var renderBatteryValue = (data, getText) => {
  const rawLevel = typeof data.level === "number" || typeof data.level === "string" ? Number(data.level) : Number.NaN;
  const hasLevel = Number.isFinite(rawLevel);
  const levelValue = hasLevel ? Math.max(0, Math.min(rawLevel, 100)) : 0;
  const level = hasLevel ? `${rawLevel}%` : EMPTY_VALUE;
  const charging = (data == null ? void 0 : data.charging) === true;
  return /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__battery-value" }, /* @__PURE__ */ import_react.default.createElement(
    "span",
    {
      className: (0, import_classnames.default)("device-detail-drawer__battery-icon", {
        "is-charging": charging
      })
    },
    /* @__PURE__ */ import_react.default.createElement(
      "span",
      {
        className: "device-detail-drawer__battery-fill",
        style: { width: `${levelValue}%` }
      }
    ),
    charging ? /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__battery-bolt" }) : null
  ), /* @__PURE__ */ import_react.default.createElement("span", null, level), /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__battery-status" }, getReportText(getText, charging ? "charging" : "not-charging")));
};
var DeviceDetailDrawer = ({
  open,
  record,
  getText,
  translation,
  onClose,
  onEdit,
  onDelete
}) => {
  var _a;
  const device = record == null ? void 0 : record._raw;
  const reportData = device == null ? void 0 : device.data;
  const online = (record == null ? void 0 : record.status) === "online";
  const lastSeen = formatLastSeen(device == null ? void 0 : device.last_seen);
  const reportGroups = (0, import_react.useMemo)(() => {
    if (!isPlainObject(reportData)) return [];
    return REPORT_GROUPS.reduce((list, group) => {
      const data = reportData[group.key];
      if (isPlainObject(data)) {
        list.push({ ...group, data });
      }
      return list;
    }, []);
  }, [reportData]);
  return /* @__PURE__ */ import_react.default.createElement(
    import_antd.Drawer,
    {
      open,
      onClose,
      width: 520,
      maskClosable: true,
      closable: false,
      className: "device-detail-drawer",
      rootClassName: "device-detail-drawer-root",
      styles: {
        body: {
          padding: 0
        }
      },
      bodyStyle: { padding: 0 }
    },
    record ? /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__root" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__header" }, ((_a = device == null ? void 0 : device.type) == null ? void 0 : _a.icon) ? /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__icon" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: device.type.icon })) : null, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__heading" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__name" }, record.name), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__type" }, record.typeName)), /* @__PURE__ */ import_react.default.createElement(import_materials.Button, { type: "text", icon: /* @__PURE__ */ import_react.default.createElement(import_icons.CloseOutlined, null), onClick: onClose })), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__content" }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Card,
      {
        size: "small",
        title: getText("pisell2.saas.device-planning.detail.basic-info"),
        className: "device-detail-drawer__card"
      },
      /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-list" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-row" }, /* @__PURE__ */ import_react.default.createElement("span", null, getText("pisell2.saas.device-planning.detail.name")), /* @__PURE__ */ import_react.default.createElement("strong", null, record.name)), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-row" }, /* @__PURE__ */ import_react.default.createElement("span", null, getText("pisell2.saas.device-planning.detail.type")), /* @__PURE__ */ import_react.default.createElement("strong", null, record.typeName)), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-row" }, /* @__PURE__ */ import_react.default.createElement("span", null, getText("pisell2.saas.device-planning.detail.model")), /* @__PURE__ */ import_react.default.createElement("strong", null, record.modelName)), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-two-row" }, /* @__PURE__ */ import_react.default.createElement("span", null, getText("pisell2.saas.device-planning.detail.profile")), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__profile-card" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "FileTextOutlined" }), record.profileName)))
    ), /* @__PURE__ */ import_react.default.createElement(
      import_antd.Card,
      {
        size: "small",
        title: getText("pisell2.saas.device-planning.detail.status"),
        className: "device-detail-drawer__card"
      },
      /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-list" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-row" }, /* @__PURE__ */ import_react.default.createElement("span", null, getText("pisell2.saas.device-planning.detail.link-status")), /* @__PURE__ */ import_react.default.createElement(
        import_materials.Tag,
        {
          color: record.link === "linked" ? "green" : "gold",
          style: { marginRight: 0 }
        },
        getText(
          `pisell2.saas.device-planning.status.${record.link}`
        ) || record.link
      )), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__info-row" }, /* @__PURE__ */ import_react.default.createElement("span", null, getText(
        "pisell2.saas.device-planning.detail.online-status"
      )), /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__online-status" }, /* @__PURE__ */ import_react.default.createElement(
        "span",
        {
          className: (0, import_classnames.default)(
            "device-detail-drawer__status-dot",
            {
              "is-online": online
            }
          )
        }
      ), getText(
        `pisell2.saas.device-planning.status.${record.status}`
      ) || record.status)))
    ), /* @__PURE__ */ import_react.default.createElement(
      import_antd.Card,
      {
        size: "small",
        title: getText("pisell2.saas.device-planning.detail.report-info"),
        extra: /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__last-seen" }, getText("pisell2.saas.device-planning.detail.last-seen"), lastSeen),
        className: "device-detail-drawer__card"
      },
      reportGroups.length > 0 ? /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__report-list" }, reportGroups.map((group) => /* @__PURE__ */ import_react.default.createElement(
        import_antd.Card,
        {
          key: group.key,
          size: "small",
          type: "inner",
          title: getReportText(getText, `group.${group.key}`),
          className: "device-detail-drawer__report-card"
        },
        /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__report-rows" }, group.fields.map((field) => /* @__PURE__ */ import_react.default.createElement(
          "div",
          {
            key: field.key,
            className: "device-detail-drawer__report-row"
          },
          /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__report-label" }, getReportText(getText, `field.${field.key}`)),
          /* @__PURE__ */ import_react.default.createElement("span", { className: "device-detail-drawer__report-value" }, field.value ? field.value(group.data, getText) : formatReportValue(
            group.data[field.key],
            getText
          ))
        )))
      ))) : /* @__PURE__ */ import_react.default.createElement(
        import_antd.Empty,
        {
          image: import_antd.Empty.PRESENTED_IMAGE_SIMPLE,
          description: getText(
            "pisell2.saas.device-planning.detail.no-report-info"
          )
        }
      )
    )), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__footer" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Button, { danger: true, size: "large", onClick: onDelete }, getText("pisell2.saas.device-planning.detail.delete")), /* @__PURE__ */ import_react.default.createElement(import_materials.Button, { type: "primary", size: "large", onClick: onEdit }, getText("pisell2.saas.device-planning.detail.edit")))) : null
  );
};
var DeviceDetailDrawer_default = DeviceDetailDrawer;
