import { jsxs as a, jsx as t } from "react/jsx-runtime";
import { useState as s, useCallback as $, useEffect as W } from "react";
import { useNavigate as q } from "react-router-dom";
import { useTranslation as Z } from "react-i18next";
import { Bell as S, Settings as z, Filter as G, CheckCheck as H, Trash2 as D, Loader2 as J, Check as K } from "lucide-react";
import { a as Q, n as d, P as X, g as _ } from "./index-CwSaRXXg.js";
import { C as ee } from "./ConfirmModal-BEfzLWOz.js";
function de() {
  const m = q(), { t: n } = Z("common"), { currentTenant: F, userTenants: P, hasMultipleTenants: N } = Q(), [u, b] = s(!0), [c, i] = s([]), [j, h] = s(!1), [I, y] = s(!1), [p, g] = s(1), [k, C] = s(1), [f, x] = s(0), [l, M] = s(void 0), [v, B] = s(void 0), w = $(async () => {
    try {
      b(!0);
      const e = await d.getAll(p, 20, l, v);
      i(e.items), C(e.totalPages), x(e.totalCount);
    } catch (e) {
      console.error("Failed to load notifications:", e);
    } finally {
      b(!1);
    }
  }, [p, l, v]);
  W(() => {
    w();
  }, [w]);
  const A = async (e) => {
    try {
      await d.markAsRead(e), i(
        (r) => r.map((o) => o.id === e ? { ...o, isRead: !0, readAt: (/* @__PURE__ */ new Date()).toISOString() } : o)
      );
    } catch (r) {
      console.error("Failed to mark as read:", r);
    }
  }, O = async () => {
    try {
      await d.markAllAsRead(), i((e) => e.map((r) => ({ ...r, isRead: !0, readAt: (/* @__PURE__ */ new Date()).toISOString() })));
    } catch (e) {
      console.error("Failed to mark all as read:", e);
    }
  }, E = async (e) => {
    try {
      await d.delete(e), i((r) => r.filter((o) => o.id !== e)), x((r) => r - 1);
    } catch (r) {
      console.error("Failed to delete notification:", r);
    }
  }, L = async () => {
    try {
      y(!0), await d.deleteAll(), i([]), x(0), C(1);
    } catch (e) {
      console.error("Failed to delete all notifications:", e);
    } finally {
      y(!1), h(!1);
    }
  }, U = (e) => {
    e.isRead || A(e.id), e.actionUrl && m(e.actionUrl);
  }, V = (e) => {
    switch (e) {
      case "TicketCreated":
        return "🎫";
      case "TicketAssigned":
        return "👤";
      case "StatusChanged":
        return "🔄";
      case "CommentAdded":
        return "💬";
      case "SlaResponseBreached":
      case "SlaResolutionBreached":
        return "⚠️";
      case "SlaWarning":
        return "⏰";
      case "TicketEscalated":
        return "📈";
      case "SatisfactionRequested":
        return "⭐";
      default:
        return "📌";
    }
  }, R = (e) => new Date(e).toLocaleString(), Y = (e) => {
    if (!N) return null;
    const r = _(e.tenantId, F?.id ?? null);
    return r === "global" ? /* @__PURE__ */ t("span", { className: "text-xs px-2 py-1 rounded bg-purple-100 dark:bg-purple-900/30 text-purple-700 dark:text-purple-300 border border-purple-200 dark:border-purple-700", children: "System" }) : r === "current" ? /* @__PURE__ */ t("span", { className: "text-xs px-2 py-1 rounded bg-[var(--bg-secondary)] text-[var(--text-secondary)] border border-[var(--border-color)]", children: e.tenantName }) : /* @__PURE__ */ t("span", { className: "text-xs px-2 py-1 rounded bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300 border border-blue-200 dark:border-blue-700 font-medium", children: e.tenantName });
  }, T = c.filter((e) => !e.isRead).length;
  return /* @__PURE__ */ a("div", { className: "space-y-6", children: [
    /* @__PURE__ */ a("div", { className: "flex items-center justify-between", children: [
      /* @__PURE__ */ a("div", { children: [
        /* @__PURE__ */ a("h1", { className: "text-2xl font-bold flex items-center gap-2", children: [
          /* @__PURE__ */ t(S, { className: "w-6 h-6" }),
          "Notifications"
        ] }),
        /* @__PURE__ */ a("p", { className: "text-[var(--text-secondary)]", children: [
          f,
          " notification",
          f !== 1 ? "s" : "",
          ", ",
          T,
          " unread"
        ] })
      ] }),
      /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ a(
        "button",
        {
          onClick: () => m("/myspace/notification-preferences"),
          className: "btn btn-secondary flex items-center gap-2",
          children: [
            /* @__PURE__ */ t(z, { className: "w-4 h-4" }),
            "Preferences"
          ]
        }
      ) })
    ] }),
    /* @__PURE__ */ a("div", { className: "flex flex-col md:flex-row gap-4 items-start md:items-center justify-between", children: [
      /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ t(G, { className: "w-4 h-4 text-[var(--text-secondary)]" }),
        /* @__PURE__ */ a(
          "select",
          {
            value: l === void 0 ? "" : l ? "read" : "unread",
            onChange: (e) => {
              const r = e.target.value;
              M(r === "" ? void 0 : r === "read"), g(1);
            },
            className: "input",
            children: [
              /* @__PURE__ */ t("option", { value: "", children: "All Notifications" }),
              /* @__PURE__ */ t("option", { value: "unread", children: "Unread Only" }),
              /* @__PURE__ */ t("option", { value: "read", children: "Read Only" })
            ]
          }
        ),
        N && /* @__PURE__ */ a(
          "select",
          {
            value: v || "",
            onChange: (e) => {
              B(e.target.value || void 0), g(1);
            },
            className: "input",
            children: [
              /* @__PURE__ */ t("option", { value: "", children: "All Workspaces" }),
              P.filter((e) => e.status === "Active").map((e) => /* @__PURE__ */ t("option", { value: e.id, children: e.name }, e.id))
            ]
          }
        )
      ] }),
      /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
        T > 0 && /* @__PURE__ */ a(
          "button",
          {
            onClick: O,
            className: "btn btn-secondary flex items-center gap-2",
            children: [
              /* @__PURE__ */ t(H, { className: "w-4 h-4" }),
              "Mark All Read"
            ]
          }
        ),
        c.length > 0 && /* @__PURE__ */ a(
          "button",
          {
            onClick: () => h(!0),
            className: "btn btn-secondary flex items-center gap-2 text-red-600",
            children: [
              /* @__PURE__ */ t(D, { className: "w-4 h-4" }),
              "Delete All"
            ]
          }
        )
      ] })
    ] }),
    u && /* @__PURE__ */ t("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ t(J, { className: "w-8 h-8 animate-spin text-[var(--color-primary-600)]" }) }),
    !u && c.length > 0 && /* @__PURE__ */ t("div", { className: "card divide-y divide-[var(--border-color)]", children: c.map((e) => /* @__PURE__ */ t(
      "button",
      {
        type: "button",
        onClick: () => U(e),
        className: `w-full text-left p-4 cursor-pointer hover:bg-[var(--bg-hover)] transition-colors ${e.isRead ? "" : "bg-blue-50/50"}`,
        children: /* @__PURE__ */ a("div", { className: "flex gap-4", children: [
          /* @__PURE__ */ t("span", { className: "text-2xl flex-shrink-0", children: V(e.type) }),
          /* @__PURE__ */ a("div", { className: "flex-1 min-w-0", children: [
            /* @__PURE__ */ a("div", { className: "flex items-start justify-between gap-4", children: [
              /* @__PURE__ */ a("div", { children: [
                /* @__PURE__ */ t("h3", { className: `${e.isRead ? "" : "font-semibold"}`, children: e.title }),
                /* @__PURE__ */ t("p", { className: "text-sm text-[var(--text-secondary)] mt-1", children: e.message })
              ] }),
              /* @__PURE__ */ a("div", { className: "text-right flex-shrink-0", children: [
                /* @__PURE__ */ t("div", { className: "text-sm text-[var(--text-secondary)]", children: R(e.createdAt) }),
                e.isRead && e.readAt && /* @__PURE__ */ a("div", { className: "text-xs text-[var(--text-secondary)] mt-1", children: [
                  "Read ",
                  R(e.readAt)
                ] })
              ] })
            ] }),
            /* @__PURE__ */ a("div", { className: "flex items-center gap-2 mt-2", children: [
              /* @__PURE__ */ t("span", { className: "text-xs px-2 py-1 bg-[var(--bg-secondary)] rounded", children: te(e.type) }),
              Y(e),
              e.relatedEntityType && /* @__PURE__ */ t("span", { className: "text-xs text-[var(--text-secondary)]", children: e.relatedEntityType })
            ] })
          ] }),
          /* @__PURE__ */ a("div", { className: "flex flex-col gap-2 flex-shrink-0", onClick: (r) => r.stopPropagation(), children: [
            !e.isRead && /* @__PURE__ */ t(
              "button",
              {
                onClick: () => A(e.id),
                className: "p-2 rounded hover:bg-[var(--bg-secondary)] transition-colors",
                title: "Mark as read",
                children: /* @__PURE__ */ t(K, { className: "w-4 h-4 text-green-600" })
              }
            ),
            /* @__PURE__ */ t(
              "button",
              {
                onClick: () => E(e.id),
                className: "p-2 rounded hover:bg-[var(--bg-secondary)] transition-colors",
                title: "Delete",
                children: /* @__PURE__ */ t(D, { className: "w-4 h-4 text-red-500" })
              }
            )
          ] })
        ] })
      },
      e.id
    )) }),
    !u && c.length === 0 && /* @__PURE__ */ a("div", { className: "card p-12 text-center", children: [
      /* @__PURE__ */ t(S, { className: "w-16 h-16 mx-auto mb-4 opacity-30" }),
      /* @__PURE__ */ t("h3", { className: "text-lg font-medium mb-2", children: "No notifications" }),
      /* @__PURE__ */ t("p", { className: "text-[var(--text-secondary)]", children: l === !1 ? "You have no unread notifications" : l === !0 ? "You have no read notifications" : "You're all caught up!" })
    ] }),
    !u && k > 1 && /* @__PURE__ */ t(
      X,
      {
        page: p,
        totalPages: k,
        totalCount: f,
        onPageChange: g
      }
    ),
    /* @__PURE__ */ t(
      ee,
      {
        isOpen: j,
        title: n("notifications.deleteAll.title"),
        message: n("notifications.deleteAll.message"),
        confirmLabel: n("notifications.deleteAll.confirm"),
        variant: "danger",
        loading: I,
        onConfirm: L,
        onCancel: () => h(!1)
      }
    )
  ] });
}
function te(m) {
  return m.replace(/([A-Z])/g, " $1").replace(/^./, (n) => n.toUpperCase()).trim();
}
export {
  de as NotificationsPage
};
//# sourceMappingURL=NotificationsPage-C29Lln5o.js.map
