import { create } from 'zustand';

/**
 * ChatBox UI 状态 Store
 * 管理聊天框的 UI 交互状态（非持久化）
 */
const useChatBoxUIStore = create((set) => ({
  // ==================== 状态 ====================
  
  // 当前编辑的消息 ID
  editingId: null,
  
  // 编辑中的内容
  editContent: '',
  
  // 输入框内容
  inputValue: '',
  
  // 是否显示选项面板
  showOptions: false,
  
  // 是否显示聊天选择器
  showChatSelector: false,
  
  // 角色的聊天列表
  characterChats: [],
  
  // 当前 swipe ID（用于多版本切换）
  currentSwipeId: {},
  
  // 输入框高度
  inputHeight: 42,

  // ==================== Actions ====================

  /**
   * 开始编辑消息
   * @param {string|number} messageId - 消息 ID
   * @param {string} content - 消息内容
   */
  startEditing: (messageId, content) => {
    set({ 
      editingId: messageId,
      editContent: content 
    });
  },

  /**
   * 取消编辑
   */
  cancelEditing: () => {
    set({ 
      editingId: null,
      editContent: '' 
    });
  },

  /**
   * 更新编辑内容
   * @param {string} content - 新内容
   */
  updateEditContent: (content) => {
    set({ editContent: content });
  },

  /**
   * 设置输入框内容
   * @param {string} value - 输入值
   */
  setInputValue: (value) => {
    set({ inputValue: value });
  },

  /**
   * 清空输入框
   */
  clearInput: () => {
    set({ inputValue: '' });
  },

  /**
   * 切换选项面板
   */
  toggleOptions: () => {
    set((state) => ({ showOptions: !state.showOptions }));
  },

  /**
   * 设置选项面板显示状态
   * @param {boolean} show - 是否显示
   */
  setShowOptions: (show) => {
    set({ showOptions: show });
  },

  /**
   * 切换聊天选择器
   */
  toggleChatSelector: () => {
    set((state) => ({ showChatSelector: !state.showChatSelector }));
  },

  /**
   * 设置聊天选择器显示状态
   * @param {boolean} show - 是否显示
   */
  setShowChatSelector: (show) => {
    set({ showChatSelector: show });
  },

  /**
   * 设置角色聊天列表
   * @param {Array} chats - 聊天列表
   */
  setCharacterChats: (chats) => {
    set({ characterChats: chats });
  },

  /**
   * 设置当前 swipe ID
   * @param {Object} swipeId - swipe ID 对象 { [messageId]: swipeIndex }
   */
  setCurrentSwipeId: (swipeId) => {
    set((state) => ({ 
      currentSwipeId: { ...state.currentSwipeId, ...swipeId }
    }));
  },

  /**
   * 设置输入框高度
   * @param {number} height - 高度（px）
   */
  setInputHeight: (height) => {
    set({ inputHeight: height });
  },

  /**
   * 重置所有 UI 状态
   */
  reset: () => {
    set({
      editingId: null,
      editContent: '',
      inputValue: '',
      showOptions: false,
      showChatSelector: false,
      characterChats: [],
      currentSwipeId: {},
      inputHeight: 42
    });
  }
}));

export default useChatBoxUIStore;
