import { defineStore } from 'pinia'
import { ref, watch } from 'vue'

export const useSettingsStore = defineStore('settings', () => {
  const darkMode = ref(localStorage.getItem('darkMode') === 'true')
  const pollInterval = ref(10_000)
  const clinicianId = ref(localStorage.getItem('clinicianId') ?? 'DR-DEMO')

  watch(darkMode, (val) => {
    localStorage.setItem('darkMode', val)
    document.documentElement.classList.toggle('dark', val)
  }, { immediate: true })

  function toggleDarkMode() {
    darkMode.value = !darkMode.value
  }

  return { darkMode, pollInterval, clinicianId, toggleDarkMode }
})