vue-wp/vue-theme/src/store/modules/artist.js

import api from '../../utils/api'

const state = {
    all: [],
    loaded: false,
    singleArtist: null,
}

const getters = {
    allArtists: state => state.all,
    allArtistsBySlug: state => Object.values(state.all).reduce((bySlug, artist) => {
        bySlug[artist.slug] = artist
        return bySlug
    }, {}),
    allArtistsLoaded: state => state.loaded
}

const actions = {
    getAllArtists({ commit }, sortType) {
        commit('CLEAR_ARTISTS')
        commit('ARTISTS_LOADED', false)
        return api.getByType('artists', sortType, artists => {
            commit('STORE_FETCHED_ARTISTS', { artists })
            commit('ARTISTS_LOADED', true)
        })
    },
    getSingleArtist({ commit }, id) {
        console.log('getting single Artist...')
        commit('CLEAR_SINGLE_ARTIST')
        commit('ARTISTS_LOADED', false)
        api.getSingleType('artists', id,  artist => {
            commit('STORE_FETCHED_SINGLE_ARTIST', artist)
            commit('ARTISTS_LOADED', true)
        })
    }
}

const mutations = {
    STORE_FETCHED_ARTISTS(state, { artists }) { state.all = artists },
    STORE_FETCHED_SINGLE_ARTIST(state, artist) { state.singleArtist = artist },
    CLEAR_ARTISTS(state) { state.all = [] },
    CLEAR_SINGLE_ARTIST(state) { state.singleArtist = null },
    ARTISTS_LOADED(state, val) { state.loaded = val },
}

export default { state, getters, actions, mutations }