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

/**
 * useAdminUiStore — global UI state for the admin panel.
 *
 * Tracks sidebar collapse, search, and breadcrumb state.
 */
export const useAdminUiStore = defineStore('admin-ui', () => {
  /** Sidebar collapsed state */
  const sidebarCollapsed = ref(false)

  /** Current page search query (for inline page search) */
  const pageSearch = ref('')

  /** Global notification count (for badge display) */
  const notificationCount = ref(0)

  /** Whether any form on the current page has unsaved changes */
  const hasUnsavedChanges = ref(false)

  /** Toggle sidebar */
  function toggleSidebar() {
    sidebarCollapsed.value = !sidebarCollapsed.value
  }

  /** Clear page search */
  function clearSearch() {
    pageSearch.value = ''
  }

  return {
    sidebarCollapsed,
    pageSearch,
    notificationCount,
    hasUnsavedChanges,
    toggleSidebar,
    clearSearch,
  }
})