Skip to content

Instantly share code, notes, and snippets.

@zaycker
Created July 5, 2018 23:24
Show Gist options
  • Save zaycker/7b7c81b753aa6584520244e800134d96 to your computer and use it in GitHub Desktop.
Save zaycker/7b7c81b753aa6584520244e800134d96 to your computer and use it in GitHub Desktop.
final-form + redux submit handling example. not to forget
import {compose, lifecycle, mapProps, withHandlers, withProps, withState} from 'recompose';
import { FORM_ERROR } from 'final-form';
import omit from 'lodash/omit';
export default compose(
withState('submitHandler', 'setSubmitHandler', null),
withHandlers(({
onSubmit: ({ submitAction, setSubmitHandler }) => values =>
new Promise((resolve) => {
submitAction(values);
setSubmitHandler({ resolve });
}),
})),
lifecycle({
componentWillReceiveProps({
submitHandler,
setSubmitHandler,
isSubmitComplete,
submitError,
}) {
if (!isSubmitComplete || !submitHandler) {
return;
}
if (submitError) {
submitHandler.resolve({ [FORM_ERROR]: submitError });
} else {
submitHandler.resolve();
}
setSubmitHandler(null);
},
}),
mapProps(props => omit(props, [
'isSubmitComplete',
'setSubmitHandler',
'submitAction',
'submitError',
'submitHandler',
])),
);
/** Example usage:
export default compose(
connect(({ auth, loading }) => ({
isSubmitComplete: !loading.models.auth,
submitError: auth.error,
}), {
submitAction: SOME_ACTION,
}),
withRouter,
withProps({
component: SomeFormComponent,
}),
reduxSubmitHandler,
)(Form);
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment