import { ConfigService } from "../../../configService/index.mjs";
import { apiMutate } from "../../../utilities/useAxiosMutate.mjs";
import { FluentIcon } from "../../../utilities/iconLibrary/FluentIcon.mjs";
import { useActions } from "../../../hooks/useActions.mjs";
import { redirectToLinkOnClick } from "../../../utilities/menus/redirectToLink.mjs";
import { AppMenuItemComponent } from "./AppMenuItemComponent.mjs";
import { c } from "react-compiler-runtime";
import React, { useState } from "react";
import { Collapse, List, ListItemIcon, ListItemText, createStyles, makeStyles } from "@material-ui/core";
import clsx from "clsx";
import { ChevronDownIcon, ChevronUpIcon } from "@fluentui/react-icons";
import PropTypes from "prop-types";
import { useTranslation } from "react-i18next";
//#region src/UI/navigation/menus/AppMenuItem.jsx
const AppMenuItemPropTypes = {
	id: PropTypes.string,
	label: PropTypes.string.isRequired,
	link: PropTypes.string,
	tenantHref: PropTypes.string,
	icon: PropTypes.elementType,
	iconName: PropTypes.string,
	image: PropTypes.string,
	items: PropTypes.arrayOf(PropTypes.object),
	indent: PropTypes.string,
	redirectInfo: PropTypes.string,
	params: PropTypes.object,
	menuItemId: PropTypes.string,
	menuStructureId: PropTypes.number,
	parentId: PropTypes.number,
	productId: PropTypes.number,
	isActive: PropTypes.bool,
	roleIds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])),
	getAccessToken: PropTypes.func,
	childrenIcons: PropTypes.bool,
	isChild: PropTypes.bool,
	childIndex: PropTypes.number,
	sidebarExpanded: PropTypes.bool,
	devicesHiddenOn: PropTypes.arrayOf(PropTypes.string),
	user: PropTypes.object,
	tenantSsoId: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
const useStyles = makeStyles((theme) => createStyles({
	menuItem: { "&.active": {
		background: "rgba(0, 0, 0, 0.08)",
		"& .MuiListItemIcon-root": { marginLeft: theme.spacing(2) }
	} },
	menuItemIcon: { minWidth: theme.spacing(5) },
	item: {
		width: 254,
		whiteSpace: "normal",
		paddingLeft: (props) => props?.isChild && props.sidebarExpanded ? `calc(16px + ${16 * (props.childIndex !== void 0 ? props.childIndex : 0)}px)` : null
	},
	indent: {},
	icon: {
		width: theme.spacing(3),
		height: theme.spacing(3),
		color: theme.palette.secondary.dark
	},
	expand: { visibility: (props) => props.sidebarExpanded ? "visible" : "hidden" },
	images: {
		width: theme.spacing(3.5),
		height: theme.spacing(3.5)
	}
}));
const AppMenuItem = (props) => {
	const $ = c(78);
	let getAccessToken;
	let icon;
	let image;
	let indent;
	let label;
	let link;
	let other;
	let params;
	let redirectInfo;
	let sidebarExpanded;
	let t0;
	let t1;
	let t2;
	let t3;
	let tenantHref;
	let tenantSsoId;
	let user;
	if ($[0] !== props) {
		({childrenIcons: t0, isChild: t1, childIndex: t2, label, link, tenantHref, icon, image, getAccessToken, indent, items: t3, redirectInfo, sidebarExpanded, user, params, tenantSsoId, ...other} = props);
		$[0] = props;
		$[1] = getAccessToken;
		$[2] = icon;
		$[3] = image;
		$[4] = indent;
		$[5] = label;
		$[6] = link;
		$[7] = other;
		$[8] = params;
		$[9] = redirectInfo;
		$[10] = sidebarExpanded;
		$[11] = t0;
		$[12] = t1;
		$[13] = t2;
		$[14] = t3;
		$[15] = tenantHref;
		$[16] = tenantSsoId;
		$[17] = user;
	} else {
		getAccessToken = $[1];
		icon = $[2];
		image = $[3];
		indent = $[4];
		label = $[5];
		link = $[6];
		other = $[7];
		params = $[8];
		redirectInfo = $[9];
		sidebarExpanded = $[10];
		t0 = $[11];
		t1 = $[12];
		t2 = $[13];
		t3 = $[14];
		tenantHref = $[15];
		tenantSsoId = $[16];
		user = $[17];
	}
	const childrenIcons = t0 === void 0 ? true : t0;
	const isChild = t1 === void 0 ? false : t1;
	const childIndex = t2 === void 0 ? 0 : t2;
	let t4;
	if ($[18] !== t3) {
		t4 = t3 === void 0 ? [] : t3;
		$[18] = t3;
		$[19] = t4;
	} else t4 = $[19];
	const items = t4;
	const classes = useStyles(props);
	const isExpandable = items?.length > 0;
	const [open, setOpen] = useState(false);
	const { triggerMultipleActions } = useActions();
	const { t } = useTranslation();
	let t5;
	if ($[20] !== getAccessToken || $[21] !== open || $[22] !== params || $[23] !== redirectInfo || $[24] !== tenantSsoId || $[25] !== triggerMultipleActions || $[26] !== user) {
		t5 = async () => {
			let url = redirectInfo;
			if (url && tenantSsoId) {
				const response = await apiMutate(ConfigService.securityV1ApiUrl, `sso/${tenantSsoId}`, { method: "get" });
				if (!response) return;
				url = `${url}${response.data.urlParams}`;
			}
			if (url) redirectToLinkOnClick(url, getAccessToken, user);
			if (params?.Action?.length) triggerMultipleActions(params.Action);
			setOpen(!open);
		};
		$[20] = getAccessToken;
		$[21] = open;
		$[22] = params;
		$[23] = redirectInfo;
		$[24] = tenantSsoId;
		$[25] = triggerMultipleActions;
		$[26] = user;
		$[27] = t5;
	} else t5 = $[27];
	const handleClick = t5;
	const t6 = indent ? classes.menuItem : classes.indent;
	let t7;
	if ($[28] !== classes.item || $[29] !== t6) {
		t7 = clsx(t6, classes.item);
		$[28] = classes.item;
		$[29] = t6;
		$[30] = t7;
	} else t7 = $[30];
	const t8 = items.length ? "" : link;
	const t9 = items.length ? void 0 : tenantHref;
	const t10 = isExpandable ? open : null;
	let t11;
	if ($[31] !== label || $[32] !== other || $[33] !== params) {
		t11 = {
			...other,
			label,
			params
		};
		$[31] = label;
		$[32] = other;
		$[33] = params;
		$[34] = t11;
	} else t11 = $[34];
	let t12;
	if ($[35] !== childrenIcons || $[36] !== classes.icon || $[37] !== classes.images || $[38] !== classes.menuItemIcon || $[39] !== icon || $[40] !== image || $[41] !== isChild || $[42] !== label) {
		t12 = (!!icon || !!image) && (isChild && childrenIcons || !isChild) && /* @__PURE__ */ React.createElement(ListItemIcon, { className: classes.menuItemIcon }, icon ? /* @__PURE__ */ React.createElement("div", { className: classes.icon }, /* @__PURE__ */ React.createElement(FluentIcon, { component: icon })) : /* @__PURE__ */ React.createElement("img", {
			src: image,
			alt: label,
			className: classes.images
		}));
		$[35] = childrenIcons;
		$[36] = classes.icon;
		$[37] = classes.images;
		$[38] = classes.menuItemIcon;
		$[39] = icon;
		$[40] = image;
		$[41] = isChild;
		$[42] = label;
		$[43] = t12;
	} else t12 = $[43];
	let t13;
	if ($[44] !== label || $[45] !== t) {
		t13 = t(label);
		$[44] = label;
		$[45] = t;
		$[46] = t13;
	} else t13 = $[46];
	const t14 = !icon && !image;
	let t15;
	if ($[47] === Symbol.for("react.memo_cache_sentinel")) {
		t15 = { variant: "body1" };
		$[47] = t15;
	} else t15 = $[47];
	let t16;
	if ($[48] !== t13 || $[49] !== t14) {
		t16 = /* @__PURE__ */ React.createElement(ListItemText, {
			primary: t13,
			inset: t14,
			primaryTypographyProps: t15
		});
		$[48] = t13;
		$[49] = t14;
		$[50] = t16;
	} else t16 = $[50];
	let t17;
	if ($[51] !== classes.expand || $[52] !== isExpandable || $[53] !== label || $[54] !== open) {
		t17 = isExpandable && (open ? /* @__PURE__ */ React.createElement("div", { className: classes.expand }, /* @__PURE__ */ React.createElement(FluentIcon, {
			size: "small",
			component: ChevronUpIcon,
			id: `udpRecord-AppMenuItem-FluentIcon-Up-${label}`,
			udprecordid: `udpRecord-AppMenuItem-FluentIcon-Up-${label}`
		})) : /* @__PURE__ */ React.createElement("div", { className: classes.expand }, /* @__PURE__ */ React.createElement(FluentIcon, {
			size: "small",
			component: ChevronDownIcon,
			id: `udpRecord-AppMenuItem-FluentIcon-Down-${label}`,
			udprecordid: `udpRecord-AppMenuItem-FluentIcon-Down-${label}`
		})));
		$[51] = classes.expand;
		$[52] = isExpandable;
		$[53] = label;
		$[54] = open;
		$[55] = t17;
	} else t17 = $[55];
	let t18;
	if ($[56] !== handleClick || $[57] !== isChild || $[58] !== t10 || $[59] !== t11 || $[60] !== t12 || $[61] !== t16 || $[62] !== t17 || $[63] !== t7 || $[64] !== t8 || $[65] !== t9) {
		t18 = /* @__PURE__ */ React.createElement(AppMenuItemComponent, {
			className: t7,
			link: t8,
			tenantHref: t9,
			onClick: handleClick,
			"aria-expanded": t10,
			params: t11,
			isChild
		}, t12, t16, t17);
		$[56] = handleClick;
		$[57] = isChild;
		$[58] = t10;
		$[59] = t11;
		$[60] = t12;
		$[61] = t16;
		$[62] = t17;
		$[63] = t7;
		$[64] = t8;
		$[65] = t9;
		$[66] = t18;
	} else t18 = $[66];
	const MenuItemRoot = t18;
	let t19;
	if ($[67] !== childIndex || $[68] !== childrenIcons || $[69] !== isExpandable || $[70] !== items || $[71] !== open || $[72] !== sidebarExpanded || $[73] !== user) {
		t19 = isExpandable ? /* @__PURE__ */ React.createElement(Collapse, {
			in: open,
			timeout: "auto",
			unmountOnExit: true
		}, /* @__PURE__ */ React.createElement(List, null, items.map((item, index) => /* @__PURE__ */ React.createElement(AppMenuItem, {
			...item,
			childrenIcons,
			isChild: true,
			key: index,
			childIndex: childIndex + 1,
			sidebarExpanded,
			user
		})))) : null;
		$[67] = childIndex;
		$[68] = childrenIcons;
		$[69] = isExpandable;
		$[70] = items;
		$[71] = open;
		$[72] = sidebarExpanded;
		$[73] = user;
		$[74] = t19;
	} else t19 = $[74];
	const MenuItemChildren = t19;
	let t20;
	if ($[75] !== MenuItemChildren || $[76] !== MenuItemRoot) {
		t20 = /* @__PURE__ */ React.createElement("li", null, MenuItemRoot, MenuItemChildren);
		$[75] = MenuItemChildren;
		$[76] = MenuItemRoot;
		$[77] = t20;
	} else t20 = $[77];
	return t20;
};
AppMenuItem.propTypes = AppMenuItemPropTypes;
//#endregion
export { AppMenuItem };

//# sourceMappingURL=AppMenuItem.mjs.map