import { onMounted, ref } from 'vue';
import axios from 'axios';
import { defineStore } from 'pinia';

export const useNavigationStore = defineStore('navigationStore', () => {
    const modules = ['customer', 'claim', 'ticket'];
    const pinned = ref([]);

    onMounted(() => fetchPinned())

    async function fetchPinned() {
        const response = await axios.get('StarredModules/getStarredModules');
        // const filteredModules = modules.value.filter((module) => {
        //     return response.data.find((element) => element.moduleFk == salixModules[module.name]);
        // });

        return (pinned.value = response.data);
    }

    function togglePinned(module) {
        if (pinned.value.includes(module)) {
            const index = pinned.value.indexOf(module);
            pinned.value.splice(index, 1);

            return;
        }

        pinned.value.push(module);
    }

    return {
        modules,
        pinned,
        togglePinned,
    };
});