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