项目作者: zooppa

项目描述 :
⚡️ A redux reducer and a set of actions to implement flash messages in a redux application
高级语言: JavaScript
项目地址: git://github.com/zooppa/flash-messages.git
创建时间: 2017-06-15T16:01:52Z
项目社区:https://github.com/zooppa/flash-messages

开源协议:MIT License

下载


flash-messages Build Status codecov

A redux reducer and a set of actions to implement flash messages in a redux
application.

Note: this library provides only the data layer. In order to display the messages in
your frontend, you must read the current messages from the corresponding
reducer.

Work In Progress Warning

The public interface of this project is being actively developed. It is,
therefore, still evolving and subject to sudden change. Wait until version
1.0.0 if you want to enjoy a stable API.

Installing

npm install @zooppa/flash-messages

or

yarn add @zooppa/flash-messages

Running tests

  • yarn run test:single (single test run with coverage)
  • yarn run test (watch)

Building

  • yarn run build

Using

Adding the reducer to your root reducer:

  1. // reducers/rootReducer.js
  2. import { combineReducers } from 'redux';
  3. import { flashMessagesReducer as flashMessages } from '@zooppa/flash-messages';
  4. export default combineReducers({
  5. flashMessages
  6. });

Dispatching a message:

  1. // your component
  2. import { receiveFlashMessage } from '@zooppa/flash-messages';
  3. store.dispatch(receiveFlashMessage({
  4. type: 'success', // ['success', 'warning', 'error', ...]
  5. text: 'my text'
  6. }));

Dispatching a timed message:

  1. import { receiveTimedFlashMessage } from '@zooppa/flash-messages';
  2. store.dispatch(receiveTimedFlashMessage({
  3. type: 'success',
  4. text: 'this message will disappear in 3000 ms'
  5. }, { // optional config object
  6. time: 3000 // default: 3000
  7. }))

Contributing

  • Use eslint in your editor with the provided eslintrc.js config.
  • Use prettifier as a code formatter (included in devDependencies).
  • Respect the coverage thresholds.
  • Use common sense.