const require_runtime = require("../../../../../../../_virtual/_rolldown/runtime.js");
const require_utils = require("../../../../shared/utils.js");
const require_DrawerSidebar = require("../DrawerSidebar.js");
const require_DeviceInfoPanel = require("../DeviceInfoPanel.js");
const require_DeviceConnectionsPanel = require("../../../deviceConnections/components/DeviceConnectionsPanel.js");
const require_useDeviceConnections = require("../../../deviceConnections/hooks/useDeviceConnections.js");
const require_useDeviceDetail = require("../../hooks/useDeviceDetail.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _pisell_materials = require("@pisell/materials");
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
let _ant_design_icons = require("@ant-design/icons");
require("./index.less");
//#region src/plus/saasDevice/devicePlanning/modules/deviceDetail/components/DeviceDetailDrawer/index.tsx
const DeviceDetailDrawer = ({ open, record, initialTab = "info", getText, translation, onClose, onEdit, onDelete, onConnectionsChanged }) => {
	var _device$type;
	const { activeTab, activeKind, displayRecord, setActiveTab } = require_useDeviceDetail.useDeviceDetail({
		open,
		record,
		initialTab,
		translation
	});
	const device = displayRecord === null || displayRecord === void 0 ? void 0 : displayRecord._raw;
	const isBuildInsTab = activeTab === "buildIns";
	const isComponentDevice = (displayRecord === null || displayRecord === void 0 ? void 0 : displayRecord._raw.structure) === "component";
	const connectionType = isBuildInsTab || isComponentDevice ? "component" : "dumb";
	const connections = require_useDeviceConnections.useDeviceConnections({
		open,
		activeTab,
		activeKind,
		connectionType,
		displayRecord,
		onConnectionsChanged
	});
	return /* @__PURE__ */ react.default.createElement(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__ */ react.default.createElement("div", { className: (0, classnames.default)("device-detail-drawer__root", `is-${activeKind}`) }, /* @__PURE__ */ react.default.createElement(require_DrawerSidebar.default, {
		activeKey: activeTab,
		activeKind,
		showBuildIns: (displayRecord === null || displayRecord === void 0 ? void 0 : displayRecord._raw.structure) === "composite",
		getText,
		onChange: setActiveTab
	}), /* @__PURE__ */ react.default.createElement("div", { className: "device-detail-drawer__main" }, /* @__PURE__ */ react.default.createElement("div", { className: "device-detail-drawer__header" }, (device === null || device === void 0 || (_device$type = device.type) === null || _device$type === void 0 ? void 0 : _device$type.icon) ? /* @__PURE__ */ react.default.createElement("div", { className: "device-detail-drawer__icon" }, /* @__PURE__ */ react.default.createElement(_pisell_materials.Icon, {
		type: device.type.icon,
		color: require_utils.DEVICE_ICON_COLOR[activeKind]
	})) : null, /* @__PURE__ */ react.default.createElement("div", { className: "device-detail-drawer__heading" }, /* @__PURE__ */ react.default.createElement("div", { className: "device-detail-drawer__name" }, displayRecord.name), /* @__PURE__ */ react.default.createElement("div", { className: "device-detail-drawer__type" }, displayRecord.typeName)), /* @__PURE__ */ react.default.createElement(_pisell_materials.Button, {
		type: "text",
		icon: /* @__PURE__ */ react.default.createElement(_ant_design_icons.CloseOutlined, null),
		onClick: onClose
	})), /* @__PURE__ */ react.default.createElement("div", {
		className: "device-detail-drawer__content",
		style: { padding: activeTab === "info" ? "16px" : "0" }
	}, activeTab === "info" ? /* @__PURE__ */ react.default.createElement(require_DeviceInfoPanel.default, {
		record: displayRecord,
		getText
	}) : /* @__PURE__ */ react.default.createElement(require_DeviceConnectionsPanel.default, {
		activeKind,
		connectionType,
		isBuildIns: isBuildInsTab,
		hideConnectButton: isComponentDevice,
		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__ */ react.default.createElement("div", { className: "device-detail-drawer__footer" }, /* @__PURE__ */ react.default.createElement(_pisell_materials.Button, {
		danger: true,
		size: "large",
		onClick: onDelete
	}, getText("pisell2.saas.device-planning.detail.delete")), /* @__PURE__ */ react.default.createElement(_pisell_materials.Button, {
		type: "primary",
		size: "large",
		onClick: onEdit
	}, getText("pisell2.saas.device-planning.detail.edit"))) : null)) : null);
};
//#endregion
exports.default = DeviceDetailDrawer;
