CODEWITHSUNDEEP
reactjspush-notificationredux
Homer
Homer

Reputation: 87

React/redux notifications

I'm working on a react/redux project. I looking for a component or a package, that displays notification messages to the user, for example react-notify.

The components I've found (including react-notify) use refs:

<ReactNotify ref='notificator'/>

I want a package without refs, if one exists.

Thank you!

Upvotes: 4

Views: 6234

Answers (2)

Nicolas
Nicolas

Reputation: 1263

I have recently developed a simple library to implement a react-redux notification system on your app and it doesn't need to use ref. Check it out react-redux-notifications. Any feedback would be appreciate it.

Upvotes: 1

Ori Drori
Ori Drori

Reputation: 191976

Look at redux-notifications. It's a pure redux solution without the use of refs. The documentation is a bit outdated, but this worked for me (the change is the actions).

You add the <Notifs /> component to the root of your project: 

import { Provider }  from 'react-redux'
import { Notifs } from 'redux-notifications';

<Provider store={store}>
  <div>
    // ... other things like router ...
    <Notifs />
  </div>
</Provider>

Add the the notifReducer to your base reducer:

import { createStore, combineReducers } from 'redux'
import { reducer as notifReducer } from 'redux-notifications';
combineReducers({
  notifs: notifReducer,
  // ... more reducers here ...
})

And then use the built in actions to dispatch notifications:

import { actions } from 'redux-notifications';

action.notifSend({
    message: "I am a notification",
    kind,
    id: 1234,
    dismissAfter: 2000
})(dispatch)

Upvotes: 4

Related Questions