Organize actions in redux architecture

README.md

MOVED: https://github.com/frontrockets/redux-abstract-action

Create an action creator

import AbstractAction from 'src/lib/AbstractAction'

// We create an Action constructor specifically for the collection (domain). We specify collection 
// name by overriding `_namespace`. This can be easily automated by babel plugin.
class Action extends AbstractAction {
  _namespace = 'Users'
}

// We create a new Action creator (setting a name can be easily automated by babel plugin)
const pullOne = new Action('pullOne', {
  // Here we specify functions which will generate a payload according to arguments (we can specify 
  // generators for `init`, `success` and `failure` actions)
  init: id => ({ id }),
  success: data => data,
})

Usage of action creator

Every action has the following interface:

// To create actions:
pullOne.init()
pullOne.success()
pullOne.failure()

// To reference types of created actions:
pullOne.INIT_TYPE
pullOne.SUCCESS_TYPE
pullOne.FAILURE_TYPE

In our example above those functions will return this:

pullOne.init(10)
//- { type: 'Users/pullOne/INIT', payload: { id: 10 } } 

pullOne.success({ name: 'Eugene' })
//- { type: 'Users/pullOne/SUCCESS', payload: { name: 'Eugene' } } 

pullOne.failure()
//- { type: 'Users/pullOne/FAILURE', payload: {} } 

pullOne.INIT_TYPE
//- 'Users/pullOne/INIT'

pullOne.SUCCESS_TYPE
//- 'Users/pullOne/SUCCESS'

pullOne.FAILURE_TYPE
//- 'Users/pullOne/FAILURE'

AbstractAction.js

/* eslint-disable no-underscore-dangle */

const noop = () => {}

class ActionCreator {
  constructor(type, payload = noop, args = []) {
    this._type = type
    this._payload = payload
    this._args = args

    return this.perform.call(this, args)
  }

  perform(args) {
    return {
      type: this._type,
      payload: this._payload(...args),
    }
  }
}

class AbstractAction {
  constructor(name, options = {}) {
    this._name = name
    this._options = options
  }

  _buildType(kind = '') {
    return [this._namespace, this._name, kind].filter(Boolean).join('/')
  }

  get INIT_TYPE() {
    return this._buildType('INIT')
  }

  get SUCCESS_TYPE() {
    return this._buildType('SUCCESS')
  }

  get FAILURE_TYPE() {
    return this._buildType('FAILURE')
  }

  init = (...args) =>
    new ActionCreator(this.INIT_TYPE, this._options.init, args)

  success = (...args) =>
    new ActionCreator(this.SUCCESS_TYPE, this._options.success, args)

  failure = (...args) =>
    new ActionCreator(this.FAILURE_TYPE, this._options.failure, args)
}

export default AbstractAction