Refactored mutations syntax

Author: alOneh

templates/vue/store/modules/foo/create.js

@@ -12,24 +12,24 @@ const state = {
   created: null
 };
 
-function error(commit, error) {
-  return commit({{{ uc }}}_CREATE_ERROR, error);
+function error(error) {
+  return {type: {{{ uc }}}_CREATE_ERROR, error};
 }
 
-function loading(commit, loading) {
-  return commit({{{ uc }}}_CREATE_LOADING, loading);
+function loading(loading) {
+  return {type: {{{ uc }}}_CREATE_LOADING, loading};
 }
 
-function success(commit, created) {
-  return commit({{{ uc }}}_CREATE_SUCCESS, created);
+function success(created) {
+  return {type: {{{ uc }}}_CREATE_SUCCESS, created};
 }
 
-function violations(commit, violations) {
-  return commit({{{ uc }}}_CREATE_VIOLATIONS, violations);
+function violations(violations) {
+  return {type: {{{ uc }}}_CREATE_VIOLATIONS, violations};
 }
 
-function reset(commit) {
-  return commit({{{ uc }}}_CREATE_RESET);
+function reset() {
+  return {type: {{{ uc }}}_CREATE_RESET};
 }
 
 const getters = {
@@ -40,40 +40,47 @@ const getters = {
 };
 
 const actions = {
-  create({ commit }) {
-    loading(commit, true);
+  create({ dispatch }, values) {
+    dispatch(loading(true));
 
     return {{{ lc }}}Fetch('/{{{ name }}}', {method: 'POST', body: JSON.stringify(values)})
       .then(response => {
-        loading(commit, false);
+        dispatch(loading(false));
 
         return response.json();
       })
       .then(data => {
-        success(commit, data);
+        dispatch(success(data));
       })
       .catch(e => {
-        loading(commit, false);
-        error(commit, e.message);
+        dispatch(loading(false));
+
+        if (e instanceof SubmissionError) {
+          dispatch(violations(e.errors));
+          dispatch(error(e.errors._error));
+          return;
+        }
+
+        dispatch(error(e.message));
       });
   },
-  reset({ commit }) {
-    reset(commit);
+  reset({ dispatch }) {
+    dispatch(reset());
   }
 };
 
 const mutations = {
-    [{{{ uc }}}_CREATE_ERROR] (state, error) {
-      state.error = error;
+    [{{{ uc }}}_CREATE_ERROR] (state, payload) {
+      state.error = payload.error;
     },
-    [{{{ uc }}}_CREATE_LOADING] (state, loading) {
-      state.loading = loading;
+    [{{{ uc }}}_CREATE_LOADING] (state, payload) {
+      state.loading = payload.loading;
     },
-    [{{{ uc }}}_CREATE_SUCCESS] (state, created) {
-      state.created = created;
+    [{{{ uc }}}_CREATE_SUCCESS] (state, payload) {
+      state.created = payload.created;
     },
-    [{{{ uc }}}_CREATE_VIOLATIONS] (state, violations) {
-      state.violations = violations;
+    [{{{ uc }}}_CREATE_VIOLATIONS] (state, payload) {
+      state.violations = payload.violations;
     },
     [{{{ uc }}}_CREATE_RESET] (state) {
       state.loading = false;

templates/vue/store/modules/foo/delete.js

@@ -11,20 +11,20 @@ const state = {
   deleted: null
 };
 
-function error(commit, error) {
-  return commit({{{ uc }}}_DELETE_ERROR, error);
+function error(error) {
+  return {type: {{{ uc }}}_DELETE_ERROR, error};
 }
 
-function loading(commit, loading) {
-  return commit({{{ uc }}}_DELETE_LOADING, loading);
+function loading(loading) {
+  return {type: {{{ uc }}}_DELETE_LOADING, loading};
 }
 
-function success(commit, deleted) {
-  return commit({{{ uc }}}_DELETE_SUCCESS, deleted);
+function success(deleted) {
+  return {type: {{{ uc }}}_DELETE_SUCCESS, deleted};
 }
 
-function reset(commit) {
-  return commit({{{ uc }}}_DELETE_RESET);
+function reset() {
+  return {type: {{{ uc }}}_DELETE_RESET};
 }
 
 const getters = {
@@ -34,33 +34,33 @@ const getters = {
 };
 
 const actions = {
-  delete({ commit }, item) {
-    loading(commit, true);
+  delete({ dispatch }, item) {
+    dispatch(loading(true));
 
     return {{{ lc }}}Fetch(item['@id'], {method: 'DELETE'})
       .then(() => {
-        loading(commit, false);
-        success(commit, item);
+        dispatch(loading(false));
+        dispatch(success(item));
       })
       .catch(e => {
-        loading(commit, false);
-        error(commit, e.message);
+        dispatch(loading(false));
+        dispatch(error(e.message));
       });
   },
-  reset({ commit }) {
-    reset(commit);
+  reset({ dispatch }) {
+    dispatch(reset());
   }
 };
 
 const mutations = {
-    [{{{ uc }}}_DELETE_ERROR] (state, error) {
-      state.error = error;
+    [{{{ uc }}}_DELETE_ERROR] (state, payload) {
+      state.error = payload.error;
     },
-    [{{{ uc }}}_DELETE_LOADING] (state, loading) {
-      state.loading = loading;
+    [{{{ uc }}}_DELETE_LOADING] (state, payload) {
+      state.loading = payload.loading;
     },
-    [{{{ uc }}}_DELETE_SUCCESS] (state, deleted) {
-      state.deleted = deleted;
+    [{{{ uc }}}_DELETE_SUCCESS] (state, payload) {
+      state.deleted = payload.deleted;
     },
     [{{{ uc }}}_DELETE_RESET] (state) {
       state.error = '';

templates/vue/store/modules/foo/list.js

@@ -10,30 +10,23 @@ const state = {
   loading: false,
   error: '',
   items: [],
-  view: [],
-  filters: {
-    page: 1
-  }
+  view: []
 };
 
-function error(commit, error) {
-  return commit({{{ uc }}}_LIST_ERROR, error);
+function error(error) {
+  return {type: {{{ uc }}}_LIST_ERROR, error};
 }
 
-function loading(commit, loading) {
-  return commit({{{ uc }}}_LIST_LOADING, loading);
+function loading(loading) {
+  return {type: {{{ uc }}}_LIST_LOADING, loading};
 }
 
-function success(commit, items) {
-  return commit({{{ uc }}}_LIST_SUCCESS, items);
+function success(items) {
+  return {type: {{{ uc }}}_LIST_SUCCESS, items};
 }
 
-function view(commit, items) {
-  return commit({{{ uc }}}_LIST_VIEW, items);
-}
-
-function reset(commit) {
-  return commit({{{ uc }}}_LIST_RESET);
+function view(items) {
+  return { type: {{{ uc }}}_LIST_VIEW, items};
 }
 
 const getters = {
@@ -42,38 +35,38 @@ const getters = {
 };
 
 const actions = {
-    getItems({ commit, state }) {
-      loading(commit, true);
+    getItems({ dispatch }) {
+      dispatch(loading(true));
 
-      {{{ lc }}}Fetch('/{{{ name }}}', state.filters)
+      {{{ lc }}}Fetch('/{{{ name }}}')
         .then(response => response.json())
         .then(data => {
-          loading(commit, false);
-          success(commit, data['{{{ hydraPrefix }}}member']);
-          view(commit, data['{{{ hydraPrefix }}}view']);
+          dispatch(loading(false));
+          dispatch(success(data['{{{ hydraPrefix }}}member']));
+          dispatch(view(data['{{{ hydraPrefix }}}view']));
         })
         .catch(e => {
-          loading(commit, false);
-          error(commit, e.message);
+          dispatch(loading(false));
+          dispatch(error(e.message));
         });
     }
 };
 
 const mutations = {
-    [{{{ uc }}}_LIST_ERROR] (state, error) {
-      state.error = error;
+    [{{{ uc }}}_LIST_ERROR] (state, payload) {
+      state.error = payload.error;
     },
-    [{{{ uc }}}_LIST_LOADING] (state, loading) {
-      state.loading = loading;
+    [{{{ uc }}}_LIST_LOADING] (state, payload) {
+      state.loading = payload.loading;
     },
-    [{{{ uc }}}_LIST_RESET] (state) {
-      state.items = [];
+    [{{{ uc }}}_LIST_VIEW] (state, payload) {
+      state.view = payload.items;
     },
-    [{{{ uc }}}_LIST_VIEW] (state, items) {
-      state.view = items;
+    [{{{ uc }}}_LIST_SUCCESS] (state, payload) {
+      state.items = payload.items;
     },
-    [{{{ uc }}}_LIST_SUCCESS] (state, items) {
-      state.items = items;
+    [{{{ uc }}}_LIST_RESET] (state) {
+      state.items = [];
     }
 };
 

templates/vue/store/modules/foo/show.js

@@ -11,20 +11,20 @@ const state = {
   retrieved: null
 };
 
-function error(commit, error) {
-  return commit({{{ uc }}}_SHOW_ERROR, error);
+function error(error) {
+  return {type: {{{ uc }}}_SHOW_ERROR, error};
 }
 
-function loading(commit, loading) {
-  return commit({{{ uc }}}_SHOW_LOADING, loading);
+function loading(loading) {
+  return {type: {{{ uc }}}_SHOW_LOADING, loading};
 }
 
-function retrieved(commit, retrieved) {
-  return commit({{{ uc }}}_SHOW_RETRIEVED_SUCCESS, retrieved);
+function retrieved(retrieved) {
+  return {type: {{{ uc }}}_SHOW_RETRIEVED_SUCCESS, retrieved};
 }
 
-function reset(commit) {
-  return commit({{{ uc }}}_SHOW_RESET);
+function reset() {
+  return {type: {{{ uc }}}_SHOW_RESET};
 }
 
 const getters = {
@@ -34,34 +34,34 @@ const getters = {
 };
 
 const actions = {
-  retrieve({ commit }, id) {
-    loading(commit, true);
+  retrieve({ dispatch }, id) {
+    dispatch(loading(true));
 
     return {{{ lc }}}Fetch(id)
       .then(response => response.json())
       .then(data => {
-        loading(commit, false);
-        retrieved(commit, data);
+        dispatch(loading(false));
+        dispatch(retrieved(data));
       })
       .catch(e => {
-        loading(commit, false);
-        error(commit, e.message);
+        dispatch(loading(false));
+        dispatch(error(e.message));
       });
   },
-  reset({ commit }) {
-    reset(commit);
+  reset({ dispatch }) {
+    dispatch(reset());
   }
 };
 
 const mutations = {
-    [{{{ uc }}}_SHOW_ERROR] (state, error) {
-      state.error = error;
+    [{{{ uc }}}_SHOW_ERROR] (state, payload) {
+      state.error = payload.error;
     },
-    [{{{ uc }}}_SHOW_LOADING] (state, loading) {
-      state.loading = loading;
+    [{{{ uc }}}_SHOW_LOADING] (state, payload) {
+      state.loading = payload.loading;
     },
-    [{{{ uc }}}_SHOW_RETRIEVED_SUCCESS] (state, retrieved) {
-      state.retrieved = retrieved;
+    [{{{ uc }}}_SHOW_RETRIEVED_SUCCESS] (state, payload) {
+      state.retrieved = payload.retrieved;
     },
     [{{{ uc }}}_SHOW_RESET] (state) {
       state.retrieved = null;