Redux-GraphQL Boilerplate

redux_graphQL.js

import { someMethod } from 'utils/graphql';

// Actions
const REQUEST = 'path/to/REQUEST';
const REQUEST_SUCCESS = 'path/to/REQUEST_SUCCESS';
const REQUEST_FAIL = 'path/to/REQUEST_FAIL';

// Reducer
const initialState = {
  requesting: false,
  requested: false,
  errorMessage: '',
};

export default function reducer(state = initialState, action = {}) {
  switch (action.type) {
    case REQUEST:
      return {
        ...state,
        requesting: true,
        requested: false,
        errorMessage: '',
      };
    case REQUEST_SUCCESS:
      return {
        ...state,
        requesting: false,
        requested: true,
      };
    case REQUEST_FAIL:
      return {
        ...state,
        requesting: false,
        errorMessage: action.error.message,
      };
    default:
      return state;
  }
}

// Selectors - clean way to grab state rather than doing it in the container. This way if the location changes
// there is only one spot to update, all the containers can still use getSomeStuff().
export const getSomeStuff = state => state.stuff.allStuff;

// Action Creators - mutation example, could be just a simple query also.
export function request(arg1, arg2) {
  if (arg1 && arg2) {
    return { type: REQUEST_SUCCESS };
  }

  return {
    types: [REQUEST, REQUEST_SUCCESS, REQUEST_FAIL],
    promise: query`
      mutation MaybeMutateSomething(
        ${{ arg1 }}: String!
        ${{ arg2 }}: String!
      ) {
        info: requestInfo(arg1: $arg2, arg2: $arg2) {
          id
          someInfo
          someMoreInfo
        }
      }
    `,
  };
}