Permalink
Browse files

Finish part2 - recomposition

  • Loading branch information...
mtancoigne committed Sep 27, 2018
1 parent c1b0403 commit 3f06702244f018982a7e1f782603e04fbf072452
Showing with 72 additions and 74 deletions.
  1. +68 −70 src/modulator/index.js
  2. +4 −4 src/store.js
@@ -16,86 +16,84 @@ const camelize = function (snakeText, capitalizeFirstLetter = true) {
return out
}
const mutations = function (singular) {
const mutations = {}
export default {
mutations (singular) {
const mutations = {}
mutations[`set_${singular}`] = (state, entity) => { Vue.set(state, entity.id, entity) }
mutations[`remove_${singular}`] = (state, id) => {Vue.delete(state, id)}
mutations[`set_${singular}`] = (state, entity) => { Vue.set(state, entity.id, entity) }
mutations[`remove_${singular}`] = (state, id) => {Vue.delete(state, id)}
return mutations
}
const actions = function (endpoint, singular, plural, editable = true, destroyable = true) {
const camelSingular = camelize(singular)
const camelPlural = camelize(plural)
const actions = {}
return mutations
},
actions (endpoint, singular, plural, editable = true, destroyable = true) {
const camelSingular = camelize(singular)
const camelPlural = camelize(plural)
const actions = {}
actions[`load${camelPlural}`] = ({commit}) => {
api.get(endpoint)
.then((data) => {
for (let i = 0; i < data.length; i++) {
commit(`set_${singular}`, data[i])
}
})
.catch((error) => {console.log(`ERROR in load${camelPlural}:`, error)})
}
actions[`load${camelSingular}`] = ({commit}, id) => {
api.get(`${endpoint}/${id}`)
.then((data) => {commit(`set_${singular}`, data)})
.catch((error) => {console.log(`ERROR in load${camelSingular}:`, error)})
}
if (editable) {
actions[`create${camelSingular}`] = ({commit}, payload) => {
api.post(endpoint, payload)
actions[`load${camelPlural}`] = ({commit}) => {
api.get(endpoint)
.then((data) => {
// Let's assume "data" is the new article, sent back by the API
// We don't want to store the user input in our store :)
commit(`set_${singular}`, data)
for (let i = 0; i < data.length; i++) {
commit(`set_${singular}`, data[i])
}
})
.catch((error) => {console.log(`ERROR in create${camelSingular}:`, error)})
.catch((error) => {console.log(`ERROR in load${camelPlural}:`, error)})
}
actions[`update${camelSingular}`] = ({commit}, payload) => {
api.patch(`${endpoint}/${payload.id}`, payload)
.then((data) => {
// Let's assume "data" is the updated article
commit(`set_${singular}`, data)
})
.catch((error) => {console.log(`ERROR in update${camelSingular}:`, error)})
actions[`load${camelSingular}`] = ({commit}, id) => {
api.get(`${endpoint}/${id}`)
.then((data) => {commit(`set_${singular}`, data)})
.catch((error) => {console.log(`ERROR in load${camelSingular}:`, error)})
}
}
if (destroyable) {
actions[`destroy${camelSingular}`] = ({commit}, id) => {
api.delete(`${endpoint}/${id}`)
.then(() => { commit(`remove_${singular}`, id) })
.catch((error) => {console.log('ERROR in DESTROY_ARTICLE:', error)})
if (editable) {
actions[`create${camelSingular}`] = ({commit}, payload) => {
api.post(endpoint, payload)
.then((data) => {
// Let's assume "data" is the new article, sent back by the API
// We don't want to store the user input in our store :)
commit(`set_${singular}`, data)
})
.catch((error) => {console.log(`ERROR in create${camelSingular}:`, error)})
}
actions[`update${camelSingular}`] = ({commit}, payload) => {
api.patch(`${endpoint}/${payload.id}`, payload)
.then((data) => {
// Let's assume "data" is the updated article
commit(`set_${singular}`, data)
})
.catch((error) => {console.log(`ERROR in update${camelSingular}:`, error)})
}
}
if (destroyable) {
actions[`destroy${camelSingular}`] = ({commit}, id) => {
api.delete(`${endpoint}/${id}`)
.then(() => { commit(`remove_${singular}`, id) })
.catch((error) => {console.log('ERROR in DESTROY_ARTICLE:', error)})
}
}
}
return actions
}
const getters = function (singular, plural) {
const lowCamelSingular = camelize(singular, false)
const lowCamelPlural = camelize(plural, false)
const getters = {}
getters[lowCamelPlural] = state => state
getters[lowCamelSingular] = state => id => state[id] || undefined
return actions
},
getters (singular, plural) {
const lowCamelSingular = camelize(singular, false)
const lowCamelPlural = camelize(plural, false)
return getters
}
const getters = {}
export default function (endpoint, singular, plural, editable = true, destroyable = true) {
const module = {
state: {}, mutations: {
...mutations(singular),
}, actions: {
...actions(endpoint, singular, plural, editable, destroyable),
}, getters: {
...getters(singular, plural),
},
}
getters[lowCamelPlural] = state => state
getters[lowCamelSingular] = state => id => state[id] || undefined
return module
return getters
},
generateModule (endpoint, singular, plural, editable = true, destroyable = true) {
return {
state: {},
mutations: {
...this.mutations(singular),
}, actions: {
...this.actions(endpoint, singular, plural, editable, destroyable),
}, getters: {
...this.getters(singular, plural),
},
}
},
}
@@ -1,6 +1,6 @@
import Vue from 'vue'
import Vuex from 'vuex'
import moduleGenerator from './modulator'
import Modulator from './modulator'
Vue.use(Vuex)
@@ -9,8 +9,8 @@ export default new Vuex.Store({
mutations: {},
actions: {},
modules: {
users: moduleGenerator('users', 'user', 'users', true, false),
posts: moduleGenerator('posts', 'post', 'posts'),
postTypes: moduleGenerator('post_types', 'post_type', 'post_types'),
users: Modulator.generateModule('users', 'user', 'users', true, false),
posts: Modulator.generateModule('posts', 'post', 'posts'),
postTypes: Modulator.generateModule('post_types', 'post_type', 'post_types'),
}
})

0 comments on commit 3f06702

Please sign in to comment.