import { useEffect } from 'react'
import { useEditorStore } from '../stores/editorStore'
import { settingsRepository } from '../db/settingsRepository'
import { syncToastTheme } from '../lib/toast'

/**
 * AR-04: 主题 hook
 * 不再独立加载设置（由 useSettingsInit 统一加载）
 * 仅负责主题切换时的同步和保存
 */
export function useTheme() {
  const darkMode = useEditorStore(s => s.darkMode)
  const toggleDarkMode = useEditorStore(s => s.toggleDarkMode)

  // darkMode 变化时同步 class 并保存
  useEffect(() => {
    document.documentElement.classList.toggle('dark', darkMode)
    settingsRepository.save({ darkMode })
    syncToastTheme(darkMode)
  }, [darkMode])

  return { darkMode, toggleDarkMode }
}