An example reducer file for react and also shows how to use redux-promise-middleware

reducer.js

import * as actionTypes from './actionTypes';

const initialState = {
  customers: [],
  searchItem: '',
  totalCustomers: 0,
  currentPageNo: 1,
  currentPageSize: 100,
  selectedUsers: [],
  loading: false,
  error: null,
};

export default function (state = initialState, action) {
  switch (action.type) {
    case actionTypes.GET_CUSTOMERS_SUCCESS: {
      return {
        ...state,
        customers: action.payload.customers,
        totalCustomers: action.payload.total,
        currentPageNo: action.payload.page,
        currentPageSize: action.payload.pageSize,
        loading: false,
        error: null,
      };
    }
    case actionTypes.GET_CUSTOMERS_LOADING: {
      return {
        ...state,
        loading: true,
        error: null,
      };
    }
    case actionTypes.GET_CUSTOMERS_ERROR: {
      return {
        ...state,
        customers: [],
        loading: false,
        error: action.payload,
      };
    }
    case actionTypes.SAVE_CUSTOMERS_SUCCESS: {
      return {
        ...state,
        customers: [...state.customers, action.payload.data.customer],
        loading: false,
      };
    }
    case actionTypes.SAVE_CUSTOMERS_LOADING: {
      return {
        ...state,
        loading: true,
        error: null,
      };
    }
    case actionTypes.SAVE_CUSTOMERS_ERROR: {
      return {
        ...state,
        loading: false,
        error: action.payload,
      };
    }
    case actionTypes.UPDATE_CUSTOMERS_SUCCESS: {
      return {
        ...state,
        customers: [...state.customers.map((user) => {
          if (user.id === action.payload.data.customer.id) {
            return action.payload.data.customer;
          }
          return user;
        })],
        loading: false,
        error: null,
      };
    }
    case actionTypes.UPDATE_CUSTOMERS_LOADING: {
      return {
        ...state,
        loading: true,
        error: null,
      };
    }
    case actionTypes.UPDATE_CUSTOMERS_ERROR: {
      return {
        ...state,
        loading: false,
        error: action.payload,
      };
    }
    case actionTypes.DELETE_CUSTOMERS_SUCCESS: {
      return {
        ...state,
        selectedUsers: [...state.selectedUsers.filter(user => user.id !== action.payload.id)],
        customers: [...state.customers.filter(user => user.id !== action.payload)],
        loading: false,
        error: null,
      };
    }
    case actionTypes.DELETE_CUSTOMERS_LOADING: {
      return {
        ...state,
        loading: true,
        error: null,
      };
    }
    case actionTypes.DELETE_CUSTOMERS_ERROR: {
      return {
        ...state,
        loading: false,
        error: action.payload,
      };
    }
    case actionTypes.SET_SELECTED_CUSTOMERS: {
      return {
        ...state,
        selectedUsers: action.payload,
      };
    }
    case actionTypes.ADD_CUSTOMER_TO_SELECTED_CUSTOMERS: {
      return {
        ...state,
        selectedUsers: [...state.selectedUsers, action.payload],
      };
    }
    case actionTypes.REMOVE_CUSTOMER_FROM_SELECTED_CUSTOMERS: {
      return {
        ...state,
        selectedUsers: [...state.selectedUsers.filter(user => user.id !== action.payload.id)],
      };
    }
    case actionTypes.SEARCH_CUSTOMERS_SUCCESS: {
      return {
        ...state,
        customers: action.payload.data.customers,
        totalCustomers: action.payload.data.total,
        searchItem: action.payload.searchItem,
        currentPageNo: action.payload.data.page,
        currentPageSize: action.payload.pageSize,
        loading: false,
        error: null,
      };
    }
    case actionTypes.SEARCH_CUSTOMERS_LOADING: {
      return {
        ...state,
        // currentPageNo: 1,
        loading: true,
        error: null,
      };
    }
    case actionTypes.SEARCH_CUSTOMERS_ERROR: {
      return {
        ...state,
        loading: false,
        error: action.payload,
      };
    }
    case actionTypes.SET_SEARCH_ITEM: {
      return {
        ...state,
        searchItem: '',
        customers: [],
      };
    }
    default:
      return state;
  }
}