import { jsxs as s, jsx as e } from "react/jsx-runtime";
import { useState as n, useRef as D, useEffect as w, useCallback as ce, Suspense as W, lazy as Y } from "react";
import { useTranslateProvider as de } from "@/common/languageTranslator/TranslationContext";
import { api as Z } from "@/common/interceptors/AxiosInterceptor";
import { getNotifications as Q, getAllRoleList as me } from "@/common/services/GlobalApis";
import ue from "@/common/syncWithServer/SyncWithServerDialog";
import { showToast as C } from "@/common/toaster/toaster";
import fe from "@/views/custom-components/CustomConfirmationModal";
import { debounce as pe, Card as he, Typography as R, Box as T, FormControlLabel as U, Checkbox as G, TextField as ge, Button as ye } from "@mui/material";
import { Grid as I } from "@mui/system";
import x from "prop-types";
import { useSelector as q } from "react-redux";
import { getUseSkeleton as J } from "@/store/reducers/SkeletonReducer";
import be from "@/hooks/useTrackEvent";
import xe from "@/views/custom-components/CustomizedTable/CustomizedTableV2";
import { faPen as ve, faBars as Ne } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon as H } from "@fortawesome/react-fontawesome";
const we = ({ id: o, state: r }) => Z.put(
  `notificationtype/${o}?is_active=${r === "INACTIVE" ? "true" : "false"}`
), Re = (o) => Z.post("notificationtype", o), K = ({ children: o, isLoading: r }) => !q(J) || !r ? o : /* @__PURE__ */ s("div", { className: "flex flex-col gap-2", children: [
  /* @__PURE__ */ s("div", { className: "flex space-between justify-between m-[0px]", children: [
    /* @__PURE__ */ e("div", { className: "bg-gray-300 animate-pulse rounded-sm w-[130px] h-[40px]" }),
    /* @__PURE__ */ s("div", { className: "flex", children: [
      /* @__PURE__ */ e("div", { className: "bg-gray-300 animate-pulse rounded-sm w-[150px] h-[40px] mx-[5px]" }),
      /* @__PURE__ */ e("div", { className: "bg-gray-300 animate-pulse rounded-sm w-[100px] h-[40px]" })
    ] })
  ] }),
  /* @__PURE__ */ e("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-100" })
] });
K.propTypes = {
  children: x.any,
  isLoading: x.any
};
const Ce = ({ children: o, isLoading: r }) => !q(J) || !r ? o : /* @__PURE__ */ s("div", { className: "flex flex-col w-full md:w-[650px] bg-white ", children: [
  /* @__PURE__ */ e("div", { className: "px-2 py-2 flex  items-center  ", children: /* @__PURE__ */ e("div", { className: "bg-gray-300 animate-pulse rounded-sm w-60 h-10" }) }),
  /* @__PURE__ */ e("hr", {}),
  /* @__PURE__ */ s("div", { className: "flex flex-col w-full space-y-2 p-2", children: [
    /* @__PURE__ */ s("div", { className: "flex flex-col space-y-2", children: [
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-40 h-5  mr-[100px]" }),
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10 " })
    ] }),
    /* @__PURE__ */ s("div", { className: "flex flex-col space-y-2 ", children: [
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-40 h-5  mr-[100px]" }),
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10 " })
    ] }),
    /* @__PURE__ */ s("div", { className: "flex flex-col space-y-2 ", children: [
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-40 h-5  mr-[100px]" }),
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10 " })
    ] }),
    /* @__PURE__ */ s("div", { className: "flex flex-col space-y-2 ", children: [
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-40 h-5  mr-[100px]" }),
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10 " })
    ] }),
    /* @__PURE__ */ s("div", { className: "flex flex-col space-y-2 ", children: [
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-40 h-5 mr-[100px]" }),
      /* @__PURE__ */ e("button", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10 " })
    ] })
  ] }),
  /* @__PURE__ */ e("hr", {}),
  /* @__PURE__ */ s("div", { className: "px-2 py-2 w-full flex space-x-3 items-center justify-end ", children: [
    /* @__PURE__ */ e("div", { className: "bg-gray-300 animate-pulse rounded-sm w-20 h-10" }),
    /* @__PURE__ */ e("div", { className: "bg-gray-300 animate-pulse rounded-sm w-20 h-10" })
  ] })
] });
Ce.propTypes = {
  children: x.any,
  isLoading: x.any
};
const Te = Y(() => import("./ManageNotification-DMN2szWy-DQvdrfwC.js")), Ie = Y(() => import("./NotificationFlywayQuery-BY8Zzml_-C7G-28dx.js"));
function Ae() {
  const o = be(), [r, A] = n(""), [v, k] = n([]), [E, p] = n([]), [h, c] = n(""), [l, b] = n({}), [N, X] = n([]), { translate: u } = de(), [S, O] = n(null), [L, f] = n(!1), ee = [
    {
      field: "notificationName",
      label: "Name",
      sortable: !0,
      sortOrder: "asc",
      align: "left"
    },
    {
      field: "code",
      label: "Code",
      sortable: !0,
      sortOrder: "asc",
      align: "left"
    },
    {
      field: "notificationType",
      label: "Type",
      align: "left",
      render: (a) => /* @__PURE__ */ e(R, { mt: 0.5, children: a.notificationType === "WEB" ? "WEB" : "MOBILE" })
    },
    {
      field: "state",
      label: "State",
      sortable: !0,
      sortOrder: "asc",
      align: "left"
    },
    { field: "Actions", label: "Actions", align: "left" }
  ], [te, ae] = n(ee), [g, ie] = n(!0), [y, se] = n(!0), _ = D(g), B = D(y);
  w(() => {
    _.current = g;
  }, [g]), w(() => {
    B.current = y;
  }, [y]);
  const le = async () => {
    try {
      f((t) => !t), await we({ id: l.id, state: l.state }), c("");
      const { data: a } = await Q();
      k(a), p(a), C({
        type: "success",
        message: `State succesfully changed from  ${(l == null ? void 0 : l.state) === "INACTIVE" ? "inactive" : "active"} to ${(l == null ? void 0 : l.state) === "INACTIVE" ? "active" : "inactive"}`
      }), f((t) => !t);
    } catch (a) {
      C({
        type: "error",
        message: `Error ${a}`
      }), f((t) => !t);
    }
  }, oe = (a) => [
    {
      label: "",
      icon: /* @__PURE__ */ e(
        H,
        {
          icon: ve,
          "data-testid": "notificationlist-button-edit"
        }
      ),
      onClick: (t) => {
        c(1), b(t);
      }
    },
    {
      label: "",
      icon: /* @__PURE__ */ e(
        H,
        {
          icon: Ne,
          "data-testid": "notificationlist-button-menu"
        }
      ),
      menuItems: [
        {
          label: u(
            a.state === "ACTIVE" ? "Mark as Inactive" : "Mark as Active"
          ),
          onClick: (t) => {
            b(t), c(2);
          }
        },
        {
          label: u("Sync With Server"),
          onClick: (t) => {
            if (!t.uuid) {
              C({
                type: "info",
                message: "No configuration found. Please open the respective feature item and save it."
              });
              return;
            }
            c(4), O(t == null ? void 0 : t.uuid), b(t);
          }
        },
        {
          label: u("Show Flyway Query"),
          onClick: (t) => {
            c(3), b(t);
          }
        }
      ]
    }
  ], M = ce(
    pe((a) => {
      const t = v.filter(
        (i) => {
          var d;
          return ((d = i.notificationName) == null ? void 0 : d.toLowerCase().includes(a)) && i.state === (_.current ? "ACTIVE" : "INACTIVE") && i.notificationType === (B.current ? "MO" : "WEB");
        }
      );
      o("search_tracking", {
        searchTerm: a,
        results_count: t.length,
        search_type: "Page Search"
      }), p(t);
    }, 500),
    [v, o]
  ), ne = (a) => {
    const t = a.target.value.toLowerCase();
    A(t), M(t);
  }, re = (a) => {
    const t = a.sortOrder === "asc" ? "desc" : "asc";
    ae(
      (d) => d.map((m) => m.field === a.field ? { ...m, sortOrder: t } : m)
    );
    const i = [...E].sort((d, m) => {
      var $, j;
      const z = ($ = d[a.field]) == null ? void 0 : $.toString().toLowerCase(), F = (j = m[a.field]) == null ? void 0 : j.toString().toLowerCase();
      return z < F ? t === "asc" ? -1 : 1 : z > F ? t === "asc" ? 1 : -1 : 0;
    });
    p(i);
  }, V = async () => {
    try {
      f((i) => !i);
      const { data: a } = await Q();
      k(a);
      const t = a.filter((i) => i.notificationType === "MO" && i.state === "ACTIVE");
      if (p(t), !N.length) {
        const { data: i } = await me();
        X(i);
      }
      f((i) => !i), A("");
    } catch (a) {
      console.error("error", a), f((t) => !t);
    }
  };
  w(() => {
    V();
  }, []);
  const P = (a, t) => {
    const i = t === "status" ? a : g, d = t === "notificationType" ? a : y;
    ie(i), se(d), r ? M(r) : p(
      v.filter(
        (m) => m.state === (i ? "ACTIVE" : "INACTIVE") && m.notificationType === (d ? "MO" : "WEB")
      )
    );
  };
  return /* @__PURE__ */ s(
    he,
    {
      variant: "elevation",
      container: !0,
      className: "mt-6 p-3 flex flex-col space-y-3 shadow-xl",
      children: [
        /* @__PURE__ */ e(W, { children: /* @__PURE__ */ e(
          Te,
          {
            open: h === 1 || h === 5,
            handleClose: () => c(""),
            data: h === 1 ? l : null,
            roleData: N,
            setNotifications: V,
            "data-testid": "notification-list-managenotification-dialog"
          }
        ) }),
        /* @__PURE__ */ e(W, { children: /* @__PURE__ */ e(
          Ie,
          {
            open: h === 3,
            handleClose: () => c(""),
            data: l,
            roleData: N
          }
        ) }),
        /* @__PURE__ */ e(
          fe,
          {
            title: "CONFIRM ACTION",
            open: h === 2,
            description: `Are you sure you want to change the state ${(l == null ? void 0 : l.state) === "INACTIVE" ? "inactive" : "active"} to ${(l == null ? void 0 : l.state) === "INACTIVE" ? "active" : "inactive"}`,
            handleClick: le,
            handleClose: () => c(""),
            dataTestId: "notification-list-customconfirmationmodal-dialog"
          }
        ),
        /* @__PURE__ */ e(
          ue,
          {
            isOpen: !!S,
            handleClose: () => O(() => null),
            featureUUID: S,
            dataTestId: "notification-list-syncwithserverdialog-dialog"
          }
        ),
        /* @__PURE__ */ s(K, { isLoading: L, children: [
          /* @__PURE__ */ s(I, { container: !0, className: "flex justify-between", children: [
            /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(
              R,
              {
                variant: "body2",
                className: "font-bold font-sans text-lg text-customBlue uppercase",
                "data-testid": "notification-list-typography-title",
                children: u("Notification Configuration")
              }
            ) }),
            /* @__PURE__ */ s(T, { className: "flex flex-col sm:flex-row sm:items-center gap-3 w-full sm:w-auto", children: [
              /* @__PURE__ */ s(T, { className: "flex items-center gap-3", children: [
                /* @__PURE__ */ e(
                  U,
                  {
                    control: /* @__PURE__ */ e(
                      G,
                      {
                        checked: g,
                        onChange: (a) => P(a.target.checked, "status"),
                        "data-testid": "notifications-checkbox-include-active"
                      }
                    ),
                    label: u("Active"),
                    slotProps: {
                      typography: {
                        className: "custom-label"
                      }
                    }
                  }
                ),
                /* @__PURE__ */ e(
                  U,
                  {
                    control: /* @__PURE__ */ e(
                      G,
                      {
                        checked: y,
                        onChange: (a) => P(a.target.checked, "notificationType"),
                        "data-testid": "notifications-checkbox-include-mobile"
                      }
                    ),
                    label: u("Mobile"),
                    slotProps: {
                      typography: {
                        className: "custom-label"
                      }
                    }
                  }
                )
              ] }),
              /* @__PURE__ */ s(T, { className: "flex items-center gap-3 w-full sm:w-auto", children: [
                /* @__PURE__ */ e(
                  ge,
                  {
                    id: "searchQuery",
                    placeholder: "Search Text",
                    size: "small",
                    onChange: ne,
                    className: "m-0 p-0 bg-white",
                    value: r,
                    "data-testid": "notification-list-textfield-search",
                    sx: {
                      "& .MuiInputBase-root": {
                        height: "2.4em",
                        width: { xs: "100%", sm: "190px" }
                      },
                      flex: { xs: 1, sm: 1 }
                    }
                  }
                ),
                /* @__PURE__ */ e(
                  ye,
                  {
                    size: "small",
                    variant: "contained",
                    onClick: () => {
                      o("button_click", {
                        button_name: "notification-list-add-button",
                        button_type: "navigate",
                        button_id: "notification-list-button-add"
                      }), c(5);
                    },
                    "data-testid": "notification-list-button-add",
                    sx: { whiteSpace: "nowrap" },
                    children: u("Add")
                  }
                )
              ] })
            ] })
          ] }),
          /* @__PURE__ */ e(I, { size: { xs: 12 }, children: /* @__PURE__ */ e(
            xe,
            {
              columns: te,
              actions: oe,
              tableData: E,
              paginationConfig: {
                pagination: !1
              },
              styleConfig: {
                tableStyle: {
                  maxHeight: 40
                }
              },
              handleSort: re,
              isLoading: L,
              dataTestId: "notification-list-customizedtable"
            }
          ) })
        ] })
      ]
    }
  );
}
const Ue = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  default: Ae
}, Symbol.toStringTag, { value: "Module" }));
export {
  Ce as M,
  Ue as N,
  Re as P
};
//# sourceMappingURL=NotificationList-BqibwMaM-D4mMbj4h.js.map
