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

const createDefaultVisitedTabs = () => [{ key: "/dashboard", label: "工作台", closable: false }];

export const useAppStore = defineStore(
  "app",
  () => {
    const locale = ref("zh-CN");
    const sidebarCollapsed = ref(false);
    const visitedTabs = ref(createDefaultVisitedTabs());

    function toggleSidebar() {
      sidebarCollapsed.value = !sidebarCollapsed.value;
    }

    function setLocale(value) {
      locale.value = value;
    }

    function addVisitedTab(tab) {
      if (!visitedTabs.value.some((item) => item.key === tab.key)) {
        visitedTabs.value.push(tab);
      }
    }

    function removeVisitedTab(key) {
      visitedTabs.value = visitedTabs.value.filter((item) => item.key !== key);
    }

    return {
      locale,
      sidebarCollapsed,
      visitedTabs,
      toggleSidebar,
      setLocale,
      addVisitedTab,
      removeVisitedTab,
    };
  },
  {
    persist: {
      key: "fms-app",
      pick: ["locale"],
    },
  },
);