import React from "react";
import { Dropdown, Empty, Spin } from "antd";
import { Button as Button$1, Icon } from "@pisell/materials";
import classNames from "classnames";
import { DeleteOutlined, EditOutlined, MoreOutlined, PlusOutlined } from "@ant-design/icons";
import "./index.less";
//#region src/plus/saasDevice/appDevicePlanning/components/WorkAreaList/index.tsx
const WorkAreaListItem = ({ item, selected, title, getText, onSelect, onEdit, onDelete }) => {
	const menuItems = item ? [{
		key: "edit",
		icon: /* @__PURE__ */ React.createElement(EditOutlined, null),
		label: getText("pisell2.saas.device-planning.action.edit"),
		onClick: ({ domEvent }) => {
			domEvent.stopPropagation();
			onEdit(item);
		}
	}, {
		key: "delete",
		danger: true,
		icon: /* @__PURE__ */ React.createElement(DeleteOutlined, null),
		label: getText("pisell2.saas.device-planning.action.delete"),
		onClick: ({ domEvent }) => {
			domEvent.stopPropagation();
			onDelete(item);
		}
	}] : [];
	return /* @__PURE__ */ React.createElement("div", {
		className: classNames("saas-app-device-planning-workarea-item", { "is-selected": selected }),
		onClick: () => onSelect(item === null || item === void 0 ? void 0 : item.id)
	}, item ? null : /* @__PURE__ */ React.createElement("span", { className: "saas-app-device-planning-workarea-item__icon" }, /* @__PURE__ */ React.createElement(Icon, {
		type: "AppstoreOutlined",
		color: selected ? "#1677ff" : "#999"
	})), /* @__PURE__ */ React.createElement("span", { className: "saas-app-device-planning-workarea-item__name" }, title), item ? /* @__PURE__ */ React.createElement(Dropdown, {
		trigger: ["click"],
		menu: { items: menuItems },
		placement: "bottomRight"
	}, /* @__PURE__ */ React.createElement(Button$1, {
		type: "text",
		className: "saas-app-device-planning-workarea-item__more",
		icon: /* @__PURE__ */ React.createElement(MoreOutlined, null),
		onClick: (event) => event.stopPropagation()
	})) : null);
};
const WorkAreaList = ({ className, loading, workAreas, selectedWorkAreaId, getText, translation, onCreate, onSelect, onEdit, onDelete }) => /* @__PURE__ */ React.createElement("aside", { className: classNames("saas-app-device-planning-sider", className) }, /* @__PURE__ */ React.createElement("div", { className: "saas-app-device-planning-sider__header" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "saas-app-device-planning-sider__title" }, getText("pisell2.saas.device-planning.work-areas")), /* @__PURE__ */ React.createElement("div", { className: "saas-app-device-planning-sider__desc" }, getText("pisell2.saas.device-planning.work-areas-desc"))), /* @__PURE__ */ React.createElement(Button$1, {
	type: "text",
	icon: /* @__PURE__ */ React.createElement(PlusOutlined, null),
	onClick: onCreate
})), /* @__PURE__ */ React.createElement("div", { className: "saas-app-device-planning-sider__list" }, /* @__PURE__ */ React.createElement(WorkAreaListItem, {
	selected: !selectedWorkAreaId,
	title: getText("pisell2.saas.device-planning.all-work-areas"),
	getText,
	onSelect,
	onEdit,
	onDelete
}), loading && !workAreas.length ? /* @__PURE__ */ React.createElement("div", { className: "saas-app-device-planning-sider__loading" }, /* @__PURE__ */ React.createElement(Spin, null)) : workAreas.length ? workAreas.map((item) => /* @__PURE__ */ React.createElement(WorkAreaListItem, {
	key: item.id,
	item,
	title: translation(item.name),
	selected: item.id === selectedWorkAreaId,
	getText,
	onSelect,
	onEdit,
	onDelete
})) : /* @__PURE__ */ React.createElement(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE })));
//#endregion
export { WorkAreaList as default };
