@novu/react 2.0.0-canary.2 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React$1 from 'react';
3
- import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab } from '@novu/js/ui';
3
+ import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab, RouterPush } from '@novu/js/ui';
4
4
  export { Notification } from '@novu/js/ui';
5
5
 
6
6
  type NotificationsRenderer = (notification: Notification) => React.ReactNode;
@@ -22,6 +22,7 @@ type BaseProps = {
22
22
  appearance?: Appearance;
23
23
  localization?: Localization;
24
24
  tabs?: Array<Tab>;
25
+ routerPush?: RouterPush;
25
26
  };
26
27
  type DefaultProps = BaseProps & DefaultInboxProps & {
27
28
  children?: never;
@@ -1,6 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React$1 from 'react';
3
- import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab } from '@novu/js/ui';
3
+ import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab, RouterPush } from '@novu/js/ui';
4
4
  export { Notification } from '@novu/js/ui';
5
5
 
6
6
  type NotificationsRenderer = (notification: Notification) => React.ReactNode;
@@ -22,6 +22,7 @@ type BaseProps = {
22
22
  appearance?: Appearance;
23
23
  localization?: Localization;
24
24
  tabs?: Array<Tab>;
25
+ routerPush?: RouterPush;
25
26
  };
26
27
  type DefaultProps = BaseProps & DefaultInboxProps & {
27
28
  children?: never;
@@ -103,7 +103,7 @@ var Bell = import_react3.default.memo((props) => {
103
103
  return novuUI.mountComponent({
104
104
  name: "Bell",
105
105
  element,
106
- props: renderBell ? { mountBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : void 0
106
+ props: renderBell ? { renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : void 0
107
107
  });
108
108
  },
109
109
  [renderBell]
@@ -165,6 +165,7 @@ var Renderer = ({ options, children }) => {
165
165
  novuUI.updateLocalization(options.localization);
166
166
  novuUI.updateTabs(options.tabs);
167
167
  novuUI.updateOptions(options.options);
168
+ novuUI.updateRouterPush(options.routerPush);
168
169
  }, [options]);
169
170
  if (!novuUI) {
170
171
  return null;
@@ -188,8 +189,8 @@ var DefaultInbox = (props) => {
188
189
  name: "Inbox",
189
190
  props: {
190
191
  open,
191
- mountNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
192
- mountBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : void 0,
192
+ renderNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
193
+ renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : void 0,
193
194
  onNotificationClick,
194
195
  onPrimaryActionClick,
195
196
  onSecondaryActionClick
@@ -202,12 +203,23 @@ var DefaultInbox = (props) => {
202
203
  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Mounter, { mount });
203
204
  };
204
205
  var Inbox = import_react6.default.memo((props) => {
205
- const { localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl } = props;
206
+ const {
207
+ localization,
208
+ appearance,
209
+ tabs,
210
+ routerPush,
211
+ applicationIdentifier,
212
+ subscriberId,
213
+ subscriberHash,
214
+ backendUrl,
215
+ socketUrl
216
+ } = props;
206
217
  const options = (0, import_react6.useMemo)(() => {
207
218
  return {
208
219
  localization,
209
220
  appearance,
210
221
  tabs,
222
+ routerPush,
211
223
  options: { applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl }
212
224
  };
213
225
  }, [localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl]);
@@ -257,7 +269,7 @@ var Notifications = import_react8.default.memo((props) => {
257
269
  name: "Notifications",
258
270
  element,
259
271
  props: {
260
- mountNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
272
+ renderNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
261
273
  onNotificationClick,
262
274
  onPrimaryActionClick,
263
275
  onSecondaryActionClick
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts","../../src/components/Bell.tsx","../../src/utils/createContextAndHook.ts","../../src/context/RenderContext.tsx","../../src/components/Mounter.tsx","../../src/components/Inbox.tsx","../../src/components/Renderer.tsx","../../src/hooks/useDataRef.ts","../../src/components/Preferences.tsx","../../src/components/Notifications.tsx"],"sourcesContent":["export * from './components';\nexport * from './utils/types';\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport { BellRenderer } from '../utils/types';\n\nexport type BellProps = {\n renderBell?: BellRenderer;\n};\n\nexport const Bell = React.memo((props: BellProps) => {\n const { renderBell } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Bell',\n element,\n props: renderBell ? { mountBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : undefined,\n });\n },\n [renderBell]\n );\n\n return <Mounter mount={mount} />;\n});\n","import React from 'react';\n\nexport function assertContextExists(contextVal: unknown, msgOrCtx: string | React.Context<any>): asserts contextVal {\n if (!contextVal) {\n throw typeof msgOrCtx === 'string' ? new Error(msgOrCtx) : new Error(`${msgOrCtx.displayName} not found`);\n }\n}\n\ntype Options = { assertCtxFn?: (v: unknown, msg: string) => void };\ntype ContextOf<T> = React.Context<{ value: T } | undefined>;\ntype UseCtxFn<T> = () => T;\n\n/**\n * Creates and returns a Context and two hooks that return the context value.\n * The Context type is derived from the type passed in by the user.\n * The first hook returned guarantees that the context exists so the returned value is always CtxValue\n * The second hook makes no guarantees, so the returned value can be CtxValue | undefined\n */\nexport const createContextAndHook = <CtxVal>(\n displayName: string,\n options?: Options\n): [ContextOf<CtxVal>, UseCtxFn<CtxVal>, UseCtxFn<CtxVal | Partial<CtxVal>>] => {\n const { assertCtxFn = assertContextExists } = options || {};\n const Ctx = React.createContext<{ value: CtxVal } | undefined>(undefined);\n Ctx.displayName = displayName;\n\n const useCtx = () => {\n const ctx = React.useContext(Ctx);\n assertCtxFn(ctx, `Component must be wrapped with the <Inbox /> Component`);\n\n return (ctx as any).value as CtxVal;\n };\n\n const useCtxWithoutGuarantee = () => {\n const ctx = React.useContext(Ctx);\n\n return ctx ? ctx.value : {};\n };\n\n return [Ctx, useCtx, useCtxWithoutGuarantee];\n};\n","import React from 'react';\nimport type { NovuUI } from '@novu/js/ui';\nimport { createContextAndHook } from '../utils/createContextAndHook';\n\nexport type MountedElement = React.ReactNode;\nexport type MountedElements = Map<HTMLElement, MountedElement>;\n\ntype RendererContextValue = {\n mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void;\n novuUI: NovuUI;\n};\n\nconst [RendererContext, useRendererContext] = createContextAndHook<RendererContextValue>('RendererContext');\n\nconst RendererProvider = (props: React.PropsWithChildren<{ value: RendererContextValue }>) => {\n return <RendererContext.Provider value={{ value: props.value }}>{props.children}</RendererContext.Provider>;\n};\n\nexport { useRendererContext as useRenderer, RendererProvider };\n","import React from 'react';\n\ntype MounterProps = {\n mount: (node: HTMLElement) => ((node: HTMLElement) => void) | void;\n};\n\n/**\n * Mounter allows you to mount a component to a DOM node.\n */\nexport function Mounter({ mount }: MounterProps) {\n const ref = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n let unmount: (node: HTMLDivElement) => void | undefined;\n const element = ref.current;\n if (element && mount) {\n const possibleUnmount = mount(element);\n if (possibleUnmount) {\n unmount = possibleUnmount;\n }\n }\n\n return () => {\n if (element && unmount) {\n unmount(element);\n }\n };\n }, [ref, mount]);\n\n return <div ref={ref} />;\n}\n","import React, { useMemo } from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { DefaultProps, DefaultInboxProps, WithChildrenProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { Renderer } from './Renderer';\n\nexport type InboxProps = DefaultProps | WithChildrenProps;\n\nconst DefaultInbox = (props: DefaultInboxProps) => {\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Inbox',\n props: {\n open,\n mountNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n mountBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n element,\n });\n },\n [open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n};\n\nexport const Inbox = React.memo((props: InboxProps) => {\n const { localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl } =\n props;\n\n const options = useMemo(() => {\n return {\n localization,\n appearance,\n tabs,\n options: { applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl },\n };\n }, [localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl]);\n\n if (isWithChildrenProps(props)) {\n return <Renderer options={options}>{props.children}</Renderer>;\n }\n\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n\n return (\n <Renderer options={options}>\n <DefaultInbox\n open={open}\n renderNotification={renderNotification}\n renderBell={renderBell}\n onNotificationClick={onNotificationClick}\n onPrimaryActionClick={onPrimaryActionClick}\n onSecondaryActionClick={onSecondaryActionClick}\n />\n </Renderer>\n );\n});\n\nfunction isWithChildrenProps(props: InboxProps): props is WithChildrenProps {\n return 'children' in props;\n}\n","import React, { useCallback, useEffect, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { NovuUI } from '@novu/js/ui';\nimport type { NovuUIOptions } from '@novu/js/ui';\nimport { MountedElement, RendererProvider } from '../context/RenderContext';\nimport { useDataRef } from '../hooks/useDataRef';\n\ntype RendererProps = React.PropsWithChildren<{\n options: NovuUIOptions;\n}>;\n\n/**\n *\n * Renderer component that provides the NovuUI instance and mounts the elements on DOM in a portal\n */\nexport const Renderer = ({ options, children }: RendererProps) => {\n const optionsRef = useDataRef(options);\n const [novuUI, setNovuUI] = useState<NovuUI | undefined>();\n const [mountedElements, setMountedElements] = useState(new Map<HTMLElement, MountedElement>());\n\n const mountElement = useCallback(\n (el: HTMLElement, mountedElement: MountedElement) => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.set(el, mountedElement);\n\n return newMountedElements;\n });\n\n return () => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.delete(el);\n\n return newMountedElements;\n });\n };\n },\n [setMountedElements]\n );\n\n useEffect(() => {\n const novu = new NovuUI(optionsRef.current);\n setNovuUI(novu);\n\n return () => {\n novu.unmount();\n };\n }, []);\n\n useEffect(() => {\n if (!novuUI) {\n return;\n }\n\n novuUI.updateAppearance(options.appearance);\n novuUI.updateLocalization(options.localization);\n novuUI.updateTabs(options.tabs);\n novuUI.updateOptions(options.options);\n }, [options]);\n\n if (!novuUI) {\n return null;\n }\n\n return (\n <RendererProvider value={{ mountElement, novuUI }}>\n {[...mountedElements].map(([element, mountedElement]) => {\n return ReactDOM.createPortal(mountedElement, element);\n })}\n\n {children}\n </RendererProvider>\n );\n};\n","import { useRef } from 'react';\n\nexport const useDataRef = <T>(data: T) => {\n const ref = useRef(data);\n ref.current = data;\n\n return ref;\n};\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\n\nexport const Preferences = () => {\n const { novuUI } = useRenderer();\n\n const mount = React.useCallback((element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Preferences',\n element,\n });\n }, []);\n\n return <Mounter mount={mount} />;\n};\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport type { NotificationClickHandler, NotificationActionClickHandler } from '@novu/js/ui';\nimport { NotificationsRenderer } from '../utils/types';\n\nexport type NotificationProps = {\n renderNotification?: NotificationsRenderer;\n onNotificationClick?: NotificationClickHandler;\n onPrimaryActionClick?: NotificationActionClickHandler;\n onSecondaryActionClick?: NotificationActionClickHandler;\n};\n\nexport const Notifications = React.memo((props: NotificationProps) => {\n const { onNotificationClick, onPrimaryActionClick, renderNotification, onSecondaryActionClick } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Notifications',\n element,\n props: {\n mountNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n });\n },\n [renderNotification, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n});\n"],"mappings":"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","names":["import_react","React","import_react","import_jsx_runtime","React","import_jsx_runtime","React","import_react","import_react","import_react","import_jsx_runtime","ReactDOM","import_jsx_runtime","React","import_react","import_jsx_runtime","React","import_react","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.ts","../../src/components/Bell.tsx","../../src/utils/createContextAndHook.ts","../../src/context/RenderContext.tsx","../../src/components/Mounter.tsx","../../src/components/Inbox.tsx","../../src/components/Renderer.tsx","../../src/hooks/useDataRef.ts","../../src/components/Preferences.tsx","../../src/components/Notifications.tsx"],"sourcesContent":["export * from './components';\nexport * from './utils/types';\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport { BellRenderer } from '../utils/types';\n\nexport type BellProps = {\n renderBell?: BellRenderer;\n};\n\nexport const Bell = React.memo((props: BellProps) => {\n const { renderBell } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Bell',\n element,\n props: renderBell ? { renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : undefined,\n });\n },\n [renderBell]\n );\n\n return <Mounter mount={mount} />;\n});\n","import React from 'react';\n\nexport function assertContextExists(contextVal: unknown, msgOrCtx: string | React.Context<any>): asserts contextVal {\n if (!contextVal) {\n throw typeof msgOrCtx === 'string' ? new Error(msgOrCtx) : new Error(`${msgOrCtx.displayName} not found`);\n }\n}\n\ntype Options = { assertCtxFn?: (v: unknown, msg: string) => void };\ntype ContextOf<T> = React.Context<{ value: T } | undefined>;\ntype UseCtxFn<T> = () => T;\n\n/**\n * Creates and returns a Context and two hooks that return the context value.\n * The Context type is derived from the type passed in by the user.\n * The first hook returned guarantees that the context exists so the returned value is always CtxValue\n * The second hook makes no guarantees, so the returned value can be CtxValue | undefined\n */\nexport const createContextAndHook = <CtxVal>(\n displayName: string,\n options?: Options\n): [ContextOf<CtxVal>, UseCtxFn<CtxVal>, UseCtxFn<CtxVal | Partial<CtxVal>>] => {\n const { assertCtxFn = assertContextExists } = options || {};\n const Ctx = React.createContext<{ value: CtxVal } | undefined>(undefined);\n Ctx.displayName = displayName;\n\n const useCtx = () => {\n const ctx = React.useContext(Ctx);\n assertCtxFn(ctx, `Component must be wrapped with the <Inbox /> Component`);\n\n return (ctx as any).value as CtxVal;\n };\n\n const useCtxWithoutGuarantee = () => {\n const ctx = React.useContext(Ctx);\n\n return ctx ? ctx.value : {};\n };\n\n return [Ctx, useCtx, useCtxWithoutGuarantee];\n};\n","import React from 'react';\nimport type { NovuUI } from '@novu/js/ui';\nimport { createContextAndHook } from '../utils/createContextAndHook';\n\nexport type MountedElement = React.ReactNode;\nexport type MountedElements = Map<HTMLElement, MountedElement>;\n\ntype RendererContextValue = {\n mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void;\n novuUI: NovuUI;\n};\n\nconst [RendererContext, useRendererContext] = createContextAndHook<RendererContextValue>('RendererContext');\n\nconst RendererProvider = (props: React.PropsWithChildren<{ value: RendererContextValue }>) => {\n return <RendererContext.Provider value={{ value: props.value }}>{props.children}</RendererContext.Provider>;\n};\n\nexport { useRendererContext as useRenderer, RendererProvider };\n","import React from 'react';\n\ntype MounterProps = {\n mount: (node: HTMLElement) => ((node: HTMLElement) => void) | void;\n};\n\n/**\n * Mounter allows you to mount a component to a DOM node.\n */\nexport function Mounter({ mount }: MounterProps) {\n const ref = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n let unmount: (node: HTMLDivElement) => void | undefined;\n const element = ref.current;\n if (element && mount) {\n const possibleUnmount = mount(element);\n if (possibleUnmount) {\n unmount = possibleUnmount;\n }\n }\n\n return () => {\n if (element && unmount) {\n unmount(element);\n }\n };\n }, [ref, mount]);\n\n return <div ref={ref} />;\n}\n","import React, { useMemo } from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { DefaultProps, DefaultInboxProps, WithChildrenProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { Renderer } from './Renderer';\n\nexport type InboxProps = DefaultProps | WithChildrenProps;\n\nconst DefaultInbox = (props: DefaultInboxProps) => {\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Inbox',\n props: {\n open,\n renderNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n element,\n });\n },\n [open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n};\n\nexport const Inbox = React.memo((props: InboxProps) => {\n const {\n localization,\n appearance,\n tabs,\n routerPush,\n applicationIdentifier,\n subscriberId,\n subscriberHash,\n backendUrl,\n socketUrl,\n } = props;\n\n const options = useMemo(() => {\n return {\n localization,\n appearance,\n tabs,\n routerPush,\n options: { applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl },\n };\n }, [localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl]);\n\n if (isWithChildrenProps(props)) {\n return <Renderer options={options}>{props.children}</Renderer>;\n }\n\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n\n return (\n <Renderer options={options}>\n <DefaultInbox\n open={open}\n renderNotification={renderNotification}\n renderBell={renderBell}\n onNotificationClick={onNotificationClick}\n onPrimaryActionClick={onPrimaryActionClick}\n onSecondaryActionClick={onSecondaryActionClick}\n />\n </Renderer>\n );\n});\n\nfunction isWithChildrenProps(props: InboxProps): props is WithChildrenProps {\n return 'children' in props;\n}\n","import React, { useCallback, useEffect, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { NovuUI } from '@novu/js/ui';\nimport type { NovuUIOptions } from '@novu/js/ui';\nimport { MountedElement, RendererProvider } from '../context/RenderContext';\nimport { useDataRef } from '../hooks/useDataRef';\n\ntype RendererProps = React.PropsWithChildren<{\n options: NovuUIOptions;\n}>;\n\n/**\n *\n * Renderer component that provides the NovuUI instance and mounts the elements on DOM in a portal\n */\nexport const Renderer = ({ options, children }: RendererProps) => {\n const optionsRef = useDataRef(options);\n const [novuUI, setNovuUI] = useState<NovuUI | undefined>();\n const [mountedElements, setMountedElements] = useState(new Map<HTMLElement, MountedElement>());\n\n const mountElement = useCallback(\n (el: HTMLElement, mountedElement: MountedElement) => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.set(el, mountedElement);\n\n return newMountedElements;\n });\n\n return () => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.delete(el);\n\n return newMountedElements;\n });\n };\n },\n [setMountedElements]\n );\n\n useEffect(() => {\n const novu = new NovuUI(optionsRef.current);\n setNovuUI(novu);\n\n return () => {\n novu.unmount();\n };\n }, []);\n\n useEffect(() => {\n if (!novuUI) {\n return;\n }\n\n novuUI.updateAppearance(options.appearance);\n novuUI.updateLocalization(options.localization);\n novuUI.updateTabs(options.tabs);\n novuUI.updateOptions(options.options);\n novuUI.updateRouterPush(options.routerPush);\n }, [options]);\n\n if (!novuUI) {\n return null;\n }\n\n return (\n <RendererProvider value={{ mountElement, novuUI }}>\n {[...mountedElements].map(([element, mountedElement]) => {\n return ReactDOM.createPortal(mountedElement, element);\n })}\n\n {children}\n </RendererProvider>\n );\n};\n","import { useRef } from 'react';\n\nexport const useDataRef = <T>(data: T) => {\n const ref = useRef(data);\n ref.current = data;\n\n return ref;\n};\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\n\nexport const Preferences = () => {\n const { novuUI } = useRenderer();\n\n const mount = React.useCallback((element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Preferences',\n element,\n });\n }, []);\n\n return <Mounter mount={mount} />;\n};\n","import React from 'react';\nimport type { NotificationClickHandler, NotificationActionClickHandler } from '@novu/js/ui';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport { NotificationsRenderer } from '../utils/types';\n\nexport type NotificationProps = {\n renderNotification?: NotificationsRenderer;\n onNotificationClick?: NotificationClickHandler;\n onPrimaryActionClick?: NotificationActionClickHandler;\n onSecondaryActionClick?: NotificationActionClickHandler;\n};\n\nexport const Notifications = React.memo((props: NotificationProps) => {\n const { onNotificationClick, onPrimaryActionClick, renderNotification, onSecondaryActionClick } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Notifications',\n element,\n props: {\n renderNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n });\n },\n [renderNotification, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n});\n"],"mappings":"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","names":["import_react","React","import_react","import_jsx_runtime","React","import_jsx_runtime","React","import_react","import_react","import_react","import_jsx_runtime","ReactDOM","import_jsx_runtime","React","import_react","import_jsx_runtime","React","import_react","import_jsx_runtime","React"]}
@@ -64,7 +64,7 @@ var Bell = React3.memo((props) => {
64
64
  return novuUI.mountComponent({
65
65
  name: "Bell",
66
66
  element,
67
- props: renderBell ? { mountBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : void 0
67
+ props: renderBell ? { renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : void 0
68
68
  });
69
69
  },
70
70
  [renderBell]
@@ -126,6 +126,7 @@ var Renderer = ({ options, children }) => {
126
126
  novuUI.updateLocalization(options.localization);
127
127
  novuUI.updateTabs(options.tabs);
128
128
  novuUI.updateOptions(options.options);
129
+ novuUI.updateRouterPush(options.routerPush);
129
130
  }, [options]);
130
131
  if (!novuUI) {
131
132
  return null;
@@ -149,8 +150,8 @@ var DefaultInbox = (props) => {
149
150
  name: "Inbox",
150
151
  props: {
151
152
  open,
152
- mountNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
153
- mountBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : void 0,
153
+ renderNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
154
+ renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : void 0,
154
155
  onNotificationClick,
155
156
  onPrimaryActionClick,
156
157
  onSecondaryActionClick
@@ -163,12 +164,23 @@ var DefaultInbox = (props) => {
163
164
  return /* @__PURE__ */ jsx4(Mounter, { mount });
164
165
  };
165
166
  var Inbox = React5.memo((props) => {
166
- const { localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl } = props;
167
+ const {
168
+ localization,
169
+ appearance,
170
+ tabs,
171
+ routerPush,
172
+ applicationIdentifier,
173
+ subscriberId,
174
+ subscriberHash,
175
+ backendUrl,
176
+ socketUrl
177
+ } = props;
167
178
  const options = useMemo(() => {
168
179
  return {
169
180
  localization,
170
181
  appearance,
171
182
  tabs,
183
+ routerPush,
172
184
  options: { applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl }
173
185
  };
174
186
  }, [localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl]);
@@ -218,7 +230,7 @@ var Notifications = React7.memo((props) => {
218
230
  name: "Notifications",
219
231
  element,
220
232
  props: {
221
- mountNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
233
+ renderNotification: renderNotification ? (el, notification) => mountElement(el, renderNotification(notification)) : void 0,
222
234
  onNotificationClick,
223
235
  onPrimaryActionClick,
224
236
  onSecondaryActionClick
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/Bell.tsx","../../src/utils/createContextAndHook.ts","../../src/context/RenderContext.tsx","../../src/components/Mounter.tsx","../../src/components/Inbox.tsx","../../src/components/Renderer.tsx","../../src/hooks/useDataRef.ts","../../src/components/Preferences.tsx","../../src/components/Notifications.tsx"],"sourcesContent":["import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport { BellRenderer } from '../utils/types';\n\nexport type BellProps = {\n renderBell?: BellRenderer;\n};\n\nexport const Bell = React.memo((props: BellProps) => {\n const { renderBell } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Bell',\n element,\n props: renderBell ? { mountBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : undefined,\n });\n },\n [renderBell]\n );\n\n return <Mounter mount={mount} />;\n});\n","import React from 'react';\n\nexport function assertContextExists(contextVal: unknown, msgOrCtx: string | React.Context<any>): asserts contextVal {\n if (!contextVal) {\n throw typeof msgOrCtx === 'string' ? new Error(msgOrCtx) : new Error(`${msgOrCtx.displayName} not found`);\n }\n}\n\ntype Options = { assertCtxFn?: (v: unknown, msg: string) => void };\ntype ContextOf<T> = React.Context<{ value: T } | undefined>;\ntype UseCtxFn<T> = () => T;\n\n/**\n * Creates and returns a Context and two hooks that return the context value.\n * The Context type is derived from the type passed in by the user.\n * The first hook returned guarantees that the context exists so the returned value is always CtxValue\n * The second hook makes no guarantees, so the returned value can be CtxValue | undefined\n */\nexport const createContextAndHook = <CtxVal>(\n displayName: string,\n options?: Options\n): [ContextOf<CtxVal>, UseCtxFn<CtxVal>, UseCtxFn<CtxVal | Partial<CtxVal>>] => {\n const { assertCtxFn = assertContextExists } = options || {};\n const Ctx = React.createContext<{ value: CtxVal } | undefined>(undefined);\n Ctx.displayName = displayName;\n\n const useCtx = () => {\n const ctx = React.useContext(Ctx);\n assertCtxFn(ctx, `Component must be wrapped with the <Inbox /> Component`);\n\n return (ctx as any).value as CtxVal;\n };\n\n const useCtxWithoutGuarantee = () => {\n const ctx = React.useContext(Ctx);\n\n return ctx ? ctx.value : {};\n };\n\n return [Ctx, useCtx, useCtxWithoutGuarantee];\n};\n","import React from 'react';\nimport type { NovuUI } from '@novu/js/ui';\nimport { createContextAndHook } from '../utils/createContextAndHook';\n\nexport type MountedElement = React.ReactNode;\nexport type MountedElements = Map<HTMLElement, MountedElement>;\n\ntype RendererContextValue = {\n mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void;\n novuUI: NovuUI;\n};\n\nconst [RendererContext, useRendererContext] = createContextAndHook<RendererContextValue>('RendererContext');\n\nconst RendererProvider = (props: React.PropsWithChildren<{ value: RendererContextValue }>) => {\n return <RendererContext.Provider value={{ value: props.value }}>{props.children}</RendererContext.Provider>;\n};\n\nexport { useRendererContext as useRenderer, RendererProvider };\n","import React from 'react';\n\ntype MounterProps = {\n mount: (node: HTMLElement) => ((node: HTMLElement) => void) | void;\n};\n\n/**\n * Mounter allows you to mount a component to a DOM node.\n */\nexport function Mounter({ mount }: MounterProps) {\n const ref = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n let unmount: (node: HTMLDivElement) => void | undefined;\n const element = ref.current;\n if (element && mount) {\n const possibleUnmount = mount(element);\n if (possibleUnmount) {\n unmount = possibleUnmount;\n }\n }\n\n return () => {\n if (element && unmount) {\n unmount(element);\n }\n };\n }, [ref, mount]);\n\n return <div ref={ref} />;\n}\n","import React, { useMemo } from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { DefaultProps, DefaultInboxProps, WithChildrenProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { Renderer } from './Renderer';\n\nexport type InboxProps = DefaultProps | WithChildrenProps;\n\nconst DefaultInbox = (props: DefaultInboxProps) => {\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Inbox',\n props: {\n open,\n mountNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n mountBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n element,\n });\n },\n [open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n};\n\nexport const Inbox = React.memo((props: InboxProps) => {\n const { localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl } =\n props;\n\n const options = useMemo(() => {\n return {\n localization,\n appearance,\n tabs,\n options: { applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl },\n };\n }, [localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl]);\n\n if (isWithChildrenProps(props)) {\n return <Renderer options={options}>{props.children}</Renderer>;\n }\n\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n\n return (\n <Renderer options={options}>\n <DefaultInbox\n open={open}\n renderNotification={renderNotification}\n renderBell={renderBell}\n onNotificationClick={onNotificationClick}\n onPrimaryActionClick={onPrimaryActionClick}\n onSecondaryActionClick={onSecondaryActionClick}\n />\n </Renderer>\n );\n});\n\nfunction isWithChildrenProps(props: InboxProps): props is WithChildrenProps {\n return 'children' in props;\n}\n","import React, { useCallback, useEffect, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { NovuUI } from '@novu/js/ui';\nimport type { NovuUIOptions } from '@novu/js/ui';\nimport { MountedElement, RendererProvider } from '../context/RenderContext';\nimport { useDataRef } from '../hooks/useDataRef';\n\ntype RendererProps = React.PropsWithChildren<{\n options: NovuUIOptions;\n}>;\n\n/**\n *\n * Renderer component that provides the NovuUI instance and mounts the elements on DOM in a portal\n */\nexport const Renderer = ({ options, children }: RendererProps) => {\n const optionsRef = useDataRef(options);\n const [novuUI, setNovuUI] = useState<NovuUI | undefined>();\n const [mountedElements, setMountedElements] = useState(new Map<HTMLElement, MountedElement>());\n\n const mountElement = useCallback(\n (el: HTMLElement, mountedElement: MountedElement) => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.set(el, mountedElement);\n\n return newMountedElements;\n });\n\n return () => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.delete(el);\n\n return newMountedElements;\n });\n };\n },\n [setMountedElements]\n );\n\n useEffect(() => {\n const novu = new NovuUI(optionsRef.current);\n setNovuUI(novu);\n\n return () => {\n novu.unmount();\n };\n }, []);\n\n useEffect(() => {\n if (!novuUI) {\n return;\n }\n\n novuUI.updateAppearance(options.appearance);\n novuUI.updateLocalization(options.localization);\n novuUI.updateTabs(options.tabs);\n novuUI.updateOptions(options.options);\n }, [options]);\n\n if (!novuUI) {\n return null;\n }\n\n return (\n <RendererProvider value={{ mountElement, novuUI }}>\n {[...mountedElements].map(([element, mountedElement]) => {\n return ReactDOM.createPortal(mountedElement, element);\n })}\n\n {children}\n </RendererProvider>\n );\n};\n","import { useRef } from 'react';\n\nexport const useDataRef = <T>(data: T) => {\n const ref = useRef(data);\n ref.current = data;\n\n return ref;\n};\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\n\nexport const Preferences = () => {\n const { novuUI } = useRenderer();\n\n const mount = React.useCallback((element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Preferences',\n element,\n });\n }, []);\n\n return <Mounter mount={mount} />;\n};\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport type { NotificationClickHandler, NotificationActionClickHandler } from '@novu/js/ui';\nimport { NotificationsRenderer } from '../utils/types';\n\nexport type NotificationProps = {\n renderNotification?: NotificationsRenderer;\n onNotificationClick?: NotificationClickHandler;\n onPrimaryActionClick?: NotificationActionClickHandler;\n onSecondaryActionClick?: NotificationActionClickHandler;\n};\n\nexport const Notifications = React.memo((props: NotificationProps) => {\n const { onNotificationClick, onPrimaryActionClick, renderNotification, onSecondaryActionClick } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Notifications',\n element,\n props: {\n mountNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n });\n },\n [renderNotification, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n});\n"],"mappings":"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","names":["React","React","jsx","jsx","React","React","jsx","React","React","jsx","React","React","jsx","React"]}
1
+ {"version":3,"sources":["../../src/components/Bell.tsx","../../src/utils/createContextAndHook.ts","../../src/context/RenderContext.tsx","../../src/components/Mounter.tsx","../../src/components/Inbox.tsx","../../src/components/Renderer.tsx","../../src/hooks/useDataRef.ts","../../src/components/Preferences.tsx","../../src/components/Notifications.tsx"],"sourcesContent":["import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport { BellRenderer } from '../utils/types';\n\nexport type BellProps = {\n renderBell?: BellRenderer;\n};\n\nexport const Bell = React.memo((props: BellProps) => {\n const { renderBell } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Bell',\n element,\n props: renderBell ? { renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : undefined,\n });\n },\n [renderBell]\n );\n\n return <Mounter mount={mount} />;\n});\n","import React from 'react';\n\nexport function assertContextExists(contextVal: unknown, msgOrCtx: string | React.Context<any>): asserts contextVal {\n if (!contextVal) {\n throw typeof msgOrCtx === 'string' ? new Error(msgOrCtx) : new Error(`${msgOrCtx.displayName} not found`);\n }\n}\n\ntype Options = { assertCtxFn?: (v: unknown, msg: string) => void };\ntype ContextOf<T> = React.Context<{ value: T } | undefined>;\ntype UseCtxFn<T> = () => T;\n\n/**\n * Creates and returns a Context and two hooks that return the context value.\n * The Context type is derived from the type passed in by the user.\n * The first hook returned guarantees that the context exists so the returned value is always CtxValue\n * The second hook makes no guarantees, so the returned value can be CtxValue | undefined\n */\nexport const createContextAndHook = <CtxVal>(\n displayName: string,\n options?: Options\n): [ContextOf<CtxVal>, UseCtxFn<CtxVal>, UseCtxFn<CtxVal | Partial<CtxVal>>] => {\n const { assertCtxFn = assertContextExists } = options || {};\n const Ctx = React.createContext<{ value: CtxVal } | undefined>(undefined);\n Ctx.displayName = displayName;\n\n const useCtx = () => {\n const ctx = React.useContext(Ctx);\n assertCtxFn(ctx, `Component must be wrapped with the <Inbox /> Component`);\n\n return (ctx as any).value as CtxVal;\n };\n\n const useCtxWithoutGuarantee = () => {\n const ctx = React.useContext(Ctx);\n\n return ctx ? ctx.value : {};\n };\n\n return [Ctx, useCtx, useCtxWithoutGuarantee];\n};\n","import React from 'react';\nimport type { NovuUI } from '@novu/js/ui';\nimport { createContextAndHook } from '../utils/createContextAndHook';\n\nexport type MountedElement = React.ReactNode;\nexport type MountedElements = Map<HTMLElement, MountedElement>;\n\ntype RendererContextValue = {\n mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void;\n novuUI: NovuUI;\n};\n\nconst [RendererContext, useRendererContext] = createContextAndHook<RendererContextValue>('RendererContext');\n\nconst RendererProvider = (props: React.PropsWithChildren<{ value: RendererContextValue }>) => {\n return <RendererContext.Provider value={{ value: props.value }}>{props.children}</RendererContext.Provider>;\n};\n\nexport { useRendererContext as useRenderer, RendererProvider };\n","import React from 'react';\n\ntype MounterProps = {\n mount: (node: HTMLElement) => ((node: HTMLElement) => void) | void;\n};\n\n/**\n * Mounter allows you to mount a component to a DOM node.\n */\nexport function Mounter({ mount }: MounterProps) {\n const ref = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n let unmount: (node: HTMLDivElement) => void | undefined;\n const element = ref.current;\n if (element && mount) {\n const possibleUnmount = mount(element);\n if (possibleUnmount) {\n unmount = possibleUnmount;\n }\n }\n\n return () => {\n if (element && unmount) {\n unmount(element);\n }\n };\n }, [ref, mount]);\n\n return <div ref={ref} />;\n}\n","import React, { useMemo } from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { DefaultProps, DefaultInboxProps, WithChildrenProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { Renderer } from './Renderer';\n\nexport type InboxProps = DefaultProps | WithChildrenProps;\n\nconst DefaultInbox = (props: DefaultInboxProps) => {\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Inbox',\n props: {\n open,\n renderNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n element,\n });\n },\n [open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n};\n\nexport const Inbox = React.memo((props: InboxProps) => {\n const {\n localization,\n appearance,\n tabs,\n routerPush,\n applicationIdentifier,\n subscriberId,\n subscriberHash,\n backendUrl,\n socketUrl,\n } = props;\n\n const options = useMemo(() => {\n return {\n localization,\n appearance,\n tabs,\n routerPush,\n options: { applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl },\n };\n }, [localization, appearance, tabs, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl]);\n\n if (isWithChildrenProps(props)) {\n return <Renderer options={options}>{props.children}</Renderer>;\n }\n\n const { open, renderNotification, renderBell, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick } =\n props;\n\n return (\n <Renderer options={options}>\n <DefaultInbox\n open={open}\n renderNotification={renderNotification}\n renderBell={renderBell}\n onNotificationClick={onNotificationClick}\n onPrimaryActionClick={onPrimaryActionClick}\n onSecondaryActionClick={onSecondaryActionClick}\n />\n </Renderer>\n );\n});\n\nfunction isWithChildrenProps(props: InboxProps): props is WithChildrenProps {\n return 'children' in props;\n}\n","import React, { useCallback, useEffect, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { NovuUI } from '@novu/js/ui';\nimport type { NovuUIOptions } from '@novu/js/ui';\nimport { MountedElement, RendererProvider } from '../context/RenderContext';\nimport { useDataRef } from '../hooks/useDataRef';\n\ntype RendererProps = React.PropsWithChildren<{\n options: NovuUIOptions;\n}>;\n\n/**\n *\n * Renderer component that provides the NovuUI instance and mounts the elements on DOM in a portal\n */\nexport const Renderer = ({ options, children }: RendererProps) => {\n const optionsRef = useDataRef(options);\n const [novuUI, setNovuUI] = useState<NovuUI | undefined>();\n const [mountedElements, setMountedElements] = useState(new Map<HTMLElement, MountedElement>());\n\n const mountElement = useCallback(\n (el: HTMLElement, mountedElement: MountedElement) => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.set(el, mountedElement);\n\n return newMountedElements;\n });\n\n return () => {\n setMountedElements((prev) => {\n const newMountedElements = new Map(prev);\n newMountedElements.delete(el);\n\n return newMountedElements;\n });\n };\n },\n [setMountedElements]\n );\n\n useEffect(() => {\n const novu = new NovuUI(optionsRef.current);\n setNovuUI(novu);\n\n return () => {\n novu.unmount();\n };\n }, []);\n\n useEffect(() => {\n if (!novuUI) {\n return;\n }\n\n novuUI.updateAppearance(options.appearance);\n novuUI.updateLocalization(options.localization);\n novuUI.updateTabs(options.tabs);\n novuUI.updateOptions(options.options);\n novuUI.updateRouterPush(options.routerPush);\n }, [options]);\n\n if (!novuUI) {\n return null;\n }\n\n return (\n <RendererProvider value={{ mountElement, novuUI }}>\n {[...mountedElements].map(([element, mountedElement]) => {\n return ReactDOM.createPortal(mountedElement, element);\n })}\n\n {children}\n </RendererProvider>\n );\n};\n","import { useRef } from 'react';\n\nexport const useDataRef = <T>(data: T) => {\n const ref = useRef(data);\n ref.current = data;\n\n return ref;\n};\n","import React from 'react';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\n\nexport const Preferences = () => {\n const { novuUI } = useRenderer();\n\n const mount = React.useCallback((element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Preferences',\n element,\n });\n }, []);\n\n return <Mounter mount={mount} />;\n};\n","import React from 'react';\nimport type { NotificationClickHandler, NotificationActionClickHandler } from '@novu/js/ui';\nimport { useRenderer } from '../context/RenderContext';\nimport { Mounter } from './Mounter';\nimport { NotificationsRenderer } from '../utils/types';\n\nexport type NotificationProps = {\n renderNotification?: NotificationsRenderer;\n onNotificationClick?: NotificationClickHandler;\n onPrimaryActionClick?: NotificationActionClickHandler;\n onSecondaryActionClick?: NotificationActionClickHandler;\n};\n\nexport const Notifications = React.memo((props: NotificationProps) => {\n const { onNotificationClick, onPrimaryActionClick, renderNotification, onSecondaryActionClick } = props;\n const { novuUI, mountElement } = useRenderer();\n\n const mount = React.useCallback(\n (element: HTMLElement) => {\n return novuUI.mountComponent({\n name: 'Notifications',\n element,\n props: {\n renderNotification: renderNotification\n ? (el, notification) => mountElement(el, renderNotification(notification))\n : undefined,\n onNotificationClick,\n onPrimaryActionClick,\n onSecondaryActionClick,\n },\n });\n },\n [renderNotification, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n );\n\n return <Mounter mount={mount} />;\n});\n"],"mappings":"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","names":["React","React","jsx","jsx","React","React","jsx","React","React","jsx","React","React","jsx","React"]}
@@ -0,0 +1,71 @@
1
+ import { Notification, NovuError, Preference, NotificationFilter, Novu, NovuOptions } from '@novu/js';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+
4
+ type UseNotificationsProps = {
5
+ tags?: string[];
6
+ read?: boolean;
7
+ archived?: boolean;
8
+ limit?: number;
9
+ onSuccess?: (data: Notification[]) => void;
10
+ onError?: (error: NovuError) => void;
11
+ };
12
+ declare const useNotifications: (props?: UseNotificationsProps) => {
13
+ readAll: () => Promise<{
14
+ data?: void | undefined;
15
+ error?: NovuError | undefined;
16
+ }>;
17
+ archiveAll: () => Promise<{
18
+ data?: void | undefined;
19
+ error?: NovuError | undefined;
20
+ }>;
21
+ archiveAllRead: () => Promise<{
22
+ data?: void | undefined;
23
+ error?: NovuError | undefined;
24
+ }>;
25
+ notifications: Notification[] | undefined;
26
+ error: NovuError | undefined;
27
+ isLoading: boolean;
28
+ isFetching: boolean;
29
+ refetch: () => Promise<void>;
30
+ fetchMore: () => Promise<void>;
31
+ hasMore: boolean;
32
+ };
33
+
34
+ type UsePreferencesProps = {
35
+ onSuccess?: (data: Preference[]) => void;
36
+ onError?: (error: NovuError) => void;
37
+ };
38
+ type UsePreferencesResult = {
39
+ preferences?: Preference[];
40
+ error?: NovuError;
41
+ isLoading: boolean;
42
+ isFetching: boolean;
43
+ refetch: () => Promise<void>;
44
+ };
45
+ declare const usePreferences: (props?: UsePreferencesProps) => UsePreferencesResult;
46
+
47
+ type Count = {
48
+ count: number;
49
+ filter: NotificationFilter;
50
+ };
51
+ type UseCountsProps = {
52
+ filters: NotificationFilter[];
53
+ onSuccess?: (data: Count[]) => void;
54
+ onError?: (error: NovuError) => void;
55
+ };
56
+ type UseCountsResult = {
57
+ counts?: Count[];
58
+ error?: NovuError;
59
+ isLoading: boolean;
60
+ isFetching: boolean;
61
+ refetch: () => Promise<void>;
62
+ };
63
+ declare const useCounts: (props: UseCountsProps) => UseCountsResult;
64
+
65
+ type NovuProviderProps = NovuOptions & {
66
+ children: JSX.Element;
67
+ };
68
+ declare const NovuProvider: ({ children, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache, }: NovuProviderProps) => react_jsx_runtime.JSX.Element;
69
+ declare const useNovu: () => Novu;
70
+
71
+ export { NovuProvider, type UseNotificationsProps, useCounts, useNotifications, useNovu, usePreferences };
@@ -0,0 +1,71 @@
1
+ import { Notification, NovuError, Preference, NotificationFilter, Novu, NovuOptions } from '@novu/js';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+
4
+ type UseNotificationsProps = {
5
+ tags?: string[];
6
+ read?: boolean;
7
+ archived?: boolean;
8
+ limit?: number;
9
+ onSuccess?: (data: Notification[]) => void;
10
+ onError?: (error: NovuError) => void;
11
+ };
12
+ declare const useNotifications: (props?: UseNotificationsProps) => {
13
+ readAll: () => Promise<{
14
+ data?: void | undefined;
15
+ error?: NovuError | undefined;
16
+ }>;
17
+ archiveAll: () => Promise<{
18
+ data?: void | undefined;
19
+ error?: NovuError | undefined;
20
+ }>;
21
+ archiveAllRead: () => Promise<{
22
+ data?: void | undefined;
23
+ error?: NovuError | undefined;
24
+ }>;
25
+ notifications: Notification[] | undefined;
26
+ error: NovuError | undefined;
27
+ isLoading: boolean;
28
+ isFetching: boolean;
29
+ refetch: () => Promise<void>;
30
+ fetchMore: () => Promise<void>;
31
+ hasMore: boolean;
32
+ };
33
+
34
+ type UsePreferencesProps = {
35
+ onSuccess?: (data: Preference[]) => void;
36
+ onError?: (error: NovuError) => void;
37
+ };
38
+ type UsePreferencesResult = {
39
+ preferences?: Preference[];
40
+ error?: NovuError;
41
+ isLoading: boolean;
42
+ isFetching: boolean;
43
+ refetch: () => Promise<void>;
44
+ };
45
+ declare const usePreferences: (props?: UsePreferencesProps) => UsePreferencesResult;
46
+
47
+ type Count = {
48
+ count: number;
49
+ filter: NotificationFilter;
50
+ };
51
+ type UseCountsProps = {
52
+ filters: NotificationFilter[];
53
+ onSuccess?: (data: Count[]) => void;
54
+ onError?: (error: NovuError) => void;
55
+ };
56
+ type UseCountsResult = {
57
+ counts?: Count[];
58
+ error?: NovuError;
59
+ isLoading: boolean;
60
+ isFetching: boolean;
61
+ refetch: () => Promise<void>;
62
+ };
63
+ declare const useCounts: (props: UseCountsProps) => UseCountsResult;
64
+
65
+ type NovuProviderProps = NovuOptions & {
66
+ children: JSX.Element;
67
+ };
68
+ declare const NovuProvider: ({ children, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache, }: NovuProviderProps) => react_jsx_runtime.JSX.Element;
69
+ declare const useNovu: () => Novu;
70
+
71
+ export { NovuProvider, type UseNotificationsProps, useCounts, useNotifications, useNovu, usePreferences };
@@ -0,0 +1,349 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/hooks/index.ts
21
+ var hooks_exports = {};
22
+ __export(hooks_exports, {
23
+ NovuProvider: () => NovuProvider,
24
+ useCounts: () => useCounts,
25
+ useNotifications: () => useNotifications,
26
+ useNovu: () => useNovu,
27
+ usePreferences: () => usePreferences
28
+ });
29
+ module.exports = __toCommonJS(hooks_exports);
30
+
31
+ // src/hooks/useNotifications.ts
32
+ var import_react2 = require("react");
33
+ var import_js2 = require("@novu/js");
34
+
35
+ // src/hooks/NovuProvider.tsx
36
+ var import_js = require("@novu/js");
37
+ var import_react = require("react");
38
+ var import_jsx_runtime = require("react/jsx-runtime");
39
+ var NovuContext = (0, import_react.createContext)(void 0);
40
+ var NovuProvider = ({
41
+ children,
42
+ applicationIdentifier,
43
+ subscriberId,
44
+ subscriberHash,
45
+ backendUrl,
46
+ socketUrl,
47
+ useCache
48
+ }) => {
49
+ const novu = (0, import_react.useMemo)(
50
+ () => new import_js.Novu({ applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache }),
51
+ [applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache]
52
+ );
53
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NovuContext.Provider, { value: novu, children });
54
+ };
55
+ var useNovu = () => {
56
+ const context = (0, import_react.useContext)(NovuContext);
57
+ if (!context) {
58
+ throw new Error("useNovu must be used within a <NovuProvider />");
59
+ }
60
+ return context;
61
+ };
62
+
63
+ // src/hooks/useNotifications.ts
64
+ var useNotifications = (props) => {
65
+ const { tags, read, archived = false, limit, onSuccess, onError } = props || {};
66
+ const filterRef = (0, import_react2.useRef)(void 0);
67
+ const { notifications, on, off } = useNovu();
68
+ const [data, setData] = (0, import_react2.useState)();
69
+ const [error, setError] = (0, import_react2.useState)();
70
+ const [isLoading, setIsLoading] = (0, import_react2.useState)(true);
71
+ const [isFetching, setIsFetching] = (0, import_react2.useState)(false);
72
+ const [hasMore, setHasMore] = (0, import_react2.useState)(false);
73
+ const length = data?.length;
74
+ const after = length ? data[length - 1].id : void 0;
75
+ const sync = (event) => {
76
+ if (!event.data || filterRef.current && !(0, import_js2.isSameFilter)(filterRef.current, event.data.filter)) {
77
+ return;
78
+ }
79
+ setData(event.data.notifications);
80
+ setHasMore(event.data.hasMore);
81
+ };
82
+ (0, import_react2.useEffect)(() => {
83
+ on("notifications.list.updated", sync);
84
+ return () => {
85
+ off("notifications.list.updated", sync);
86
+ };
87
+ }, []);
88
+ (0, import_react2.useEffect)(() => {
89
+ const newFilter = { tags, read, archived };
90
+ if (filterRef.current && (0, import_js2.isSameFilter)(filterRef.current, newFilter)) {
91
+ return;
92
+ }
93
+ notifications.clearCache({ filter: filterRef.current });
94
+ filterRef.current = newFilter;
95
+ fetchNotifications({ refetch: true });
96
+ }, [tags, read, archived]);
97
+ const fetchNotifications = async (options) => {
98
+ if (options?.refetch) {
99
+ setError(void 0);
100
+ setIsLoading(true);
101
+ setIsFetching(false);
102
+ }
103
+ setIsFetching(true);
104
+ const response = await notifications.list({
105
+ tags,
106
+ read,
107
+ archived,
108
+ limit,
109
+ after: options?.refetch ? void 0 : after
110
+ });
111
+ if (response.error) {
112
+ setError(response.error);
113
+ onError?.(response.error);
114
+ } else {
115
+ onSuccess?.(response.data.notifications);
116
+ setData(response.data.notifications);
117
+ setHasMore(response.data.hasMore);
118
+ }
119
+ setIsLoading(false);
120
+ setIsFetching(false);
121
+ };
122
+ const refetch = () => {
123
+ notifications.clearCache({ filter: { tags, read, archived } });
124
+ return fetchNotifications({ refetch: true });
125
+ };
126
+ const fetchMore = async () => {
127
+ if (!hasMore || isFetching) return;
128
+ return fetchNotifications();
129
+ };
130
+ const readAll = async () => {
131
+ return await notifications.readAll({ tags });
132
+ };
133
+ const archiveAll = async () => {
134
+ return await notifications.archiveAll({ tags });
135
+ };
136
+ const archiveAllRead = async () => {
137
+ return await notifications.archiveAllRead({ tags });
138
+ };
139
+ return {
140
+ readAll,
141
+ archiveAll,
142
+ archiveAllRead,
143
+ notifications: data,
144
+ error,
145
+ isLoading,
146
+ isFetching,
147
+ refetch,
148
+ fetchMore,
149
+ hasMore
150
+ };
151
+ };
152
+
153
+ // src/hooks/usePreferences.ts
154
+ var import_react3 = require("react");
155
+ var usePreferences = (props) => {
156
+ const { onSuccess, onError } = props || {};
157
+ const [data, setData] = (0, import_react3.useState)();
158
+ const { preferences, on, off } = useNovu();
159
+ const [error, setError] = (0, import_react3.useState)();
160
+ const [isLoading, setIsLoading] = (0, import_react3.useState)(true);
161
+ const [isFetching, setIsFetching] = (0, import_react3.useState)(false);
162
+ const sync = (event) => {
163
+ if (!event.data) {
164
+ return;
165
+ }
166
+ setData(event.data);
167
+ };
168
+ (0, import_react3.useEffect)(() => {
169
+ fetchPreferences();
170
+ on("preferences.list.updated", sync);
171
+ on("preferences.list.pending", sync);
172
+ on("preferences.list.resolved", sync);
173
+ return () => {
174
+ off("preferences.list.updated", sync);
175
+ off("preferences.list.pending", sync);
176
+ off("preferences.list.resolved", sync);
177
+ };
178
+ }, []);
179
+ const fetchPreferences = async () => {
180
+ setIsFetching(true);
181
+ const response = await preferences.list();
182
+ if (response.error) {
183
+ setError(response.error);
184
+ onError?.(response.error);
185
+ } else {
186
+ onSuccess?.(response.data);
187
+ }
188
+ setIsLoading(false);
189
+ setIsFetching(false);
190
+ };
191
+ const refetch = () => {
192
+ preferences.cache.clearAll();
193
+ return fetchPreferences();
194
+ };
195
+ return {
196
+ preferences: data,
197
+ error,
198
+ isLoading,
199
+ isFetching,
200
+ refetch
201
+ };
202
+ };
203
+
204
+ // src/hooks/useCounts.ts
205
+ var import_react6 = require("react");
206
+ var import_js3 = require("@novu/js");
207
+
208
+ // src/hooks/internal/useWebsocketEvent.ts
209
+ var import_react5 = require("react");
210
+
211
+ // src/utils/requestLock.ts
212
+ function requestLock(id, cb) {
213
+ if (!("locks" in navigator)) {
214
+ cb(id);
215
+ return () => {
216
+ };
217
+ }
218
+ let isFulfilled = false;
219
+ let promiseResolve;
220
+ const promise = new Promise((resolve) => {
221
+ promiseResolve = resolve;
222
+ });
223
+ navigator.locks.request(id, () => {
224
+ if (!isFulfilled) {
225
+ cb(id);
226
+ }
227
+ return promise;
228
+ });
229
+ return () => {
230
+ isFulfilled = true;
231
+ promiseResolve();
232
+ };
233
+ }
234
+
235
+ // src/hooks/internal/useBrowserTabsChannel.ts
236
+ var import_react4 = require("react");
237
+ var useBrowserTabsChannel = ({
238
+ channelName,
239
+ onMessage
240
+ }) => {
241
+ const [tabsChannel] = (0, import_react4.useState)(
242
+ typeof BroadcastChannel !== "undefined" ? new BroadcastChannel(channelName) : void 0
243
+ );
244
+ const postMessage = (data) => {
245
+ tabsChannel?.postMessage(data);
246
+ };
247
+ (0, import_react4.useEffect)(() => {
248
+ const listener = (event) => {
249
+ onMessage(event.data);
250
+ };
251
+ tabsChannel?.addEventListener("message", listener);
252
+ return () => {
253
+ tabsChannel?.removeEventListener("message", listener);
254
+ };
255
+ }, []);
256
+ return { postMessage };
257
+ };
258
+
259
+ // src/hooks/internal/useWebsocketEvent.ts
260
+ var useWebSocketEvent = ({
261
+ event: webSocketEvent,
262
+ eventHandler: onMessage
263
+ }) => {
264
+ const novu = useNovu();
265
+ const { postMessage } = useBrowserTabsChannel({ channelName: `nv.${webSocketEvent}`, onMessage });
266
+ const updateReadCount = (data) => {
267
+ onMessage(data);
268
+ postMessage(data);
269
+ };
270
+ (0, import_react5.useEffect)(() => {
271
+ const resolveLock = requestLock(`nv.${webSocketEvent}`, () => {
272
+ novu.on(webSocketEvent, updateReadCount);
273
+ });
274
+ return () => {
275
+ novu.off(webSocketEvent, updateReadCount);
276
+ resolveLock();
277
+ };
278
+ }, []);
279
+ };
280
+
281
+ // src/hooks/useCounts.ts
282
+ var useCounts = (props) => {
283
+ const { filters, onSuccess, onError } = props;
284
+ const { notifications } = useNovu();
285
+ const [error, setError] = (0, import_react6.useState)();
286
+ const [counts, setCounts] = (0, import_react6.useState)();
287
+ const [isLoading, setIsLoading] = (0, import_react6.useState)(true);
288
+ const [isFetching, setIsFetching] = (0, import_react6.useState)(false);
289
+ const sync = async (notification) => {
290
+ const existingCounts = counts ?? new Array(filters.length).fill(void 0);
291
+ let countFiltersToFetch = [];
292
+ if (notification) {
293
+ for (let i = 0; i < existingCounts.length; i++) {
294
+ const filter = filters[i];
295
+ if ((0, import_js3.areTagsEqual)(filter.tags, notification.tags)) {
296
+ countFiltersToFetch.push(filter);
297
+ }
298
+ }
299
+ } else {
300
+ countFiltersToFetch = filters;
301
+ }
302
+ if (countFiltersToFetch.length === 0) {
303
+ return;
304
+ }
305
+ setIsFetching(true);
306
+ const countsRes = await notifications.count({ filters: countFiltersToFetch });
307
+ setIsFetching(false);
308
+ setIsLoading(false);
309
+ if (countsRes.error) {
310
+ setError(countsRes.error);
311
+ onError?.(countsRes.error);
312
+ return;
313
+ }
314
+ const data = countsRes.data;
315
+ onSuccess?.(data.counts);
316
+ setCounts((oldCounts) => {
317
+ const newCounts = [];
318
+ const countsReceived = data.counts;
319
+ for (let i = 0; i < existingCounts.length; i++) {
320
+ const countReceived = countsReceived.find((c) => (0, import_js3.areTagsEqual)(c.filter.tags, existingCounts[i]?.filter.tags));
321
+ newCounts.push(countReceived || oldCounts[i]);
322
+ }
323
+ return newCounts;
324
+ });
325
+ };
326
+ useWebSocketEvent({
327
+ event: "notifications.notification_received",
328
+ eventHandler: (data) => {
329
+ sync(data.result);
330
+ }
331
+ });
332
+ useWebSocketEvent({
333
+ event: "notifications.unread_count_changed",
334
+ eventHandler: () => {
335
+ sync();
336
+ }
337
+ });
338
+ (0, import_react6.useEffect)(() => {
339
+ setError(void 0);
340
+ setIsLoading(true);
341
+ setIsFetching(false);
342
+ sync();
343
+ }, [JSON.stringify(filters)]);
344
+ const refetch = async () => {
345
+ await sync();
346
+ };
347
+ return { counts, error, refetch, isLoading, isFetching };
348
+ };
349
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/hooks/index.ts","../../src/hooks/useNotifications.ts","../../src/hooks/NovuProvider.tsx","../../src/hooks/usePreferences.ts","../../src/hooks/useCounts.ts","../../src/hooks/internal/useWebsocketEvent.ts","../../src/utils/requestLock.ts","../../src/hooks/internal/useBrowserTabsChannel.ts"],"sourcesContent":["export * from './useNotifications';\nexport * from './usePreferences';\nexport * from './useCounts';\nexport { NovuProvider, useNovu } from './NovuProvider';\n","import { useState, useEffect, useRef } from 'react';\nimport { ListNotificationsResponse, Notification, NovuError, isSameFilter, NotificationFilter } from '@novu/js';\nimport { useNovu } from './NovuProvider';\n\nexport type UseNotificationsProps = {\n tags?: string[];\n read?: boolean;\n archived?: boolean;\n limit?: number;\n onSuccess?: (data: Notification[]) => void;\n onError?: (error: NovuError) => void;\n};\n\nexport const useNotifications = (props?: UseNotificationsProps) => {\n const { tags, read, archived = false, limit, onSuccess, onError } = props || {};\n const filterRef = useRef<NotificationFilter | undefined>(undefined);\n const { notifications, on, off } = useNovu();\n const [data, setData] = useState<Array<Notification>>();\n const [error, setError] = useState<NovuError>();\n const [isLoading, setIsLoading] = useState(true);\n const [isFetching, setIsFetching] = useState(false);\n const [hasMore, setHasMore] = useState(false);\n const length = data?.length;\n const after = length ? data[length - 1].id : undefined;\n\n const sync = (event: { data?: ListNotificationsResponse }) => {\n if (!event.data || (filterRef.current && !isSameFilter(filterRef.current, event.data.filter))) {\n return;\n }\n setData(event.data.notifications);\n setHasMore(event.data.hasMore);\n };\n\n useEffect(() => {\n on('notifications.list.updated', sync);\n\n return () => {\n off('notifications.list.updated', sync);\n };\n }, []);\n\n useEffect(() => {\n const newFilter = { tags, read, archived };\n if (filterRef.current && isSameFilter(filterRef.current, newFilter)) {\n return;\n }\n\n notifications.clearCache({ filter: filterRef.current });\n filterRef.current = newFilter;\n\n fetchNotifications({ refetch: true });\n }, [tags, read, archived]);\n\n const fetchNotifications = async (options?: { refetch: boolean }) => {\n if (options?.refetch) {\n setError(undefined);\n setIsLoading(true);\n setIsFetching(false);\n }\n setIsFetching(true);\n const response = await notifications.list({\n tags,\n read,\n archived,\n limit,\n after: options?.refetch ? undefined : after,\n });\n if (response.error) {\n setError(response.error);\n onError?.(response.error);\n } else {\n onSuccess?.(response.data!.notifications);\n setData(response.data!.notifications);\n setHasMore(response.data!.hasMore);\n }\n setIsLoading(false);\n setIsFetching(false);\n };\n\n const refetch = () => {\n notifications.clearCache({ filter: { tags, read, archived } });\n\n return fetchNotifications({ refetch: true });\n };\n\n const fetchMore = async () => {\n if (!hasMore || isFetching) return;\n\n return fetchNotifications();\n };\n\n const readAll = async () => {\n return await notifications.readAll({ tags });\n };\n\n const archiveAll = async () => {\n return await notifications.archiveAll({ tags });\n };\n\n const archiveAllRead = async () => {\n return await notifications.archiveAllRead({ tags });\n };\n\n return {\n readAll,\n archiveAll,\n archiveAllRead,\n notifications: data,\n error,\n isLoading,\n isFetching,\n refetch,\n fetchMore,\n hasMore,\n };\n};\n","import { Novu, NovuOptions } from '@novu/js';\nimport { createContext, useContext, useMemo } from 'react';\n\ntype NovuProviderProps = NovuOptions & {\n children: JSX.Element;\n};\n\nconst NovuContext = createContext<Novu | undefined>(undefined);\n\nexport const NovuProvider = ({\n children,\n applicationIdentifier,\n subscriberId,\n subscriberHash,\n backendUrl,\n socketUrl,\n useCache,\n}: NovuProviderProps) => {\n const novu = useMemo(\n () => new Novu({ applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache }),\n [applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache]\n );\n\n return <NovuContext.Provider value={novu}>{children}</NovuContext.Provider>;\n};\n\nexport const useNovu = () => {\n const context = useContext(NovuContext);\n if (!context) {\n throw new Error('useNovu must be used within a <NovuProvider />');\n }\n\n return context;\n};\n\nexport const useUnsafeNovu = () => {\n const context = useContext(NovuContext);\n\n return context;\n};\n","import { NovuError, Preference } from '@novu/js';\nimport { useEffect, useState } from 'react';\nimport { useNovu } from './NovuProvider';\n\ntype UsePreferencesProps = {\n onSuccess?: (data: Preference[]) => void;\n onError?: (error: NovuError) => void;\n};\n\ntype UsePreferencesResult = {\n preferences?: Preference[];\n error?: NovuError;\n isLoading: boolean; // initial loading\n isFetching: boolean; // the request is in flight\n refetch: () => Promise<void>;\n};\n\nexport const usePreferences = (props?: UsePreferencesProps): UsePreferencesResult => {\n const { onSuccess, onError } = props || {};\n const [data, setData] = useState<Preference[]>();\n const { preferences, on, off } = useNovu();\n const [error, setError] = useState<NovuError>();\n const [isLoading, setIsLoading] = useState(true);\n const [isFetching, setIsFetching] = useState(false);\n\n const sync = (event: { data?: Preference[] }) => {\n if (!event.data) {\n return;\n }\n setData(event.data);\n };\n\n useEffect(() => {\n fetchPreferences();\n\n on('preferences.list.updated', sync);\n on('preferences.list.pending', sync);\n on('preferences.list.resolved', sync);\n\n return () => {\n off('preferences.list.updated', sync);\n off('preferences.list.pending', sync);\n off('preferences.list.resolved', sync);\n };\n }, []);\n\n const fetchPreferences = async () => {\n setIsFetching(true);\n const response = await preferences.list();\n if (response.error) {\n setError(response.error);\n onError?.(response.error);\n } else {\n onSuccess?.(response.data!);\n }\n setIsLoading(false);\n setIsFetching(false);\n };\n\n const refetch = () => {\n preferences.cache.clearAll();\n return fetchPreferences();\n };\n\n return {\n preferences: data,\n error,\n isLoading,\n isFetching,\n refetch,\n };\n};\n","import { useEffect, useState } from 'react';\nimport { Notification, NotificationFilter, NovuError, areTagsEqual } from '@novu/js';\nimport { useNovu } from './NovuProvider';\nimport { useWebSocketEvent } from './internal/useWebsocketEvent';\n\ntype Count = {\n count: number;\n filter: NotificationFilter;\n};\n\ntype UseCountsProps = {\n filters: NotificationFilter[];\n onSuccess?: (data: Count[]) => void;\n onError?: (error: NovuError) => void;\n};\n\ntype UseCountsResult = {\n counts?: Count[];\n error?: NovuError;\n isLoading: boolean; // initial loading\n isFetching: boolean; // the request is in flight\n refetch: () => Promise<void>;\n};\n\nexport const useCounts = (props: UseCountsProps): UseCountsResult => {\n const { filters, onSuccess, onError } = props;\n const { notifications } = useNovu();\n const [error, setError] = useState<NovuError>();\n const [counts, setCounts] = useState<Count[]>();\n const [isLoading, setIsLoading] = useState(true);\n const [isFetching, setIsFetching] = useState(false);\n\n const sync = async (notification?: Notification) => {\n const existingCounts = counts ?? (new Array(filters.length).fill(undefined) as (Count | undefined)[]);\n let countFiltersToFetch: NotificationFilter[] = [];\n if (notification) {\n // eslint-disable-next-line no-plusplus\n for (let i = 0; i < existingCounts.length; i++) {\n const filter = filters[i];\n if (areTagsEqual(filter.tags, notification.tags)) {\n countFiltersToFetch.push(filter);\n }\n }\n } else {\n countFiltersToFetch = filters;\n }\n\n if (countFiltersToFetch.length === 0) {\n return;\n }\n\n setIsFetching(true);\n const countsRes = await notifications.count({ filters: countFiltersToFetch });\n setIsFetching(false);\n setIsLoading(false);\n if (countsRes.error) {\n setError(countsRes.error);\n onError?.(countsRes.error);\n\n return;\n }\n const data = countsRes.data!;\n onSuccess?.(data.counts);\n\n setCounts((oldCounts) => {\n const newCounts: Count[] = [];\n const countsReceived = data.counts;\n\n // eslint-disable-next-line no-plusplus\n for (let i = 0; i < existingCounts.length; i++) {\n const countReceived = countsReceived.find((c) => areTagsEqual(c.filter.tags, existingCounts[i]?.filter.tags));\n\n newCounts.push(countReceived || oldCounts![i]);\n }\n\n return newCounts;\n });\n };\n\n useWebSocketEvent({\n event: 'notifications.notification_received',\n eventHandler: (data) => {\n sync(data.result);\n },\n });\n\n useWebSocketEvent({\n event: 'notifications.unread_count_changed',\n eventHandler: () => {\n sync();\n },\n });\n\n useEffect(() => {\n setError(undefined);\n setIsLoading(true);\n setIsFetching(false);\n sync();\n }, [JSON.stringify(filters)]);\n\n const refetch = async () => {\n await sync();\n };\n\n return { counts, error, refetch, isLoading, isFetching };\n};\n","import { EventHandler, Events, SocketEventNames } from '@novu/js';\nimport { useEffect } from 'react';\nimport { useNovu } from '../NovuProvider';\nimport { requestLock } from '../../utils/requestLock';\nimport { useBrowserTabsChannel } from './useBrowserTabsChannel';\n\nexport const useWebSocketEvent = <E extends SocketEventNames>({\n event: webSocketEvent,\n eventHandler: onMessage,\n}: {\n event: E;\n eventHandler: (args: Events[E]) => void;\n}) => {\n const novu = useNovu();\n const { postMessage } = useBrowserTabsChannel({ channelName: `nv.${webSocketEvent}`, onMessage });\n\n const updateReadCount: EventHandler<Events[E]> = (data) => {\n onMessage(data);\n postMessage(data);\n };\n\n useEffect(() => {\n const resolveLock = requestLock(`nv.${webSocketEvent}`, () => {\n novu.on(webSocketEvent, updateReadCount);\n });\n\n return () => {\n novu.off(webSocketEvent, updateReadCount);\n resolveLock();\n };\n }, []);\n};\n","export function requestLock(id: string, cb: (id: string) => void) {\n // Check if the Lock API is available\n if (!('locks' in navigator)) {\n // If Lock API is not available, immediately invoke the callback and return a no-op function\n cb(id);\n return () => {};\n }\n\n let isFulfilled = false;\n let promiseResolve: () => void;\n\n const promise = new Promise<void>((resolve) => {\n promiseResolve = resolve;\n });\n\n navigator.locks.request(id, () => {\n if (!isFulfilled) {\n cb(id);\n }\n\n return promise;\n });\n\n return () => {\n isFulfilled = true;\n promiseResolve();\n };\n}\n","import { useEffect, useState } from 'react';\n\nexport const useBrowserTabsChannel = <T = unknown>({\n channelName,\n onMessage,\n}: {\n channelName: string;\n onMessage: (args: T) => void;\n}) => {\n const [tabsChannel] = useState(\n typeof BroadcastChannel !== 'undefined' ? new BroadcastChannel(channelName) : undefined\n );\n\n const postMessage = (data: T) => {\n tabsChannel?.postMessage(data);\n };\n\n useEffect(() => {\n const listener = (event: MessageEvent<T>) => {\n onMessage(event.data);\n };\n\n tabsChannel?.addEventListener('message', listener);\n\n return () => {\n tabsChannel?.removeEventListener('message', listener);\n };\n }, []);\n\n return { postMessage };\n};\n"],"mappings":"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","names":["import_react","import_js","import_react","import_react","import_js","import_react","import_react"]}
@@ -0,0 +1,326 @@
1
+ // src/hooks/useNotifications.ts
2
+ import { useState, useEffect, useRef } from "react";
3
+ import { isSameFilter } from "@novu/js";
4
+
5
+ // src/hooks/NovuProvider.tsx
6
+ import { Novu } from "@novu/js";
7
+ import { createContext, useContext, useMemo } from "react";
8
+ import { jsx } from "react/jsx-runtime";
9
+ var NovuContext = createContext(void 0);
10
+ var NovuProvider = ({
11
+ children,
12
+ applicationIdentifier,
13
+ subscriberId,
14
+ subscriberHash,
15
+ backendUrl,
16
+ socketUrl,
17
+ useCache
18
+ }) => {
19
+ const novu = useMemo(
20
+ () => new Novu({ applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache }),
21
+ [applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache]
22
+ );
23
+ return /* @__PURE__ */ jsx(NovuContext.Provider, { value: novu, children });
24
+ };
25
+ var useNovu = () => {
26
+ const context = useContext(NovuContext);
27
+ if (!context) {
28
+ throw new Error("useNovu must be used within a <NovuProvider />");
29
+ }
30
+ return context;
31
+ };
32
+
33
+ // src/hooks/useNotifications.ts
34
+ var useNotifications = (props) => {
35
+ const { tags, read, archived = false, limit, onSuccess, onError } = props || {};
36
+ const filterRef = useRef(void 0);
37
+ const { notifications, on, off } = useNovu();
38
+ const [data, setData] = useState();
39
+ const [error, setError] = useState();
40
+ const [isLoading, setIsLoading] = useState(true);
41
+ const [isFetching, setIsFetching] = useState(false);
42
+ const [hasMore, setHasMore] = useState(false);
43
+ const length = data?.length;
44
+ const after = length ? data[length - 1].id : void 0;
45
+ const sync = (event) => {
46
+ if (!event.data || filterRef.current && !isSameFilter(filterRef.current, event.data.filter)) {
47
+ return;
48
+ }
49
+ setData(event.data.notifications);
50
+ setHasMore(event.data.hasMore);
51
+ };
52
+ useEffect(() => {
53
+ on("notifications.list.updated", sync);
54
+ return () => {
55
+ off("notifications.list.updated", sync);
56
+ };
57
+ }, []);
58
+ useEffect(() => {
59
+ const newFilter = { tags, read, archived };
60
+ if (filterRef.current && isSameFilter(filterRef.current, newFilter)) {
61
+ return;
62
+ }
63
+ notifications.clearCache({ filter: filterRef.current });
64
+ filterRef.current = newFilter;
65
+ fetchNotifications({ refetch: true });
66
+ }, [tags, read, archived]);
67
+ const fetchNotifications = async (options) => {
68
+ if (options?.refetch) {
69
+ setError(void 0);
70
+ setIsLoading(true);
71
+ setIsFetching(false);
72
+ }
73
+ setIsFetching(true);
74
+ const response = await notifications.list({
75
+ tags,
76
+ read,
77
+ archived,
78
+ limit,
79
+ after: options?.refetch ? void 0 : after
80
+ });
81
+ if (response.error) {
82
+ setError(response.error);
83
+ onError?.(response.error);
84
+ } else {
85
+ onSuccess?.(response.data.notifications);
86
+ setData(response.data.notifications);
87
+ setHasMore(response.data.hasMore);
88
+ }
89
+ setIsLoading(false);
90
+ setIsFetching(false);
91
+ };
92
+ const refetch = () => {
93
+ notifications.clearCache({ filter: { tags, read, archived } });
94
+ return fetchNotifications({ refetch: true });
95
+ };
96
+ const fetchMore = async () => {
97
+ if (!hasMore || isFetching) return;
98
+ return fetchNotifications();
99
+ };
100
+ const readAll = async () => {
101
+ return await notifications.readAll({ tags });
102
+ };
103
+ const archiveAll = async () => {
104
+ return await notifications.archiveAll({ tags });
105
+ };
106
+ const archiveAllRead = async () => {
107
+ return await notifications.archiveAllRead({ tags });
108
+ };
109
+ return {
110
+ readAll,
111
+ archiveAll,
112
+ archiveAllRead,
113
+ notifications: data,
114
+ error,
115
+ isLoading,
116
+ isFetching,
117
+ refetch,
118
+ fetchMore,
119
+ hasMore
120
+ };
121
+ };
122
+
123
+ // src/hooks/usePreferences.ts
124
+ import { useEffect as useEffect2, useState as useState2 } from "react";
125
+ var usePreferences = (props) => {
126
+ const { onSuccess, onError } = props || {};
127
+ const [data, setData] = useState2();
128
+ const { preferences, on, off } = useNovu();
129
+ const [error, setError] = useState2();
130
+ const [isLoading, setIsLoading] = useState2(true);
131
+ const [isFetching, setIsFetching] = useState2(false);
132
+ const sync = (event) => {
133
+ if (!event.data) {
134
+ return;
135
+ }
136
+ setData(event.data);
137
+ };
138
+ useEffect2(() => {
139
+ fetchPreferences();
140
+ on("preferences.list.updated", sync);
141
+ on("preferences.list.pending", sync);
142
+ on("preferences.list.resolved", sync);
143
+ return () => {
144
+ off("preferences.list.updated", sync);
145
+ off("preferences.list.pending", sync);
146
+ off("preferences.list.resolved", sync);
147
+ };
148
+ }, []);
149
+ const fetchPreferences = async () => {
150
+ setIsFetching(true);
151
+ const response = await preferences.list();
152
+ if (response.error) {
153
+ setError(response.error);
154
+ onError?.(response.error);
155
+ } else {
156
+ onSuccess?.(response.data);
157
+ }
158
+ setIsLoading(false);
159
+ setIsFetching(false);
160
+ };
161
+ const refetch = () => {
162
+ preferences.cache.clearAll();
163
+ return fetchPreferences();
164
+ };
165
+ return {
166
+ preferences: data,
167
+ error,
168
+ isLoading,
169
+ isFetching,
170
+ refetch
171
+ };
172
+ };
173
+
174
+ // src/hooks/useCounts.ts
175
+ import { useEffect as useEffect5, useState as useState4 } from "react";
176
+ import { areTagsEqual } from "@novu/js";
177
+
178
+ // src/hooks/internal/useWebsocketEvent.ts
179
+ import { useEffect as useEffect4 } from "react";
180
+
181
+ // src/utils/requestLock.ts
182
+ function requestLock(id, cb) {
183
+ if (!("locks" in navigator)) {
184
+ cb(id);
185
+ return () => {
186
+ };
187
+ }
188
+ let isFulfilled = false;
189
+ let promiseResolve;
190
+ const promise = new Promise((resolve) => {
191
+ promiseResolve = resolve;
192
+ });
193
+ navigator.locks.request(id, () => {
194
+ if (!isFulfilled) {
195
+ cb(id);
196
+ }
197
+ return promise;
198
+ });
199
+ return () => {
200
+ isFulfilled = true;
201
+ promiseResolve();
202
+ };
203
+ }
204
+
205
+ // src/hooks/internal/useBrowserTabsChannel.ts
206
+ import { useEffect as useEffect3, useState as useState3 } from "react";
207
+ var useBrowserTabsChannel = ({
208
+ channelName,
209
+ onMessage
210
+ }) => {
211
+ const [tabsChannel] = useState3(
212
+ typeof BroadcastChannel !== "undefined" ? new BroadcastChannel(channelName) : void 0
213
+ );
214
+ const postMessage = (data) => {
215
+ tabsChannel?.postMessage(data);
216
+ };
217
+ useEffect3(() => {
218
+ const listener = (event) => {
219
+ onMessage(event.data);
220
+ };
221
+ tabsChannel?.addEventListener("message", listener);
222
+ return () => {
223
+ tabsChannel?.removeEventListener("message", listener);
224
+ };
225
+ }, []);
226
+ return { postMessage };
227
+ };
228
+
229
+ // src/hooks/internal/useWebsocketEvent.ts
230
+ var useWebSocketEvent = ({
231
+ event: webSocketEvent,
232
+ eventHandler: onMessage
233
+ }) => {
234
+ const novu = useNovu();
235
+ const { postMessage } = useBrowserTabsChannel({ channelName: `nv.${webSocketEvent}`, onMessage });
236
+ const updateReadCount = (data) => {
237
+ onMessage(data);
238
+ postMessage(data);
239
+ };
240
+ useEffect4(() => {
241
+ const resolveLock = requestLock(`nv.${webSocketEvent}`, () => {
242
+ novu.on(webSocketEvent, updateReadCount);
243
+ });
244
+ return () => {
245
+ novu.off(webSocketEvent, updateReadCount);
246
+ resolveLock();
247
+ };
248
+ }, []);
249
+ };
250
+
251
+ // src/hooks/useCounts.ts
252
+ var useCounts = (props) => {
253
+ const { filters, onSuccess, onError } = props;
254
+ const { notifications } = useNovu();
255
+ const [error, setError] = useState4();
256
+ const [counts, setCounts] = useState4();
257
+ const [isLoading, setIsLoading] = useState4(true);
258
+ const [isFetching, setIsFetching] = useState4(false);
259
+ const sync = async (notification) => {
260
+ const existingCounts = counts ?? new Array(filters.length).fill(void 0);
261
+ let countFiltersToFetch = [];
262
+ if (notification) {
263
+ for (let i = 0; i < existingCounts.length; i++) {
264
+ const filter = filters[i];
265
+ if (areTagsEqual(filter.tags, notification.tags)) {
266
+ countFiltersToFetch.push(filter);
267
+ }
268
+ }
269
+ } else {
270
+ countFiltersToFetch = filters;
271
+ }
272
+ if (countFiltersToFetch.length === 0) {
273
+ return;
274
+ }
275
+ setIsFetching(true);
276
+ const countsRes = await notifications.count({ filters: countFiltersToFetch });
277
+ setIsFetching(false);
278
+ setIsLoading(false);
279
+ if (countsRes.error) {
280
+ setError(countsRes.error);
281
+ onError?.(countsRes.error);
282
+ return;
283
+ }
284
+ const data = countsRes.data;
285
+ onSuccess?.(data.counts);
286
+ setCounts((oldCounts) => {
287
+ const newCounts = [];
288
+ const countsReceived = data.counts;
289
+ for (let i = 0; i < existingCounts.length; i++) {
290
+ const countReceived = countsReceived.find((c) => areTagsEqual(c.filter.tags, existingCounts[i]?.filter.tags));
291
+ newCounts.push(countReceived || oldCounts[i]);
292
+ }
293
+ return newCounts;
294
+ });
295
+ };
296
+ useWebSocketEvent({
297
+ event: "notifications.notification_received",
298
+ eventHandler: (data) => {
299
+ sync(data.result);
300
+ }
301
+ });
302
+ useWebSocketEvent({
303
+ event: "notifications.unread_count_changed",
304
+ eventHandler: () => {
305
+ sync();
306
+ }
307
+ });
308
+ useEffect5(() => {
309
+ setError(void 0);
310
+ setIsLoading(true);
311
+ setIsFetching(false);
312
+ sync();
313
+ }, [JSON.stringify(filters)]);
314
+ const refetch = async () => {
315
+ await sync();
316
+ };
317
+ return { counts, error, refetch, isLoading, isFetching };
318
+ };
319
+ export {
320
+ NovuProvider,
321
+ useCounts,
322
+ useNotifications,
323
+ useNovu,
324
+ usePreferences
325
+ };
326
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/hooks/useNotifications.ts","../../src/hooks/NovuProvider.tsx","../../src/hooks/usePreferences.ts","../../src/hooks/useCounts.ts","../../src/hooks/internal/useWebsocketEvent.ts","../../src/utils/requestLock.ts","../../src/hooks/internal/useBrowserTabsChannel.ts"],"sourcesContent":["import { useState, useEffect, useRef } from 'react';\nimport { ListNotificationsResponse, Notification, NovuError, isSameFilter, NotificationFilter } from '@novu/js';\nimport { useNovu } from './NovuProvider';\n\nexport type UseNotificationsProps = {\n tags?: string[];\n read?: boolean;\n archived?: boolean;\n limit?: number;\n onSuccess?: (data: Notification[]) => void;\n onError?: (error: NovuError) => void;\n};\n\nexport const useNotifications = (props?: UseNotificationsProps) => {\n const { tags, read, archived = false, limit, onSuccess, onError } = props || {};\n const filterRef = useRef<NotificationFilter | undefined>(undefined);\n const { notifications, on, off } = useNovu();\n const [data, setData] = useState<Array<Notification>>();\n const [error, setError] = useState<NovuError>();\n const [isLoading, setIsLoading] = useState(true);\n const [isFetching, setIsFetching] = useState(false);\n const [hasMore, setHasMore] = useState(false);\n const length = data?.length;\n const after = length ? data[length - 1].id : undefined;\n\n const sync = (event: { data?: ListNotificationsResponse }) => {\n if (!event.data || (filterRef.current && !isSameFilter(filterRef.current, event.data.filter))) {\n return;\n }\n setData(event.data.notifications);\n setHasMore(event.data.hasMore);\n };\n\n useEffect(() => {\n on('notifications.list.updated', sync);\n\n return () => {\n off('notifications.list.updated', sync);\n };\n }, []);\n\n useEffect(() => {\n const newFilter = { tags, read, archived };\n if (filterRef.current && isSameFilter(filterRef.current, newFilter)) {\n return;\n }\n\n notifications.clearCache({ filter: filterRef.current });\n filterRef.current = newFilter;\n\n fetchNotifications({ refetch: true });\n }, [tags, read, archived]);\n\n const fetchNotifications = async (options?: { refetch: boolean }) => {\n if (options?.refetch) {\n setError(undefined);\n setIsLoading(true);\n setIsFetching(false);\n }\n setIsFetching(true);\n const response = await notifications.list({\n tags,\n read,\n archived,\n limit,\n after: options?.refetch ? undefined : after,\n });\n if (response.error) {\n setError(response.error);\n onError?.(response.error);\n } else {\n onSuccess?.(response.data!.notifications);\n setData(response.data!.notifications);\n setHasMore(response.data!.hasMore);\n }\n setIsLoading(false);\n setIsFetching(false);\n };\n\n const refetch = () => {\n notifications.clearCache({ filter: { tags, read, archived } });\n\n return fetchNotifications({ refetch: true });\n };\n\n const fetchMore = async () => {\n if (!hasMore || isFetching) return;\n\n return fetchNotifications();\n };\n\n const readAll = async () => {\n return await notifications.readAll({ tags });\n };\n\n const archiveAll = async () => {\n return await notifications.archiveAll({ tags });\n };\n\n const archiveAllRead = async () => {\n return await notifications.archiveAllRead({ tags });\n };\n\n return {\n readAll,\n archiveAll,\n archiveAllRead,\n notifications: data,\n error,\n isLoading,\n isFetching,\n refetch,\n fetchMore,\n hasMore,\n };\n};\n","import { Novu, NovuOptions } from '@novu/js';\nimport { createContext, useContext, useMemo } from 'react';\n\ntype NovuProviderProps = NovuOptions & {\n children: JSX.Element;\n};\n\nconst NovuContext = createContext<Novu | undefined>(undefined);\n\nexport const NovuProvider = ({\n children,\n applicationIdentifier,\n subscriberId,\n subscriberHash,\n backendUrl,\n socketUrl,\n useCache,\n}: NovuProviderProps) => {\n const novu = useMemo(\n () => new Novu({ applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache }),\n [applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache]\n );\n\n return <NovuContext.Provider value={novu}>{children}</NovuContext.Provider>;\n};\n\nexport const useNovu = () => {\n const context = useContext(NovuContext);\n if (!context) {\n throw new Error('useNovu must be used within a <NovuProvider />');\n }\n\n return context;\n};\n\nexport const useUnsafeNovu = () => {\n const context = useContext(NovuContext);\n\n return context;\n};\n","import { NovuError, Preference } from '@novu/js';\nimport { useEffect, useState } from 'react';\nimport { useNovu } from './NovuProvider';\n\ntype UsePreferencesProps = {\n onSuccess?: (data: Preference[]) => void;\n onError?: (error: NovuError) => void;\n};\n\ntype UsePreferencesResult = {\n preferences?: Preference[];\n error?: NovuError;\n isLoading: boolean; // initial loading\n isFetching: boolean; // the request is in flight\n refetch: () => Promise<void>;\n};\n\nexport const usePreferences = (props?: UsePreferencesProps): UsePreferencesResult => {\n const { onSuccess, onError } = props || {};\n const [data, setData] = useState<Preference[]>();\n const { preferences, on, off } = useNovu();\n const [error, setError] = useState<NovuError>();\n const [isLoading, setIsLoading] = useState(true);\n const [isFetching, setIsFetching] = useState(false);\n\n const sync = (event: { data?: Preference[] }) => {\n if (!event.data) {\n return;\n }\n setData(event.data);\n };\n\n useEffect(() => {\n fetchPreferences();\n\n on('preferences.list.updated', sync);\n on('preferences.list.pending', sync);\n on('preferences.list.resolved', sync);\n\n return () => {\n off('preferences.list.updated', sync);\n off('preferences.list.pending', sync);\n off('preferences.list.resolved', sync);\n };\n }, []);\n\n const fetchPreferences = async () => {\n setIsFetching(true);\n const response = await preferences.list();\n if (response.error) {\n setError(response.error);\n onError?.(response.error);\n } else {\n onSuccess?.(response.data!);\n }\n setIsLoading(false);\n setIsFetching(false);\n };\n\n const refetch = () => {\n preferences.cache.clearAll();\n return fetchPreferences();\n };\n\n return {\n preferences: data,\n error,\n isLoading,\n isFetching,\n refetch,\n };\n};\n","import { useEffect, useState } from 'react';\nimport { Notification, NotificationFilter, NovuError, areTagsEqual } from '@novu/js';\nimport { useNovu } from './NovuProvider';\nimport { useWebSocketEvent } from './internal/useWebsocketEvent';\n\ntype Count = {\n count: number;\n filter: NotificationFilter;\n};\n\ntype UseCountsProps = {\n filters: NotificationFilter[];\n onSuccess?: (data: Count[]) => void;\n onError?: (error: NovuError) => void;\n};\n\ntype UseCountsResult = {\n counts?: Count[];\n error?: NovuError;\n isLoading: boolean; // initial loading\n isFetching: boolean; // the request is in flight\n refetch: () => Promise<void>;\n};\n\nexport const useCounts = (props: UseCountsProps): UseCountsResult => {\n const { filters, onSuccess, onError } = props;\n const { notifications } = useNovu();\n const [error, setError] = useState<NovuError>();\n const [counts, setCounts] = useState<Count[]>();\n const [isLoading, setIsLoading] = useState(true);\n const [isFetching, setIsFetching] = useState(false);\n\n const sync = async (notification?: Notification) => {\n const existingCounts = counts ?? (new Array(filters.length).fill(undefined) as (Count | undefined)[]);\n let countFiltersToFetch: NotificationFilter[] = [];\n if (notification) {\n // eslint-disable-next-line no-plusplus\n for (let i = 0; i < existingCounts.length; i++) {\n const filter = filters[i];\n if (areTagsEqual(filter.tags, notification.tags)) {\n countFiltersToFetch.push(filter);\n }\n }\n } else {\n countFiltersToFetch = filters;\n }\n\n if (countFiltersToFetch.length === 0) {\n return;\n }\n\n setIsFetching(true);\n const countsRes = await notifications.count({ filters: countFiltersToFetch });\n setIsFetching(false);\n setIsLoading(false);\n if (countsRes.error) {\n setError(countsRes.error);\n onError?.(countsRes.error);\n\n return;\n }\n const data = countsRes.data!;\n onSuccess?.(data.counts);\n\n setCounts((oldCounts) => {\n const newCounts: Count[] = [];\n const countsReceived = data.counts;\n\n // eslint-disable-next-line no-plusplus\n for (let i = 0; i < existingCounts.length; i++) {\n const countReceived = countsReceived.find((c) => areTagsEqual(c.filter.tags, existingCounts[i]?.filter.tags));\n\n newCounts.push(countReceived || oldCounts![i]);\n }\n\n return newCounts;\n });\n };\n\n useWebSocketEvent({\n event: 'notifications.notification_received',\n eventHandler: (data) => {\n sync(data.result);\n },\n });\n\n useWebSocketEvent({\n event: 'notifications.unread_count_changed',\n eventHandler: () => {\n sync();\n },\n });\n\n useEffect(() => {\n setError(undefined);\n setIsLoading(true);\n setIsFetching(false);\n sync();\n }, [JSON.stringify(filters)]);\n\n const refetch = async () => {\n await sync();\n };\n\n return { counts, error, refetch, isLoading, isFetching };\n};\n","import { EventHandler, Events, SocketEventNames } from '@novu/js';\nimport { useEffect } from 'react';\nimport { useNovu } from '../NovuProvider';\nimport { requestLock } from '../../utils/requestLock';\nimport { useBrowserTabsChannel } from './useBrowserTabsChannel';\n\nexport const useWebSocketEvent = <E extends SocketEventNames>({\n event: webSocketEvent,\n eventHandler: onMessage,\n}: {\n event: E;\n eventHandler: (args: Events[E]) => void;\n}) => {\n const novu = useNovu();\n const { postMessage } = useBrowserTabsChannel({ channelName: `nv.${webSocketEvent}`, onMessage });\n\n const updateReadCount: EventHandler<Events[E]> = (data) => {\n onMessage(data);\n postMessage(data);\n };\n\n useEffect(() => {\n const resolveLock = requestLock(`nv.${webSocketEvent}`, () => {\n novu.on(webSocketEvent, updateReadCount);\n });\n\n return () => {\n novu.off(webSocketEvent, updateReadCount);\n resolveLock();\n };\n }, []);\n};\n","export function requestLock(id: string, cb: (id: string) => void) {\n // Check if the Lock API is available\n if (!('locks' in navigator)) {\n // If Lock API is not available, immediately invoke the callback and return a no-op function\n cb(id);\n return () => {};\n }\n\n let isFulfilled = false;\n let promiseResolve: () => void;\n\n const promise = new Promise<void>((resolve) => {\n promiseResolve = resolve;\n });\n\n navigator.locks.request(id, () => {\n if (!isFulfilled) {\n cb(id);\n }\n\n return promise;\n });\n\n return () => {\n isFulfilled = true;\n promiseResolve();\n };\n}\n","import { useEffect, useState } from 'react';\n\nexport const useBrowserTabsChannel = <T = unknown>({\n channelName,\n onMessage,\n}: {\n channelName: string;\n onMessage: (args: T) => void;\n}) => {\n const [tabsChannel] = useState(\n typeof BroadcastChannel !== 'undefined' ? new BroadcastChannel(channelName) : undefined\n );\n\n const postMessage = (data: T) => {\n tabsChannel?.postMessage(data);\n };\n\n useEffect(() => {\n const listener = (event: MessageEvent<T>) => {\n onMessage(event.data);\n };\n\n tabsChannel?.addEventListener('message', listener);\n\n return () => {\n tabsChannel?.removeEventListener('message', listener);\n };\n }, []);\n\n return { postMessage };\n};\n"],"mappings":"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","names":["useEffect","useState","useState","useEffect","useEffect","useState","useEffect","useEffect","useState","useEffect","useState","useEffect"]}
@@ -1,4 +1,4 @@
1
- import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab } from '@novu/js/ui';
1
+ import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab, RouterPush } from '@novu/js/ui';
2
2
  export { Notification } from '@novu/js/ui';
3
3
 
4
4
  type NotificationsRenderer = (notification: Notification) => React.ReactNode;
@@ -20,6 +20,7 @@ type BaseProps = {
20
20
  appearance?: Appearance;
21
21
  localization?: Localization;
22
22
  tabs?: Array<Tab>;
23
+ routerPush?: RouterPush;
23
24
  };
24
25
  type DefaultProps = BaseProps & DefaultInboxProps & {
25
26
  children?: never;
@@ -1,4 +1,4 @@
1
- import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab } from '@novu/js/ui';
1
+ import { Notification, NotificationClickHandler, NotificationActionClickHandler, Appearance, Localization, Tab, RouterPush } from '@novu/js/ui';
2
2
  export { Notification } from '@novu/js/ui';
3
3
 
4
4
  type NotificationsRenderer = (notification: Notification) => React.ReactNode;
@@ -20,6 +20,7 @@ type BaseProps = {
20
20
  appearance?: Appearance;
21
21
  localization?: Localization;
22
22
  tabs?: Array<Tab>;
23
+ routerPush?: RouterPush;
23
24
  };
24
25
  type DefaultProps = BaseProps & DefaultInboxProps & {
25
26
  children?: never;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@novu/react",
3
- "version": "2.0.0-canary.2",
3
+ "version": "2.0.0",
4
4
  "repository": "https://github.com/novuhq/novu",
5
5
  "description": "Novu's React SDK for building custom inbox notification experiences",
6
6
  "author": "",
@@ -37,7 +37,7 @@
37
37
  "scripts": {
38
38
  "build:watch": "tsup --watch",
39
39
  "build": "tsup",
40
- "lint": "eslint --ext .ts,.tsx src"
40
+ "lint": "eslint src"
41
41
  },
42
42
  "browserslist": {
43
43
  "production": [
@@ -65,6 +65,6 @@
65
65
  "react-dom": ">=17"
66
66
  },
67
67
  "dependencies": {
68
- "@novu/js": "^2.0.0-canary.1"
68
+ "@novu/js": "^2.0.0"
69
69
  }
70
70
  }