Novu•16mo ago

Data payload undefined in new React <Inbox /> component

Hey I'm trying to update from the old React Notification Center to the new Inbox. If I trigger a notification via the website I get undefined for the data payload. I've even added an explicit "data" field.

Im using

"@novu/react": "2.2.0"

"@novu/react": "2.2.0"

"@novu/react": "2.2.0"

"@novu/react": "2.2.0"

Am I missing something?, I've attached a screenshot showing how the notification comes through using the old style

IMessage

IMessage

IMessage

IMessage from the

PopoverNotificationCenter

PopoverNotificationCenter

PopoverNotificationCenter

PopoverNotificationCenter

Pawan Jain•9/25/24, 7:15 AM

@turtles

Currently, it is supported only in @novu/framework@novu/framework

turtlesOP•9/25/24, 9:25 PM

Ahh, I see. Are there plans to increase support so using the website or @novu/node to trigger a notification works for the new React package?

Pawan Jain•9/26/24, 6:33 AM

We are planning to release this end of october or start of november.
is that a blocker for you to use Novu?

turtlesOP•9/26/24, 9:29 PM

We are using Novu already. I was just trying to update to the new component.

Once it's supported on @novu/node we will be able to finish the update

turtlesOP•9/26/24, 9:35 PM

Just as a FYI from a user perspective I followed the Migration guide on your docs and it doesnt sound like its not compatible with any of the packages, maybe it should be in breaking changes?

and in this section https://docs.novu.co/inbox/react/styling#variables

there is a small typo:
"if you want to change the border radiusborder radius of all the components at once, you can do so by updating the colorPrimarycolorPrimary variable".

We like Novu and it's saved us a lot of time, so thanks

Novu

Styling the Inbox component - Novu

Learn how to style the pre built Inbox component

Novu_Bot•9/26/24, 9:35 PM

@turtles, you just advanced to level 1!

Pawan Jain•10/1/24, 10:25 PM

@turtles

Sorry for delayed response.

Would you like to share the use case with data field? I might have workaround for you.

I followed the Migration guide on your docs and it doesnt sound like its not compatible with any of the packages, maybe it should be in breaking changes?

Can you please share more about breaking change?

there is a small typo: if you want to change the border radius of all the components at once, you can do so by updating the colorPrimarycolorPrimary variable

Apologies, can you please share the typo. I could not figure out.

turtlesOP•10/1/24, 11:00 PM

No worries

*Would you like to share the use case with data field? I might have workaround for you.*Yeah we send info around in the old payload. We have a side panel that alerts the user if a measurement exceeds a threshold. We use data in that payload to populate that panel or we can popup a toast. Extra little nice to have things that we would otherwise need to add backend routes for
*Can you please share more about breaking change?*The guide reads like you just need to update the front end components and it should work with existing backend implementations (in our case `@novu/node`). The guide says compatibility with `@novu/framework` not that it only works with `@novu/framework` . Could just be my interpretation though, but it confused me.
*Apologies, can you please share the typo. I could not figure out. *We are being told if we want to change the `borderRadius` we should change the `colorPrimary` variable instead of the `borderRadius` variable

Sang Dang•10/27/24, 7:25 AM

Sorry to chime in but currently I face similar issue. After upgrading the

data

data

is undefined. I tried to check the docs but it is not in a flow, like I followed the upgrade guide, but it never mentions the frameworkframework anywhere.

My question is, if I send the trigger from the server, should I upgrade the @novu/node@novu/node into something else or it is the same?

Thanks.

Pawan Jain•10/27/24, 1:04 PM

@Sang Dang

Are you using @novu/framework@novu/framework to create workflow and @novu/react@novu/react for in-app notifications?

Data payload undefined in new React <Inbox /> component

Similar Threads

Similar Threads

Similar Threads