Reducer Architecture

noteReducer.js

import {
  FETCHING_NOTES,
  FETCH_NOTES,
  FETCH_NEW_NOTE,
  FETCH_UPDATED_NOTE,
  FETCH_CLOSED_NOTE
} from "../actions/types";

const initialState = {
  list: [],
  isFetching: false
};

export const noteReducer = (state = initialState, action) => {
  switch (action.type) {
    case FETCHING_NOTES:
      return { ...state, isFetching: true };
    case FETCH_NOTES:
      return { ...state, isFetching: false, list: action.payload.notes };
    case FETCH_NEW_NOTE:
      return {
        ...state,
        isFetching: false,
        list: [...state.list, action.payload.newNote] // Add newNote to list array
      };
     case FETCH_UPDATED_INCIDENT:
       const updatedNotes = state.list.map(note => {
         if (note._id === action.id) {
           return { ...note, ...action.payload }; // update the particular array element
         } else {
           return note; // just return the rest of the notes that we don't want to update
         }
       });
       return { ...state, isFetching: false, list: updatedNotes };
    case FETCH_CLOSED_NOTE: // delete it from array as we don't want it displayed
      return {
        ...state,
        isFetching: false,
        list: [...state.list.filter(note => note._id !== action.id)]
      };
    default:
      return state;
  }
};

export default noteReducer;