import { create } from 'zustand';

export type Theme = 'light' | 'dark' | 'system';
export type Locale = 'de' | 'en';
export type AISidebarTab = 'proactive' | 'chat' | 'notifications' | 'team' | 'chatroom';

export interface Toast {
  id: string;
  type: 'success' | 'error' | 'warning' | 'info';
  message: string;
  duration?: number;
}

export interface UIState {
  theme: Theme;
  locale: Locale;
  sidebarOpen: boolean;
  suggestionSidebarOpen: boolean;
  aiSidebarCollapsed: boolean;
  aiSidebarTab: AISidebarTab;
  messageSidebarCollapsed: boolean;
  toasts: Toast[];
  notifications: string[];
  setTheme: (theme: Theme) => void;
  setLocale: (locale: Locale) => void;
  toggleSidebar: () => void;
  setSidebarOpen: (open: boolean) => void;
  toggleSuggestionSidebar: () => void;
  toggleAISidebar: () => void;
  setAISidebarCollapsed: (collapsed: boolean) => void;
  setAISidebarTab: (tab: AISidebarTab) => void;
  openAISidebarProactive: () => void;
  toggleMessageSidebar: () => void;
  setMessageSidebarCollapsed: (collapsed: boolean) => void;
  addToast: (toast: Omit<Toast, 'id'>) => void;
  removeToast: (id: string) => void;
  clearToasts: () => void;
  removeNotification: (index: number) => void;
  clearNotifications: () => void;
}

let toastIdCounter = 0;

export const useUIStore = create<UIState>((set) => ({
  theme: (localStorage.getItem('leocrm_theme') as Theme) || 'light',
  locale: (localStorage.getItem('leocrm_lang') as Locale) || 'de',
  sidebarOpen: true,
  suggestionSidebarOpen: false,
  aiSidebarCollapsed: true,
  aiSidebarTab: 'chat',
  messageSidebarCollapsed: true,
  toasts: [],
  notifications: [],
  setTheme: (theme) => {
    localStorage.setItem('leocrm_theme', theme);
    set({ theme });
  },
  setLocale: (locale) => {
    localStorage.setItem('leocrm_lang', locale);
    set({ locale });
  },
  toggleSidebar: () => set((s) => ({ sidebarOpen: !s.sidebarOpen })),
  setSidebarOpen: (open) => set({ sidebarOpen: open }),
  toggleSuggestionSidebar: () => set((s) => ({ suggestionSidebarOpen: !s.suggestionSidebarOpen })),
  toggleAISidebar: () => set((s) => ({ aiSidebarCollapsed: !s.aiSidebarCollapsed })),
  setAISidebarCollapsed: (collapsed) => set({ aiSidebarCollapsed: collapsed }),
  setAISidebarTab: (tab) => set({ aiSidebarTab: tab }),
  openAISidebarProactive: () => set({ aiSidebarCollapsed: false, aiSidebarTab: 'proactive' }),
  toggleMessageSidebar: () => set((s) => ({ messageSidebarCollapsed: !s.messageSidebarCollapsed })),
  setMessageSidebarCollapsed: (collapsed) => set({ messageSidebarCollapsed: collapsed }),
  addToast: (toast) => {
    const id = `toast-${++toastIdCounter}`;
    set((s) => ({ toasts: [...s.toasts, { ...toast, id }] }));
  },
  removeToast: (id) =>
    set((s) => ({ toasts: s.toasts.filter((t) => t.id !== id) })),
  clearToasts: () => set({ toasts: [] }),
  removeNotification: (index) =>
    set((s) => ({ notifications: s.notifications.filter((_, i) => i !== index) })),
  clearNotifications: () => set({ notifications: [] }),
}));
