State and Store in frontend codebases - Redux example - middleware

middleware.js

import { fetchUsers, createUser } from "./fake-fetch";

import {
  fetchUsersSucceeded,
  fetchUsersFailed,
  createUserFailed,
  createUserSucceeded
} from "./actionCreators";

export const middleware = ({ dispatch, getState }) => (next) => (action) => {
  next(action);

  switch (action.type) {
    case "FETCH_USERS": {
      fetchUsers()
        .then((payload) => {
          dispatch(fetchUsersSucceeded(payload));
        })
        .catch(() => {
          dispatch(fetchUsersFailed());
        });

      break;
    }

    case "CREATE_USER": {
      const currentUsers = getState().users;

      if (currentUsers.length >= 10) {
        dispatch(createUserFailed());
      }

      createUser()
        .then((payload) => {
          dispatch(createUserSucceeded(payload));
        })
        .catch(() => {
          dispatch(createUserFailed());
        });

      break;
    }

    default: {
    }
  }
};