@adatechnology/notification-ui 0.4.1 → 0.6.0

package/dist/{chunk-SFMOFCHV.js → chunk-Y65PYMEH.js}

@@ -16,6 +16,7 @@ var pt_BR_default = {
   "item.markAsRead": "Marcar como lida",
   "item.delete": "Excluir",
   "item.unread": "N\xE3o lida",
+  "item.addToCalendar": "Adicionar \xE0 agenda",
   "preferences.title": "Prefer\xEAncias de notifica\xE7\xE3o",
   "preferences.description": "Escolha por onde voc\xEA quer ser avisado em cada assunto.",
   "preferences.save": "Salvar prefer\xEAncias",
@@ -111,7 +112,23 @@ var pt_BR_default = {
   "toolbar.italic": "Italico",
   "toolbar.strikethrough": "Tachado",
   "toolbar.monospace": "Monoespacado",
-  "toolbar.emoji": "Emoji"
+  "toolbar.emoji": "Emoji",
+  "banner.title": "Ativar notifica\xE7\xF5es",
+  "banner.description": "Receba lembretes de atividades, mensagens e avisos importantes diretamente no seu navegador.",
+  "banner.allow": "Permitir notifica\xE7\xF5es",
+  "banner.dismiss": "Agora n\xE3o",
+  "banner.activeTitle": "Notifica\xE7\xF5es ativas",
+  "banner.activeDescription": "Voc\xEA est\xE1 recebendo notifica\xE7\xF5es neste navegador.",
+  "banner.disable": "Desativar notifica\xE7\xF5es",
+  "banner.disabling": "Desativando\u2026",
+  "banner.deniedTitle": "Notifica\xE7\xF5es bloqueadas",
+  "banner.deniedDescription": "As notifica\xE7\xF5es est\xE3o bloqueadas no navegador. Para receber alertas, permita nas configura\xE7\xF5es do site.",
+  "settings.pager": "Pagina\xE7\xE3o das mensagens",
+  "settings.pagerRange": "{from}\u2013{to} de {total}",
+  "settings.pageSize": "Por p\xE1gina",
+  "settings.pagePrevious": "Anterior",
+  "settings.pageNext": "Pr\xF3xima",
+  "settings.pageOf": "P\xE1gina {page} de {pages}"
 };
 
 // src/locales/en.json
@@ -129,6 +146,7 @@ var en_default = {
   "item.markAsRead": "Mark as read",
   "item.delete": "Delete",
   "item.unread": "Unread",
+  "item.addToCalendar": "Add to calendar",
   "preferences.title": "Notification preferences",
   "preferences.description": "Choose how you want to be notified about each topic.",
   "preferences.save": "Save preferences",
@@ -224,7 +242,23 @@ var en_default = {
   "toolbar.italic": "Italic",
   "toolbar.strikethrough": "Strikethrough",
   "toolbar.monospace": "Monospace",
-  "toolbar.emoji": "Emoji"
+  "toolbar.emoji": "Emoji",
+  "banner.title": "Enable notifications",
+  "banner.description": "Receive activity reminders, messages, and important alerts directly in your browser.",
+  "banner.allow": "Allow notifications",
+  "banner.dismiss": "Not now",
+  "banner.activeTitle": "Notifications enabled",
+  "banner.activeDescription": "You are receiving notifications in this browser.",
+  "banner.disable": "Disable notifications",
+  "banner.disabling": "Disabling\u2026",
+  "banner.deniedTitle": "Notifications blocked",
+  "banner.deniedDescription": "Notifications are blocked in your browser. To receive alerts, allow them in your site settings.",
+  "settings.pager": "Message pagination",
+  "settings.pagerRange": "{from}\u2013{to} of {total}",
+  "settings.pageSize": "Per page",
+  "settings.pagePrevious": "Previous",
+  "settings.pageNext": "Next",
+  "settings.pageOf": "Page {page} of {pages}"
 };
 
 // src/locales/index.ts
@@ -265,6 +299,187 @@ function useNotificationContext() {
   if (!context) throw new Error("notification-ui: componente usado fora de <NotificationProvider>");
   return context;
 }
+function useOptionalNotificationContext() {
+  return useContext(NotificationContext);
+}
+
+// src/hooks/useNotificationPermission.ts
+import { useCallback, useEffect, useState } from "react";
+import {
+  getWebPushSubscription,
+  isWebPushSupported,
+  subscribeWebPush,
+  unsubscribeWebPush
+} from "@adatechnology/notification-client";
+var DEFAULT_STORAGE_KEY = "adatechnology:notification:permission-dismissed";
+var DEFAULT_DEVICE_KEY = "adatechnology:notification:device-id";
+var DEFAULT_DISMISS_TTL_MS = 7 * 24 * 60 * 60 * 1e3;
+function readCurrentNotificationPermission() {
+  if (typeof window === "undefined" || !("Notification" in window)) {
+    return "unsupported";
+  }
+  return Notification.permission;
+}
+function checkIsNotificationDismissed(storageKey, dismissTtlMs) {
+  if (typeof window === "undefined" || typeof window.localStorage === "undefined") {
+    return false;
+  }
+  try {
+    const raw = window.localStorage.getItem(storageKey);
+    if (!raw) return false;
+    const parsed = JSON.parse(raw);
+    if (!parsed?.dismissedAt) return false;
+    if (dismissTtlMs > 0 && Date.now() - parsed.dismissedAt > dismissTtlMs) {
+      window.localStorage.removeItem(storageKey);
+      return false;
+    }
+    return true;
+  } catch {
+    return false;
+  }
+}
+function useNotificationPermission(options) {
+  const context = useOptionalNotificationContext();
+  const storageKey = options?.storageKey ?? DEFAULT_STORAGE_KEY;
+  const deviceStorageKey = options?.deviceStorageKey ?? DEFAULT_DEVICE_KEY;
+  const dismissTtlMs = options?.dismissTtlMs ?? DEFAULT_DISMISS_TTL_MS;
+  const isSupported = isWebPushSupported();
+  const [permission, setPermission] = useState(readCurrentNotificationPermission);
+  const [isSubscribed, setIsSubscribed] = useState(false);
+  const [isDismissed, setIsDismissed] = useState(() => checkIsNotificationDismissed(storageKey, dismissTtlMs));
+  const [isPending, setIsPending] = useState(false);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    setPermission(readCurrentNotificationPermission());
+    setIsDismissed(checkIsNotificationDismissed(storageKey, dismissTtlMs));
+    if (!isSupported) return;
+    let isMounted = true;
+    getWebPushSubscription(options?.serviceWorkerRegistration).then((sub) => {
+      if (isMounted && sub) {
+        setIsSubscribed(true);
+      }
+    }).catch(() => {
+    });
+    return () => {
+      isMounted = false;
+    };
+  }, [isSupported, storageKey, dismissTtlMs, options?.serviceWorkerRegistration]);
+  const requestPermission = useCallback(async () => {
+    if (typeof window === "undefined" || !("Notification" in window)) {
+      return false;
+    }
+    setIsPending(true);
+    setError(null);
+    try {
+      const result = await Notification.requestPermission();
+      const updatedStatus = result;
+      setPermission(updatedStatus);
+      if (updatedStatus !== "granted") {
+        setIsPending(false);
+        return false;
+      }
+      let vapidKey = options?.vapidPublicKey;
+      if (!vapidKey && context?.client) {
+        try {
+          vapidKey = await context.client.getVapidPublicKey();
+        } catch {
+        }
+      }
+      if (vapidKey) {
+        const subscription = await subscribeWebPush({
+          vapidPublicKey: vapidKey,
+          serviceWorkerRegistration: options?.serviceWorkerRegistration
+        });
+        if (subscription) {
+          setIsSubscribed(true);
+          if (context?.client) {
+            try {
+              const device = await context.client.registerWebPush(subscription);
+              if (typeof window !== "undefined" && window.localStorage) {
+                window.localStorage.setItem(deviceStorageKey, device.id);
+              }
+            } catch {
+            }
+          }
+          if (options?.onSubscribe) {
+            await options.onSubscribe(subscription);
+          }
+        }
+      }
+      if (typeof window !== "undefined" && window.localStorage) {
+        window.localStorage.removeItem(storageKey);
+      }
+      setIsDismissed(false);
+      setIsPending(false);
+      return true;
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+      setIsPending(false);
+      return false;
+    }
+  }, [
+    context?.client,
+    deviceStorageKey,
+    options?.onSubscribe,
+    options?.serviceWorkerRegistration,
+    options?.vapidPublicKey,
+    storageKey
+  ]);
+  const disableNotifications = useCallback(async () => {
+    setIsPending(true);
+    setError(null);
+    try {
+      await unsubscribeWebPush(options?.serviceWorkerRegistration);
+      if (context?.client && typeof window !== "undefined" && window.localStorage) {
+        const deviceId = window.localStorage.getItem(deviceStorageKey);
+        if (deviceId) {
+          await context.client.unregisterDevice(deviceId).catch(() => void 0);
+          window.localStorage.removeItem(deviceStorageKey);
+        }
+      }
+      if (options?.onUnsubscribe) {
+        await options.onUnsubscribe();
+      }
+      setIsSubscribed(false);
+      setIsPending(false);
+      return true;
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+      setIsPending(false);
+      return false;
+    }
+  }, [context?.client, deviceStorageKey, options?.onUnsubscribe, options?.serviceWorkerRegistration]);
+  const dismiss = useCallback(() => {
+    if (typeof window !== "undefined" && window.localStorage) {
+      try {
+        window.localStorage.setItem(storageKey, JSON.stringify({ dismissedAt: Date.now() }));
+      } catch {
+      }
+    }
+    setIsDismissed(true);
+  }, [storageKey]);
+  const resetDismissed = useCallback(() => {
+    if (typeof window !== "undefined" && window.localStorage) {
+      try {
+        window.localStorage.removeItem(storageKey);
+      } catch {
+      }
+    }
+    setIsDismissed(false);
+  }, [storageKey]);
+  return {
+    permission,
+    isSupported,
+    isSubscribed,
+    isDismissed,
+    isPending,
+    error,
+    requestPermission,
+    disableNotifications,
+    dismiss,
+    resetDismissed
+  };
+}
 
 // src/hooks/useNotifications.ts
 import { useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
@@ -354,7 +569,7 @@ function flattenNotificationPages(pages) {
 }
 
 // src/hooks/useNotificationStream.ts
-import { useEffect } from "react";
+import { useEffect as useEffect2 } from "react";
 import { useQueryClient as useQueryClient2 } from "@tanstack/react-query";
 import { subscribeToNotificationStream } from "@adatechnology/notification-client";
 function useNotificationStream(options = {}) {
@@ -362,7 +577,7 @@ function useNotificationStream(options = {}) {
   const queryClient = useQueryClient2();
   const enabled = options.enabled ?? false;
   const onEvent = options.onEvent;
-  useEffect(() => {
+  useEffect2(() => {
     if (!enabled) return;
     let subscription;
     let cancelled = false;
@@ -385,7 +600,7 @@ function useNotificationStream(options = {}) {
 }
 
 // src/hooks/useCategoryPolicies.ts
-import { useMemo as useMemo2, useState } from "react";
+import { useMemo as useMemo2, useState as useState2 } from "react";
 import { useMutation as useMutation2, useQuery as useQuery2, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
 function identityOf(params) {
   return `${params.category}:${params.channel}`;
@@ -403,7 +618,7 @@ function useCategoryPolicies() {
       void queryClient.invalidateQueries({ queryKey: NOTIFICATION_QUERY_KEYS.categoryPolicies() });
     }
   });
-  const [touched, setTouched] = useState({});
+  const [touched, setTouched] = useState2({});
   const saved = useMemo2(() => {
     const byIdentity = /* @__PURE__ */ new Map();
     for (const policy of policiesQuery.data ?? []) byIdentity.set(identityOf(policy), policy.enabled);
@@ -543,7 +758,7 @@ function formatNotificationTimestamp(isoTimestamp, locale) {
 }
 
 // src/hooks/useTemplateEditor.ts
-import { useMemo as useMemo3, useState as useState2 } from "react";
+import { useMemo as useMemo3, useState as useState3 } from "react";
 
 // src/templateList.constant.ts
 var TEMPLATE_VIEWS = {
@@ -566,6 +781,12 @@ var TEMPLATE_COLUMNS = [
   { labelKey: "settings.column.version", field: TEMPLATE_SORT_FIELDS.VERSION },
   { labelKey: "settings.column.actions", headerHidden: true }
 ];
+var TEMPLATE_PAGE_SIZES = [10, 25, 50];
+var DEFAULT_TEMPLATE_PAGE_SIZE = 25;
+function summarizeTemplateBody(body, maxLength = 140) {
+  const text = body.replace(/<!--[\s\S]*?-->/g, " ").replace(/<(style|script|head)[\s\S]*?<\/\1>/gi, " ").replace(/<[^>]*>/g, " ").replace(/&nbsp;/g, " ").replace(/\s+/g, " ").trim();
+  return text.length > maxLength ? `${text.slice(0, maxLength - 1).trimEnd()}\u2026` : text;
+}
 
 // src/hooks/useTemplateEditor.ts
 import {
@@ -638,14 +859,16 @@ function useTemplateEditor(params = {}) {
   const upsert = useUpsertTemplate();
   const deactivateMutation = useDeactivateTemplate();
   const restoreMutation = useRestoreTemplateDefault();
-  const [search, setSearch] = useState2("");
-  const [channelFilter, setChannelFilter] = useState2([]);
-  const [categoryFilter, setCategoryFilter] = useState2([]);
-  const [view, setView] = useState2(TEMPLATE_VIEWS.TABLE);
-  const [sort, setSort] = useState2(void 0);
-  const [selectedId, setSelectedId] = useState2(void 0);
-  const [draft, setDraft] = useState2(void 0);
-  const [isNew, setIsNew] = useState2(false);
+  const [search, setSearch] = useState3("");
+  const [channelFilter, setChannelFilter] = useState3([]);
+  const [categoryFilter, setCategoryFilter] = useState3([]);
+  const [view, setView] = useState3(TEMPLATE_VIEWS.TABLE);
+  const [requestedPage, setRequestedPage] = useState3(1);
+  const [pageSize, setPageSizeState] = useState3(DEFAULT_TEMPLATE_PAGE_SIZE);
+  const [sort, setSort] = useState3(void 0);
+  const [selectedId, setSelectedId] = useState3(void 0);
+  const [draft, setDraft] = useState3(void 0);
+  const [isNew, setIsNew] = useState3(false);
   const templates = useMemo3(() => {
     const activeByIdentity = /* @__PURE__ */ new Map();
     for (const template of templatesQuery.data ?? []) {
@@ -680,16 +903,19 @@ function useTemplateEditor(params = {}) {
       return left[campo].localeCompare(right[campo]) * sinal;
     });
   }, [filtered, sort]);
+  const pageCount = Math.max(1, Math.ceil(sorted.length / pageSize));
+  const page = Math.min(requestedPage, pageCount);
+  const paged = useMemo3(() => sorted.slice((page - 1) * pageSize, page * pageSize), [sorted, page, pageSize]);
   const groups = useMemo3(() => {
     const porCategoria = /* @__PURE__ */ new Map();
-    for (const template of sorted) {
+    for (const template of paged) {
       const categoria = categoryOf(template.key);
       const atual = porCategoria.get(categoria);
       if (atual) atual.push(template);
       else porCategoria.set(categoria, [template]);
     }
     return [...porCategoria.entries()].sort(([left], [right]) => left.localeCompare(right)).map(([category, list]) => ({ category, templates: list }));
-  }, [sorted]);
+  }, [paged]);
   const selected = useMemo3(() => templates.find((template) => template.id === selectedId), [templates, selectedId]);
   const variables = useMemo3(() => draft ? variablesQuery.data?.[draft.key] ?? [] : [], [variablesQuery.data, draft]);
   const variableDiff = useMemo3(
@@ -738,7 +964,16 @@ function useTemplateEditor(params = {}) {
     return Object.keys(original).some((field) => original[field] !== atual[field]);
   }, [draft, selected, isNew]);
   return {
-    templates: sorted,
+    templates: paged,
+    filteredCount: sorted.length,
+    page,
+    pageCount,
+    pageSize,
+    setPage: (next) => setRequestedPage(Math.min(Math.max(1, next), pageCount)),
+    setPageSize: (size) => {
+      setPageSizeState(size);
+      setRequestedPage(1);
+    },
     groups,
     view,
     sort,
@@ -770,13 +1005,18 @@ function useTemplateEditor(params = {}) {
     /** Todo canal marcado precisa do proprio texto — senao a gravacao criaria template vazio. */
     canSave: Boolean(draft?.key) && (draft?.channels.length ?? 0) > 0 && (draft?.channels.every((channel) => (draft.byChannel[channel]?.body ?? "").length > 0) ?? false) && variableDiff.unknown.length === 0 && // O modelo padrão inutilizável nunca é gravado: o servidor recusa (400) e o envio o ignoraria.
     (standardAssessment?.usable ?? true),
-    setSearch,
+    setSearch(value) {
+      setSearch(value);
+      setRequestedPage(1);
+    },
     toggleChannelFilter(channel) {
+      setRequestedPage(1);
       setChannelFilter(
         (current) => current.includes(channel) ? current.filter((each) => each !== channel) : [...current, channel]
       );
     },
     toggleCategoryFilter(category) {
+      setRequestedPage(1);
       setCategoryFilter(
         (current) => current.includes(category) ? current.filter((each) => each !== category) : [...current, category]
       );
@@ -790,6 +1030,7 @@ function useTemplateEditor(params = {}) {
       });
     },
     clearFilters() {
+      setRequestedPage(1);
       setSearch("");
       setChannelFilter([]);
       setCategoryFilter([]);
@@ -898,6 +1139,8 @@ export {
   resolveMessages,
   NotificationProvider,
   useNotificationContext,
+  useOptionalNotificationContext,
+  useNotificationPermission,
   NOTIFICATION_QUERY_KEYS,
   useNotifications,
   useUnreadCount,
@@ -920,7 +1163,9 @@ export {
   TEMPLATE_SORT_FIELDS,
   SORT_DIRECTIONS,
   TEMPLATE_COLUMNS,
+  TEMPLATE_PAGE_SIZES,
+  summarizeTemplateBody,
   isStandardEmailKey,
   useTemplateEditor
 };
-//# sourceMappingURL=chunk-SFMOFCHV.js.map
+//# sourceMappingURL=chunk-Y65PYMEH.js.map