import { E as compilerRuntimeExports, r as reactExports, j as jsxRuntimeExports, T as useNavigate, a0 as useParams, V as Outlet } from "./vendor-react-DYNCg6N5.js";
import { H as HEADER_HEIGHT, b as useActions, c as useAppSelector, y as SearchIcon, J as useGetDefaultRolesFiltersQuery, I as IFiltersEnumType, h as filtersLabelsKeys, K as IUsersSortField, M as RolesPlaceholder, N as getFilterAttributeByKey, O as themeColors, Q as useGetFilterListItemsQuery, T as useGetRolesQuery, V as PanelsEnum, E as ErrorBoundary, L as Layout } from "./index-DfebxkL9.js";
import { c as createStyles, n as useDisclosure, W as useMediaQuery, B as Button, T as Text, b as Box, A as Avatar, F as Flex, k as Tooltip, M as Menu, O as Badge, U as UnstyledButton, h as ActionIcon, X as Drawer } from "./vendor-mantine-h0WlM2Mj.js";
import { X as XMe, b as gq, W as Ws } from "./vendor-icons-xWhXK_Ui.js";
import { u as useStyles$6, A as Action, P as Panels } from "./index-C2HWmCvh.js";
import { R as RolesCreateForm } from "./form-BjvLuBG-.js";
import { M as Modal } from "./index-DqcA8P_y.js";
import { u as useTranslation } from "./vendor-i18n-wisIXUFi.js";
import { S as Search } from "./index-CcqTjOWY.js";
import { u as useDebounce } from "./useDebounce-DTubzIUC.js";
import { S as SimpleTable } from "./index-DOqL4InQ.js";
import { g as getNameByRolesId, t as transformConditionals, c as convertToFilterConditions } from "./index-Ds4Bnwmy.js";
import { O as OverflowTip } from "./index-C-CFogWu.js";
import { a as formatDateTime } from "./date-bOIw2uwV.js";
import { E as EllipsisTooltip } from "./index-D4BAIihc.js";
import { S as SearchFilter } from "./index-C6QQOvbB.js";
import { F as FilterSkeleton } from "./index-DppR1vQX.js";
import "./index-CfN7Ll0p.js";
import "./errorIcon-PZO0f1IY.js";
import "./index.es-BTZFX8B-.js";
import "./index-BWhdniX1.js";
import "./index-DFEP7Sv_.js";
import "./index-3c9En-DB.js";
import "./index-C_Fw_IUU.js";
import "./index-woYEqWvh.js";
import "./index-72JBTuLT.js";
import "./styles-3NoIlzov.js";
import "./validation-Ds00Zghx.js";
import "./types-espwwxTQ.js";
import "./index-BoQKW1g7.js";
import "./format-CMT-x-V3.js";
import "./index-CslanKI5.js";
import "./styles-BC5VOxAU.js";
import "./index-Zaude47i.js";
import "./useCopyToClipboard-C-S2RacD.js";
const useStyles$5 = createStyles((theme) => ({
  container: {
    height: `calc(100vh - ${HEADER_HEIGHT}px)`,
    width: "100%",
    display: "flex",
    alignItems: "center",
    justifyContent: "flex-start",
    flexDirection: "column",
    backgroundColor: theme.colors.backgroundGray[0]
  },
  list: {
    width: "calc(100vw - 264px)"
  },
  listItem: {
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    flexDirection: "column"
  },
  Wrapper: {
    backgroundColor: theme.colors.backgroundGray[0],
    padding: "0 24px 0 24px",
    width: "100%",
    display: "flex",
    justifyContent: "space-between",
    alignItems: "center",
    margin: "24px 0 20px 0"
  },
  TableWrapper: {
    padding: "0 24px 0 24px",
    width: "100%"
  },
  search: {
    marginRight: "27px",
    "& input": {
      backgroundColor: theme.colors.backgroundGray[6],
      paddingLeft: "56px",
      height: "45px",
      fontSize: "16px"
    },
    "& .mantine-Input-section": {
      marginLeft: "15px"
    }
  },
  avatar: {
    cursor: "pointer"
  },
  error: {
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    flexDirection: "column"
  }
}));
const CreateRoles = () => {
  const $ = compilerRuntimeExports.c(25);
  const [opened, t0] = useDisclosure(false);
  const {
    open,
    close
  } = t0;
  const {
    classes
  } = useStyles$6();
  const {
    t
  } = useTranslation();
  const isMobile = useMediaQuery("(max-width: 1200px)");
  let t1;
  if ($[0] !== close) {
    t1 = () => () => {
      close();
    };
    $[0] = close;
    $[1] = t1;
  } else {
    t1 = $[1];
  }
  let t2;
  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = [];
    $[2] = t2;
  } else {
    t2 = $[2];
  }
  reactExports.useEffect(t1, t2);
  let t3;
  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
    t3 = /* @__PURE__ */ jsxRuntimeExports.jsx(XMe, {});
    $[3] = t3;
  } else {
    t3 = $[3];
  }
  let t4;
  if ($[4] !== isMobile || $[5] !== t) {
    t4 = isMobile ? "" : t("create");
    $[4] = isMobile;
    $[5] = t;
    $[6] = t4;
  } else {
    t4 = $[6];
  }
  let t5;
  if ($[7] !== t4) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { fw: "600", children: t4 });
    $[7] = t4;
    $[8] = t5;
  } else {
    t5 = $[8];
  }
  let t6;
  if ($[9] !== classes.createButton || $[10] !== open || $[11] !== t5) {
    t6 = /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { "data-cy": "createRole", size: "md", leftSection: t3, className: classes.createButton, onClick: open, children: t5 });
    $[9] = classes.createButton;
    $[10] = open;
    $[11] = t5;
    $[12] = t6;
  } else {
    t6 = $[12];
  }
  let t7;
  if ($[13] !== t) {
    t7 = t("roles.create");
    $[13] = t;
    $[14] = t7;
  } else {
    t7 = $[14];
  }
  let t8;
  if ($[15] !== close) {
    t8 = /* @__PURE__ */ jsxRuntimeExports.jsx(RolesCreateForm, { close });
    $[15] = close;
    $[16] = t8;
  } else {
    t8 = $[16];
  }
  let t9;
  if ($[17] !== close || $[18] !== opened || $[19] !== t7 || $[20] !== t8) {
    t9 = /* @__PURE__ */ jsxRuntimeExports.jsx(Modal, { opened, onClose: close, title: t7, zIndex: 1002, children: t8 });
    $[17] = close;
    $[18] = opened;
    $[19] = t7;
    $[20] = t8;
    $[21] = t9;
  } else {
    t9 = $[21];
  }
  let t10;
  if ($[22] !== t6 || $[23] !== t9) {
    t10 = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
      t6,
      t9
    ] });
    $[22] = t6;
    $[23] = t9;
    $[24] = t10;
  } else {
    t10 = $[24];
  }
  return t10;
};
const RolesSearch = () => {
  const $ = compilerRuntimeExports.c(13);
  const {
    classes
  } = useStyles$5();
  const {
    setRolesTableFilters
  } = useActions();
  const {
    filters: rolesFilters
  } = useAppSelector(_temp$2);
  const [text, setText] = reactExports.useState(rolesFilters.Query || "");
  const debounced = useDebounce(text, 500);
  const {
    t
  } = useTranslation();
  let t0;
  if ($[0] !== debounced || $[1] !== rolesFilters || $[2] !== setRolesTableFilters) {
    t0 = () => {
      setRolesTableFilters({
        ...rolesFilters,
        Query: debounced,
        Offset: 0
      });
    };
    $[0] = debounced;
    $[1] = rolesFilters;
    $[2] = setRolesTableFilters;
    $[3] = t0;
  } else {
    t0 = $[3];
  }
  let t1;
  if ($[4] !== debounced) {
    t1 = [debounced];
    $[4] = debounced;
    $[5] = t1;
  } else {
    t1 = $[5];
  }
  reactExports.useEffect(t0, t1);
  let t2;
  if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = /* @__PURE__ */ jsxRuntimeExports.jsx(SearchIcon, {});
    $[6] = t2;
  } else {
    t2 = $[6];
  }
  const t3 = classes.search;
  let t4;
  if ($[7] !== t) {
    t4 = t("searchRolesByName");
    $[7] = t;
    $[8] = t4;
  } else {
    t4 = $[8];
  }
  let t5;
  if ($[9] !== classes.search || $[10] !== t4 || $[11] !== text) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(Search, { "data-cy": "rolesSearch", icon: t2, setSearch: setText, className: t3, fullSize: true, value: text, placeholder: t4 });
    $[9] = classes.search;
    $[10] = t4;
    $[11] = text;
    $[12] = t5;
  } else {
    t5 = $[12];
  }
  return t5;
};
function _temp$2(state) {
  return state.roles;
}
const transformFilters = (data, t) => {
  return data.map((item) => {
    var _a;
    return {
      ...item,
      label: item.Type in IFiltersEnumType ? t(`filters.${filtersLabelsKeys[item.Type]}`) : t("filters.title"),
      Items: (_a = item.Items) == null ? void 0 : _a.map((filterItem) => ({
        ...filterItem,
        checked: false
      })),
      hideSearch: item.Type === IFiltersEnumType.RoleTypeFilter ? true : false
    };
  });
};
const useGetRolesFilters = () => {
  const $ = compilerRuntimeExports.c(7);
  const {
    t
  } = useTranslation();
  const {
    data: defaultFiltersData,
    isSuccess: defaultFiltersSuccess,
    isFetching
  } = useGetDefaultRolesFiltersQuery(20);
  let t0;
  if ($[0] !== defaultFiltersData || $[1] !== defaultFiltersSuccess || $[2] !== t) {
    t0 = defaultFiltersSuccess ? transformFilters(defaultFiltersData || [], t) : [];
    $[0] = defaultFiltersData;
    $[1] = defaultFiltersSuccess;
    $[2] = t;
    $[3] = t0;
  } else {
    t0 = $[3];
  }
  const filtersMenuList = t0;
  let t1;
  if ($[4] !== filtersMenuList || $[5] !== isFetching) {
    t1 = {
      filtersMenuList,
      isFetching
    };
    $[4] = filtersMenuList;
    $[5] = isFetching;
    $[6] = t1;
  } else {
    t1 = $[6];
  }
  return t1;
};
const Type = (t0) => {
  const $ = compilerRuntimeExports.c(7);
  const {
    item
  } = t0;
  const {
    t
  } = useTranslation();
  const t1 = item == null ? void 0 : item.Type;
  let t2;
  if ($[0] !== t1) {
    t2 = getNameByRolesId(t1);
    $[0] = t1;
    $[1] = t2;
  } else {
    t2 = $[1];
  }
  const {
    name
  } = t2;
  let t3;
  if ($[2] !== name || $[3] !== t) {
    t3 = name.length ? t(`roles.types.${name}`) : "";
    $[2] = name;
    $[3] = t;
    $[4] = t3;
  } else {
    t3 = $[4];
  }
  let t4;
  if ($[5] !== t3) {
    t4 = /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { children: t3 });
    $[5] = t3;
    $[6] = t4;
  } else {
    t4 = $[6];
  }
  return t4;
};
const useStyles$4 = createStyles((theme) => ({
  title: {
    height: "100%",
    width: "100%",
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    flexDirection: "row",
    margin: 0,
    padding: 0
  },
  content: {
    height: "100%",
    width: "100%",
    display: "flex",
    alignItems: "flex-start",
    justifyContent: "center",
    flexDirection: "column",
    marginLeft: theme.spacing.sm
  },
  ldapLabel: {
    bottom: -10,
    right: -10,
    position: "absolute",
    backgroundColor: "rgba(51, 154, 240, 1)",
    color: "#EFF8FF",
    padding: "3px 4px",
    borderRadius: "16px",
    fontWeight: "500",
    fontSize: "10px",
    lineHeight: "100%",
    letterSpacing: "0%",
    flexShrink: 0
  }
}));
const ItemTitle = (t0) => {
  const $ = compilerRuntimeExports.c(20);
  const {
    item
  } = t0;
  const {
    classes
  } = useStyles$4();
  const isLdapUser = (item == null ? void 0 : item.Origin) === IUsersSortField.LDAP;
  let t1;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = {
      zIndex: 1
    };
    $[0] = t1;
  } else {
    t1 = $[0];
  }
  let t2;
  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = /* @__PURE__ */ jsxRuntimeExports.jsx(Avatar, { sx: t1, color: "blue", size: 40, radius: 40, children: /* @__PURE__ */ jsxRuntimeExports.jsx(RolesPlaceholder, { size: 24 }) });
    $[1] = t2;
  } else {
    t2 = $[1];
  }
  let t3;
  if ($[2] !== classes.ldapLabel || $[3] !== isLdapUser) {
    t3 = isLdapUser && /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.ldapLabel, children: "LDAP" });
    $[2] = classes.ldapLabel;
    $[3] = isLdapUser;
    $[4] = t3;
  } else {
    t3 = $[4];
  }
  let t4;
  if ($[5] !== t3) {
    t4 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Flex, { pos: "relative", children: [
      t2,
      t3
    ] });
    $[5] = t3;
    $[6] = t4;
  } else {
    t4 = $[6];
  }
  let t5;
  if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
    t5 = {
      maxWidth: "80%"
    };
    $[7] = t5;
  } else {
    t5 = $[7];
  }
  const t6 = item == null ? void 0 : item.Name;
  let t7;
  if ($[8] !== t6) {
    t7 = /* @__PURE__ */ jsxRuntimeExports.jsx(OverflowTip, { sx: t5, size: "sm", fw: 600, color: "#101828", children: t6 });
    $[8] = t6;
    $[9] = t7;
  } else {
    t7 = $[9];
  }
  const t8 = item == null ? void 0 : item.Id;
  let t9;
  if ($[10] !== t8) {
    t9 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Text, { color: "dimmed", size: "xs", children: [
      "ID: ",
      t8
    ] });
    $[10] = t8;
    $[11] = t9;
  } else {
    t9 = $[11];
  }
  let t10;
  if ($[12] !== classes.content || $[13] !== t7 || $[14] !== t9) {
    t10 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.content, children: [
      t7,
      t9
    ] });
    $[12] = classes.content;
    $[13] = t7;
    $[14] = t9;
    $[15] = t10;
  } else {
    t10 = $[15];
  }
  let t11;
  if ($[16] !== classes.title || $[17] !== t10 || $[18] !== t4) {
    t11 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.title, children: [
      t4,
      t10
    ] });
    $[16] = classes.title;
    $[17] = t10;
    $[18] = t4;
    $[19] = t11;
  } else {
    t11 = $[19];
  }
  return t11;
};
const useStyles$3 = createStyles((theme) => ({
  cellContent: {
    display: "flex",
    flexDirection: "column",
    gap: "2px",
    cursor: "pointer",
    minWidth: 0
  },
  emailText: {
    fontSize: "14px",
    fontWeight: 400,
    lineHeight: "20px",
    color: theme.colors.dark[9],
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap"
  },
  serverText: {
    fontSize: "12px",
    fontWeight: 400,
    lineHeight: "16px",
    color: theme.colors.gray[6],
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap"
  },
  moreIndicator: {
    fontSize: "12px",
    fontWeight: 500,
    lineHeight: "16px",
    color: theme.colors.blue[6],
    marginTop: "2px"
  },
  tooltip: {
    backgroundColor: theme.colors.dark[9],
    padding: "12px",
    maxWidth: "320px",
    borderRadius: "8px"
  },
  tooltipContent: {
    display: "flex",
    flexDirection: "column",
    gap: "12px"
  },
  serverBlock: {
    display: "flex",
    flexDirection: "column",
    gap: "4px"
  },
  serverName: {
    fontSize: "12px",
    fontWeight: 500,
    lineHeight: "16px",
    color: theme.white,
    marginBottom: "4px"
  },
  emailItem: {
    fontSize: "12px",
    fontWeight: 400,
    lineHeight: "16px",
    color: theme.colors.gray[4],
    paddingLeft: "8px"
  }
}));
const MailboxesCell = (t0) => {
  var _a, _b;
  const $ = compilerRuntimeExports.c(32);
  const {
    item
  } = t0;
  const {
    classes
  } = useStyles$3();
  const postClientEmails = item == null ? void 0 : item.PostClientEmails;
  if (!postClientEmails || postClientEmails.length === 0) {
    let t12;
    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
      t12 = /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { c: "dimmed", children: "—" });
      $[0] = t12;
    } else {
      t12 = $[0];
    }
    return t12;
  }
  const firstServer = postClientEmails[0];
  const firstEmail = (_a = firstServer == null ? void 0 : firstServer.Emails) == null ? void 0 : _a[0];
  const hasMoreData = postClientEmails.length > 1 || (((_b = firstServer == null ? void 0 : firstServer.Emails) == null ? void 0 : _b.length) || 0) > 1;
  let t1;
  if ($[1] !== classes.emailItem || $[2] !== classes.serverBlock || $[3] !== classes.serverName || $[4] !== classes.tooltipContent || $[5] !== postClientEmails) {
    t1 = () => /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.tooltipContent, children: postClientEmails.map((serverData, serverIndex) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.serverBlock, children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { className: classes.serverName, children: serverData.Server }),
      serverData.Emails.map((email, emailIndex) => /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { className: classes.emailItem, children: email }, emailIndex))
    ] }, serverIndex)) });
    $[1] = classes.emailItem;
    $[2] = classes.serverBlock;
    $[3] = classes.serverName;
    $[4] = classes.tooltipContent;
    $[5] = postClientEmails;
    $[6] = t1;
  } else {
    t1 = $[6];
  }
  const renderTooltipContent = t1;
  if (!firstEmail) {
    let t22;
    if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
      t22 = /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { c: "dimmed", children: "—" });
      $[7] = t22;
    } else {
      t22 = $[7];
    }
    return t22;
  }
  let t2;
  if ($[8] !== renderTooltipContent) {
    t2 = renderTooltipContent();
    $[8] = renderTooltipContent;
    $[9] = t2;
  } else {
    t2 = $[9];
  }
  const t3 = !hasMoreData;
  let t4;
  if ($[10] !== classes.tooltip) {
    t4 = {
      tooltip: classes.tooltip
    };
    $[10] = classes.tooltip;
    $[11] = t4;
  } else {
    t4 = $[11];
  }
  let t5;
  if ($[12] !== classes.emailText || $[13] !== firstEmail) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { className: classes.emailText, lineClamp: 1, children: firstEmail });
    $[12] = classes.emailText;
    $[13] = firstEmail;
    $[14] = t5;
  } else {
    t5 = $[14];
  }
  let t6;
  if ($[15] !== classes.serverText || $[16] !== firstServer.Server) {
    t6 = /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { className: classes.serverText, lineClamp: 1, children: firstServer.Server });
    $[15] = classes.serverText;
    $[16] = firstServer.Server;
    $[17] = t6;
  } else {
    t6 = $[17];
  }
  let t7;
  if ($[18] !== classes.moreIndicator || $[19] !== hasMoreData || $[20] !== postClientEmails) {
    t7 = hasMoreData && /* @__PURE__ */ jsxRuntimeExports.jsxs(Text, { className: classes.moreIndicator, children: [
      "+",
      postClientEmails.reduce(_temp$1, 0) - 1
    ] });
    $[18] = classes.moreIndicator;
    $[19] = hasMoreData;
    $[20] = postClientEmails;
    $[21] = t7;
  } else {
    t7 = $[21];
  }
  let t8;
  if ($[22] !== classes.cellContent || $[23] !== t5 || $[24] !== t6 || $[25] !== t7) {
    t8 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.cellContent, children: [
      t5,
      t6,
      t7
    ] });
    $[22] = classes.cellContent;
    $[23] = t5;
    $[24] = t6;
    $[25] = t7;
    $[26] = t8;
  } else {
    t8 = $[26];
  }
  let t9;
  if ($[27] !== t2 || $[28] !== t3 || $[29] !== t4 || $[30] !== t8) {
    t9 = /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, { label: t2, position: "bottom-start", withArrow: true, disabled: t3, classNames: t4, children: t8 });
    $[27] = t2;
    $[28] = t3;
    $[29] = t4;
    $[30] = t8;
    $[31] = t9;
  } else {
    t9 = $[31];
  }
  return t9;
};
function _temp$1(total, server) {
  return total + server.Emails.length;
}
const useGetColumns = () => {
  const $ = compilerRuntimeExports.c(44);
  const {
    t
  } = useTranslation();
  let t0;
  if ($[0] !== t) {
    t0 = t("servers.name");
    $[0] = t;
    $[1] = t0;
  } else {
    t0 = $[1];
  }
  let t1;
  if ($[2] !== t0) {
    t1 = {
      width: "200px",
      dataIndex: "Id",
      title: t0,
      hideColumn: false,
      render: _temp
    };
    $[2] = t0;
    $[3] = t1;
  } else {
    t1 = $[3];
  }
  let t2;
  if ($[4] !== t) {
    t2 = t("roles.roleType");
    $[4] = t;
    $[5] = t2;
  } else {
    t2 = $[5];
  }
  let t3;
  if ($[6] !== t2) {
    t3 = {
      width: "100px",
      dataIndex: "Type",
      title: t2,
      hideColumn: false,
      render: _temp2
    };
    $[6] = t2;
    $[7] = t3;
  } else {
    t3 = $[7];
  }
  let t4;
  if ($[8] !== t) {
    t4 = t("owner");
    $[8] = t;
    $[9] = t4;
  } else {
    t4 = $[9];
  }
  let t5;
  if ($[10] !== t4) {
    t5 = {
      width: "146px",
      dataIndex: "owner",
      title: t4,
      hideColumn: false,
      render: _temp3
    };
    $[10] = t4;
    $[11] = t5;
  } else {
    t5 = $[11];
  }
  let t6;
  if ($[12] !== t) {
    t6 = t("participants");
    $[12] = t;
    $[13] = t6;
  } else {
    t6 = $[13];
  }
  let t7;
  if ($[14] !== t6) {
    t7 = {
      width: "116px",
      dataIndex: "Counter",
      title: t6,
      hideColumn: false,
      render: _temp4
    };
    $[14] = t6;
    $[15] = t7;
  } else {
    t7 = $[15];
  }
  let t8;
  if ($[16] !== t) {
    t8 = t("unit");
    $[16] = t;
    $[17] = t8;
  } else {
    t8 = $[17];
  }
  let t9;
  if ($[18] !== t8) {
    t9 = {
      width: "116px",
      dataIndex: "filial",
      title: t8,
      hideColumn: false,
      render: _temp5
    };
    $[18] = t8;
    $[19] = t9;
  } else {
    t9 = $[19];
  }
  let t10;
  if ($[20] !== t) {
    t10 = t("roles.parentalRole");
    $[20] = t;
    $[21] = t10;
  } else {
    t10 = $[21];
  }
  let t11;
  if ($[22] !== t10) {
    t11 = {
      width: "146px",
      dataIndex: "parentRole",
      title: t10,
      hideColumn: false,
      render: _temp6
    };
    $[22] = t10;
    $[23] = t11;
  } else {
    t11 = $[23];
  }
  let t12;
  if ($[24] !== t) {
    t12 = t("roles.mailboxes");
    $[24] = t;
    $[25] = t12;
  } else {
    t12 = $[25];
  }
  let t13;
  if ($[26] !== t12) {
    t13 = {
      width: "200px",
      dataIndex: "PostClientEmails",
      title: t12,
      hideColumn: false,
      render: _temp7
    };
    $[26] = t12;
    $[27] = t13;
  } else {
    t13 = $[27];
  }
  let t14;
  if ($[28] !== t) {
    t14 = t("dateOfCreation");
    $[28] = t;
    $[29] = t14;
  } else {
    t14 = $[29];
  }
  let t15;
  if ($[30] !== t14) {
    t15 = {
      width: "126px",
      dataIndex: "dateOfCreation",
      title: t14,
      hideColumn: false,
      render: _temp8
    };
    $[30] = t14;
    $[31] = t15;
  } else {
    t15 = $[31];
  }
  let t16;
  if ($[32] === Symbol.for("react.memo_cache_sentinel")) {
    t16 = {
      width: "80px",
      dataIndex: "Action",
      title: "",
      hideColumn: false,
      render: _temp9
    };
    $[32] = t16;
  } else {
    t16 = $[32];
  }
  let t17;
  if ($[33] !== t1 || $[34] !== t11 || $[35] !== t13 || $[36] !== t15 || $[37] !== t3 || $[38] !== t5 || $[39] !== t7 || $[40] !== t9) {
    t17 = [t1, t3, t5, t7, t9, t11, t13, t15, t16];
    $[33] = t1;
    $[34] = t11;
    $[35] = t13;
    $[36] = t15;
    $[37] = t3;
    $[38] = t5;
    $[39] = t7;
    $[40] = t9;
    $[41] = t17;
  } else {
    t17 = $[41];
  }
  const columnsData = t17;
  const [columns, setColumns] = reactExports.useState(columnsData);
  let t18;
  if ($[42] !== columns) {
    t18 = {
      columns,
      setColumns
    };
    $[42] = columns;
    $[43] = t18;
  } else {
    t18 = $[43];
  }
  return t18;
};
function _temp(item) {
  return /* @__PURE__ */ jsxRuntimeExports.jsx(ItemTitle, { item });
}
function _temp2(item_0) {
  return /* @__PURE__ */ jsxRuntimeExports.jsx(Type, { item: item_0 });
}
function _temp3(item_1) {
  var _a;
  return /* @__PURE__ */ jsxRuntimeExports.jsx(EllipsisTooltip, { width: 140, children: (_a = item_1 == null ? void 0 : item_1.Owner) == null ? void 0 : _a.Name });
}
function _temp4(item_2) {
  return item_2 == null ? void 0 : item_2.Counter;
}
function _temp5(item_3) {
  var _a;
  return /* @__PURE__ */ jsxRuntimeExports.jsx(EllipsisTooltip, { width: 200, children: (_a = item_3 == null ? void 0 : item_3.Customer) == null ? void 0 : _a.Name });
}
function _temp6(item_4) {
  var _a;
  return /* @__PURE__ */ jsxRuntimeExports.jsx(EllipsisTooltip, { width: 140, children: (_a = item_4 == null ? void 0 : item_4.Parent) == null ? void 0 : _a.Name });
}
function _temp7(item_5) {
  return /* @__PURE__ */ jsxRuntimeExports.jsx(MailboxesCell, { item: item_5 });
}
function _temp8(item_6) {
  return formatDateTime(item_6 == null ? void 0 : item_6.CreateOfDate);
}
function _temp9(item_7) {
  return /* @__PURE__ */ jsxRuntimeExports.jsx(Action, { item: item_7 });
}
const useStyles$2 = createStyles((theme) => ({
  filtersListWrapper: {
    padding: `${theme.spacing.sm} ${theme.spacing.md} ${theme.spacing.sm} ${theme.spacing.sm}`,
    display: "flex",
    justifyContent: "flex-start",
    backgroundColor: "white",
    gap: 20
  },
  filterHeader: {
    display: "flex",
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
    backgroundColor: "#F2F4F7",
    padding: "4px, 20px, 4px, 20px",
    height: "32px",
    gap: 0,
    borderRadius: "54px",
    fontWeight: 400,
    color: "var(--mantine-colors-black)"
  },
  menuButton: {
    display: "flex",
    alignItems: "center",
    justifyContent: "center"
  },
  badgeContainer: {
    flexDirection: "row",
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    marginLeft: "12px"
  },
  scroll: {
    overflow: "scroll",
    height: "100%",
    width: "100%",
    position: "absolute",
    top: "0",
    left: "0",
    visibility: "hidden"
  },
  checkbox: {
    display: "flex",
    marginRight: theme.spacing.md,
    "& input": {
      cursor: "pointer"
    }
  },
  badge: {
    textTransform: "none",
    fontSize: "12px",
    fontWeight: 400,
    lineHeight: "18px",
    marginRight: theme.spacing.xs,
    borderRadius: "16px",
    padding: `0px 6px`
  },
  leftSection: {
    display: "flex",
    alignItems: "flex-start"
  },
  rightSection: {
    display: "flex",
    alignItems: "flex-end"
  },
  menu: {
    height: "180px",
    marginBottom: "10px"
  },
  dropdownContainer: {
    padding: theme.spacing.sm
  }
}));
const FilterList = (t0) => {
  const $ = compilerRuntimeExports.c(18);
  const {
    activeFilters,
    handleFilterReset,
    filtersMenuList,
    handleFilterChange
  } = t0;
  const {
    classes
  } = useStyles$2();
  let t1;
  if ($[0] !== filtersMenuList) {
    t1 = [...filtersMenuList.slice(0, 4)];
    $[0] = filtersMenuList;
    $[1] = t1;
  } else {
    t1 = $[1];
  }
  const slicedFilters = t1;
  if (!filtersMenuList) {
    return null;
  }
  let t2;
  if ($[2] !== handleFilterReset) {
    t2 = (e, type) => {
      e.stopPropagation();
      handleFilterReset(type);
    };
    $[2] = handleFilterReset;
    $[3] = t2;
  } else {
    t2 = $[3];
  }
  const onFilterResetClick = t2;
  const t3 = classes.filtersListWrapper;
  let t4;
  if ($[4] !== activeFilters || $[5] !== classes.badge || $[6] !== classes.badgeContainer || $[7] !== classes.dropdownContainer || $[8] !== classes.filterHeader || $[9] !== classes.menuButton || $[10] !== handleFilterChange || $[11] !== handleFilterReset || $[12] !== onFilterResetClick || $[13] !== slicedFilters) {
    t4 = slicedFilters.map((filterMenu, index) => {
      const activeIds = activeFilters[filterMenu == null ? void 0 : filterMenu.Type];
      return /* @__PURE__ */ jsxRuntimeExports.jsxs(Menu, { width: "auto", zIndex: 400, position: "bottom-start", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx(Menu.Target, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "transparent", color: "gray", className: classes.filterHeader, rightSection: (activeIds == null ? void 0 : activeIds.length) ? /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.badgeContainer, children: [
          /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { className: classes.badge, variant: "filled", children: activeIds == null ? void 0 : activeIds.length }),
          /* @__PURE__ */ jsxRuntimeExports.jsx(ActionIcon, { size: 24, onClick: (e_0) => onFilterResetClick(e_0, filterMenu.Type), children: /* @__PURE__ */ jsxRuntimeExports.jsx(Ws, { size: 16, color: themeColors.brandGray[0] }) })
        ] }) : null, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(UnstyledButton, { className: classes.menuButton, "data-cy": getFilterAttributeByKey(filterMenu.Type), children: [
          (filterMenu == null ? void 0 : filterMenu.label) || "Статус",
          " ",
          /* @__PURE__ */ jsxRuntimeExports.jsx(gq, { size: 18 })
        ] }) }) }),
        /* @__PURE__ */ jsxRuntimeExports.jsx(Menu.Dropdown, { className: classes.dropdownContainer, children: /* @__PURE__ */ jsxRuntimeExports.jsx(SearchFilter, { handleFilterReset, activeIds, filterType: filterMenu == null ? void 0 : filterMenu.Type, label: filterMenu == null ? void 0 : filterMenu.label, list: filterMenu == null ? void 0 : filterMenu.Items, hideCollapse: true, handleFilterChange, handleLoadData: useGetFilterListItemsQuery, hideSearch: filterMenu == null ? void 0 : filterMenu.hideSearch }) })
      ] }, (filterMenu == null ? void 0 : filterMenu.label) + index);
    });
    $[4] = activeFilters;
    $[5] = classes.badge;
    $[6] = classes.badgeContainer;
    $[7] = classes.dropdownContainer;
    $[8] = classes.filterHeader;
    $[9] = classes.menuButton;
    $[10] = handleFilterChange;
    $[11] = handleFilterReset;
    $[12] = onFilterResetClick;
    $[13] = slicedFilters;
    $[14] = t4;
  } else {
    t4 = $[14];
  }
  let t5;
  if ($[15] !== classes.filtersListWrapper || $[16] !== t4) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: t3, children: t4 });
    $[15] = classes.filtersListWrapper;
    $[16] = t4;
    $[17] = t5;
  } else {
    t5 = $[17];
  }
  return t5;
};
const useStyles$1 = createStyles((theme, _, utils) => ({
  table: {
    width: "100%"
  },
  header: {
    position: "sticky",
    top: 0,
    [utils.dark]: {
      backgroundColor: theme.colors.dark[7]
    },
    [utils.light]: {
      backgroundColor: theme.white
    },
    transition: "box-shadow 150ms ease",
    zIndex: 300
  },
  scrolled: {
    boxShadow: theme.shadows.sm
  },
  tr: {
    padding: "0 !important",
    position: "relative",
    backgroundColor: "white"
  },
  infiniteScroll: {
    "&::-webkit-scrollbar": {
      width: "8px",
      height: "10px"
    },
    "&::-webkit-scrollbar-thumb": {
      borderRadius: "8px",
      background: "#98A2B3"
    },
    "&::-webkit-scrollbar-track": {
      background: "#F9FAFB"
    },
    scrollbarColor: "#98A2B3 #F9FAFB"
  },
  infiniteScrollMoreData: {
    width: "100%",
    height: "50px",
    display: "flex",
    alignItems: "center",
    justifyContent: "center"
  },
  error: {
    height: "100vh",
    width: "100%",
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    flexDirection: "column",
    backgroundColor: theme.colors.backgroundGray[0],
    "& p": {
      display: "flex",
      alignItems: "center",
      justifyContent: "center",
      margin: "0px 10px"
    }
  },
  listWrapper: {
    display: "flex",
    justifyContent: "space-between",
    // width: '100%',
    overflowX: "auto",
    msOverflowStyle: "none",
    scrollbarWidth: "none",
    backgroundColor: "white"
  }
}));
const RolesTable = () => {
  const {
    setRoles,
    setRolesTableFilters
  } = useActions();
  const {
    filtersMenuList,
    isFetching: isFetchingFilter
  } = useGetRolesFilters();
  const {
    items,
    total,
    filters: rolesFilter,
    selected: selectedRoles
  } = useAppSelector((state) => state.roles);
  const navigate = useNavigate();
  const scrollRef = reactExports.useRef(null);
  const {
    classes
  } = useStyles$1();
  const [rowData, setRowData] = reactExports.useState(items);
  const [activeFilters, setActiveFilters] = reactExports.useState((rolesFilter == null ? void 0 : rolesFilter.FilterConditions) ? transformConditionals(rolesFilter == null ? void 0 : rolesFilter.FilterConditions) : {});
  const [rolesFilters, setRolesFilters] = reactExports.useState(filtersMenuList);
  reactExports.useEffect(() => {
    if (filtersMenuList.length) {
      setRolesFilters(filtersMenuList);
    }
  }, [filtersMenuList]);
  const {
    data,
    error,
    isLoading,
    isFetching
  } = useGetRolesQuery({
    Count: 20,
    Offset: rolesFilter.Offset,
    SortOrder: rolesFilter.SortOrder,
    SortField: rolesFilter.SortField,
    Filters: {},
    Query: rolesFilter.Query,
    FilterConditions: rolesFilter.FilterConditions
  });
  const {
    columns
  } = useGetColumns();
  const handleLoadMore = () => {
    setRolesTableFilters({
      ...rolesFilter,
      Offset: rolesFilter.Offset + 20
    });
  };
  const handleFilterChange = reactExports.useCallback(({
    Type: Type2,
    value
  }) => {
    const updatedData = {
      ...activeFilters
    };
    if (Array.isArray(value)) {
      updatedData[Type2] = value;
    } else {
      if (typeof value === "number") {
        const array = updatedData[Type2] || [];
        updatedData[Type2] = array.includes(value) ? array.filter((val) => val !== value) : [...array, value];
      }
    }
    setRolesTableFilters({
      ...rolesFilter,
      FilterConditions: convertToFilterConditions(updatedData),
      Offset: 0
    });
    scrollRef.current.el.scrollTo(0, 0);
    setActiveFilters(updatedData);
  }, [rolesFilter]);
  const resetActiveFilterByType = (type) => {
    setActiveFilters((prevNumbers) => {
      const updatedNumbers = {
        ...prevNumbers
      };
      delete updatedNumbers[type];
      setRolesTableFilters({
        ...rolesFilter,
        FilterConditions: convertToFilterConditions(updatedNumbers),
        Offset: 0
      });
      return updatedNumbers;
    });
  };
  const resetAllActiveFilters = () => {
    setActiveFilters({});
    setRolesTableFilters({
      ...rolesFilter,
      FilterConditions: [],
      Offset: 0,
      Query: ""
    });
  };
  reactExports.useEffect(() => {
    if (data) {
      const filialsData = rolesFilter.Offset > 0 ? [...items, ...data.Items] : data.Items;
      setRoles({
        ...data,
        Items: filialsData
      });
    }
  }, [data]);
  reactExports.useEffect(() => {
    setRowData(items || []);
  }, [items]);
  reactExports.useEffect(() => {
    return () => {
      resetAllActiveFilters();
    };
  }, []);
  const handleRowClick = reactExports.useCallback((id) => {
    navigate(`/roles/${id}`);
  }, []);
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.listWrapper, children: isFetchingFilter ? /* @__PURE__ */ jsxRuntimeExports.jsx(FilterSkeleton, { count: 2, p: "sm" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(FilterList, { handleFilterReset: resetActiveFilterByType, handleResetFilters: resetAllActiveFilters, activeFilters, handleFilterChange, filtersMenuList: rolesFilters }) }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(SimpleTable, { dataCy: "rolesTable", allDataLength: total, rowData, setRowData, columns, height: "calc(100vh - 265px)", minWidth: 700, width: "calc(100vw - 48px)", selection: selectedRoles, handleRowClick, getNextData: handleLoadMore, error, scrollRef, isLoading, isFetching })
  ] });
};
const useStyles = createStyles((theme) => ({
  root: {
    "& .mantine-Drawer-body": {
      height: "100%",
      padding: theme.spacing.sm
      // overflow: 'auto'
    },
    "& .mantine-Paper-root": {
      width: "384px"
    }
  }
}));
const RolesInfoMain = ({
  setRowData
}) => {
  const {
    classes
  } = useStyles();
  const {
    setSelectedRolesId
  } = useActions();
  const {
    selectedRolesId
  } = useAppSelector((state) => state.roles);
  const navigate = useNavigate();
  const {
    id
  } = useParams();
  const toNumberId = reactExports.useMemo(() => Number(id), [id]);
  const [isOpened, setIsOpened] = reactExports.useState(false);
  const {
    setSelectedPanel
  } = useActions();
  reactExports.useEffect(() => {
    if (toNumberId) {
      setSelectedRolesId(Number(toNumberId));
      setIsOpened(true);
    } else {
      handleClose();
    }
  }, [toNumberId]);
  const handleClose = reactExports.useCallback(() => {
    setIsOpened(false);
    setSelectedRolesId(0);
    navigate("/roles");
    setSelectedPanel(PanelsEnum.generalInformation);
  }, []);
  return /* @__PURE__ */ jsxRuntimeExports.jsx(Drawer, { zIndex: 1100, opened: isOpened, trapFocus: false, onClose: handleClose, position: "right", withCloseButton: false, className: classes.root, lockScroll: true, children: Boolean(selectedRolesId) && /* @__PURE__ */ jsxRuntimeExports.jsx(Panels, { selectedRolesId, setRowData, handleClose }) });
};
const Roles = () => {
  const $ = compilerRuntimeExports.c(18);
  const {
    classes
  } = useStyles$5();
  let t0;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t0 = [];
    $[0] = t0;
  } else {
    t0 = $[0];
  }
  const [setRowData] = reactExports.useState(t0);
  let t1;
  let t2;
  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = /* @__PURE__ */ jsxRuntimeExports.jsx(RolesSearch, {});
    t2 = /* @__PURE__ */ jsxRuntimeExports.jsx(CreateRoles, {});
    $[1] = t1;
    $[2] = t2;
  } else {
    t1 = $[1];
    t2 = $[2];
  }
  let t3;
  if ($[3] !== classes.Wrapper) {
    t3 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.Wrapper, children: [
      t1,
      t2
    ] });
    $[3] = classes.Wrapper;
    $[4] = t3;
  } else {
    t3 = $[4];
  }
  let t4;
  if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
    t4 = /* @__PURE__ */ jsxRuntimeExports.jsx(RolesTable, {});
    $[5] = t4;
  } else {
    t4 = $[5];
  }
  let t5;
  if ($[6] !== classes.TableWrapper) {
    t5 = /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className: classes.TableWrapper, children: t4 });
    $[6] = classes.TableWrapper;
    $[7] = t5;
  } else {
    t5 = $[7];
  }
  let t6;
  if ($[8] !== classes.container || $[9] !== t3 || $[10] !== t5) {
    t6 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { className: classes.container, children: [
      t3,
      t5
    ] });
    $[8] = classes.container;
    $[9] = t3;
    $[10] = t5;
    $[11] = t6;
  } else {
    t6 = $[11];
  }
  let t7;
  if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
    t7 = /* @__PURE__ */ jsxRuntimeExports.jsx(Outlet, {});
    $[12] = t7;
  } else {
    t7 = $[12];
  }
  const t8 = setRowData;
  let t9;
  if ($[13] !== t8) {
    t9 = /* @__PURE__ */ jsxRuntimeExports.jsx(RolesInfoMain, { setRowData: t8 });
    $[13] = t8;
    $[14] = t9;
  } else {
    t9 = $[14];
  }
  let t10;
  if ($[15] !== t6 || $[16] !== t9) {
    t10 = /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorBoundary, { componentTitle: "Roles page", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Layout, { children: [
      t6,
      t7,
      t9
    ] }) });
    $[15] = t6;
    $[16] = t9;
    $[17] = t10;
  } else {
    t10 = $[17];
  }
  return t10;
};
export {
  Roles
};
//# sourceMappingURL=index-t2CI3gBu.js.map
