import React, { useEffect, useMemo, useState } from "react";
import { Button, Checkbox, Empty } from "antd";
import { Icon } from "@pisell/materials";
import "./index.less";
//#region src/plus/saasRole/components/PermissionManager/index.tsx
const PERMISSION_TYPE_CONFIG = {
	channel: {
		titleKey: "pisell2.saas.role.channels",
		descriptionKey: "pisell2.saas.role.control-access-channels",
		prefix: "channel:"
	},
	pageType: {
		titleKey: "pisell2.saas.role.page-types",
		descriptionKey: "pisell2.saas.role.control-access-page-types",
		prefix: "page:"
	},
	app: {
		titleKey: "pisell2.saas.role.apps",
		descriptionKey: "pisell2.saas.role.control-access-apps",
		prefix: "app:"
	},
	systemManagement: {
		titleKey: "pisell2.saas.role.system-management",
		descriptionKey: "pisell2.saas.role.control-system-operations",
		prefix: "system:"
	}
};
const PermissionManager = ({ availablePermissions, currentPermissions, onChange, getLocaleText, getText, updating }) => {
	const [selectedPermissions, setSelectedPermissions] = useState([]);
	console.log("selectedPermissions", selectedPermissions);
	const permissionTypes = useMemo(() => {
		if (!availablePermissions) return [];
		return Object.keys(availablePermissions).filter((key) => {
			var _availablePermissions;
			return ((_availablePermissions = availablePermissions[key]) === null || _availablePermissions === void 0 ? void 0 : _availablePermissions.length) > 0;
		}).map((key) => ({
			type: key,
			items: availablePermissions[key],
			config: PERMISSION_TYPE_CONFIG[key] || {
				titleKey: key,
				descriptionKey: `Control access to ${key}`,
				prefix: `${key}:`
			}
		}));
	}, [availablePermissions]);
	useEffect(() => {
		if (currentPermissions.includes("*")) setSelectedPermissions(permissionTypes.flatMap((pt) => pt.items.map((item) => item.code)));
		else {
			const knownPrefixes = permissionTypes.map((pt) => pt.config.prefix);
			setSelectedPermissions(currentPermissions.filter((p) => knownPrefixes.some((prefix) => p.startsWith(prefix)) || p.includes(":")));
		}
	}, [currentPermissions, permissionTypes]);
	const isTypeAllSelected = (items) => {
		return items.length > 0 && items.every((item) => selectedPermissions.includes(item.code));
	};
	const handleTypeSelectAll = (items, checked) => {
		const itemCodes = items.map((item) => item.code);
		if (checked) {
			const newPermissions = [...selectedPermissions];
			itemCodes.forEach((code) => {
				if (!newPermissions.includes(code)) newPermissions.push(code);
			});
			setSelectedPermissions(newPermissions);
		} else setSelectedPermissions(selectedPermissions.filter((p) => !itemCodes.includes(p)));
	};
	const handlePermissionChange = (code, checked) => {
		if (checked) setSelectedPermissions([...selectedPermissions, code]);
		else setSelectedPermissions(selectedPermissions.filter((p) => p !== code));
	};
	const handleSave = () => {
		const knownPrefixes = permissionTypes.map((pt) => pt.config.prefix);
		onChange([...currentPermissions.filter((p) => !knownPrefixes.some((prefix) => p.startsWith(prefix)) && p !== "*"), ...selectedPermissions]);
	};
	if (!permissionTypes || permissionTypes.length === 0) return /* @__PURE__ */ React.createElement(Empty, { description: getText("pisell2.saas.role.no-permissions") });
	return /* @__PURE__ */ React.createElement("div", { className: "permission-manager" }, /* @__PURE__ */ React.createElement("div", { className: "permission-sections-container" }, permissionTypes.map(({ type, items, config }) => {
		const isAllSelected = isTypeAllSelected(items);
		return /* @__PURE__ */ React.createElement("div", {
			key: type,
			className: "permission-section"
		}, /* @__PURE__ */ React.createElement("div", { className: "permission-section-title" }, /* @__PURE__ */ React.createElement("h4", null, getText(config.titleKey)), /* @__PURE__ */ React.createElement("p", null, getText(config.descriptionKey))), /* @__PURE__ */ React.createElement("div", { className: "permission-section-content" }, /* @__PURE__ */ React.createElement("div", { className: "permission-section-actions" }, /* @__PURE__ */ React.createElement(Button, {
			size: "small",
			type: "text",
			icon: isAllSelected ? /* @__PURE__ */ React.createElement(Icon, { type: "pisell2-square" }) : /* @__PURE__ */ React.createElement(Icon, { type: "pisell2-check-square-broken" }),
			style: {
				padding: 0,
				fontSize: 12
			},
			onClick: () => handleTypeSelectAll(items, !isAllSelected)
		}, isAllSelected ? getText("pisell2.saas.role.clear-all") : getText("pisell2.saas.role.select-all"))), /* @__PURE__ */ React.createElement("div", { className: "permission-items" }, items.map((item) => /* @__PURE__ */ React.createElement("div", {
			key: item.code,
			className: "permission-item"
		}, /* @__PURE__ */ React.createElement(Checkbox, {
			checked: selectedPermissions.includes(item.code),
			onChange: (e) => handlePermissionChange(item.code, e.target.checked)
		}, getLocaleText(item.name)))))));
	})), /* @__PURE__ */ React.createElement("div", { className: "permission-manager-footer" }, /* @__PURE__ */ React.createElement(Button, {
		type: "primary",
		onClick: handleSave,
		loading: updating
	}, getText("pisell2.saas.role.save"))));
};
//#endregion
export { PermissionManager as default };
