import { jsx as a, jsxs as s, Fragment as E } from "react/jsx-runtime";
import { Button as P, debounce as W, Card as _, Typography as F, TextField as I, TableContainer as M } from "@mui/material";
import { Grid as r } from "@mui/system";
import { useTranslateProvider as Q } from "@/common/languageTranslator/TranslationContext";
import { getNotifications as R, getRoleList as G } from "@/common/services/GlobalApis.js";
import { useState as l, useCallback as H, useEffect as U, Suspense as Y, lazy as Z } from "react";
import $ from "@/hooks/useTrackEvent";
import q from "@/views/custom-components/CustomizedTable/CustomizedTableV2";
import { useSelector as J } from "react-redux";
import { getUseSkeleton as K } from "@/store/reducers/SkeletonReducer";
const O = () => J(K) ? /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 mt-6 w-full", children: [
  /* @__PURE__ */ s("div", { className: "flex space-between justify-between m-[0px]", children: [
    /* @__PURE__ */ a("div", { className: "bg-gray-300 animate-pulse rounded-sm w-[130px] h-[40px]" }),
    /* @__PURE__ */ s("div", { className: "flex", children: [
      /* @__PURE__ */ a("div", { className: "bg-gray-300 animate-pulse rounded-sm w-[150px] h-[40px] mx-[5px]" }),
      /* @__PURE__ */ a("div", { className: "bg-gray-300 animate-pulse rounded-sm w-[100px] h-[40px]" })
    ] })
  ] }),
  /* @__PURE__ */ a("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-100" })
] }) : null, V = Z(() => import("./AddRoleDrawer-ZK1eejxI-BM6rfhh5.js"));
function ce() {
  const [y, w] = l(""), [m, v] = l({}), [N, C] = l([]), [c, T] = l({}), { translate: p } = Q(), u = $(), [B, f] = l([]), [g, d] = l(!1), [h, x] = l(!1), S = [
    { field: "notificationName", label: "Name", align: "left" },
    { field: "roles", label: "Action By", align: "left" },
    {
      field: "Actions",
      label: "Actions",
      align: "left"
    }
  ], k = (t) => {
    x(!0), C(t);
  }, z = [
    {
      label: "",
      icon: /* @__PURE__ */ a(
        P,
        {
          size: "small",
          variant: "contained",
          className: "text-[10px]",
          "data-testid": "widgetlist-button-assign",
          children: p("Assign")
        }
      ),
      onClick: k
    }
  ], A = H(
    W((t) => {
      const i = m.filter(
        (o) => {
          var e;
          return (e = o.notificationName) == null ? void 0 : e.toLowerCase().includes(t);
        }
      );
      u("search_tracking", {
        searchTerm: t,
        results_count: i.length,
        search_type: "Page Search"
      }), f(i);
    }, 500),
    [m, u]
  ), L = (t) => {
    const i = t.target.value.toLowerCase();
    w(i), A(i);
  }, b = async () => {
    try {
      d((e) => !e);
      let t = c;
      const { data: i } = await R();
      if (!c.length) {
        const { data: e } = await G();
        t = e, T(e);
      }
      const o = i.map((e) => {
        const j = e == null ? void 0 : e.roles.map((n) => t.find((D) => D.id === n)).filter((n) => n !== void 0).map((n) => n.name);
        return {
          ...e,
          roles: j
        };
      });
      v(
        o.filter((e) => e.notificationType === "WEB")
      ), f(
        o.filter((e) => e.notificationType === "WEB")
      ), d((e) => !e);
    } catch (t) {
      console.error(t), d((i) => !i);
    }
  };
  return U(() => {
    b();
  }, []), /* @__PURE__ */ a(
    _,
    {
      variant: "elevation",
      container: !0,
      className: "mt-6 p-3 flex flex-col space-y-3 shadow-xl",
      children: /* @__PURE__ */ s(r, { container: !0, "data-testid": "widgetlist-container", children: [
        /* @__PURE__ */ a(Y, { children: h && /* @__PURE__ */ a(
          V,
          {
            open: h,
            handleClose: async (t) => {
              x(!1), t && b();
            },
            data: N,
            roleData: c
          }
        ) }),
        g ? /* @__PURE__ */ a(O, {}) : /* @__PURE__ */ s(E, { children: [
          /* @__PURE__ */ s(
            r,
            {
              container: !0,
              size: { xs: 12 },
              className: "flex justify-between items-center",
              children: [
                /* @__PURE__ */ a(r, { children: /* @__PURE__ */ a(
                  F,
                  {
                    variant: "body2",
                    className: "font-bold font-sans text-lg text-customBlue uppercase",
                    "data-testid": "notification-list-typography-title",
                    children: p("Widget Management")
                  }
                ) }),
                /* @__PURE__ */ a(
                  I,
                  {
                    name: "searchQuery",
                    id: "searchQuery",
                    placeholder: "Search Text",
                    size: "small",
                    onChange: L,
                    value: y,
                    "data-testid": "widgetlist-textfield-search",
                    slotProps: {
                      input: {
                        className: "custom-input-root"
                      }
                    },
                    sx: {
                      "& .MuiInputBase-root": {
                        backgroundColor: (t) => t.palette.background.paper
                      }
                    }
                  }
                )
              ]
            }
          ),
          /* @__PURE__ */ a(
            r,
            {
              size: { xs: 12 },
              mt: 2,
              "data-testid": "widgetlist-table-container",
              children: /* @__PURE__ */ a(
                M,
                {
                  component: "paper",
                  sx: { borderRadius: "12px" },
                  "data-testid": "widgetlist-table-paper",
                  children: /* @__PURE__ */ a(
                    q,
                    {
                      columns: S,
                      actions: z,
                      tableData: B,
                      paginationConfig: { pagination: !1 },
                      dataTestId: "widgetlist-table-customized",
                      isLoading: g,
                      styleConfig: { tableStyle: { maxHeight: 55 } }
                    }
                  )
                }
              )
            }
          )
        ] })
      ] })
    }
  );
}
export {
  ce as default
};
//# sourceMappingURL=WidgetList-BSApErov-Z61Kpq4T.js.map
