const require_runtime = require("../../../../_virtual/_rolldown/runtime.js");
const require_asyncToGenerator = require("../../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/asyncToGenerator.js");
const require_useEngineContext = require("../../../../hooks/useEngineContext.js");
const require_index = require("../AppearanceShow/index.js");
const require_index$1 = require("../AppearanceEdit/index.js");
const require_index$2 = require("../Modal/index.js");
const require_antdConfirmPromise = require("../Modal/antdConfirmPromise.js");
const require_constants = require("./constants.js");
const require_index$3 = require("../EditableString/index.js");
let react = require("react");
react = require_runtime.__toESM(react);
let _pisell_utils = require("@pisell/utils");
let _pisell_materials = require("@pisell/materials");
let _ant_design_icons = require("@ant-design/icons");
require("./index.less");
//#region src/components/workSpaceList/components/Card/index.tsx
const stopPropagation = (e) => {
	e.stopPropagation();
};
const titleMap = {
	duplicate: () => `Duplicate "Untitled Base"`,
	move: "Move Untitled Base to another workspace"
};
const DuplicateContent = () => {
	return /* @__PURE__ */ react.default.createElement("div", { className: "duplicate-content-wrap" }, /* @__PURE__ */ react.default.createElement("div", { className: "appearance-wrap" }, /* @__PURE__ */ react.default.createElement(require_index.default, {
		icon: "Un",
		color: "#7F56D9",
		size: 72,
		fontSize: 30
	})), /* @__PURE__ */ react.default.createElement(_pisell_materials.Input, null), /* @__PURE__ */ react.default.createElement(_pisell_materials.Space, { className: "duplicate-records" }, /* @__PURE__ */ react.default.createElement(_pisell_materials.Switch, { defaultChecked: true }), /* @__PURE__ */ react.default.createElement("span", null, "Duplicate records")));
};
const MoveContent = () => {
	return /* @__PURE__ */ react.default.createElement("div", { className: "move-content-wrap" }, /* @__PURE__ */ react.default.createElement("div", null, "Choose workspace"), /* @__PURE__ */ react.default.createElement(_pisell_materials.Select, {
		className: "select",
		options: [{
			label: "Workspace 1",
			value: 1
		}, {
			label: "Workspace 2",
			value: 2
		}]
	}));
};
const Card = (props) => {
	const { name, describe, created_at, icon, color, id, onDeleteBase, onUpdateBase } = props;
	const { pushV2AdminPage } = require_useEngineContext.default().appHelper.utils.getApp().history;
	const [editing, setEditing] = (0, react.useState)(false);
	const [open, setOpen] = (0, react.useState)(false);
	const [popoverOpen, setPopoverOpen] = (0, react.useState)(false);
	const [currentType, setCurrentType] = (0, react.useState)("");
	const cardRef = (0, react.useRef)(null);
	const appearanceEditRef = (0, react.useRef)(null);
	const onClick = function() {
		var _ref = require_asyncToGenerator._asyncToGenerator(function* ({ key, domEvent }) {
			domEvent.stopPropagation();
			if (key === "rename") setEditing(true);
			else if (key === "share") {} else if (key === "duplicate") {
				setOpen(true);
				setCurrentType("duplicate");
			} else if (key === "move") {
				setOpen(true);
				setCurrentType("move");
			} else if (key === "customize") setPopoverOpen(true);
			else if (key === "settings") {} else if (key === "delete") {
				yield require_antdConfirmPromise.antdConfirmPromise({
					type: "confirm",
					title: "Are you sure you want to delete Untitled Base?",
					content: "This operation can cause all data in the Base to be deleted.",
					okText: "Delete base"
				});
				onDeleteBase === null || onDeleteBase === void 0 || onDeleteBase(id);
			}
		});
		return function onClick(_x) {
			return _ref.apply(this, arguments);
		};
	}();
	const handleNameChange = (val) => {
		setEditing(false);
		if (name === val) return;
		onUpdateBase === null || onUpdateBase === void 0 || onUpdateBase({
			id,
			name: val
		});
	};
	const handleOk = () => {};
	const title = (0, react.useMemo)(() => {
		const result = titleMap[currentType];
		return (0, _pisell_utils.isFunction)(result) ? result() : result;
	}, [currentType]);
	const content = (0, react.useMemo)(() => {
		return /* @__PURE__ */ react.default.createElement(require_index$1.default, {
			name,
			color,
			icon,
			isShowName: false,
			colorTitle: "Edit icon appearance",
			ref: appearanceEditRef
		});
	}, [
		name,
		color,
		icon
	]);
	const handleOpenChange = function() {
		var _ref2 = require_asyncToGenerator._asyncToGenerator(function* (o) {
			if (!o) {
				var _appearanceEditRef$cu;
				setPopoverOpen(o);
				const detail = (_appearanceEditRef$cu = appearanceEditRef.current) === null || _appearanceEditRef$cu === void 0 ? void 0 : _appearanceEditRef$cu.getDetail();
				const newBase = {
					id,
					color: detail === null || detail === void 0 ? void 0 : detail.color,
					icon: (detail === null || detail === void 0 ? void 0 : detail.icon) || "",
					name: detail === null || detail === void 0 ? void 0 : detail.name
				};
				if (JSON.stringify(newBase) === JSON.stringify({
					id,
					color,
					icon: icon || "",
					name
				})) return;
				onUpdateBase === null || onUpdateBase === void 0 || onUpdateBase({
					id,
					color: detail === null || detail === void 0 ? void 0 : detail.color,
					icon: detail === null || detail === void 0 ? void 0 : detail.icon,
					name: detail === null || detail === void 0 ? void 0 : detail.name
				});
			}
		});
		return function handleOpenChange(_x2) {
			return _ref2.apply(this, arguments);
		};
	}();
	const handleCardClick = () => {
		pushV2AdminPage(`/lowcode/${id}`);
	};
	return /* @__PURE__ */ react.default.createElement(_pisell_materials.Popover, {
		placement: "bottomLeft",
		content,
		open: popoverOpen,
		arrow: false,
		onOpenChange: handleOpenChange,
		destroyTooltipOnHide: true,
		trigger: "click"
	}, /* @__PURE__ */ react.default.createElement("div", {
		className: "card-wrap",
		ref: cardRef,
		onClick: handleCardClick
	}, /* @__PURE__ */ react.default.createElement("div", null, /* @__PURE__ */ react.default.createElement(require_index.default, {
		icon,
		color,
		name,
		size: 72,
		fontSize: 30
	})), /* @__PURE__ */ react.default.createElement("div", { className: "right" }, /* @__PURE__ */ react.default.createElement("div", { className: "line-1" }, /* @__PURE__ */ react.default.createElement("span", { onClick: editing && stopPropagation }, /* @__PURE__ */ react.default.createElement(require_index$3.default, {
		editing,
		editable: false,
		text: name || "",
		onChange: handleNameChange
	})), /* @__PURE__ */ react.default.createElement(_pisell_materials.Dropdown, {
		menu: {
			items: require_constants.items,
			onClick
		},
		placement: "bottomRight"
	}, /* @__PURE__ */ react.default.createElement("span", {
		className: "operate-wrap",
		onClick: stopPropagation
	}, /* @__PURE__ */ react.default.createElement(_ant_design_icons.EllipsisOutlined, null)))), /* @__PURE__ */ react.default.createElement("div", { className: "line-2" }, created_at)), /* @__PURE__ */ react.default.createElement(require_index$2.default, {
		open,
		title,
		width: 400,
		evenlyButton: true,
		onCancel: () => setOpen(false),
		onOk: handleOk
	}, currentType === "duplicate" && /* @__PURE__ */ react.default.createElement(DuplicateContent, null), currentType === "move" && /* @__PURE__ */ react.default.createElement(MoveContent, null))));
};
//#endregion
exports.default = Card;
