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

export const useUiStore = defineStore('ui', () => {
  const sidebarOpen = ref(true)
  const configPanelOpen = ref(false)
  const activeView = ref<'chat' | 'config' | 'tracking' | 'notifications'>('chat')
  const toasts = ref<{ id: string; message: string; type: 'success' | 'error' | 'info' }[]>([])

  function toggleSidebar() {
    sidebarOpen.value = !sidebarOpen.value
  }

  function showToast(message: string, type: 'success' | 'error' | 'info' = 'info') {
    const id = crypto.randomUUID()
    toasts.value.push({ id, message, type })
    setTimeout(() => {
      toasts.value = toasts.value.filter(t => t.id !== id)
    }, 4000)
  }

  return {
    sidebarOpen, configPanelOpen, activeView, toasts,
    toggleSidebar, showToast,
  }
})
