@nivaro/react 0.3.41 → 0.3.43

package/dist/shared/components/notifications/NotificationCenterView.js

@@ -1,33 +1,33 @@
 import { jsxs as n, jsx as t } from "react/jsx-runtime";
-import { useQueryClient as Xe, useQuery as I, keepPreviousData as We, useMutation as y } from "@tanstack/react-query";
-import { Archive as ke, CheckCheck as Ee, Search as et, Check as ye, AlarmClock as re, ExternalLink as ve, Bell as we, ShieldCheck as de, ChevronLeft as tt, ChevronRight as at, History as nt, Trash2 as lt, ChevronDown as rt } from "lucide-react";
-import { useState as s, useEffect as Ne, Fragment as ie } from "react";
-import { useNivaroClient as dt } from "../../context.js";
-import { get as j, post as A, patch as it, del as st } from "../../lib/commands.js";
-import { resolveNotificationTargetFor as Q, runNotificationTarget as se } from "../../lib/notification-target.js";
-import { openInTabsMessage as ot, openInTabs as ct } from "../../lib/open-in-tabs.js";
+import { useQueryClient as tt, useQuery as I, keepPreviousData as at, useMutation as y } from "@tanstack/react-query";
+import { Archive as ve, CheckCheck as nt, Search as lt, Check as we, AlarmClock as de, ExternalLink as Ne, Bell as Ce, ShieldCheck as ie, ChevronLeft as rt, ChevronRight as dt, History as it, Trash2 as st, ChevronDown as ot } from "lucide-react";
+import { useState as s, useEffect as Se, Fragment as se } from "react";
+import { useNivaroClient as ct } from "../../context.js";
+import { get as j, post as A, patch as ut, del as mt } from "../../lib/commands.js";
+import { resolveNotificationTargetFor as Q, runNotificationTarget as oe } from "../../lib/notification-target.js";
+import { openInTabsMessage as pt, openInTabs as bt } from "../../lib/open-in-tabs.js";
 import { cn as m, formatRelative as G } from "../../lib/utils.js";
-import { hasSnapshotView as ut } from "../NotificationBell.js";
-import { SimpleSelect as oe } from "../ui/SimpleSelect.js";
-import { AsItWasSheet as mt } from "./AsItWasSheet.js";
-import { bundleLocally as pt, laneTone as bt, bundleAsNotification as xt, bundleHeadline as ht, categoryChipLabel as gt } from "./bundles.js";
-import { DeliveryChips as ft } from "./DeliveryChips.js";
-import { NotificationActions as kt } from "./NotificationActions.js";
-import { NotificationDetailBits as yt } from "./NotificationDetailBits.js";
-const ce = 25, vt = [
+import { hasSnapshotView as ht, offersChanges as xt } from "../NotificationBell.js";
+import { SimpleSelect as ce } from "../ui/SimpleSelect.js";
+import { AsItWasSheet as gt } from "./AsItWasSheet.js";
+import { bundleLocally as ft, laneTone as kt, bundleAsNotification as yt, bundleHeadline as vt, categoryChipLabel as wt } from "./bundles.js";
+import { DeliveryChips as Nt } from "./DeliveryChips.js";
+import { NotificationActions as Ct } from "./NotificationActions.js";
+import { NotificationChangesList as St, NotificationDetailBits as _t } from "./NotificationDetailBits.js";
+const ue = 25, Dt = [
   { key: "all", label: "All" },
   { key: "inbox", label: "Unread" },
   { key: "read", label: "Read" },
   { key: "snoozed", label: "Snoozed" },
   { key: "archived", label: "Archived" },
   { key: "sent", label: "Sent" }
-], wt = [
+], zt = [
   { key: "all", label: "Every lane" },
   { key: "critical", label: "Critical" },
   { key: "needs_you", label: "Needs you" },
   { key: "fyi", label: "FYI" }
 ];
-function Ce() {
+function _e() {
   const g = /* @__PURE__ */ new Date(), v = new Date(g.getTime() + 3600 * 1e3), w = new Date(g);
   w.setDate(w.getDate() + 1), w.setHours(8, 0, 0, 0);
   const N = new Date(g);
@@ -37,67 +37,74 @@ function Ce() {
     { label: "Until next week", until: N }
   ];
 }
-function jt({
+function Qt({
   routes: g,
   onNavigate: v,
   app: w,
   mailLogUrl: N,
-  subscriptionsPath: Se,
+  subscriptionsPath: De,
+  rulesPath: ze,
+  changesId: me,
   onNotice: r,
   onError: d,
-  className: _e
+  className: Ae
 }) {
-  const c = dt(), Y = Xe(), [i, De] = s("all"), [C, ze] = s("all"), [B, Ae] = s(!0), { data: ue = [], isLoading: qe } = I({
-    queryKey: ["notifications", "sent", B],
+  const c = ct(), Y = tt(), [V, qe] = s(() => {
+    if (me !== void 0) return me;
+    if (typeof window > "u") return null;
+    const e = new URLSearchParams(window.location.search).get("changes"), a = Number(e);
+    return e && Number.isInteger(a) && a > 0 ? a : null;
+  }), [i, Fe] = s("all"), [C, $e] = s("all"), [R, Me] = s(!0), { data: pe = [], isLoading: Te } = I({
+    queryKey: ["notifications", "sent", R],
     queryFn: () => c.request(
-      j("/notifications/sent", { lane: B ? "critical" : "all" })
+      j("/notifications/sent", { lane: R ? "critical" : "all" })
     ).then((e) => e.data ?? []),
     enabled: i === "sent",
     refetchInterval: i === "sent" ? 3e4 : !1
-  }), [S, q] = s(1), [Fe, V] = s(null), [me, pe] = s(null), [Z, $e] = s(""), [R, Me] = s(""), [M, Te] = s(""), [K, Oe] = s(!0), [Pe, Le] = s(() => /* @__PURE__ */ new Set()), [b, be] = s(null), [F, U] = s(() => /* @__PURE__ */ new Set()), [J, T] = s(!1), [Ie, X] = s(!1), [xe, je] = s(!1), [he, Be] = s("30");
-  Ne(() => {
-    U(/* @__PURE__ */ new Set()), T(!1), X(!1);
-  }, [i, C, S, R, M]), Ne(() => {
+  }), [S, q] = s(1), [Le, Z] = s(null), [be, he] = s(null), [J, Oe] = s(""), [B, Pe] = s(""), [M, Ie] = s(""), [U, je] = s(!0), [Re, Be] = s(() => /* @__PURE__ */ new Set()), [b, xe] = s(null), [F, K] = s(() => /* @__PURE__ */ new Set()), [W, T] = s(!1), [Ue, X] = s(!1), [ge, Ke] = s(!1), [fe, He] = s("30");
+  Se(() => {
+    K(/* @__PURE__ */ new Set()), T(!1), X(!1);
+  }, [i, C, S, B, M]), Se(() => {
     const e = setTimeout(() => {
-      Me(Z.trim()), q(1);
+      Pe(J.trim()), q(1);
     }, 350);
     return () => clearTimeout(e);
-  }, [Z]);
-  const { data: x } = I({
+  }, [J]);
+  const { data: h } = I({
     queryKey: ["notification-count"],
     queryFn: () => c.request(j("/notifications/unread-count"))
-  }), { data: p, isLoading: Re } = I({
+  }), { data: p, isLoading: Qe } = I({
     queryKey: [
       "notifications",
       "center",
       i,
       C,
       S,
-      R,
+      B,
       M,
       w ?? null,
-      K
+      U
     ],
     queryFn: () => c.request(
       j("/notifications", {
         page: S,
-        limit: ce,
+        limit: ue,
         status: i === "snoozed" || i === "sent" ? "all" : i,
         snoozed: i === "snoozed" ? "true" : void 0,
         lane: C === "all" ? void 0 : C,
-        search: R || void 0,
+        search: B || void 0,
         collection: M || void 0,
         app: w,
-        bundle: K ? "record" : void 0
+        bundle: U ? "record" : void 0
       })
     ).then((e) => {
-      if (!K || e.bundles) return e;
-      const a = pt(e.data ?? []);
+      if (!U || e.bundles) return e;
+      const a = ft(e.data ?? []);
       return { ...e, data: a.rows, bundles: a.bundles };
     }),
-    placeholderData: We,
+    placeholderData: at,
     enabled: i !== "sent"
-  }), { data: Ke = [] } = I({
+  }), { data: Ge = [] } = I({
     queryKey: ["notifications", "center", "collections"],
     queryFn: () => c.request(
       j("/collections")
@@ -106,19 +113,19 @@ function jt({
       return [...new Set(a.map((l) => l.collection))].sort();
     }),
     staleTime: 3e5
-  }), _ = i === "archived" || S > 1 ? [] : (p == null ? void 0 : p.pinned) ?? [], Ue = new Set(_.map((e) => e.id)), O = ((p == null ? void 0 : p.data) ?? []).filter((e) => !Ue.has(e.id)), H = (p == null ? void 0 : p.bundles) ?? [], D = (p == null ? void 0 : p.total) ?? 0, W = Math.max(1, Math.ceil(D / ce)), f = () => {
+  }), _ = i === "archived" || S > 1 ? [] : (p == null ? void 0 : p.pinned) ?? [], Ye = new Set(_.map((e) => e.id)), L = ((p == null ? void 0 : p.data) ?? []).filter((e) => !Ye.has(e.id)), H = (p == null ? void 0 : p.bundles) ?? [], D = (p == null ? void 0 : p.total) ?? 0, E = Math.max(1, Math.ceil(D / ue)), f = () => {
     Y.invalidateQueries({ queryKey: ["notifications"] }), Y.invalidateQueries({ queryKey: ["notification-count"] });
-  }, He = y({
+  }, Ve = y({
     mutationFn: (e) => c.request(A("/notifications/mark-read", { ids: e })),
     onSuccess: f,
     onError: () => d == null ? void 0 : d("Failed to mark the bundle read")
-  }), E = y({
+  }), ee = y({
     mutationFn: () => c.request(A("/notifications/mark-all-read")),
     onSuccess: () => {
       f(), r == null || r("All notifications marked as read");
     },
     onError: () => d == null ? void 0 : d("Failed to mark all read")
-  }), P = y({
+  }), O = y({
     mutationFn: ({
       id: e,
       until: a,
@@ -130,75 +137,75 @@ function jt({
       )
     ),
     onSuccess: (e, a) => {
-      f(), pe(null), r == null || r(
+      f(), he(null), r == null || r(
         a.untilChange ? "Snoozed — it comes back when someone changes the record" : a.until ? "Snoozed — it will return unread" : "Snooze cleared"
       );
     },
     onError: () => d == null ? void 0 : d("Failed to snooze")
-  }), ge = y({
+  }), ke = y({
     mutationFn: (e) => c.request(A(`/notifications/${e}/acknowledge`)),
     onSuccess: () => {
       f(), r == null || r("Acknowledged");
     },
     onError: () => d == null ? void 0 : d("Failed to acknowledge")
-  }), Qe = () => ({
+  }), Ze = () => ({
     status: i === "snoozed" || i === "sent" ? "all" : i,
     snoozed: i === "snoozed" ? "true" : void 0,
     lane: C === "all" ? void 0 : C,
-    search: R || void 0,
+    search: B || void 0,
     collection: M || void 0
   }), $ = y({
     mutationFn: (e) => c.request(
       A("/notifications/bulk-action", {
         action: e.action,
         until: e.until ? e.until.toISOString() : void 0,
-        ...J ? { filter: Qe() } : { ids: [...F] }
+        ...W ? { filter: Ze() } : { ids: [...F] }
       })
     ),
     onSuccess: (e, a) => {
       var u;
-      f(), U(/* @__PURE__ */ new Set()), T(!1), X(!1);
+      f(), K(/* @__PURE__ */ new Set()), T(!1), X(!1);
       const l = ((u = e.data) == null ? void 0 : u.updated) ?? 0;
       r == null || r(
         `${l} notification${l === 1 ? "" : "s"} ${a.action === "read" ? "marked read" : a.action === "archive" ? "archived" : "snoozed"}`
       );
     },
     onError: () => d == null ? void 0 : d("That bulk action failed")
-  }), ee = y({
+  }), te = y({
     mutationFn: (e) => c.request(A("/notifications/archive-read", { days: e })),
     onSuccess: (e) => {
       var a;
       f(), r == null || r(`${((a = e.data) == null ? void 0 : a.updated) ?? 0} archived — find them under Archived`);
     },
     onError: () => d == null ? void 0 : d("Clean-up failed")
-  }), { data: te } = I({
+  }), { data: ae } = I({
     queryKey: ["nvr-profile-prefs"],
     queryFn: () => c.request(j("/users/me")).then((e) => {
       var a;
       return ((a = e.data) == null ? void 0 : a.preferences) ?? {};
     }),
-    enabled: xe
-  }), Ge = y({
-    mutationFn: (e) => c.request(it("/users/me/preferences", { notification_cleanup_days: e })),
+    enabled: ge
+  }), Je = y({
+    mutationFn: (e) => c.request(ut("/users/me/preferences", { notification_cleanup_days: e })),
     onSuccess: () => {
       Y.invalidateQueries({ queryKey: ["nvr-profile-prefs"] }), r == null || r("Automatic clean-up saved");
     },
     onError: () => d == null ? void 0 : d("Could not save the clean-up setting")
-  }), ae = y({
-    mutationFn: (e) => c.request(st(`/notifications/${e}`)),
+  }), ne = y({
+    mutationFn: (e) => c.request(mt(`/notifications/${e}`)),
     onSuccess: () => {
-      f(), V(null), r == null || r("Notification deleted");
+      f(), Z(null), r == null || r("Notification deleted");
     },
     onError: () => d == null ? void 0 : d("Failed to delete notification")
-  }), Ye = async (e) => {
+  }), We = async (e) => {
     e.read || (await c.request(A(`/notifications/${e.id}/read`)).catch(() => {
-    }), f()), se(Q(e, g), v);
-  }, Ve = (e) => {
-    T(!1), U((a) => {
+    }), f()), oe(Q(e, g), v);
+  }, Xe = (e) => {
+    T(!1), K((a) => {
       const l = new Set(a);
       return l.has(e) ? l.delete(e) : l.add(e), l;
     });
-  }, ne = (e, a = !1) => {
+  }, le = (e, a = !1) => {
     var z;
     const l = !e.read, u = Q(e, g);
     return /* @__PURE__ */ n(
@@ -216,7 +223,7 @@ function jt({
             {
               type: "checkbox",
               checked: F.has(e.id),
-              onChange: () => Ve(e.id),
+              onChange: () => Xe(e.id),
               "aria-label": "Select notification",
               "data-notification-select": e.id,
               className: "mt-1.5 h-3.5 w-3.5 shrink-0"
@@ -236,7 +243,7 @@ function jt({
               "button",
               {
                 type: "button",
-                onClick: () => void Ye(e),
+                onClick: () => void We(e),
                 className: "block w-full text-left",
                 children: [
                   /* @__PURE__ */ n("div", { className: "flex items-baseline gap-2", children: [
@@ -267,60 +274,63 @@ function jt({
                 "button",
                 {
                   type: "button",
-                  onClick: () => se(u, v),
+                  onClick: () => oe(u, v),
                   className: "inline-flex items-center gap-1 rounded-full bg-nvr-cyan/10 px-2 py-0.5 text-[10px] font-medium text-nvr-navy hover:bg-nvr-cyan/20 dark:bg-nvr-cyan/15 dark:text-nvr-cyan",
                   children: u.type === "chat" ? "Open chat" : u.type === "external" ? "Open in app ↗" : e.target_label && e.kind !== "record" ? `${e.target_label}${e.item ? ` #${e.item}` : ""}` : e.collection === "__chat__" ? "Chat" : e.collection ? `${e.collection}${e.item ? ` #${e.item}` : ""}` : "Open"
                 }
               ),
-              /* @__PURE__ */ t(ft, { delivery: e.delivery, mailLogUrl: N, onNavigate: v }),
-              ut(e) && /* @__PURE__ */ n(
+              /* @__PURE__ */ t(Nt, { delivery: e.delivery, mailLogUrl: N, onNavigate: v }),
+              ht(e) && /* @__PURE__ */ n(
                 "button",
                 {
                   type: "button",
                   "data-notification-as-it-was": e.id,
                   "data-tip": "The record as it was when you were told",
-                  onClick: () => be(e),
+                  onClick: () => xe(e),
                   className: "inline-flex items-center gap-1 rounded-full border border-slate-200 px-2 py-0.5 text-[10px] font-medium text-slate-500 hover:bg-slate-50 hover:text-slate-700 dark:border-border dark:text-slate-400 dark:hover:bg-muted dark:hover:text-slate-200",
                   children: [
-                    /* @__PURE__ */ t(nt, { className: "h-3 w-3" }),
+                    /* @__PURE__ */ t(it, { className: "h-3 w-3" }),
                     "as it was"
                   ]
                 }
               )
             ] }),
             /* @__PURE__ */ t(
-              yt,
+              _t,
               {
                 detail: e.detail,
                 why: e.why,
                 delivery: e.delivery,
-                subscriptionsPath: Se,
+                notificationId: e.id,
+                recordChanges: xt(e),
+                subscriptionsPath: De,
+                rulesPath: ze,
                 onNavigate: v,
                 className: "mt-1"
               }
             ),
             ((z = e.ack) == null ? void 0 : z.required) && /* @__PURE__ */ t("div", { className: "mt-1.5", "data-notification-ack": e.ack.at ? "acked" : "pending", children: e.ack.at ? /* @__PURE__ */ n("span", { className: "inline-flex items-center gap-1 rounded-full bg-emerald-50 px-2 py-0.5 text-[10.5px] font-medium text-emerald-700 dark:bg-emerald-500/10 dark:text-emerald-400", children: [
-              /* @__PURE__ */ t(de, { className: "h-3 w-3" }),
+              /* @__PURE__ */ t(ie, { className: "h-3 w-3" }),
               "Acknowledged ",
               G(e.ack.at)
             ] }) : /* @__PURE__ */ n(
               "button",
               {
                 type: "button",
-                disabled: ge.isPending,
-                onClick: () => ge.mutate(e.id),
+                disabled: ke.isPending,
+                onClick: () => ke.mutate(e.id),
                 "data-notification-acknowledge": e.id,
                 className: "inline-flex items-center gap-1 rounded-md bg-nvr-cyan px-2.5 py-1 text-[11.5px] font-medium text-white hover:opacity-90 disabled:opacity-50",
                 children: [
-                  /* @__PURE__ */ t(de, { className: "h-3.5 w-3.5" }),
+                  /* @__PURE__ */ t(ie, { className: "h-3.5 w-3.5" }),
                   "Acknowledge"
                 ]
               }
             ) }),
             e.actions && e.actions.length > 0 && /* @__PURE__ */ t(
-              kt,
+              Ct,
               {
-                actions: l ? e.actions : e.actions.filter((h) => !!h.input),
+                actions: l ? e.actions : e.actions.filter((x) => !!x.input),
                 notificationId: e.id,
                 size: "sm",
                 onError: d,
@@ -334,11 +344,11 @@ function jt({
               "button",
               {
                 type: "button",
-                onClick: () => P.mutate({ id: e.id, until: null }),
+                onClick: () => O.mutate({ id: e.id, until: null }),
                 className: "inline-flex items-center gap-1 rounded-full bg-amber-50 px-2 py-0.5 text-[10.5px] font-medium text-amber-700 hover:bg-amber-100 dark:bg-amber-400/10 dark:text-amber-300",
                 "data-tip": "Click to wake now",
                 children: [
-                  /* @__PURE__ */ t(re, { className: "h-3 w-3" }),
+                  /* @__PURE__ */ t(de, { className: "h-3 w-3" }),
                   e.snooze_until_change ? "Until it changes" : `Until ${new Date(e.snoozed_until).toLocaleString([], {
                     month: "short",
                     day: "numeric",
@@ -351,30 +361,30 @@ function jt({
               "button",
               {
                 type: "button",
-                onClick: () => pe(me === e.id ? null : e.id),
+                onClick: () => he(be === e.id ? null : e.id),
                 className: "rounded p-1.5 text-slate-300 opacity-0 transition-all hover:bg-amber-50 hover:text-amber-500 group-hover:opacity-100 dark:hover:bg-amber-400/10",
                 "aria-label": "Snooze notification",
-                children: /* @__PURE__ */ t(re, { className: "h-3.5 w-3.5" })
+                children: /* @__PURE__ */ t(de, { className: "h-3.5 w-3.5" })
               }
             ),
-            me === e.id && /* @__PURE__ */ n("div", { className: "absolute right-0 top-8 z-20 w-[180px] rounded-md border border-slate-200 bg-white py-1 shadow-lg dark:border-border dark:bg-card", children: [
-              Ce().map((h) => /* @__PURE__ */ t(
+            be === e.id && /* @__PURE__ */ n("div", { className: "absolute right-0 top-8 z-20 w-[180px] rounded-md border border-slate-200 bg-white py-1 shadow-lg dark:border-border dark:bg-card", children: [
+              _e().map((x) => /* @__PURE__ */ t(
                 "button",
                 {
                   type: "button",
-                  disabled: P.isPending,
-                  onClick: () => P.mutate({ id: e.id, until: h.until }),
+                  disabled: O.isPending,
+                  onClick: () => O.mutate({ id: e.id, until: x.until }),
                   className: "block w-full px-3 py-1.5 text-left text-[12px] text-slate-700 hover:bg-muted dark:text-foreground",
-                  children: h.label
+                  children: x.label
                 },
-                h.label
+                x.label
               )),
               e.collection && e.item != null && /* @__PURE__ */ t(
                 "button",
                 {
                   type: "button",
-                  disabled: P.isPending,
-                  onClick: () => P.mutate({ id: e.id, until: null, untilChange: !0 }),
+                  disabled: O.isPending,
+                  onClick: () => O.mutate({ id: e.id, until: null, untilChange: !0 }),
                   className: "block w-full border-t border-slate-100 px-3 py-1.5 text-left text-[12px] text-slate-700 hover:bg-muted dark:border-border dark:text-foreground",
                   "data-snooze-until-change": !0,
                   children: "Until the record changes"
@@ -382,12 +392,12 @@ function jt({
               )
             ] })
           ] }),
-          /* @__PURE__ */ t("div", { className: "shrink-0", children: Fe === e.id ? /* @__PURE__ */ n("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ t("div", { className: "shrink-0", children: Le === e.id ? /* @__PURE__ */ n("div", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
-                onClick: () => V(null),
+                onClick: () => Z(null),
                 className: "h-6 rounded-md border border-slate-200 px-2 text-[11px] dark:border-border",
                 children: "Cancel"
               }
@@ -396,27 +406,27 @@ function jt({
               "button",
               {
                 type: "button",
-                disabled: ae.isPending,
-                onClick: () => ae.mutate(e.id),
+                disabled: ne.isPending,
+                onClick: () => ne.mutate(e.id),
                 className: "h-6 rounded-md bg-red-500 px-2 text-[11px] text-white hover:bg-red-600",
-                children: ae.isPending ? "Deleting…" : "Delete"
+                children: ne.isPending ? "Deleting…" : "Delete"
               }
             )
           ] }) : /* @__PURE__ */ t(
             "button",
             {
               type: "button",
-              onClick: () => V(e.id),
+              onClick: () => Z(e.id),
               className: "rounded p-1.5 text-slate-300 opacity-0 transition-all hover:bg-red-50 hover:text-red-400 group-hover:opacity-100",
               "aria-label": "Delete notification",
-              children: /* @__PURE__ */ t(lt, { className: "h-3.5 w-3.5" })
+              children: /* @__PURE__ */ t(st, { className: "h-3.5 w-3.5" })
             }
           ) })
         ]
       }
     );
-  }, Ze = (e) => {
-    const a = `${e.collection}:${e.item}`, l = Pe.has(a), u = bt(e.lane), z = e.deleted ? null : Q(xt(e), g), h = e.rows.filter((o) => !o.read).map((o) => o.id), L = () => Le((o) => {
+  }, Ee = (e) => {
+    const a = `${e.collection}:${e.item}`, l = Re.has(a), u = kt(e.lane), z = e.deleted ? null : Q(yt(e), g), x = e.rows.filter((o) => !o.read).map((o) => o.id), P = () => Be((o) => {
       const k = new Set(o);
       return k.has(a) ? k.delete(a) : k.add(a), k;
     });
@@ -436,10 +446,10 @@ function jt({
                 "aria-expanded": l,
                 "aria-label": l ? "Collapse" : "Expand",
                 "data-notification-bundle-expand": a,
-                onClick: L,
+                onClick: P,
                 className: "mt-1 rounded p-0.5 text-slate-400 hover:bg-slate-100 hover:text-slate-700 dark:hover:bg-muted dark:hover:text-slate-200",
                 children: /* @__PURE__ */ t(
-                  rt,
+                  ot,
                   {
                     className: m("h-3.5 w-3.5 transition-transform", !l && "-rotate-90")
                   }
@@ -456,7 +466,7 @@ function jt({
               }
             ),
             /* @__PURE__ */ n("div", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ t("button", { type: "button", onClick: L, className: "block w-full text-left", children: /* @__PURE__ */ n("div", { className: "flex items-baseline gap-2", children: [
+              /* @__PURE__ */ t("button", { type: "button", onClick: P, className: "block w-full text-left", children: /* @__PURE__ */ n("div", { className: "flex items-baseline gap-2", children: [
                 e.lane === "critical" && e.unread > 0 && /* @__PURE__ */ t(
                   "span",
                   {
@@ -474,7 +484,7 @@ function jt({
                       "truncate text-[13px]",
                       e.unread > 0 ? m("font-medium", u.text) : "font-normal text-slate-600 dark:text-slate-400"
                     ),
-                    children: ht(e)
+                    children: vt(e)
                   }
                 ),
                 /* @__PURE__ */ t("span", { className: "shrink-0 text-[10.5px] text-slate-400", children: e.newest ? G(e.newest) : "" })
@@ -501,7 +511,7 @@ function jt({
                   {
                     className: "rounded bg-slate-100 px-1.5 py-px text-[10px] font-medium text-slate-600 dark:bg-muted dark:text-slate-300",
                     "data-notification-bundle-category": o,
-                    children: gt(o)
+                    children: wt(o)
                   },
                   o
                 )),
@@ -509,10 +519,10 @@ function jt({
                   "button",
                   {
                     type: "button",
-                    onClick: () => se(z, v),
+                    onClick: () => oe(z, v),
                     className: "inline-flex items-center gap-1 rounded-full bg-nvr-cyan/10 px-2 py-0.5 text-[10px] font-medium text-nvr-navy hover:bg-nvr-cyan/20 dark:bg-nvr-cyan/15 dark:text-nvr-cyan",
                     children: [
-                      /* @__PURE__ */ t(ve, { className: "h-3 w-3" }),
+                      /* @__PURE__ */ t(Ne, { className: "h-3 w-3" }),
                       "Open ",
                       e.label
                     ]
@@ -524,15 +534,15 @@ function jt({
                 ] })
               ] })
             ] }),
-            h.length > 0 && /* @__PURE__ */ n(
+            x.length > 0 && /* @__PURE__ */ n(
               "button",
               {
                 type: "button",
                 "data-notification-bundle-read": a,
-                onClick: () => He.mutate(h),
+                onClick: () => Ve.mutate(x),
                 className: "inline-flex items-center gap-1 rounded-md border border-slate-200 px-2 py-1 text-[11px] font-medium text-slate-600 hover:bg-slate-50 dark:border-border dark:text-slate-300 dark:hover:bg-muted",
                 children: [
-                  /* @__PURE__ */ t(ye, { className: "h-3 w-3" }),
+                  /* @__PURE__ */ t(we, { className: "h-3 w-3" }),
                   "Mark read"
                 ]
               }
@@ -543,18 +553,18 @@ function jt({
             {
               className: "divide-y divide-slate-100 border-t border-slate-100 dark:divide-border dark:border-border",
               "data-notification-bundle-rows": a,
-              children: e.rows.map((o) => /* @__PURE__ */ t(ie, { children: ne(o, !0) }, o.id))
+              children: e.rows.map((o) => /* @__PURE__ */ t(se, { children: le(o, !0) }, o.id))
             }
           )
         ]
       },
       `bundle:${a}`
     );
-  }, fe = _.length + O.length + H.reduce((e, a) => e + a.rows.length, 0), Je = (e) => {
+  }, ye = _.length + L.length + H.reduce((e, a) => e + a.rows.length, 0), et = (e) => {
     var a;
-    return e === "all" ? null : ((a = x == null ? void 0 : x.lanes) == null ? void 0 : a[e]) ?? null;
+    return e === "all" ? null : ((a = h == null ? void 0 : h.lanes) == null ? void 0 : a[e]) ?? null;
   };
-  return /* @__PURE__ */ n("div", { className: m("flex flex-1 min-h-0 flex-col", _e), "data-nvr-notification-center": !0, children: [
+  return /* @__PURE__ */ n("div", { className: m("flex flex-1 min-h-0 flex-col", Ae), "data-nvr-notification-center": !0, children: [
     /* @__PURE__ */ n("header", { className: "shrink-0 border-b border-slate-200 bg-white px-8 py-5 dark:border-border dark:bg-background", children: [
       /* @__PURE__ */ n("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ n("div", { children: [
@@ -563,7 +573,7 @@ function jt({
             D,
             " notification",
             D === 1 ? "" : "s",
-            (x == null ? void 0 : x.attention) != null && x.attention > 0 ? ` · ${x.attention} need${x.attention === 1 ? "s" : ""} you` : ""
+            (h == null ? void 0 : h.attention) != null && h.attention > 0 ? ` · ${h.attention} need${h.attention === 1 ? "s" : ""} you` : ""
           ] })
         ] }),
         /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
@@ -571,11 +581,11 @@ function jt({
             "button",
             {
               type: "button",
-              onClick: () => je((e) => !e),
+              onClick: () => Ke((e) => !e),
               "data-notification-cleanup-toggle": !0,
               className: "inline-flex h-8 items-center gap-1.5 rounded-md border border-slate-200 px-3 text-[12px] font-medium text-slate-700 hover:bg-slate-50 dark:border-border dark:text-foreground dark:hover:bg-muted",
               children: [
-                /* @__PURE__ */ t(ke, { className: "h-3.5 w-3.5" }),
+                /* @__PURE__ */ t(ve, { className: "h-3.5 w-3.5" }),
                 "Clean up"
               ]
             }
@@ -584,18 +594,18 @@ function jt({
             "button",
             {
               type: "button",
-              onClick: () => E.mutate(),
-              disabled: E.isPending,
+              onClick: () => ee.mutate(),
+              disabled: ee.isPending,
               className: "inline-flex h-8 items-center gap-1.5 rounded-md border border-slate-200 px-3 text-[12px] font-medium text-slate-700 hover:bg-slate-50 disabled:opacity-50 dark:border-border dark:text-foreground dark:hover:bg-muted",
               children: [
-                /* @__PURE__ */ t(Ee, { className: "h-3.5 w-3.5" }),
-                E.isPending ? "Marking…" : "Mark all read"
+                /* @__PURE__ */ t(nt, { className: "h-3.5 w-3.5" }),
+                ee.isPending ? "Marking…" : "Mark all read"
               ]
             }
           )
         ] })
       ] }),
-      xe && /* @__PURE__ */ n(
+      ge && /* @__PURE__ */ n(
         "div",
         {
           className: "mt-3 space-y-2 rounded-md border border-slate-200 bg-slate-50 px-3 py-2.5 text-[12px] text-slate-600 dark:border-border dark:bg-muted/40 dark:text-muted-foreground",
@@ -604,10 +614,10 @@ function jt({
             /* @__PURE__ */ n("div", { className: "flex flex-wrap items-center gap-2", children: [
               "Archive everything read and older than",
               /* @__PURE__ */ t(
-                oe,
+                ce,
                 {
-                  value: he,
-                  onChange: Be,
+                  value: fe,
+                  onChange: He,
                   ariaLabel: "Older than",
                   className: "h-7 w-auto rounded-md border-slate-200 bg-background px-2 text-[12px] dark:border-border",
                   options: [
@@ -622,21 +632,21 @@ function jt({
                 "button",
                 {
                   type: "button",
-                  disabled: ee.isPending,
-                  onClick: () => ee.mutate(Number(he)),
+                  disabled: te.isPending,
+                  onClick: () => te.mutate(Number(fe)),
                   "data-notification-archive-read": !0,
                   className: "h-7 rounded-md bg-slate-900 px-2.5 text-[11.5px] font-medium text-white hover:bg-slate-700 disabled:opacity-50 dark:bg-slate-100 dark:text-slate-900",
-                  children: ee.isPending ? "Archiving…" : "Archive now"
+                  children: te.isPending ? "Archiving…" : "Archive now"
                 }
               )
             ] }),
             /* @__PURE__ */ n("div", { className: "flex flex-wrap items-center gap-2", children: [
               "Or do it automatically — archive read notifications after",
               /* @__PURE__ */ t(
-                oe,
+                ce,
                 {
-                  value: String((te == null ? void 0 : te.notification_cleanup_days) ?? ""),
-                  onChange: (e) => Ge.mutate(e ? Number(e) : null),
+                  value: String((ae == null ? void 0 : ae.notification_cleanup_days) ?? ""),
+                  onChange: (e) => Je.mutate(e ? Number(e) : null),
                   ariaLabel: "Automatic clean-up",
                   className: "h-7 w-auto rounded-md border-slate-200 bg-background px-2 text-[12px] dark:border-border",
                   options: [
@@ -653,14 +663,14 @@ function jt({
         }
       ),
       /* @__PURE__ */ n("div", { className: "mt-4 flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: wt.map((e) => {
-          const a = Je(e.key);
+        /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: zt.map((e) => {
+          const a = et(e.key);
           return /* @__PURE__ */ n(
             "button",
             {
               type: "button",
               onClick: () => {
-                ze(e.key), q(1);
+                $e(e.key), q(1);
               },
               "data-nvr-lane": e.key,
               className: m(
@@ -676,12 +686,12 @@ function jt({
           );
         }) }),
         /* @__PURE__ */ t("span", { className: "mx-1 h-5 w-px bg-slate-200 dark:bg-border" }),
-        /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: vt.map((e) => /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: Dt.map((e) => /* @__PURE__ */ t(
           "button",
           {
             type: "button",
             onClick: () => {
-              De(e.key), q(1);
+              Fe(e.key), q(1);
             },
             className: m(
               "rounded-md px-2.5 py-1.5 text-[12px] font-medium transition-colors",
@@ -692,29 +702,29 @@ function jt({
           e.key
         )) }),
         /* @__PURE__ */ n("div", { className: "relative ml-auto", children: [
-          /* @__PURE__ */ t(et, { className: "pointer-events-none absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-slate-400" }),
+          /* @__PURE__ */ t(lt, { className: "pointer-events-none absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-slate-400" }),
           /* @__PURE__ */ t(
             "input",
             {
-              value: Z,
-              onChange: (e) => $e(e.target.value),
+              value: J,
+              onChange: (e) => Oe(e.target.value),
               placeholder: "Search notifications…",
               className: "h-8 w-[240px] rounded-md border border-slate-200 bg-background pl-8 pr-2.5 text-[12.5px] dark:border-border"
             }
           )
         ] }),
         /* @__PURE__ */ t(
-          oe,
+          ce,
           {
             value: M,
             onChange: (e) => {
-              Te(e), q(1);
+              Ie(e), q(1);
             },
             ariaLabel: "Collection",
             className: "h-8 w-auto rounded-md border-slate-200 bg-background px-2 text-[12.5px] dark:border-border",
             options: [
               { value: "", label: "All collections" },
-              ...Ke.map((e) => ({ value: e, label: e }))
+              ...Ge.map((e) => ({ value: e, label: e }))
             ]
           }
         ),
@@ -728,8 +738,8 @@ function jt({
                 "input",
                 {
                   type: "checkbox",
-                  checked: K,
-                  onChange: (e) => Oe(e.target.checked),
+                  checked: U,
+                  onChange: (e) => je(e.target.checked),
                   className: "h-3.5 w-3.5",
                   "data-notification-group-by-record": !0
                 }
@@ -740,14 +750,36 @@ function jt({
         )
       ] })
     ] }),
+    V != null && /* @__PURE__ */ n(
+      "div",
+      {
+        className: "shrink-0 border-b border-slate-200 bg-white px-8 py-3 dark:border-border dark:bg-background",
+        "data-notification-changes-landing": V,
+        children: [
+          /* @__PURE__ */ n("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ t("p", { className: "text-[12.5px] font-semibold text-slate-800 dark:text-slate-100", children: "What changed" }),
+            /* @__PURE__ */ t(
+              "button",
+              {
+                type: "button",
+                onClick: () => qe(null),
+                className: "text-[11.5px] text-slate-400 underline decoration-dotted underline-offset-2 hover:text-slate-600 dark:hover:text-slate-200",
+                children: "Dismiss"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ t(St, { notificationId: V, className: "max-w-3xl" })
+        ]
+      }
+    ),
     i !== "sent" && F.size > 0 && /* @__PURE__ */ n(
       "div",
       {
         className: "flex shrink-0 flex-wrap items-center gap-2 border-b border-nvr-cyan/30 bg-nvr-cyan/5 px-8 py-2 text-[12px] text-slate-700 dark:text-slate-200",
         "data-notification-bulkbar": !0,
         children: [
-          /* @__PURE__ */ t("span", { className: "font-medium", children: J ? `All ${D} matching` : `${F.size} selected` }),
-          !J && F.size >= fe && D > fe && /* @__PURE__ */ n(
+          /* @__PURE__ */ t("span", { className: "font-medium", children: W ? `All ${D} matching` : `${F.size} selected` }),
+          !W && F.size >= ye && D > ye && /* @__PURE__ */ n(
             "button",
             {
               type: "button",
@@ -771,7 +803,7 @@ function jt({
               "data-notification-bulk": "read",
               className: "inline-flex h-7 items-center gap-1 rounded-md border border-slate-200 bg-background px-2 text-[11.5px] font-medium hover:bg-slate-50 dark:border-border",
               children: [
-                /* @__PURE__ */ t(ye, { className: "h-3 w-3" }),
+                /* @__PURE__ */ t(we, { className: "h-3 w-3" }),
                 " Mark read"
               ]
             }
@@ -786,12 +818,12 @@ function jt({
                 "data-notification-bulk": "snooze",
                 className: "inline-flex h-7 items-center gap-1 rounded-md border border-slate-200 bg-background px-2 text-[11.5px] font-medium hover:bg-slate-50 dark:border-border",
                 children: [
-                  /* @__PURE__ */ t(re, { className: "h-3 w-3" }),
+                  /* @__PURE__ */ t(de, { className: "h-3 w-3" }),
                   " Snooze"
                 ]
               }
             ),
-            Ie && /* @__PURE__ */ t("div", { className: "absolute left-0 top-8 z-20 w-[180px] rounded-md border border-slate-200 bg-white py-1 shadow-lg dark:border-border dark:bg-card", children: Ce().map((e) => /* @__PURE__ */ t(
+            Ue && /* @__PURE__ */ t("div", { className: "absolute left-0 top-8 z-20 w-[180px] rounded-md border border-slate-200 bg-white py-1 shadow-lg dark:border-border dark:bg-card", children: _e().map((e) => /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
@@ -811,7 +843,7 @@ function jt({
               "data-notification-bulk": "archive",
               className: "inline-flex h-7 items-center gap-1 rounded-md border border-slate-200 bg-background px-2 text-[11.5px] font-medium hover:bg-slate-50 dark:border-border",
               children: [
-                /* @__PURE__ */ t(ke, { className: "h-3 w-3" }),
+                /* @__PURE__ */ t(ve, { className: "h-3 w-3" }),
                 " Archive"
               ]
             }
@@ -822,17 +854,17 @@ function jt({
               type: "button",
               onClick: () => {
                 const e = [];
-                for (const a of [..._, ...O, ...H.flatMap((l) => l.rows)]) {
+                for (const a of [..._, ...L, ...H.flatMap((l) => l.rows)]) {
                   if (!F.has(a.id)) continue;
                   const l = Q(a, g);
                   l && (l.type === "external" ? e.push(l.url) : l.type === "path" && typeof window < "u" && e.push(`${window.location.origin}${l.path}`));
                 }
-                e.length === 0 ? r == null || r("None of the selected notifications opens a page") : r == null || r(ot(ct(e)));
+                e.length === 0 ? r == null || r("None of the selected notifications opens a page") : r == null || r(pt(bt(e)));
               },
               "data-notification-bulk": "tabs",
               className: "inline-flex h-7 items-center gap-1 rounded-md border border-slate-200 bg-background px-2 text-[11.5px] font-medium hover:bg-slate-50 dark:border-border",
               children: [
-                /* @__PURE__ */ t(ve, { className: "h-3 w-3" }),
+                /* @__PURE__ */ t(Ne, { className: "h-3 w-3" }),
                 " Open in tabs"
               ]
             }
@@ -842,7 +874,7 @@ function jt({
             {
               type: "button",
               onClick: () => {
-                U(/* @__PURE__ */ new Set()), T(!1);
+                K(/* @__PURE__ */ new Set()), T(!1);
               },
               className: "ml-auto text-[11.5px] text-slate-500 underline decoration-dotted underline-offset-2",
               children: "Clear selection"
@@ -860,8 +892,8 @@ function jt({
               "input",
               {
                 type: "checkbox",
-                checked: B,
-                onChange: (e) => Ae(e.target.checked),
+                checked: R,
+                onChange: (e) => Me(e.target.checked),
                 className: "h-3.5 w-3.5",
                 "data-nvr-sent-critical": !0
               }
@@ -869,11 +901,11 @@ function jt({
             "Critical only"
           ] })
         ] }),
-        qe ? /* @__PURE__ */ t("p", { className: "py-10 text-[13px] text-slate-400", children: "Loading…" }) : ue.length === 0 ? /* @__PURE__ */ n("div", { className: "flex flex-col items-center justify-center py-24 text-center", children: [
-          /* @__PURE__ */ t(we, { className: "h-10 w-10 text-slate-200 dark:text-slate-700" }),
+        Te ? /* @__PURE__ */ t("p", { className: "py-10 text-[13px] text-slate-400", children: "Loading…" }) : pe.length === 0 ? /* @__PURE__ */ n("div", { className: "flex flex-col items-center justify-center py-24 text-center", children: [
+          /* @__PURE__ */ t(Ce, { className: "h-10 w-10 text-slate-200 dark:text-slate-700" }),
           /* @__PURE__ */ t("p", { className: "mt-3 text-[14px] font-medium text-slate-500", children: "Nothing sent yet" }),
-          /* @__PURE__ */ t("p", { className: "mt-1 text-[12px] text-slate-400", children: B ? 'No critical sends. Untick "Critical only" to see everything you sent.' : "Messages you send to stakeholders or colleagues appear here." })
-        ] }) : /* @__PURE__ */ t("div", { className: "divide-y divide-slate-100 overflow-hidden rounded-lg border border-slate-200 bg-white dark:divide-border dark:border-border dark:bg-card", children: ue.map((e) => /* @__PURE__ */ n("div", { className: "px-4 py-3", "data-nvr-sent-row": !0, children: [
+          /* @__PURE__ */ t("p", { className: "mt-1 text-[12px] text-slate-400", children: R ? 'No critical sends. Untick "Critical only" to see everything you sent.' : "Messages you send to stakeholders or colleagues appear here." })
+        ] }) : /* @__PURE__ */ t("div", { className: "divide-y divide-slate-100 overflow-hidden rounded-lg border border-slate-200 bg-white dark:divide-border dark:border-border dark:bg-card", children: pe.map((e) => /* @__PURE__ */ n("div", { className: "px-4 py-3", "data-nvr-sent-row": !0, children: [
           /* @__PURE__ */ n("div", { className: "flex items-baseline gap-2", children: [
             e.lane === "critical" && /* @__PURE__ */ t("span", { className: "shrink-0 rounded bg-red-500/10 px-1 text-[9.5px] font-bold uppercase tracking-wide text-red-600 dark:text-red-400", children: "Critical" }),
             /* @__PURE__ */ t("span", { className: "truncate text-[13px] font-medium text-slate-900 dark:text-slate-100", children: e.subject.replace(/^critical:\s*/i, "") }),
@@ -930,14 +962,14 @@ function jt({
                   }
                 ),
                 a.name,
-                a.ack === "acked" && /* @__PURE__ */ t(de, { className: "h-3 w-3" })
+                a.ack === "acked" && /* @__PURE__ */ t(ie, { className: "h-3 w-3" })
               ]
             },
             a.id
           )) })
         ] }, e.key)) })
-      ] }) : Re ? /* @__PURE__ */ t("p", { className: "px-8 py-10 text-[13px] text-slate-400", children: "Loading…" }) : O.length === 0 && H.length === 0 && _.length === 0 ? /* @__PURE__ */ n("div", { className: "flex flex-col items-center justify-center py-24 text-center", children: [
-        /* @__PURE__ */ t(we, { className: "h-10 w-10 text-slate-200 dark:text-slate-700" }),
+      ] }) : Qe ? /* @__PURE__ */ t("p", { className: "px-8 py-10 text-[13px] text-slate-400", children: "Loading…" }) : L.length === 0 && H.length === 0 && _.length === 0 ? /* @__PURE__ */ n("div", { className: "flex flex-col items-center justify-center py-24 text-center", children: [
+        /* @__PURE__ */ t(Ce, { className: "h-10 w-10 text-slate-200 dark:text-slate-700" }),
         /* @__PURE__ */ t("p", { className: "mt-3 text-[14px] font-medium text-slate-500", children: "You're all caught up" }),
         /* @__PURE__ */ t("p", { className: "mt-1 text-[12px] text-slate-400", children: i === "inbox" ? "No unread notifications." : "No notifications here." })
       ] }) : /* @__PURE__ */ n("div", { className: "mx-8 my-6 divide-y divide-slate-100 overflow-hidden rounded-lg border border-slate-200 bg-white dark:divide-border dark:border-border dark:bg-card", children: [
@@ -946,27 +978,27 @@ function jt({
             "Needs your acknowledgement · ",
             _.length
           ] }),
-          _.map((e) => /* @__PURE__ */ t(ie, { children: ne(e) }, `pin:${e.id}`))
+          _.map((e) => /* @__PURE__ */ t(se, { children: le(e) }, `pin:${e.id}`))
         ] }),
-        H.map(Ze),
-        O.map((e, a) => {
-          const l = (L) => {
-            if (!L) return "Older";
-            const o = new Date(L), k = /* @__PURE__ */ new Date(), le = new Date(k.getFullYear(), k.getMonth(), k.getDate());
-            return o >= le ? "Today" : o >= new Date(le.getTime() - 864e5) ? "Yesterday" : o >= new Date(le.getTime() - 5184e5) ? "This week" : "Older";
-          }, u = l(e.created_at), z = a > 0 ? l(O[a - 1].created_at) : null;
-          return /* @__PURE__ */ n(ie, { children: [
+        H.map(Ee),
+        L.map((e, a) => {
+          const l = (P) => {
+            if (!P) return "Older";
+            const o = new Date(P), k = /* @__PURE__ */ new Date(), re = new Date(k.getFullYear(), k.getMonth(), k.getDate());
+            return o >= re ? "Today" : o >= new Date(re.getTime() - 864e5) ? "Yesterday" : o >= new Date(re.getTime() - 5184e5) ? "This week" : "Older";
+          }, u = l(e.created_at), z = a > 0 ? l(L[a - 1].created_at) : null;
+          return /* @__PURE__ */ n(se, { children: [
             u !== z ? /* @__PURE__ */ t("div", { className: "bg-slate-50/80 px-4 py-1 text-[10.5px] font-semibold uppercase tracking-wide text-slate-400 dark:bg-muted/40", children: u }) : null,
-            ne(e)
+            le(e)
           ] }, e.id);
         })
       ] }),
-      i !== "sent" && D > ce && /* @__PURE__ */ n("div", { className: "mx-8 mb-6 flex items-center justify-between", children: [
+      i !== "sent" && D > ue && /* @__PURE__ */ n("div", { className: "mx-8 mb-6 flex items-center justify-between", children: [
         /* @__PURE__ */ n("p", { className: "text-[12px] text-slate-400", children: [
           "Page ",
           S,
           " of ",
-          W
+          E
         ] }),
         /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ n(
@@ -977,7 +1009,7 @@ function jt({
               onClick: () => q((e) => Math.max(1, e - 1)),
               className: "inline-flex h-7 items-center rounded-md border border-slate-200 px-2 text-[12px] disabled:opacity-40 dark:border-border",
               children: [
-                /* @__PURE__ */ t(tt, { className: "mr-1 h-3.5 w-3.5" }),
+                /* @__PURE__ */ t(rt, { className: "mr-1 h-3.5 w-3.5" }),
                 "Previous"
               ]
             }
@@ -986,12 +1018,12 @@ function jt({
             "button",
             {
               type: "button",
-              disabled: S >= W,
-              onClick: () => q((e) => Math.min(W, e + 1)),
+              disabled: S >= E,
+              onClick: () => q((e) => Math.min(E, e + 1)),
               className: "inline-flex h-7 items-center rounded-md border border-slate-200 px-2 text-[12px] disabled:opacity-40 dark:border-border",
               children: [
                 "Next",
-                /* @__PURE__ */ t(at, { className: "ml-1 h-3.5 w-3.5" })
+                /* @__PURE__ */ t(dt, { className: "ml-1 h-3.5 w-3.5" })
               ]
             }
           )
@@ -999,15 +1031,15 @@ function jt({
       ] })
     ] }),
     /* @__PURE__ */ t(
-      mt,
+      gt,
       {
         notificationId: (b == null ? void 0 : b.id) ?? null,
         title: (b == null ? void 0 : b.subject) ?? (b == null ? void 0 : b.title) ?? null,
-        onClose: () => be(null)
+        onClose: () => xe(null)
       }
     )
   ] });
 }
 export {
-  jt as NotificationCenterView
+  Qt as NotificationCenterView
 };