Novu•2y ago

Notifications center v0.10.1 TypeError

@dr.really is facing the following: TypeError: Cannot read properties of null (reading 'notifications') on the notifications center v0.10.1 Has anyone else encountered that? @dr.really Can you add anything else that may be relevant to troubleshoot this?

11 Replies

dr.really•2y ago

I can get some screenshots when I get to work 🙂

empe•2y ago

Sounds great! Meanwhile, if @Support can help regardless - it would be wonderful!

Paweł T.•2y ago

@dr.really it would be nice if you can provide more context

dr.really•2y ago

Currently running in Remix, using @novu/notifications-center: 0.10.1 When using the useNotifications() hook, I get the following error: TypeError: Cannot read properties of null (reading 'notifications') example code:

const { notifications, refetch, markAsSeen, fetching, markAsRead } = useNotifications();
...
  useEffect(() => {
    if (!fetching) {
      if (notifications) {
        notifications.forEach((n) => {
          if (!n.seen) {
            console.log(n._id, 'not seen');
            console.log(n);
            showNotification({
              id: n._id,
              title: 'Demo Notification',
              message: notificationContent(n),
              autoClose: false,
            })
          }
        })
      }
    }
  }, [notifications, markAsSeen, fetching])
...

const { notifications, refetch, markAsSeen, fetching, markAsRead } = useNotifications();
...
  useEffect(() => {
    if (!fetching) {
      if (notifications) {
        notifications.forEach((n) => {
          if (!n.seen) {
            console.log(n._id, 'not seen');
            console.log(n);
            showNotification({
              id: n._id,
              title: 'Demo Notification',
              message: notificationContent(n),
              autoClose: false,
            })
          }
        })
      }
    }
  }, [notifications, markAsSeen, fetching])
...

hope that helps

Paweł T.•2y ago

which line does throw it?

dr.really•2y ago

apologies just now saw this, it throws it on the useNotifications line. Looks like something in the hook

Paweł T.•2y ago

can you please share the stack trace?

dr.really•2y ago

yessir, once i get to the office i'll shoot one over to you

TypeError: Cannot read properties of null (reading 'notifications')
    at j (/home/user/code/firefly/node_modules/.pnpm/@novu+notification-center@0.10.1_2zx2umvpluuhvlq44va5bta2da/node_modules/@novu/notification-center/src/hooks/use-notifications.hook.ts:14:36)
    at AppHeader (/home/user/code/firefly/apps/web/app/components/layout/AppHeader.tsx:20:57)
    at renderWithHooks (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5662:16)
    at renderIndeterminateComponent (/home/wdhodges/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5735:15)
    at renderElement (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5950:7)
    at renderNodeDestructiveImpl (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6108:11)
    at renderNodeDestructive (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6080:14)
    at renderNode (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6263:12)
    at renderChildrenArray (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6215:7)
    at renderNodeDestructiveImpl (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6145:7)

TypeError: Cannot read properties of null (reading 'notifications')
    at j (/home/user/code/firefly/node_modules/.pnpm/@novu+notification-center@0.10.1_2zx2umvpluuhvlq44va5bta2da/node_modules/@novu/notification-center/src/hooks/use-notifications.hook.ts:14:36)
    at AppHeader (/home/user/code/firefly/apps/web/app/components/layout/AppHeader.tsx:20:57)
    at renderWithHooks (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5662:16)
    at renderIndeterminateComponent (/home/wdhodges/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5735:15)
    at renderElement (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5950:7)
    at renderNodeDestructiveImpl (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6108:11)
    at renderNodeDestructive (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6080:14)
    at renderNode (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6263:12)
    at renderChildrenArray (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6215:7)
    at renderNodeDestructiveImpl (/home/user/code/firefly/node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6145:7)

sorry that took me longer than I wanted it to take

dr.really•2y ago

Looks like the issue is here: https://github.com/novuhq/novu/blob/cd8d36cbb14c2431db8cdec47dcc40ccc5df20c2/packages/notification-center/src/hooks/use-notifications.hook.ts#L14

GitHub

novu/use-notifications.hook.ts at cd8d36cbb14c2431db8cdec47dcc40ccc...

The open-source notification infrastructure for products. Add a notification center for your React, Vue and Angular apps 🚀 - novu/use-notifications.hook.ts at cd8d36cbb14c2431db8cdec47dcc40ccc5df20...

Paweł T.•2y ago

to me it seems like you are trying to use the useNotifications hook outside the NovuProvider context can you check that?

dr.really•2y ago

For some reason, I didn't get notified of this. I apologize greatly for the delay. I am verifying this now.

Gaming

Programming

Notifications center v0.10.1 TypeError