import { ref } from 'vue';
import { defineStore } from 'pinia';

export const useStateStore = defineStore('stateStore', () => {
    const isMounted = ref(false);
    const leftDrawer = ref(false);
    const rightDrawer = ref(false);
    const rightAdvancedDrawer = ref(false);
    const subToolbar = ref(false);
    const cardDescriptor = ref(null);
    const descriptors = ref({});

    function cardDescriptorChangeValue(descriptor) {
        cardDescriptor.value = descriptor;
    }
    function toggleLeftDrawer() {
        leftDrawer.value = !leftDrawer.value;
    }

    function toggleRightDrawer() {
        rightDrawer.value = !rightDrawer.value;
    }

    function toggleRightAdvancedDrawer() {
        rightAdvancedDrawer.value = !rightAdvancedDrawer.value;
    }

    function rightDrawerChangeValue(value) {
        rightDrawer.value = value;
    }

    function toggleSubToolbar() {
        subToolbar.value = !subToolbar.value;
    }

    function setMounted() {
        isMounted.value = true;
    }

    function isHeaderMounted() {
        return isMounted.value;
    }

    function isLeftDrawerShown() {
        return leftDrawer.value;
    }

    function isRightDrawerShown() {
        return rightDrawer.value;
    }

    function isSubToolbarShown() {
        return subToolbar.value;
    }

    function setDescriptors(value) {
        descriptors.value = value;
    }

    return {
        cardDescriptor,
        cardDescriptorChangeValue,
        leftDrawer,
        rightDrawer,
        rightAdvancedDrawer,
        setMounted,
        isHeaderMounted,
        toggleLeftDrawer,
        toggleRightDrawer,
        toggleRightAdvancedDrawer,
        isLeftDrawerShown,
        isRightDrawerShown,
        isSubToolbarShown,
        toggleSubToolbar,
        rightDrawerChangeValue,
        descriptors,
        setDescriptors,
    };
});