redux-state-api-call

Redux state of api call

Installation

npm install --save redux-state-api-call

or

yarn add redux-state-api-call

Usage

Api reducer

The store should know how to handle actions coming from the async actions. To enable this, we need to pass the apiReducer to your store. It serves for all of your async actions ended with _(REQUEST|FAILURE|SUCCESS), so you only have to pass it once.

import { combineReducers } from 'redux';
import { reducer as apiReducer } from 'redux-state-api-call';
 
export const rootReducer = combineReducers({
  // ...your other reducers here
  // you have to pass apiReducer under 'api' key
  api: apiReducer
});

Async Actions

actions.js

import { createActions } from 'redux-actions';
export const {
  fetchAllRequest,
  fetchAllFailure,
  fetchAllSuccess 
} = createActions(
  {
    FETCH_ALL_REQUEST: undefined,
    FETCH_ALL_FAILURE: undefined,
    FETCH_ALL_SUCCESS: undefined
  },
  { prefix: 'app/user' }
);

Selectors

Loading Selector

import { createIsLoadingSelector } from 'redux-state-api-call';
import * as actions from './actions';
 
export const isFetching = createIsLoadingSelector([actions.fetchAllRequest]);

Error Selector

import { createErrorMessageSelector } from 'redux-state-api-call';
import * as actions from './actions';
 
export const getFetchError = createErrorMessageSelector([
  actions.fetchAllRequest
]);