import { defineStore } from 'pinia'
import { getSidebarStatus, setSidebarStatus } from '@/utils/cache/local-storage'
import { getLanguage, setLanguage } from '@/utils/cache/language'
import { SIDEBAR_OPENED, SIDEBAR_CLOSED } from '@/constants/app-key'

interface Sidebar {
  opened: boolean
  withoutAnimation: boolean
}

/** 设置侧边栏状态本地缓存 */
function handleSidebarStatus(opened: boolean) {
  opened ? setSidebarStatus(SIDEBAR_OPENED) : setSidebarStatus(SIDEBAR_CLOSED)
}

export const useAppStore = defineStore('app', () => {
  /** 侧边栏状态 */
  const sidebar: Sidebar = reactive({
    opened: getSidebarStatus() !== SIDEBAR_CLOSED,
    withoutAnimation: false
  })

  /** 语言状态 */
  const language = ref<string>(getLanguage())

  /** 监听侧边栏 opened 状态 */
  watch(
    () => sidebar.opened,
    (opened) => handleSidebarStatus(opened)
  )

  /** 监听语言状态 */
  watch(
    () => language.value,
    (lang) => setLanguage(lang)
  )

  /** 切换侧边栏 */
  const toggleSidebar = (withoutAnimation: boolean) => {
    sidebar.opened = !sidebar.opened
    sidebar.withoutAnimation = withoutAnimation
  }

  /** 切换语言 */
  const changeLanguage = (lang: string) => {
    language.value = lang
  }

  return { sidebar, language, toggleSidebar, changeLanguage }
})