eiru_purchases/src/store/modules/product.js

const state = {
    products: [],
    loadingProducts: true,
    filteredProducts: [],
    productWithVariant: null
}

const getters = {
    /**
     * 
     * @param {*} state 
     */
    products(state) {
        return state.products
    },
    /**
     * 
     * @param {*} state 
     */
    visibleProducts(state) {
        return state.filteredProducts.length === 0 ? state.products : state.filteredProducts
    },
    /**
     * 
     * @param {*} state 
     */
    productWithVariant(state) {
        return state.productWithVariant
    },
    /**
     * 
     * @param {*} state 
     */
    showProductForm(state) {
        return !!state.productWithVariant
    },
    /**
     * 
     * @param {*} state 
     */
    loadingProducts(state) {
        return state.loadingProducts
    }
}

const mutations = {
    /**
     * 
     * @param {*} state 
     * @param {*} payload 
     */
    setProducts(state, payload) {
        state.products = [...payload]
    },
    /**
     * 
     * @param {*} state 
     * @param {*} payload 
     */
    setProductWithVariant(state, payload) {
        state.productWithVariant = payload
    },
    /**
     * 
     * @param {*} state 
     * @param {*} payload 
     */
    setFilteredProducts(state, payload) {
        state.filteredProducts = [...payload]
    },
    /**
     * 
     * @param {*} state 
     * @param {*} payload 
     */
    setLoadingProducts(state, payload) {
        state.loadingProducts = !!payload
    }
}

const actions = {
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    initProducts({ commit }, payload) {
        commit('setProducts', payload)
        commit('setLoadingProducts', false)
    },
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    selectProduct({ commit }, payload) {
        if (payload.variantCount > 1) {
            commit('setProductWithVariant', payload)
            return
        }

        commit('pushToCart', payload.variants[0])
    },
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    filterProducts({ commit }, payload) {
        commit('setFilteredProducts', payload)
    },
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    selectProductVariant({ commit, dispatch }, payload) {
        commit('setProductVariant', null)

        if (!payload) return

        dispatch('addToCart', payload)
    },
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    showProductForm({ commit }) {
        commit('setShowProductForm', true)
    },
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    hideProductForm({ commit }) {
        commit('setShowProductForm', false)
    },
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    submitProduct({ commit, dispatch }, payload) {
        if (payload) {
            if (!payload.name || !payload.price) {
                dispatch('notify', 'Complete los campos para guardar')
                return
            }

            commit('setLoadingProducts', true)
            dispatch('createProduct', payload)
        }

        dispatch('hideProductForm')
    },
    /**
     * 
     * @param {*} param0 
     * @param {*} payload 
     */
    addProduct({ commit }, payload) {
        commit('addProduct', payload)
        commit('setLoadingProducts', false)
    },
    /**
     * 
     * @param {*} param0 
     */
    resetProduct({ commit }) {
        commit('setLoadingProducts', true)
        commit('setProducts', [])
        commit('setFilteredProducts', [])
    }
}

export default {
    state,
    getters,
    mutations,
    actions
}