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_utils = require("../../utils");
var import_DrawerSidebar = __toESM(require("./components/DrawerSidebar"));
var import_DeviceInfoPanel = __toESM(require("./components/DeviceInfoPanel"));
var import_DeviceConnectionsPanel = __toESM(require("./components/DeviceConnectionsPanel"));
var import_useDeviceConnections = require("./hooks/useDeviceConnections");
var import_useDeviceDetail = require("./hooks/useDeviceDetail");
var import_index = require("./index.less");
var BYTE_PER_GB = 1024 * 1024 * 1024;
var DeviceDetailDrawer = ({
  open,
  record,
  initialTab = "info",
  getText,
  translation,
  onClose,
  onEdit,
  onDelete,
  onConnectionsChanged
}) => {
  var _a;
  const { activeTab, activeKind, displayRecord, setActiveTab } = (0, import_useDeviceDetail.useDeviceDetail)({
    open,
    record,
    initialTab,
    translation
  });
  const device = displayRecord == null ? void 0 : displayRecord._raw;
  const connections = (0, import_useDeviceConnections.useDeviceConnections)({
    open,
    activeTab,
    activeKind,
    displayRecord,
    onConnectionsChanged
  });
  return /* @__PURE__ */ import_react.default.createElement(
    import_antd.Drawer,
    {
      open,
      onClose,
      width: 720,
      maskClosable: true,
      closable: false,
      className: "device-detail-drawer",
      rootClassName: "device-detail-drawer-root",
      styles: {
        body: {
          padding: 0
        }
      },
      bodyStyle: { padding: 0 }
    },
    displayRecord ? /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: (0, import_classnames.default)(
          "device-detail-drawer__root",
          `is-${activeKind}`
        )
      },
      /* @__PURE__ */ import_react.default.createElement(
        import_DrawerSidebar.default,
        {
          activeKey: activeTab,
          activeKind,
          getText,
          onChange: setActiveTab
        }
      ),
      /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__main" }, /* @__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,
          color: import_utils.DEVICE_ICON_COLOR[activeKind]
        }
      )) : null, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__heading" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__name" }, displayRecord.name), /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__type" }, displayRecord.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" }, activeTab === "info" ? /* @__PURE__ */ import_react.default.createElement(
        import_DeviceInfoPanel.default,
        {
          record: displayRecord,
          getText
        }
      ) : /* @__PURE__ */ import_react.default.createElement(
        import_DeviceConnectionsPanel.default,
        {
          activeKind,
          currentDevice: displayRecord._raw,
          connections: connections.connections,
          loading: connections.loading,
          submitting: connections.submitting,
          deleting: connections.deleting,
          getText,
          translation,
          onCreateConnection: connections.handleCreateConnection,
          onUpdateConnection: connections.handleUpdateConnection,
          onDeleteConnection: connections.handleDeleteConnection
        }
      )), activeTab === "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)
    ) : null
  );
};
var DeviceDetailDrawer_default = DeviceDetailDrawer;
