Performance enhancement - batching actions in submit() action creator

Author: davidkpiano

src/actions/field-actions.js

@@ -2,6 +2,7 @@ import _get from 'lodash/get';
 import mapValues from 'lodash/mapValues';
 
 import actionTypes from '../action-types';
+import batchActions from './batch-actions';
 import { getValidity, getForm, isValid, isInvalid } from '../utils';
 
 const focus = model => ({
@@ -114,18 +115,34 @@ const setViewValue = (model, value) => ({
   value,
 });
 
-const submit = (model, promise) => dispatch => {
+const submit = (model, promise, options = {}) => dispatch => {
   dispatch(setPending(model, true));
 
+  const errorsAction = options.fields
+    ? setFieldsErrors
+    : setErrors;
+
   promise.then(response => {
-    dispatch(setSubmitted(model, true));
-    dispatch(setValidity(model, response));
+    dispatch(batchActions.batch(model, [
+      setSubmitted(model, true),
+      setValidity(model, response),
+    ]));
   }).catch(error => {
-    dispatch(setSubmitFailed(model));
-    dispatch(setValidity(model, error, { errors: true }));
+    dispatch(batchActions.batch(model, [
+      setSubmitFailed(model),
+      errorsAction(model, error, { errors: true }),
+    ]));
   });
+
+  return promise;
 };
 
+const submitFields = (model, promise, options = {}) =>
+  submit(model, promise, {
+    ...options,
+    fields: true,
+  });
+
 const validate = (model, validators) => (dispatch, getState) => {
   const value = _get(getState(), model);
   const validity = getValidity(validators, value);
@@ -188,6 +205,7 @@ export default {
   blur,
   focus,
   submit,
+  submitFields,
   setDirty,
   setErrors,
   setInitial,

test/field-actions-spec.js

@@ -1153,8 +1153,14 @@ describe('field actions', () => {
     it('should be able to resolve a form as valid', done => {
       const expectedActions = [
         { type: actionTypes.SET_PENDING, pending: true, model: 'test' },
-        { type: actionTypes.SET_SUBMITTED, submitted: true, model: 'test' },
-        { type: actionTypes.SET_VALIDITY, validity: true, model: 'test' },
+        {
+          type: actionTypes.BATCH,
+          model: 'test',
+          actions: [
+            { model: 'test', submitted: true, type: actionTypes.SET_SUBMITTED },
+            { model: 'test', type: actionTypes.SET_VALIDITY, validity: true },
+          ],
+        },
       ];
 
       const store = mockStore(() => ({}), expectedActions, done);
@@ -1170,8 +1176,14 @@ describe('field actions', () => {
 
       const expectedActions = [
         { type: actionTypes.SET_PENDING, pending: true, model: 'test' },
-        { type: actionTypes.SET_SUBMIT_FAILED, model: 'test' },
-        { type: actionTypes.SET_ERRORS, errors, model: 'test' },
+        {
+          type: actionTypes.BATCH,
+          model: 'test',
+          actions: [
+            { type: actionTypes.SET_SUBMIT_FAILED, model: 'test' },
+            { type: actionTypes.SET_ERRORS, errors, model: 'test' },
+          ],
+        },
       ];
 
       const store = mockStore(() => ({}), expectedActions, done);