import { E as compilerRuntimeExports, T as useNavigate, r as reactExports, j as jsxRuntimeExports } from "./vendor-react-DYNCg6N5.js";
import { ce as useDeleteRolesMutation, b as useActions, c as useAppSelector, t as extractErrorCode, v as generateErrorMessage, O as themeColors, V as PanelsEnum, R as ROUTES, bj as canEditRole, bk as EditProfileIcon, aV as EditIcon, M as RolesPlaceholder, cf as useDeleteRoleMutation, l as useLazyGetUsersQuery, a6 as clearApiCacheByTags, ae as usersApi, a7 as rolesApi, I as IFiltersEnumType, aD as UsersIcon, cg as PlusIcon, bh as isSuperAdmin, bP as RoleTypesEnum, ch as useEditRolesMutation, m as universalNotification, ci as useGetRolesInfoCommonQuery } from "./index-DfebxkL9.js";
import { c as createStyles, s as showNotification, a5 as openContextModal, b as Box, h as ActionIcon, G as Group, T as Text, A as Avatar, F as Flex, K as Divider, g as Loader, O as Badge, z as useForm, a0 as SimpleGrid, E as TextInput, B as Button, U as UnstyledButton, a6 as notifications } from "./vendor-mantine-h0WlM2Mj.js";
import { v as zKe, a2 as _Z, a1 as $n } from "./vendor-icons-xWhXK_Ui.js";
import { S as SelectWithPagination } from "./index-CfN7Ll0p.js";
import { S as SelectGroupSimpleModal } from "./index-BWhdniX1.js";
import { S as SelectUserModal } from "./index-DFEP7Sv_.js";
import { u as useAddRoles, B as Badges } from "./index-woYEqWvh.js";
import { A as AddButton } from "./index-72JBTuLT.js";
import { m as modalTheme } from "./styles-3NoIlzov.js";
import { l as limitsLengthRolesFields, g as getNameByRolesId, S as SelectGroupModal, a as transformObjectIfKeyIsNull } from "./index-Ds4Bnwmy.js";
import { g as getValidateErrors } from "./validation-Ds00Zghx.js";
import { o as objectType, n as numberType, s as stringType } from "./types-espwwxTQ.js";
import { S as SelectQuotas } from "./index-BoQKW1g7.js";
import { u as useTranslation } from "./vendor-i18n-wisIXUFi.js";
import { T as TextField } from "./index-D4BAIihc.js";
import { T as TextFieldTags } from "./index-CslanKI5.js";
import { a as formatDateTime } from "./date-bOIw2uwV.js";
import { O as OverflowTip } from "./index-C-CFogWu.js";
import { I as InfiniteScroll } from "./index.es-BTZFX8B-.js";
import { u as useDebounce } from "./useDebounce-DTubzIUC.js";
import { U as UserAvatarWithCard } from "./index-3c9En-DB.js";
import { S as Search } from "./index-CcqTjOWY.js";
var OrderType = /* @__PURE__ */ ((OrderType2) => {
  OrderType2[OrderType2["Local"] = 0] = "Local";
  OrderType2[OrderType2["Ldap"] = 1] = "Ldap";
  return OrderType2;
})(OrderType || {});
const useStyles$6 = createStyles((theme, _, utils) => ({
  modalRoot: modalTheme(theme).root,
  modalContainer: modalTheme(theme).container,
  modalFooter: modalTheme(theme).footer,
  modalCancelBtn: modalTheme(theme).cancelBtn,
  root: {
    "& .mantine-Drawer-body": {
      padding: "0",
      height: `calc(100vh - 85px)`,
      paddingBottom: "env(safe-area-inset-bottom)",
      "@supports(-webkit-touch-callout: none)": {
        height: "-webkit-fit-content",
        paddingBottom: "env(safe-area-inset-bottom)"
      }
    },
    "& .mantine-Drawer-header": {
      fontWeight: "bold",
      fontSize: "16px",
      lineHeight: "125%",
      color: "#101828",
      backgroundColor: "#fff",
      borderBottom: `1px solid ${theme.colors.backgroundGray[3]}`
    }
  },
  footer: {
    display: "flex",
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "space-between",
    width: "100%",
    backgroundColor: theme.colors.backgroundGray[0],
    height: "63px",
    padding: `0px ${theme.spacing.md}`,
    borderTop: `1px solid ${theme.colors.backgroundGray[3]}`,
    position: "absolute",
    bottom: "0"
  },
  createButton: {
    display: "flex",
    justifyContent: "flex-start",
    alignItems: "center",
    borderRadius: theme.spacing.xs,
    span: {
      height: "auto",
      marginRight: "8px",
      div: {
        margin: "0"
      }
    },
    [utils.smallerThan("lg")]: {
      padding: "15px",
      justifyContent: "center",
      span: {
        margin: "0"
      }
    }
  },
  createButtonText: {
    marginLeft: "16px",
    [utils.smallerThan("lg")]: {
      display: "none"
    }
  },
  cancelBtn: {
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    height: "36px",
    borderRadius: "8px",
    padding: `8px ${theme.spacing.sm}`,
    backgroundColor: theme.colors.brandGray[1],
    fontSize: "14px",
    color: "#101828",
    fontWeight: 600,
    lineHeight: "17px",
    "&:hover": {
      backgroundColor: "#eff0f4"
    },
    "&:active": {
      transform: `translateY(1px)`
    }
  },
  addButton: {
    borderRadius: "8px",
    border: `1px solid ${theme.colors.brandGray[0]}`,
    "&:hover": {
      backgroundColor: "#f6f7f8"
    },
    "& .mantine-Button-inner": {
      display: "flex",
      flexDirection: "row",
      alignItems: "center",
      justifyContent: "space-between"
    },
    "& .mantine-Button-label": {
      color: theme.black
    }
  }
}));
const validateCreateRolesSchema = (t) => objectType({
  Name: stringType().max(limitsLengthRolesFields.Name, {
    message: t("validation.maxLengthSymbols", {
      count: limitsLengthRolesFields.Name
    })
  }).refine((data) => /\S/.test(data), {
    message: t("validation.enterRolesName")
  }),
  Customer: objectType({
    Id: numberType({
      invalid_type_error: t("validation.required")
    })
  })
});
const useDeleteRoles = () => {
  const $ = compilerRuntimeExports.c(17);
  const {
    t
  } = useTranslation();
  const navigate = useNavigate();
  const [fetchDeleteGroup, t0] = useDeleteRolesMutation();
  const {
    isSuccess
  } = t0;
  const {
    setSelectedRolesId,
    setSelectedPanel
  } = useActions();
  const {
    filters: rolesFilter
  } = useAppSelector(_temp$4);
  const {
    setRolesTableFilters
  } = useActions();
  let t1;
  if ($[0] !== fetchDeleteGroup) {
    t1 = async (selection) => {
      try {
        const res = await fetchDeleteGroup(selection);
        if ("error" in res) {
          const codeError = extractErrorCode(res.error);
          showNotification({
            title: generateErrorMessage(codeError),
            message: "",
            autoClose: true,
            color: "red"
          });
        }
      } catch (t22) {
      }
    };
    $[0] = fetchDeleteGroup;
    $[1] = t1;
  } else {
    t1 = $[1];
  }
  const handleConfirm = t1;
  let t2;
  if ($[2] !== handleConfirm || $[3] !== t) {
    t2 = (selection_0) => {
      openContextModal({
        modal: "context",
        centered: true,
        innerProps: {
          title: t("warning"),
          modalBody: /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { mb: 24, children: t("roles.deleteWarningText") }),
          confirmProps: {
            color: "brandRed.1",
            sx: {
              backgroundColor: themeColors.brandRed[1],
              color: "white",
              width: "49%"
            }
          },
          cancelProps: {
            sx: {
              backgroundColor: themeColors.brandGray[1],
              color: "black",
              width: "49%",
              "& .mantine-Button-label": {
                color: "black"
              }
            }
          },
          labels: {
            confirm: t("continue"),
            cancel: t("cancel")
          },
          onConfirm: () => handleConfirm(selection_0)
        }
      });
    };
    $[2] = handleConfirm;
    $[3] = t;
    $[4] = t2;
  } else {
    t2 = $[4];
  }
  const openDeleteRoles = t2;
  let t3;
  if ($[5] !== isSuccess || $[6] !== navigate || $[7] !== rolesFilter || $[8] !== setRolesTableFilters || $[9] !== setSelectedPanel || $[10] !== setSelectedRolesId || $[11] !== t) {
    t3 = () => {
      if (isSuccess) {
        setRolesTableFilters({
          ...rolesFilter,
          Offset: 0
        });
        showNotification({
          title: t("roles.deleteSuccess"),
          message: "",
          autoClose: true,
          color: "green"
        });
        setSelectedRolesId(0);
        setSelectedPanel(PanelsEnum.generalInformation);
        navigate(ROUTES.roles.path);
      }
    };
    $[5] = isSuccess;
    $[6] = navigate;
    $[7] = rolesFilter;
    $[8] = setRolesTableFilters;
    $[9] = setSelectedPanel;
    $[10] = setSelectedRolesId;
    $[11] = t;
    $[12] = t3;
  } else {
    t3 = $[12];
  }
  let t4;
  if ($[13] !== isSuccess) {
    t4 = [isSuccess];
    $[13] = isSuccess;
    $[14] = t4;
  } else {
    t4 = $[14];
  }
  reactExports.useEffect(t3, t4);
  let t5;
  if ($[15] !== openDeleteRoles) {
    t5 = {
      openDeleteRoles
    };
    $[15] = openDeleteRoles;
    $[16] = t5;
  } else {
    t5 = $[16];
  }
  return t5;
};
function _temp$4(state) {
  return state.roles;
}
const Action = (t0) => {
  const $ = compilerRuntimeExports.c(14);
  const {
    item
  } = t0;
  const {
    selectedRolesId
  } = useAppSelector(_temp$3);
  const {
    openDeleteRoles
  } = useDeleteRoles();
  const {
    setSelectedPanel
  } = useActions();
  let t1;
  if ($[0] !== (item == null ? void 0 : item.Id) || $[1] !== openDeleteRoles) {
    t1 = (event) => {
      event.preventDefault();
      event.stopPropagation();
      openDeleteRoles(item == null ? void 0 : item.Id);
    };
    $[0] = item == null ? void 0 : item.Id;
    $[1] = openDeleteRoles;
    $[2] = t1;
  } else {
    t1 = $[2];
  }
  const handleClickModal = t1;
  let t2;
  if ($[3] !== setSelectedPanel) {
    t2 = () => {
      setSelectedPanel(PanelsEnum.editInformation);
    };
    $[3] = setSelectedPanel;
    $[4] = t2;
  } else {
    t2 = $[4];
  }
  const editRole = t2;
  let t3;
  if ($[5] !== editRole || $[6] !== selectedRolesId) {
    t3 = !selectedRolesId && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { "data-cy": "editRole", className: "action-icon", "data-action": "action", onClick: editRole, children: /* @__PURE__ */ jsxRuntimeExports.jsx(EditProfileIcon, { size: 24 }) }),
      /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { "data-cy": "viewRole", className: "action-icon", "data-action": "action", children: /* @__PURE__ */ jsxRuntimeExports.jsx(_Z, { size: "1.5rem", color: "#667085", stroke: 1.5, style: {
        pointerEvents: "none"
      } }) })
    ] });
    $[5] = editRole;
    $[6] = selectedRolesId;
    $[7] = t3;
  } else {
    t3 = $[7];
  }
  let t4;
  if ($[8] !== handleClickModal || $[9] !== (item == null ? void 0 : item.Type)) {
    t4 = canEditRole(item == null ? void 0 : item.Type) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { "data-cy": "roleActions", className: "action-icon", onClick: handleClickModal, "data-action": "action", children: /* @__PURE__ */ jsxRuntimeExports.jsx(zKe, { size: "1.5rem", color: "#667085", stroke: 1.5, style: {
      pointerEvents: "none"
    } }) }) : null;
    $[8] = handleClickModal;
    $[9] = item == null ? void 0 : item.Type;
    $[10] = t4;
  } else {
    t4 = $[10];
  }
  let t5;
  if ($[11] !== t3 || $[12] !== t4) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Group, { gap: 4, justify: "flex-end", wrap: "nowrap", children: [
      t3,
      t4
    ] });
    $[11] = t3;
    $[12] = t4;
    $[13] = t5;
  } else {
    t5 = $[13];
  }
  return t5;
};
function _temp$3(state) {
  return state.roles;
}
const useStyles$5 = createStyles((theme) => ({
  content: {
    marginTop: theme.spacing.md,
    display: "flex",
    alignItems: "flex-start",
    flexDirection: "column"
  }
}));
const BaseInfo = () => {
  var _a, _b, _c;
  const $ = compilerRuntimeExports.c(45);
  const {
    t
  } = useTranslation();
  const {
    classes
  } = useStyles$5();
  const {
    rolesInfoCommon
  } = reactExports.useContext(RolesInfoMainContext);
  const t0 = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type;
  let t1;
  if ($[0] !== t0) {
    t1 = getNameByRolesId(t0);
    $[0] = t0;
    $[1] = t1;
  } else {
    t1 = $[1];
  }
  const {
    name
  } = t1;
  const t2 = classes.content;
  let t3;
  if ($[2] !== t) {
    t3 = t("roles.roleType");
    $[2] = t;
    $[3] = t3;
  } else {
    t3 = $[3];
  }
  let t4;
  if ($[4] !== name || $[5] !== t) {
    t4 = name.length ? t(`roles.types.${name}`) : "";
    $[4] = name;
    $[5] = t;
    $[6] = t4;
  } else {
    t4 = $[6];
  }
  let t5;
  if ($[7] !== t3 || $[8] !== t4) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(TextField, { title: t3, description: t4 });
    $[7] = t3;
    $[8] = t4;
    $[9] = t5;
  } else {
    t5 = $[9];
  }
  let t6;
  if ($[10] !== t) {
    t6 = t("unit");
    $[10] = t;
    $[11] = t6;
  } else {
    t6 = $[11];
  }
  const t7 = (_a = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Customer) == null ? void 0 : _a.Name;
  let t8;
  if ($[12] !== t6 || $[13] !== t7) {
    t8 = /* @__PURE__ */ jsxRuntimeExports.jsx(TextField, { title: t6, description: t7 });
    $[12] = t6;
    $[13] = t7;
    $[14] = t8;
  } else {
    t8 = $[14];
  }
  let t9;
  if ($[15] !== t) {
    t9 = t("roles.parentalRole");
    $[15] = t;
    $[16] = t9;
  } else {
    t9 = $[16];
  }
  const t10 = (_b = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Parent) == null ? void 0 : _b.Name;
  let t11;
  if ($[17] !== t10 || $[18] !== t9) {
    t11 = /* @__PURE__ */ jsxRuntimeExports.jsx(TextField, { title: t9, description: t10 });
    $[17] = t10;
    $[18] = t9;
    $[19] = t11;
  } else {
    t11 = $[19];
  }
  let t12;
  if ($[20] !== t) {
    t12 = t("roles.roleLeader");
    $[20] = t;
    $[21] = t12;
  } else {
    t12 = $[21];
  }
  const t13 = (_c = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Owner) == null ? void 0 : _c.Name;
  let t14;
  if ($[22] !== t12 || $[23] !== t13) {
    t14 = /* @__PURE__ */ jsxRuntimeExports.jsx(TextField, { title: t12, description: t13 });
    $[22] = t12;
    $[23] = t13;
    $[24] = t14;
  } else {
    t14 = $[24];
  }
  let t15;
  if ($[25] !== t) {
    t15 = t("roles.childRoles");
    $[25] = t;
    $[26] = t15;
  } else {
    t15 = $[26];
  }
  const t16 = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Children;
  let t17;
  if ($[27] !== t15 || $[28] !== t16) {
    t17 = /* @__PURE__ */ jsxRuntimeExports.jsx(TextFieldTags, { title: t15, tags: t16 });
    $[27] = t15;
    $[28] = t16;
    $[29] = t17;
  } else {
    t17 = $[29];
  }
  let t18;
  if ($[30] !== t) {
    t18 = t("dateOfCreation");
    $[30] = t;
    $[31] = t18;
  } else {
    t18 = $[31];
  }
  const t19 = rolesInfoCommon == null ? void 0 : rolesInfoCommon.CreateOfDate;
  let t20;
  if ($[32] !== t19) {
    t20 = formatDateTime(t19);
    $[32] = t19;
    $[33] = t20;
  } else {
    t20 = $[33];
  }
  let t21;
  if ($[34] !== t18 || $[35] !== t20) {
    t21 = /* @__PURE__ */ jsxRuntimeExports.jsx(TextField, { title: t18, description: t20 });
    $[34] = t18;
    $[35] = t20;
    $[36] = t21;
  } else {
    t21 = $[36];
  }
  let t22;
  if ($[37] !== classes.content || $[38] !== t11 || $[39] !== t14 || $[40] !== t17 || $[41] !== t21 || $[42] !== t5 || $[43] !== t8) {
    t22 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: t2, children: [
      t5,
      t8,
      t11,
      t14,
      t17,
      t21
    ] });
    $[37] = classes.content;
    $[38] = t11;
    $[39] = t14;
    $[40] = t17;
    $[41] = t21;
    $[42] = t5;
    $[43] = t8;
    $[44] = t22;
  } else {
    t22 = $[44];
  }
  return t22;
};
const useStyles$4 = createStyles(() => ({
  action: {
    position: "absolute",
    top: "16px",
    right: "16px",
    display: "flex",
    flexDirection: "row"
  },
  backArrow: {
    display: "none",
    "@media (max-width: 574px)": {
      display: "flex"
    }
  }
}));
const DrawerHeader = () => {
  const {
    classes
  } = useStyles$4();
  const navigate = useNavigate();
  const {
    rolesInfoCommon
  } = reactExports.useContext(RolesInfoMainContext);
  const {
    setSelectedRolesId,
    setSelectedPanel
  } = useActions();
  const [isLoading, setIsLoading] = reactExports.useState(true);
  const Type = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type;
  const goFilialUser = () => {
    setSelectedPanel(PanelsEnum.editInformation);
  };
  const goBack = reactExports.useCallback(() => {
    setSelectedRolesId(0);
    navigate(ROUTES.roles.path);
  }, []);
  reactExports.useEffect(() => {
    if (rolesInfoCommon) {
      setIsLoading(false);
    }
  }, [rolesInfoCommon]);
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { onClick: goBack, className: classes.backArrow, children: /* @__PURE__ */ jsxRuntimeExports.jsx($n, { color: "#667085" }) }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.action, children: isLoading ? null : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { size: "md", onClick: goFilialUser, children: /* @__PURE__ */ jsxRuntimeExports.jsx(EditIcon, {}) }),
      canEditRole(Type) ? /* @__PURE__ */ jsxRuntimeExports.jsx(Action, { item: rolesInfoCommon }) : null
    ] }) })
  ] });
};
const useStyles$3 = createStyles((theme) => ({
  photo: {
    display: "flex",
    flexDirection: "column",
    alignItems: "center",
    justifyContent: "center"
  },
  container: {
    marginTop: theme.spacing.sm
  },
  name: {
    fontWeight: 600,
    textAlign: "center",
    lineHeight: "20px"
  },
  email: {
    color: theme.colors.brandGray[0],
    fontSize: "14px",
    textAlign: "center",
    lineHeight: "17px",
    marginTop: theme.spacing.xs
  },
  ldapLabel: {
    width: "fit-content",
    margin: "0 auto",
    backgroundColor: "rgba(51, 154, 240, 1)",
    color: "#EFF8FF",
    padding: "3px 4px",
    borderRadius: "16px",
    fontWeight: "500",
    fontSize: "10px",
    lineHeight: "100%",
    letterSpacing: "0%",
    flexShrink: 0
  },
  badge: {
    marginTop: theme.spacing.sm
  }
}));
const PhotoInfo = (t0) => {
  const $ = compilerRuntimeExports.c(18);
  const {
    rolesInfoCommon
  } = t0;
  const {
    classes
  } = useStyles$3();
  const isLdapUser = (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Origin) === OrderType.Ldap;
  let t1;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = /* @__PURE__ */ jsxRuntimeExports.jsx(Avatar, { color: "blue", size: 124, radius: 62, children: /* @__PURE__ */ jsxRuntimeExports.jsx(RolesPlaceholder, { size: 60 }) });
    $[0] = t1;
  } else {
    t1 = $[0];
  }
  let t2;
  if ($[1] !== classes.ldapLabel || $[2] !== isLdapUser) {
    t2 = isLdapUser && /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.ldapLabel, children: "LDAP" });
    $[1] = classes.ldapLabel;
    $[2] = isLdapUser;
    $[3] = t2;
  } else {
    t2 = $[3];
  }
  const t3 = (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Name) || "";
  let t4;
  if ($[4] !== classes.name || $[5] !== t3) {
    t4 = /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { maw: "300px", children: /* @__PURE__ */ jsxRuntimeExports.jsx(OverflowTip, { className: classes.name, children: t3 }) });
    $[4] = classes.name;
    $[5] = t3;
    $[6] = t4;
  } else {
    t4 = $[6];
  }
  const t5 = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id;
  let t6;
  if ($[7] !== classes.email || $[8] !== t5) {
    t6 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Text, { className: classes.email, children: [
      "ID:",
      t5
    ] });
    $[7] = classes.email;
    $[8] = t5;
    $[9] = t6;
  } else {
    t6 = $[9];
  }
  let t7;
  if ($[10] !== classes.container || $[11] !== t2 || $[12] !== t4 || $[13] !== t6) {
    t7 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.container, children: [
      t2,
      t4,
      t6
    ] });
    $[10] = classes.container;
    $[11] = t2;
    $[12] = t4;
    $[13] = t6;
    $[14] = t7;
  } else {
    t7 = $[14];
  }
  let t8;
  if ($[15] !== classes.photo || $[16] !== t7) {
    t8 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.photo, children: [
      t1,
      t7
    ] });
    $[15] = classes.photo;
    $[16] = t7;
    $[17] = t8;
  } else {
    t8 = $[17];
  }
  return t8;
};
const useStyles$2 = createStyles((theme) => ({
  headerPanel: {
    display: "flex",
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    width: "100%"
  },
  container: {
    display: "flex",
    flexDirection: "row",
    justifyContent: "center",
    alignItems: "center"
  },
  title: {
    marginLeft: theme.spacing.sm,
    fontWeight: 600,
    fontSize: "14px"
  }
}));
const HeaderPanel = ({
  title
}) => {
  const {
    classes
  } = useStyles$2();
  const {
    setSelectedPanel
  } = useActions();
  const goBack = reactExports.useCallback(() => {
    setSelectedPanel(PanelsEnum.generalInformation);
  }, []);
  return /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.headerPanel, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.container, children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { onClick: goBack, size: "md", children: /* @__PURE__ */ jsxRuntimeExports.jsx($n, { color: "#667085" }) }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { className: classes.title, children: title })
  ] }) });
};
const useStyles$1 = createStyles((theme, _, utils) => ({
  divider: {
    marginTop: theme.spacing.sm,
    marginBottom: theme.spacing.sm,
    borderTopColor: theme.colors.brandGray[1]
  },
  search: {
    marginBottom: theme.spacing.sm,
    "& input": {
      backgroundColor: theme.colors.backgroundGray[6],
      height: "48px",
      fontSize: "14px",
      [utils.smallerThan("lg")]: {
        height: "100%"
      }
    }
  },
  header: {
    display: "flex",
    alignItems: "center",
    justifyContent: "space-between",
    marginBottom: theme.spacing.sm
  },
  title: {
    fontSize: "14px",
    fontWeight: 600,
    lineHeight: "20px"
  },
  infiniteScrollMoreData: {
    width: "100%",
    height: "50px",
    display: "flex",
    alignItems: "center",
    justifyContent: "center"
  },
  infiniteScroll: {
    paddingBottom: theme.spacing.sm,
    "&::-webkit-scrollbar": {
      width: "8px",
      height: "10px"
    },
    "&::-webkit-scrollbar-thumb": {
      borderRadius: "8px",
      background: "#98A2B3"
    },
    "&::-webkit-scrollbar-track": {
      background: "#F9FAFB"
    },
    scrollbarColor: "#98A2B3 #F9FAFB"
  },
  badge: {
    paddingRight: 3,
    backgroundColor: theme.colors.backgroundGray[6],
    color: "black",
    borderRadius: "16px",
    marginRight: theme.spacing.xs,
    marginTop: theme.spacing.xs,
    border: "none",
    textTransform: "inherit",
    height: "28px",
    fontSize: "14px",
    fontWeight: 400,
    cursor: "pointer"
  },
  loader: {
    display: "flex",
    flexDirection: "column",
    alignItems: "center",
    justifyContent: "center",
    width: "100%"
  },
  emptyListText: {
    fontSize: "14px",
    textAlign: "center"
  }
}));
const useStyles = createStyles((theme, _, utils) => ({
  container: {
    width: "100%",
    alignItems: "center",
    paddingTop: theme.spacing.sm,
    paddingBottom: theme.spacing.sm,
    justifyContent: "space-between",
    position: "relative"
  },
  hoverItem: {
    "&:hover": {
      borderRadius: "8px",
      [utils.dark]: {
        backgroundColor: theme.colors.dark[7],
        color: theme.white
      },
      [utils.light]: {
        backgroundColor: theme.colors.gray[2],
        color: theme.black
      },
      "& .deleteIcon": {
        paddingRight: theme.spacing.sm,
        opacity: 1
      }
    },
    "& .deleteIcon": {
      opacity: 0
    }
  },
  content: {
    width: "85%",
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    paddingLeft: theme.spacing.xs
  },
  info: {
    width: "80%",
    marginLeft: theme.spacing.sm
  },
  deleteIcon: {
    align: "center",
    paddingRight: theme.spacing.xs
  }
}));
const UserItem = (t0) => {
  const $ = compilerRuntimeExports.c(28);
  const {
    item,
    handleClick,
    showDeleteItemIcon,
    showUserHover
  } = t0;
  const {
    classes,
    cx
  } = useStyles();
  let t1;
  if ($[0] !== classes.container || $[1] !== classes.hoverItem || $[2] !== cx || $[3] !== showUserHover) {
    t1 = cx(classes.container, {
      [classes.hoverItem]: showUserHover()
    });
    $[0] = classes.container;
    $[1] = classes.hoverItem;
    $[2] = cx;
    $[3] = showUserHover;
    $[4] = t1;
  } else {
    t1 = $[4];
  }
  let t2;
  if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = {
      zIndex: 2e3
    };
    $[5] = t2;
  } else {
    t2 = $[5];
  }
  let t3;
  if ($[6] !== item) {
    t3 = /* @__PURE__ */ jsxRuntimeExports.jsx(UserAvatarWithCard, { hoverCardProps: t2, size: 40, src: item.Avatar, user: item, notClickable: true });
    $[6] = item;
    $[7] = t3;
  } else {
    t3 = $[7];
  }
  const t4 = `${item.Surname} ${item.FirstName}`;
  let t5;
  if ($[8] !== t4) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(OverflowTip, { size: "sm", fw: 500, children: t4 });
    $[8] = t4;
    $[9] = t5;
  } else {
    t5 = $[9];
  }
  let t6;
  if ($[10] !== item.Email) {
    t6 = /* @__PURE__ */ jsxRuntimeExports.jsx(OverflowTip, { color: "dimmed", size: "xs", children: item.Email });
    $[10] = item.Email;
    $[11] = t6;
  } else {
    t6 = $[11];
  }
  let t7;
  if ($[12] !== classes.info || $[13] !== t5 || $[14] !== t6) {
    t7 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Flex, { className: classes.info, wrap: "wrap", children: [
      t5,
      t6
    ] });
    $[12] = classes.info;
    $[13] = t5;
    $[14] = t6;
    $[15] = t7;
  } else {
    t7 = $[15];
  }
  let t8;
  if ($[16] !== classes.content || $[17] !== t3 || $[18] !== t7) {
    t8 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.content, children: [
      t3,
      t7
    ] });
    $[16] = classes.content;
    $[17] = t3;
    $[18] = t7;
    $[19] = t8;
  } else {
    t8 = $[19];
  }
  let t9;
  if ($[20] !== classes.deleteIcon || $[21] !== handleClick || $[22] !== showDeleteItemIcon) {
    t9 = showDeleteItemIcon && /* @__PURE__ */ jsxRuntimeExports.jsx(Flex, { className: classes.deleteIcon, onClick: handleClick, children: /* @__PURE__ */ jsxRuntimeExports.jsx(zKe, { size: "1.5rem", color: themeColors.brandGray[0], stroke: 1.5, style: {
      cursor: "pointer"
    } }) });
    $[20] = classes.deleteIcon;
    $[21] = handleClick;
    $[22] = showDeleteItemIcon;
    $[23] = t9;
  } else {
    t9 = $[23];
  }
  let t10;
  if ($[24] !== t1 || $[25] !== t8 || $[26] !== t9) {
    t10 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Flex, { className: t1, children: [
      t8,
      t9
    ] });
    $[24] = t1;
    $[25] = t8;
    $[26] = t9;
    $[27] = t10;
  } else {
    t10 = $[27];
  }
  return t10;
};
const useDeleteRole = (setUsers) => {
  const $ = compilerRuntimeExports.c(15);
  const {
    t
  } = useTranslation();
  const [deleteUserRole, t0] = useDeleteRoleMutation();
  const {
    isSuccess
  } = t0;
  const {
    filters
  } = useAppSelector(_temp$2);
  const [fetchGetUsers] = useLazyGetUsersQuery();
  let t1;
  if ($[0] !== deleteUserRole || $[1] !== fetchGetUsers || $[2] !== filters || $[3] !== setUsers) {
    t1 = async (userId, roleId) => {
      try {
        const res = await deleteUserRole({
          UserId: userId,
          RoleId: roleId
        });
        if (!Object.keys(res).includes("error")) {
          clearApiCacheByTags(usersApi, ["Users"]);
          clearApiCacheByTags(rolesApi, ["Roles"]);
          const {
            data
          } = await fetchGetUsers({
            Count: filters.Count,
            Offset: 0,
            SortOrder: filters.SortOrder,
            SortField: filters.SortField,
            Filters: filters.Filters,
            Query: filters.Query,
            FilterConditions: [{
              Type: IFiltersEnumType.RoleFilter,
              NumValues: [roleId]
            }]
          });
          if (data) {
            setUsers(data.Users);
          }
        }
      } catch (t22) {
        const err = t22;
        console.warn("Error deleting role", err);
      }
    };
    $[0] = deleteUserRole;
    $[1] = fetchGetUsers;
    $[2] = filters;
    $[3] = setUsers;
    $[4] = t1;
  } else {
    t1 = $[4];
  }
  const handleDeleteRole = t1;
  let t2;
  if ($[5] !== handleDeleteRole || $[6] !== t) {
    t2 = (userId_0, roleId_0) => {
      openContextModal({
        modal: "context",
        centered: true,
        innerProps: {
          title: t("warning"),
          modalBody: /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { mb: 24, children: t("roles.deleteWarningText") }),
          confirmProps: {
            color: "brandRed.1",
            sx: {
              backgroundColor: themeColors.brandRed[1],
              color: "white",
              width: "49%"
            }
          },
          cancelProps: {
            sx: {
              backgroundColor: themeColors.brandGray[1],
              color: "black",
              width: "49%",
              "& .mantine-Button-label": {
                color: "black"
              }
            }
          },
          labels: {
            confirm: t("continue"),
            cancel: t("cancel")
          },
          onConfirm: () => handleDeleteRole(userId_0, roleId_0)
        }
      });
    };
    $[5] = handleDeleteRole;
    $[6] = t;
    $[7] = t2;
  } else {
    t2 = $[7];
  }
  const openDeleteRole = t2;
  let t3;
  if ($[8] !== isSuccess || $[9] !== t) {
    t3 = () => {
      if (isSuccess) {
        showNotification({
          title: t("roles.deleteSuccess"),
          message: "",
          autoClose: true,
          color: "green"
        });
      }
    };
    $[8] = isSuccess;
    $[9] = t;
    $[10] = t3;
  } else {
    t3 = $[10];
  }
  let t4;
  if ($[11] !== isSuccess) {
    t4 = [isSuccess];
    $[11] = isSuccess;
    $[12] = t4;
  } else {
    t4 = $[12];
  }
  reactExports.useEffect(t3, t4);
  let t5;
  if ($[13] !== openDeleteRole) {
    t5 = {
      openDeleteRole
    };
    $[13] = openDeleteRole;
    $[14] = t5;
  } else {
    t5 = $[14];
  }
  return t5;
};
function _temp$2(state) {
  return state.users;
}
const useWindowSize = () => {
  const $ = compilerRuntimeExports.c(3);
  let t0;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t0 = {
      width: window.innerWidth,
      height: window.innerHeight
    };
    $[0] = t0;
  } else {
    t0 = $[0];
  }
  const [windowSize, setWindowSize] = reactExports.useState(t0);
  let t1;
  let t2;
  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = () => {
      const handleResize = () => {
        setWindowSize({
          width: window.innerWidth,
          height: window.innerHeight
        });
      };
      window.addEventListener("resize", handleResize);
      return () => window.removeEventListener("resize", handleResize);
    };
    t2 = [];
    $[1] = t1;
    $[2] = t2;
  } else {
    t1 = $[1];
    t2 = $[2];
  }
  reactExports.useEffect(t1, t2);
  return windowSize;
};
const UserRoles = () => {
  const $ = compilerRuntimeExports.c(131);
  const {
    classes
  } = useStyles$1();
  const {
    t
  } = useTranslation();
  const scrollRef = reactExports.useRef(null);
  const divRef = reactExports.useRef(null);
  const windowSize = useWindowSize();
  const {
    rolesInfoCommon
  } = reactExports.useContext(RolesInfoMainContext);
  const User = useAppSelector(_temp$1);
  const [search, setSearch] = reactExports.useState("");
  let t0;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t0 = [];
    $[0] = t0;
  } else {
    t0 = $[0];
  }
  const [usersList, setUsersList] = reactExports.useState(t0);
  const [offset, setOffset] = reactExports.useState(0);
  const [isUserModalOpen, setIsUserModalOpen] = reactExports.useState(false);
  let t1;
  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = [];
    $[1] = t1;
  } else {
    t1 = $[1];
  }
  const [selectedUsers, setSelectedUsers] = reactExports.useState(t1);
  const [totalCount, setTotalCount] = reactExports.useState(0);
  const {
    openDeleteRole
  } = useDeleteRole(setUsersList);
  let t2;
  if ($[2] !== rolesInfoCommon) {
    t2 = (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id) ? [rolesInfoCommon.Id] : [];
    $[2] = rolesInfoCommon;
    $[3] = t2;
  } else {
    t2 = $[3];
  }
  const {
    handleAddRoles
  } = useAddRoles(t2);
  const debounced = useDebounce(search, 500);
  const [fetchGetUsers, t3] = useLazyGetUsersQuery();
  const {
    data,
    isLoading,
    isFetching
  } = t3;
  const [containerHeight, setContainerHeight] = reactExports.useState("auto");
  let t4;
  let t5;
  if ($[4] !== usersList.length || $[5] !== windowSize) {
    t4 = () => {
      if (divRef.current) {
        const scrollRect = divRef.current.offsetTop;
        const availableHeight = windowSize.height - scrollRect - 20;
        if (usersList.length <= 5) {
          setContainerHeight("auto");
        } else {
          const totalHeightOfItems = usersList.length * 70;
          if (totalHeightOfItems <= availableHeight) {
            setContainerHeight("auto");
          } else {
            if (availableHeight > 380) {
              setContainerHeight(`${availableHeight}px`);
            } else {
              setContainerHeight("380px");
            }
          }
        }
      }
    };
    t5 = [windowSize, usersList.length];
    $[4] = usersList.length;
    $[5] = windowSize;
    $[6] = t4;
    $[7] = t5;
  } else {
    t4 = $[6];
    t5 = $[7];
  }
  reactExports.useEffect(t4, t5);
  let t6;
  if ($[8] !== User || $[9] !== (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type)) {
    t6 = (userId) => {
      if (isSuperAdmin(User)) {
        return userId !== (User == null ? void 0 : User.Id) && (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) !== RoleTypesEnum.All;
      } else {
        return userId !== (User == null ? void 0 : User.Id) && (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) !== RoleTypesEnum.All && (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) !== RoleTypesEnum.SuperUser;
      }
    };
    $[8] = User;
    $[9] = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type;
    $[10] = t6;
  } else {
    t6 = $[10];
  }
  const showDeleteItemIcon = t6;
  let t7;
  if ($[11] !== User || $[12] !== data || $[13] !== (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type)) {
    t7 = () => {
      if (data) {
        if (isSuperAdmin(User)) {
          return (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) !== RoleTypesEnum.All;
        } else {
          return (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) !== RoleTypesEnum.All && (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) !== RoleTypesEnum.SuperUser;
        }
      } else {
        return false;
      }
    };
    $[11] = User;
    $[12] = data;
    $[13] = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type;
    $[14] = t7;
  } else {
    t7 = $[14];
  }
  const showPlusIcon = t7;
  const showAddUsersBadge = showPlusIcon() && !(data == null ? void 0 : data.Users.length) && !search && !isLoading;
  let t8;
  if ($[15] !== debounced || $[16] !== fetchGetUsers || $[17] !== offset || $[18] !== rolesInfoCommon) {
    t8 = () => {
      if (rolesInfoCommon) {
        fetchGetUsers({
          Count: 20,
          Offset: offset,
          SortOrder: 0,
          SortField: 0,
          Filters: {},
          Query: debounced,
          FilterConditions: [{
            Type: IFiltersEnumType.RoleFilter,
            NumValues: [rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id]
          }]
        });
      }
    };
    $[15] = debounced;
    $[16] = fetchGetUsers;
    $[17] = offset;
    $[18] = rolesInfoCommon;
    $[19] = t8;
  } else {
    t8 = $[19];
  }
  let t9;
  if ($[20] !== debounced || $[21] !== offset || $[22] !== rolesInfoCommon) {
    t9 = [rolesInfoCommon, debounced, offset];
    $[20] = debounced;
    $[21] = offset;
    $[22] = rolesInfoCommon;
    $[23] = t9;
  } else {
    t9 = $[23];
  }
  reactExports.useEffect(t8, t9);
  let t10;
  if ($[24] !== data || $[25] !== offset || $[26] !== search || $[27] !== usersList) {
    t10 = () => {
      if (data) {
        const usersData = offset > 0 ? [...usersList, ...data.Users] : data.Users;
        setUsersList(usersData);
        if (!search) {
          setTotalCount(data == null ? void 0 : data.TotalCount);
        }
      }
    };
    $[24] = data;
    $[25] = offset;
    $[26] = search;
    $[27] = usersList;
    $[28] = t10;
  } else {
    t10 = $[28];
  }
  let t11;
  if ($[29] !== data) {
    t11 = [data];
    $[29] = data;
    $[30] = t11;
  } else {
    t11 = $[30];
  }
  reactExports.useEffect(t10, t11);
  let t12;
  let t13;
  if ($[31] !== search) {
    t12 = () => {
      var _a, _b;
      if (search) {
        (_b = (_a = scrollRef == null ? void 0 : scrollRef.current) == null ? void 0 : _a.el) == null ? void 0 : _b.scrollTo(0, 0);
      }
      setOffset(0);
    };
    t13 = [search];
    $[31] = search;
    $[32] = t12;
    $[33] = t13;
  } else {
    t12 = $[32];
    t13 = $[33];
  }
  reactExports.useEffect(t12, t13);
  let t14;
  if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
    t14 = () => {
      setOffset(_temp2);
    };
    $[34] = t14;
  } else {
    t14 = $[34];
  }
  const handleLoadMore = t14;
  let t15;
  if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
    t15 = () => {
      setIsUserModalOpen(false);
    };
    $[35] = t15;
  } else {
    t15 = $[35];
  }
  const closeModal = t15;
  let t16;
  if ($[36] !== handleAddRoles || $[37] !== rolesInfoCommon || $[38] !== selectedUsers) {
    t16 = () => {
      if (rolesInfoCommon) {
        const rolesIds = [rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id];
        handleAddRoles(selectedUsers, rolesIds);
        closeModal();
      }
    };
    $[36] = handleAddRoles;
    $[37] = rolesInfoCommon;
    $[38] = selectedUsers;
    $[39] = t16;
  } else {
    t16 = $[39];
  }
  const addRoles = t16;
  let t17;
  if ($[40] !== openDeleteRole || $[41] !== (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id)) {
    t17 = (userId_0) => {
      if (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id) {
        openDeleteRole(userId_0, rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id);
      }
    };
    $[40] = openDeleteRole;
    $[41] = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Id;
    $[42] = t17;
  } else {
    t17 = $[42];
  }
  const handleDelete = t17;
  let t18;
  if ($[43] !== usersList.length) {
    t18 = (usersList == null ? void 0 : usersList.length) < 5 ? {
      overflow: "none"
    } : {};
    $[43] = usersList.length;
    $[44] = t18;
  } else {
    t18 = $[44];
  }
  const removeInfiniteScrollOverflow = t18;
  let t19;
  if ($[45] !== classes.divider) {
    t19 = /* @__PURE__ */ jsxRuntimeExports.jsx(Divider, { className: classes.divider });
    $[45] = classes.divider;
    $[46] = t19;
  } else {
    t19 = $[46];
  }
  const t20 = classes.header;
  let t21;
  if ($[47] === Symbol.for("react.memo_cache_sentinel")) {
    t21 = /* @__PURE__ */ jsxRuntimeExports.jsx(UsersIcon, { stroke: themeColors.brandGray[0] });
    $[47] = t21;
  } else {
    t21 = $[47];
  }
  const t22 = classes.title;
  let t23;
  if ($[48] !== t) {
    t23 = t("filials.diskSpace.table.users");
    $[48] = t;
    $[49] = t23;
  } else {
    t23 = $[49];
  }
  const t24 = data == null ? void 0 : data.TotalCount;
  let t25;
  if ($[50] !== classes.title || $[51] !== t23 || $[52] !== t24) {
    t25 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Flex, { gap: "xs", align: "center", children: [
      t21,
      /* @__PURE__ */ jsxRuntimeExports.jsxs(Text, { className: t22, children: [
        t23,
        ": ",
        t24
      ] })
    ] });
    $[50] = classes.title;
    $[51] = t23;
    $[52] = t24;
    $[53] = t25;
  } else {
    t25 = $[53];
  }
  let t26;
  if ($[54] !== showPlusIcon) {
    t26 = showPlusIcon() && /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { size: "md", onClick: () => setIsUserModalOpen(true), children: /* @__PURE__ */ jsxRuntimeExports.jsx(PlusIcon, {}) });
    $[54] = showPlusIcon;
    $[55] = t26;
  } else {
    t26 = $[55];
  }
  let t27;
  if ($[56] !== classes.header || $[57] !== t25 || $[58] !== t26) {
    t27 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: t20, children: [
      t25,
      t26
    ] });
    $[56] = classes.header;
    $[57] = t25;
    $[58] = t26;
    $[59] = t27;
  } else {
    t27 = $[59];
  }
  let t28;
  if ($[60] !== classes.search || $[61] !== search || $[62] !== t || $[63] !== totalCount) {
    t28 = totalCount !== 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(Search, { setSearch, className: classes.search, fullSize: true, value: search, placeholder: t("search") }) : null;
    $[60] = classes.search;
    $[61] = search;
    $[62] = t;
    $[63] = totalCount;
    $[64] = t28;
  } else {
    t28 = $[64];
  }
  const t29 = usersList == null ? void 0 : usersList.length;
  const t30 = data && data.TotalCount !== void 0 ? data.TotalCount > (usersList == null ? void 0 : usersList.length) : false;
  let t31;
  if ($[65] !== classes.infiniteScrollMoreData || $[66] !== usersList.length) {
    t31 = Boolean(usersList == null ? void 0 : usersList.length) && /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.infiniteScrollMoreData, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Loader, { size: "sm" }) });
    $[65] = classes.infiniteScrollMoreData;
    $[66] = usersList.length;
    $[67] = t31;
  } else {
    t31 = $[67];
  }
  let t32;
  if ($[68] !== t31) {
    t32 = /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: t31 });
    $[68] = t31;
    $[69] = t32;
  } else {
    t32 = $[69];
  }
  let t33;
  if ($[70] !== removeInfiniteScrollOverflow) {
    t33 = {
      ...removeInfiniteScrollOverflow
    };
    $[70] = removeInfiniteScrollOverflow;
    $[71] = t33;
  } else {
    t33 = $[71];
  }
  let t34;
  if ($[72] !== classes.loader || $[73] !== isFetching || $[74] !== isLoading) {
    t34 = (isLoading || isFetching) && /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.loader, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Loader, { size: "sm" }) });
    $[72] = classes.loader;
    $[73] = isFetching;
    $[74] = isLoading;
    $[75] = t34;
  } else {
    t34 = $[75];
  }
  let t35;
  if ($[76] !== handleDelete || $[77] !== isLoading || $[78] !== (rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) || $[79] !== showDeleteItemIcon || $[80] !== showPlusIcon || $[81] !== usersList) {
    t35 = (usersList == null ? void 0 : usersList.length) > 0 && !isLoading && (usersList == null ? void 0 : usersList.map((item) => /* @__PURE__ */ jsxRuntimeExports.jsx(UserItem, { item, userId: item.Id, handleClick: () => handleDelete(item.Id), roleType: rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type, showDeleteItemIcon: showDeleteItemIcon(item.Id), showUserHover: showPlusIcon }, item.Id)));
    $[76] = handleDelete;
    $[77] = isLoading;
    $[78] = rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type;
    $[79] = showDeleteItemIcon;
    $[80] = showPlusIcon;
    $[81] = usersList;
    $[82] = t35;
  } else {
    t35 = $[82];
  }
  let t36;
  if ($[83] !== classes.badge || $[84] !== showAddUsersBadge || $[85] !== t) {
    t36 = showAddUsersBadge && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { className: classes.badge, variant: "outline", color: "gray", onClick: () => setIsUserModalOpen(true), rightSection: /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { size: 16, variant: "transparent", children: /* @__PURE__ */ jsxRuntimeExports.jsx(PlusIcon, {}) }), children: t("roles.addUsers") });
    $[83] = classes.badge;
    $[84] = showAddUsersBadge;
    $[85] = t;
    $[86] = t36;
  } else {
    t36 = $[86];
  }
  let t37;
  if ($[87] !== classes.emptyListText || $[88] !== isFetching || $[89] !== isLoading || $[90] !== search || $[91] !== t || $[92] !== usersList.length) {
    t37 = !usersList.length && !isLoading && !isFetching && search && /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { className: classes.emptyListText, children: t("userNotFound") });
    $[87] = classes.emptyListText;
    $[88] = isFetching;
    $[89] = isLoading;
    $[90] = search;
    $[91] = t;
    $[92] = usersList.length;
    $[93] = t37;
  } else {
    t37 = $[93];
  }
  let t38;
  if ($[94] !== classes.infiniteScroll || $[95] !== containerHeight || $[96] !== t29 || $[97] !== t30 || $[98] !== t32 || $[99] !== t33 || $[100] !== t34 || $[101] !== t35 || $[102] !== t36 || $[103] !== t37) {
    t38 = /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: divRef, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(InfiniteScroll, { ref: scrollRef, dataLength: t29, next: handleLoadMore, hasMore: t30, loader: t32, className: classes.infiniteScroll, height: containerHeight, style: t33, children: [
      t34,
      t35,
      t36,
      t37
    ] }) });
    $[94] = classes.infiniteScroll;
    $[95] = containerHeight;
    $[96] = t29;
    $[97] = t30;
    $[98] = t32;
    $[99] = t33;
    $[100] = t34;
    $[101] = t35;
    $[102] = t36;
    $[103] = t37;
    $[104] = t38;
  } else {
    t38 = $[104];
  }
  let t39;
  if ($[105] !== t) {
    t39 = t("filials.modules.addUser");
    $[105] = t;
    $[106] = t39;
  } else {
    t39 = $[106];
  }
  const t40 = selectedUsers[0];
  let t41;
  if ($[107] !== t) {
    t41 = t("add");
    $[107] = t;
    $[108] = t41;
  } else {
    t41 = $[108];
  }
  const t42 = `${t41} ${selectedUsers.length > 0 ? selectedUsers.length : ""}`;
  let t43;
  if ($[109] !== addRoles || $[110] !== t42) {
    t43 = {
      btnName: t42,
      fn: addRoles
    };
    $[109] = addRoles;
    $[110] = t42;
    $[111] = t43;
  } else {
    t43 = $[111];
  }
  let t44;
  if ($[112] !== t) {
    t44 = t("cancel");
    $[112] = t;
    $[113] = t44;
  } else {
    t44 = $[113];
  }
  let t45;
  if ($[114] !== t44) {
    t45 = {
      btnName: t44,
      fn: closeModal
    };
    $[114] = t44;
    $[115] = t45;
  } else {
    t45 = $[115];
  }
  let t46;
  if ($[116] !== t43 || $[117] !== t45) {
    t46 = {
      confirmProps: t43,
      cancelProps: t45
    };
    $[116] = t43;
    $[117] = t45;
    $[118] = t46;
  } else {
    t46 = $[118];
  }
  let t47;
  if ($[119] !== isUserModalOpen || $[120] !== selectedUsers[0] || $[121] !== t39 || $[122] !== t46 || $[123] !== usersList) {
    t47 = /* @__PURE__ */ jsxRuntimeExports.jsx(SelectUserModal, { multipleUsers: true, isOpened: isUserModalOpen, title: t39, onClose: closeModal, userId: t40, setSelectedUsers, usersList, controlSection: true, controlSectionProps: t46 });
    $[119] = isUserModalOpen;
    $[120] = selectedUsers[0];
    $[121] = t39;
    $[122] = t46;
    $[123] = usersList;
    $[124] = t47;
  } else {
    t47 = $[124];
  }
  let t48;
  if ($[125] !== t19 || $[126] !== t27 || $[127] !== t28 || $[128] !== t38 || $[129] !== t47) {
    t48 = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
      t19,
      t27,
      t28,
      t38,
      t47
    ] });
    $[125] = t19;
    $[126] = t27;
    $[127] = t28;
    $[128] = t38;
    $[129] = t47;
    $[130] = t48;
  } else {
    t48 = $[130];
  }
  return t48;
};
function _temp$1(state) {
  var _a;
  return (_a = state == null ? void 0 : state.userInfo) == null ? void 0 : _a.User;
}
function _temp2(prevState) {
  return prevState + 20;
}
const HomePanel = () => {
  const $ = compilerRuntimeExports.c(7);
  const {
    rolesInfoCommon
  } = reactExports.useContext(RolesInfoMainContext);
  let t0;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t0 = /* @__PURE__ */ jsxRuntimeExports.jsx(DrawerHeader, {});
    $[0] = t0;
  } else {
    t0 = $[0];
  }
  let t1;
  if ($[1] !== rolesInfoCommon) {
    t1 = /* @__PURE__ */ jsxRuntimeExports.jsx(PhotoInfo, { rolesInfoCommon });
    $[1] = rolesInfoCommon;
    $[2] = t1;
  } else {
    t1 = $[2];
  }
  let t2;
  let t3;
  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = /* @__PURE__ */ jsxRuntimeExports.jsx(BaseInfo, {});
    t3 = /* @__PURE__ */ jsxRuntimeExports.jsx(UserRoles, {});
    $[3] = t2;
    $[4] = t3;
  } else {
    t2 = $[3];
    t3 = $[4];
  }
  let t4;
  if ($[5] !== t1) {
    t4 = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
      t0,
      t1,
      t2,
      t3
    ] });
    $[5] = t1;
    $[6] = t4;
  } else {
    t4 = $[6];
  }
  return t4;
};
const EditRolesItem = ({
  editedItem
}) => {
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
  const {
    t
  } = useTranslation();
  const {
    classes
  } = useStyles$6();
  const {
    rolesInfoCommon
  } = reactExports.useContext(RolesInfoMainContext);
  const {
    setSelectedRolesId,
    setSelectedPanel
  } = useActions();
  const navigate = useNavigate();
  const [isUserModalOpen, setIsUserModalOpen] = reactExports.useState(false);
  const [isRoleModalOpen, setIsRoleModalOpen] = reactExports.useState(false);
  const [isAllowedRoleModalOpen, setIsAllowedRoleModalOpen] = reactExports.useState(false);
  const [selectedAllowedRoles, setSelectedAllowedRoles] = reactExports.useState({});
  const [selectedUser, setSelectedUser] = reactExports.useState(
    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
    //@ts-ignore
    ((_a = editedItem == null ? void 0 : editedItem.Owner) == null ? void 0 : _a.Name) && {
      Name: (_b = editedItem == null ? void 0 : editedItem.Owner) == null ? void 0 : _b.Name
    } || null
  );
  const [selectedRoles, setSelectedRoles] = reactExports.useState(((_c = editedItem == null ? void 0 : editedItem.Parent) == null ? void 0 : _c.Name) && {
    Name: (_d = editedItem == null ? void 0 : editedItem.Parent) == null ? void 0 : _d.Name
  } || null);
  const closeModals = () => {
    setIsUserModalOpen(false);
    setIsRoleModalOpen(false);
    setIsAllowedRoleModalOpen(false);
  };
  const handleCloseAllowedRoleModal = () => {
    setIsAllowedRoleModalOpen(false);
  };
  const goBack = reactExports.useCallback(() => {
    setSelectedPanel(PanelsEnum.generalInformation);
  }, []);
  const isMain = (editedItem == null ? void 0 : editedItem.ParentName) == null && (editedItem == null ? void 0 : editedItem.Id) == 1;
  const isLdapRole = (editedItem == null ? void 0 : editedItem.Origin) === OrderType.Ldap;
  const form = useForm({
    initialValues: {
      Id: (editedItem == null ? void 0 : editedItem.Id) || null,
      Customer: {
        Id: ((_e = editedItem == null ? void 0 : editedItem.Customer) == null ? void 0 : _e.Id) || null,
        Name: ((_f = editedItem == null ? void 0 : editedItem.Customer) == null ? void 0 : _f.Name) || null
      },
      Type: 1,
      Name: editedItem == null ? void 0 : editedItem.Name,
      Parent: {
        Id: ((_g = editedItem == null ? void 0 : editedItem.Parent) == null ? void 0 : _g.Id) || null
      },
      Owner: {
        Id: ((_h = editedItem == null ? void 0 : editedItem.Owner) == null ? void 0 : _h.Id) || null,
        Name: ((_i = editedItem == null ? void 0 : editedItem.Owner) == null ? void 0 : _i.Name) || null
      },
      Quota: {
        Id: ((_j = editedItem == null ? void 0 : editedItem.Quota) == null ? void 0 : _j.Id) || null,
        Name: ((_k = editedItem == null ? void 0 : editedItem.Quota) == null ? void 0 : _k.Name) || ""
      },
      AllowedRoles: (editedItem == null ? void 0 : editedItem.AllowedRoles) || []
    },
    validateInputOnChange: true,
    validate: (values) => getValidateErrors(validateCreateRolesSchema(t), values)
  });
  const isDisabled = !form.isValid() || !form.isDirty();
  const [editRoles] = useEditRolesMutation();
  const handleSubmit = async (values_0) => {
    var _a2, _b2;
    const formatted = transformObjectIfKeyIsNull(JSON.parse(JSON.stringify(values_0)));
    try {
      const {
        Parent,
        ...IsMineData
      } = values_0;
      const res = await editRoles(!isMain ? formatted : IsMineData);
      if (!Object.keys(res).includes("error")) {
        handleClose();
        universalNotification({
          error: null,
          isError: false,
          isSuccess: true,
          successTitle: t("roles.successEdit")
        });
      } else {
        const codeError = (_b2 = (_a2 = res == null ? void 0 : res.error) == null ? void 0 : _a2.data) == null ? void 0 : _b2.Code;
        showNotification({
          title: generateErrorMessage(codeError),
          message: "",
          autoClose: true,
          color: "red"
        });
      }
    } catch (err) {
      console.warn("Edit role ERROR", err);
    }
  };
  const setGroupId = async (id) => {
    form.setFieldValue("Parent.Id", id);
    closeModals();
  };
  const setGroup = async (group) => {
    setSelectedRoles({
      Name: group == null ? void 0 : group.label
    });
  };
  const handleAddAllowedRoles = (roles) => {
    const combined = [...form.values.AllowedRoles, ...roles];
    const uniqueById = Array.from(new Map(combined.map((role) => [role.Id, role])).values());
    form.setFieldValue("AllowedRoles", uniqueById);
    setIsAllowedRoleModalOpen(false);
  };
  const handleClose = reactExports.useCallback(() => {
    setSelectedPanel(PanelsEnum.generalInformation);
    setSelectedRolesId(0);
    form.reset();
    navigate(ROUTES.roles.path);
  }, []);
  const handleBack = () => {
    goBack();
    form.reset();
  };
  const handleRemoveRoles = () => {
    setSelectedRoles(null);
    form.setFieldValue("Parent.Id", null);
  };
  const handleRemoveUser = () => {
    setSelectedUser(null);
    form.setFieldValue("Owner.Id", null);
    form.setFieldValue("Owner.Name", null);
  };
  const handleRemoveAllowedRole = (item) => {
    const updated = form.values.AllowedRoles.filter((i) => i.Id !== item.Id);
    form.setFieldValue("AllowedRoles", updated);
  };
  const handleConfirmSelectUserModal = async () => {
    if (!selectedUser) {
      return;
    }
    form.setFieldValue("Owner.Id", selectedUser == null ? void 0 : selectedUser.Id);
    form.setFieldValue("Owner.Name", selectedUser == null ? void 0 : selectedUser.Name);
    closeModals();
  };
  const handleCloseSelectUserModal = () => {
    setIsUserModalOpen(false);
  };
  return /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: form.onSubmit(handleSubmit), children: [
    canEditRole(rolesInfoCommon == null ? void 0 : rolesInfoCommon.Type) && rolesInfoCommon ? /* @__PURE__ */ jsxRuntimeExports.jsxs(SimpleGrid, { cols: 1, w: "100%", mt: 24, children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(TextInput, { placeholder: "Admin", label: t("roles.name"), withAsterisk: true, "data-value": "Name", disabled: isLdapRole, ...form.getInputProps("Name") }),
      !isMain && /* @__PURE__ */ jsxRuntimeExports.jsx(SelectWithPagination, { form, fieldName: "Customer.Id", label: t("roles.addFilial"), placeholder: t("choose"), defaultValue: form.getInputProps("Customer.Id").value || null, value: form.getInputProps("Customer.Id").value, isRoleComponent: true, filialName: form.getInputProps("Customer.Name").value, customerField: "Customer.Name", disabled: isLdapRole }),
      /* @__PURE__ */ jsxRuntimeExports.jsxs(SimpleGrid, { cols: 1, spacing: "xs", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { size: "sm", fw: "500", children: t("roles.whoCanShareAccess") }),
        /* @__PURE__ */ jsxRuntimeExports.jsx(AddButton, { onClick: () => setIsAllowedRoleModalOpen(true), children: t("roles.addAllowedRoles") }),
        /* @__PURE__ */ jsxRuntimeExports.jsx(Flex, { gap: "xs", wrap: "wrap", children: form.values.AllowedRoles && ((_l = form.values.AllowedRoles) == null ? void 0 : _l.map((item_0) => /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Badges, { label: item_0.Name, onRemove: () => handleRemoveAllowedRole(item_0) }) }, item_0.Id))) })
      ] }),
      /* @__PURE__ */ jsxRuntimeExports.jsxs(SimpleGrid, { cols: 1, spacing: "xs", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx(AddButton, { onClick: () => setIsRoleModalOpen(true), children: t("roles.addParentRole") }),
        selectedRoles && /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Badges, { label: selectedRoles == null ? void 0 : selectedRoles.Name, onRemove: handleRemoveRoles }) })
      ] }),
      /* @__PURE__ */ jsxRuntimeExports.jsxs(SimpleGrid, { cols: 1, spacing: "xs", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx(AddButton, { onClick: () => setIsUserModalOpen(true), children: t("roles.addRoleManager") }),
        form.values.Owner.Name && /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Badges, { label: form.values.Owner.Name, onRemove: handleRemoveUser }) })
      ] })
    ] }) : null,
    /* @__PURE__ */ jsxRuntimeExports.jsx(SimpleGrid, { cols: 1, w: "100%", mt: 24, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
      SelectQuotas,
      {
        form,
        fieldName: "Quota.Id",
        quotaField: "Quota.Name",
        value: form.values.Quota.Id,
        QuotaName: form.values.Quota.Name,
        Customer: form.values.Customer.Id
      }
    ) }),
    /* @__PURE__ */ jsxRuntimeExports.jsxs(SimpleGrid, { cols: {
      base: 1,
      sm: 2
    }, mt: "md", children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "submit", disabled: isDisabled, children: t("save") }),
      /* @__PURE__ */ jsxRuntimeExports.jsx(UnstyledButton, { onClick: handleBack, className: classes.cancelBtn, children: t("cancel") })
    ] }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(SelectGroupSimpleModal, { onClose: closeModals, isOpened: isRoleModalOpen, title: t("roles.addParentRole"), setGroupId, setGroup, SkipIds: (editedItem == null ? void 0 : editedItem.Id) ? [editedItem == null ? void 0 : editedItem.Id] : [] }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(SelectGroupModal, { isOpened: isAllowedRoleModalOpen, title: t("profile.addRole"), onClose: handleCloseAllowedRoleModal, setSelectedGroup: setSelectedAllowedRoles, selectedGroup: selectedAllowedRoles, setGroups: handleAddAllowedRoles, groups: form.values.AllowedRoles }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(SelectUserModal, { multipleUsers: false, isOpened: isUserModalOpen, title: t("roles.addRoleManager"), onClose: closeModals, setSelectedUsers: setSelectedUser, userId: selectedUser == null ? void 0 : selectedUser.Id, controlSection: true, controlSectionProps: {
      confirmProps: {
        btnName: t("add"),
        fn: handleConfirmSelectUserModal
      },
      cancelProps: {
        btnName: t("cancel"),
        fn: handleCloseSelectUserModal
      }
    } })
  ] });
};
const MoreInfoPanel = () => {
  const $ = compilerRuntimeExports.c(9);
  const {
    t
  } = useTranslation();
  const {
    rolesInfoCommon
  } = reactExports.useContext(RolesInfoMainContext);
  let t0;
  if ($[0] !== t) {
    t0 = t("roles.edit");
    $[0] = t;
    $[1] = t0;
  } else {
    t0 = $[1];
  }
  let t1;
  if ($[2] !== t0) {
    t1 = /* @__PURE__ */ jsxRuntimeExports.jsx(HeaderPanel, { title: t0, activePanel: PanelsEnum.generalInformation });
    $[2] = t0;
    $[3] = t1;
  } else {
    t1 = $[3];
  }
  let t2;
  if ($[4] !== rolesInfoCommon) {
    t2 = /* @__PURE__ */ jsxRuntimeExports.jsx(EditRolesItem, { editedItem: rolesInfoCommon });
    $[4] = rolesInfoCommon;
    $[5] = t2;
  } else {
    t2 = $[5];
  }
  let t3;
  if ($[6] !== t1 || $[7] !== t2) {
    t3 = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
      t1,
      t2
    ] });
    $[6] = t1;
    $[7] = t2;
    $[8] = t3;
  } else {
    t3 = $[8];
  }
  return t3;
};
const RolesInfoMainContext = reactExports.createContext({});
const Panels = (t0) => {
  const $ = compilerRuntimeExports.c(14);
  const {
    selectedRolesId,
    setRowData,
    handleClose
  } = t0;
  const {
    data,
    isLoading,
    isError
  } = useGetRolesInfoCommonQuery(selectedRolesId);
  const {
    t
  } = useTranslation();
  const {
    selectedPanel
  } = useAppSelector(_temp);
  const t1 = data;
  let t2;
  if ($[0] !== selectedRolesId || $[1] !== setRowData || $[2] !== t1) {
    t2 = {
      selectedRolesId,
      setRowData,
      rolesInfoCommon: t1
    };
    $[0] = selectedRolesId;
    $[1] = setRowData;
    $[2] = t1;
    $[3] = t2;
  } else {
    t2 = $[3];
  }
  const initialValues = t2;
  let t3;
  if ($[4] !== handleClose || $[5] !== isError || $[6] !== t) {
    t3 = () => {
      if (isError) {
        notifications.show({
          title: t("requestsErrors.error"),
          message: t("roles.roleNotFound"),
          color: "red"
        });
        handleClose();
      }
    };
    $[4] = handleClose;
    $[5] = isError;
    $[6] = t;
    $[7] = t3;
  } else {
    t3 = $[7];
  }
  let t4;
  if ($[8] !== isError) {
    t4 = [isError];
    $[8] = isError;
    $[9] = t4;
  } else {
    t4 = $[9];
  }
  reactExports.useEffect(t3, t4);
  let t5;
  if ($[10] !== initialValues || $[11] !== isLoading || $[12] !== selectedPanel) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(Flex, { justify: "center", align: "center", h: "100vh", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Loader, {}) }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(RolesInfoMainContext.Provider, { value: initialValues, children: [
      selectedPanel === PanelsEnum.generalInformation && /* @__PURE__ */ jsxRuntimeExports.jsx(HomePanel, {}),
      selectedPanel === PanelsEnum.editInformation && /* @__PURE__ */ jsxRuntimeExports.jsx(MoreInfoPanel, {})
    ] }) });
    $[10] = initialValues;
    $[11] = isLoading;
    $[12] = selectedPanel;
    $[13] = t5;
  } else {
    t5 = $[13];
  }
  return t5;
};
function _temp(state) {
  return state.roles;
}
export {
  Action as A,
  Panels as P,
  useStyles$6 as u,
  validateCreateRolesSchema as v
};
//# sourceMappingURL=index-C2HWmCvh.js.map
