import { defineStore } from "pinia";
import { ref, onMounted } from "vue"; // 1. Import onMounted

export const useSidebarStore = defineStore("sidebar", () => {
    const isAlwaysOpen = ref<boolean>(false);
    const isSidebarOpen = ref<boolean>(false);

    onMounted(() => {
        const storedValue = localStorage.getItem("isAlwaysOpen") === "true";
        isAlwaysOpen.value = storedValue;
        isSidebarOpen.value = storedValue;
    });

    const handleSidebarToggle = (value: boolean) => {
        isSidebarOpen.value = value;
    };

    const handleAlwaysOpenToggle = (value: boolean) => {
        isAlwaysOpen.value = value;
        if (typeof window !== "undefined") {
            localStorage.setItem("isAlwaysOpen", String(value));
        }
    };

    return {
        isSidebarOpen,
        isAlwaysOpen,
        handleSidebarToggle,
        handleAlwaysOpenToggle,
    };
});