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

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

const state = {
    all: {},
    loaded: false,
    artist: null,
}

const getters = {
    allArtists: state => state.all,
    allArtistsLoaded: state => state.loaded,
    artist: state => id => {
        let field = typeof id === 'number' ? 'id' : 'slug'
        let artist = state.all.filter(artist => artist[field] === id)
        return (artist[0]) ? artist[0] : false
    },
    artistContent: state => id => {
        let field = typeof id === 'number' ? 'id' : 'slug'
        let artist = state.all.filter(artist => artist[field] === id)
        return (artist[0]) ? artist[0].content.rendered : false
    },
    someArtists: state => limit => {
        if (state.all.length < 1) return false

        let all = [...state.all]

        return all.splice(0, Math.min(limit, state.all.length))
    },
}

const actions = {
    getAllArtists({ commit }, sortType) {
        commit('CLEAR_ARTISTS')
        
        api.getByType('artists', sortType, artists => {
            commit('STORE_FETCHED_ARTISTS', { artists })
            commit('ARTISTS_LOADED', true)
        })
    }
}

const mutations = {
    STORE_FETCHED_ARTISTS(state, { artists }) { state.all = artists },
    CLEAR_ARTISTS(state) { state.all = [] },
    ARTISTS_LOADED(state, val) { state.loaded = val },
}

export default { state, getters, actions, mutations }