Skip to content

Instantly share code, notes, and snippets.

@steveyerigandev
Created September 2, 2021 15:36
Show Gist options
  • Save steveyerigandev/585bd313b58fea76dc60ddb45a9dfef7 to your computer and use it in GitHub Desktop.
Save steveyerigandev/585bd313b58fea76dc60ddb45a9dfef7 to your computer and use it in GitHub Desktop.
Redux-GraphQL Boilerplate
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
}
}
`,
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment