Novu•2y ago

How do you create a subscriber using the Notification Center for React

I am using the NovuProvider, however I can't seem to find the process for updating the subscriber properties i.e. email, number or any other metadata <NovuProvider backendUrl={novuBackendUrl} socketUrl={novuSocketUrl} subscriberId={currentShop._id} applicationIdentifier={novuAppId} > <PopoverNotificationCenter onNotificationClick={onNotificationClick}> {({ unseenCount }) => <NotificationBell unseenCount={unseenCount} />} </PopoverNotificationCenter> </NovuProvider>

15 Replies

Pawan Jain•2y ago

Hi @harrisyn Subscriber can be updated using sdk or api.

Pawan Jain•2y ago

https://docs.novu.co/platform/subscribers#update-a-subscriber

Subscribers | Novu

Subscriber is a user to whom Novu will send a notification. Each subscriber in Novu is uniquely identified by subscriberId. Novu manages your users in the form of subscribers. Novu stores some user-specific information that helps you send multichannel notifications to your users.

harrisynOP•2y ago

thanks @Pawan Jain I was hoping I could pass those in from the frontend. Also I have a usecase in which a user can have multiple profiles (although a single user id) and needs to receive notifications per each profile, to expand a little. We have profiles, think organisation or business. A business can have multiple users or be managed by multiple users. A user can have one or more organisations. A user logs in and would select an organisation to manage. Notifications can be sent to either the user or to the organisation (each has a default user/owner). A user when logged in and managing an organisation should see the notifications meant for that organisation or their account I am wondering how to setup subscribers to cater to a setup like this.

Tomer Barnea•2y ago

Hey @harrisyn so I think I tackle this like this. The basic concept of a subscriber in this case would be a profile Id. So this way we can targert the profile and not the user above. Based on the second pat, of a user can see notification targeting them individually or their organization, we need to onboard profiles beforehand, and group them into topics, based on the organization profile members. And when time come trigger the topic in the name of the organization (Novu will fan out). Open question would, is there any place to trigger a user and not a profile/organization? If so, we can create a "user" topic, adding all their profiles into the topic. * important note, in this case, youll have to user the profile id to identify said user, and there is a risk of multiple emails. Do you think that's a good solution here?

harrisynOP•2y ago

Hi @tomerbarnea thanks for the response, I can see where this is heading and I am only beginning to consider topics as a possible solution. So if I understand the proposed approach it will be 1) Add users by profile_id 2) Create a topic by organisation and add all users to it. 3) send user specific events to the profile_id 4) send org events to the topic I think this might work, will give it a spin and revert

harrisynOP•2y ago

Also getting a "invalid namespace" for the websocket

Pawan Jain•2y ago

@harrisyn Can you please share steps to reproduce this invalid namespace error?

Tomer Barnea•2y ago

Let us know how it works 🙂

harrisynOP•2y ago

@Pawan Jain I am unsure how to reproduce, I used the notification center demo to test connection, and whilst the test notification works, the websocket doesn't seem to work well, so I have to reload the page to see the new notifications. I only just seen the error in the console. I suspect it might have something to do with the configurations, but I am unsure what to tweak to solve this.

harrisynOP•2y ago

found a fix in #Another piece of information that might help someone: I couldn't get websocket to work with the config I've written in the question, this is how I got it to work: Change REACT_APP_WS_URL to

REACT_APP_WS_URL=http://novu.example.com

REACT_APP_WS_URL=http://novu.example.com

(Don't mention subroute) In your nginx config, define the rule for websocket like this:

    location /socket.io/ {
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $host;

      proxy_pass http://localhost:3002;

      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
    }

    location /socket.io/ {
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $host;

      proxy_pass http://localhost:3002;

      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
    }

Tomer Barnea•2y ago

Thanks @harrisyn 🙏 @Pawan Jain maybe we should document this?

harrisynOP•2y ago

that would be a great idea, I struggled the most setting this up with NGINX. will add instructions with a sample config (at least what's working now in my fork), I could share that when I am done, so it can be cleaned up. I experimented a lot, so there are some options that I suspect aren't required but I am just glad it's running, so haven't attempted testing without them.

sai•10mo ago

hi @harrisyn I need guidence in deploying Self-hosting Novu on an AWS EC2 instance, Via docker. I have followed the document - https://docs.novu.co/self-hosting-novu/deploy-with-docker But there are multiple errors , Is there any nginx reverse proxy script for routing the application to our domain? and the changes that we need to do in .env . Can you share me the nginx config and the .env file.

harrisynOP•9mo ago

Hi, apologies, I have been away, did you find a solution?

Novu_Bot•9mo ago

@Dauntless, you just advanced to level 1!

Gaming

Programming

How do you create a subscriber using the Notification Center for React