Skip to content

Instantly share code, notes, and snippets.

@LBWright
Created September 30, 2019 13:15
Show Gist options
  • Save LBWright/6bc1cc3f9f871fbc0845eb4af7f561c2 to your computer and use it in GitHub Desktop.
Save LBWright/6bc1cc3f9f871fbc0845eb4af7f561c2 to your computer and use it in GitHub Desktop.
thunk for zach
// inside of my actions.js, my actions look like this...
// because I'm creating a function that returns a function, I have access to dispatch
// through the Thunk middleware. I technically have access to state too, as a second argument
// Because I'm using dispatch here, this specific function can be bound to the redux store
// You could maybe think about it like a singleton?
export const createWellsTask = ({ serverId }) => async (dispatch) => {
const payload = {
properties: {
operation: 'list_wells',
witsml_server: serverId,
},
};
dispatch({
type: TYPES.CREATE_WELLS_TASK,
});
try {
const response = await post('/v2/tasks', { task: payload });
dispatch({
type: TYPES.CREATE_WELLS_TASK_SUCCESS,
payload: response.toJS(),
});
} catch (e) {
dispatch({
type: TYPES.CREATE_WELLS_TASK_ERROR,
payload: e,
});
}
};
// Where it comes together inside of container.js
const mapDispatchToProps = {
subscribeAppForAsset,
unsubscribeAppFromAsset,
createWellsTask,
};
export default
connect(
mapStateToProps,
mapDispatchToProps
)(StreamMapper);
/**************************/
//it could also be done like this with no 'actions file' (using .then just for variance)
const mapDispatchToProps = (dispatch) => {
createWellsTask: (myArgs) => dispatch({type: MYTYPE, payload: myArgs})
// You could break up your bound functions here and 'assemble them' inside of your component
}
export default
connect(
mapStateToProps,
mapDispatchToProps
)(StreamMapper);
/************************/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment