leocrm/frontend/src/store/aiUIControlStore.ts

/**
 * AI UI Control Store — Zustand store for AI-driven UI commands.
 *
 * Task 4.3: Frontend useAIUIControl Hook (store portion)
 * Task 4.11: Visuelle KI-Indikation (state for visual feedback)
 */

import { create } from 'zustand';

export type UICommandType =
  | 'navigate'
  | 'filter'
  | 'open_contact'
  | 'modal'
  | 'tab'
  | 'settings';

export type UICommandStatus =
  | 'pending'
  | 'delivered'
  | 'success'
  | 'failed'
  | 'timeout';

export interface UICommand {
  command_id: string;
  action: UICommandType;
  path?: string | null;
  entity?: string | null;
  filter?: Record<string, unknown> | null;
  contact_id?: string | null;
  modal?: string | null;
  tab?: string | null;
  section?: string | null;
  key?: string | null;
  value?: unknown | null;
  timestamp?: number | string | null;
  description?: string | null;
}

export interface UICommandFeedback {
  command_id: string;
  status: UICommandStatus;
  action?: UICommandType | null;
  current_path?: string | null;
  current_tab?: string | null;
  message?: string | null;
  error?: string | null;
  data?: Record<string, unknown> | null;
}

export interface AIUIControlState {
  /** Whether the WebSocket is connected */
  connected: boolean;
  /** Currently executing command (for visual indication) */
  activeCommand: UICommand | null;
  /** History of recent commands (last 50) */
  commandHistory: UICommand[];
  /** Whether AI is currently controlling the UI (for visual indicator) */
  aiActive: boolean;
  /** Last feedback received */
  lastFeedback: UICommandFeedback | null;
  /** Active modal state (controlled by AI) */
  activeModal: string | null;
  /** Active tab state (controlled by AI) */
  activeTab: string | null;
  /** Pending filter to apply */
  pendingFilter: { entity: string; filter: Record<string, unknown> } | null;
  /** Pending settings change */
  pendingSettings: { section: string; key: string; value: unknown } | null;

  setConnected: (connected: boolean) => void;
  setActiveCommand: (cmd: UICommand | null) => void;
  addCommandToHistory: (cmd: UICommand) => void;
  setAIActive: (active: boolean) => void;
  setLastFeedback: (feedback: UICommandFeedback | null) => void;
  setActiveModal: (modal: string | null) => void;
  setActiveTab: (tab: string | null) => void;
  setPendingFilter: (filter: { entity: string; filter: Record<string, unknown> } | null) => void;
  setPendingSettings: (settings: { section: string; key: string; value: unknown } | null) => void;
  clearPending: () => void;
}

export const useAIUIControlStore = create<AIUIControlState>((set) => ({
  connected: false,
  activeCommand: null,
  commandHistory: [],
  aiActive: false,
  lastFeedback: null,
  activeModal: null,
  activeTab: null,
  pendingFilter: null,
  pendingSettings: null,

  setConnected: (connected) => set({ connected }),
  setActiveCommand: (cmd) => set({ activeCommand: cmd, aiActive: cmd !== null }),
  addCommandToHistory: (cmd) =>
    set((s) => ({
      commandHistory: [...s.commandHistory, cmd].slice(-50),
    })),
  setAIActive: (active) => set({ aiActive: active }),
  setLastFeedback: (feedback) => set({ lastFeedback: feedback }),
  setActiveModal: (modal) => set({ activeModal: modal }),
  setActiveTab: (tab) => set({ activeTab: tab }),
  setPendingFilter: (filter) => set({ pendingFilter: filter }),
  setPendingSettings: (settings) => set({ pendingSettings: settings }),
  clearPending: () =>
    set({ pendingFilter: null, pendingSettings: null, activeCommand: null, aiActive: false }),
}));