import React, { useEffect, useRef, useState } from 'react'; import { Check, Eraser, MessageSquareText, Pencil, Plus, Trash2, X } from 'lucide-react'; export interface SixStepConversationMeta { id: string; title: string; updatedAt: number; } interface Props { isOpen: boolean; isDark: boolean; conversations: SixStepConversationMeta[]; activeId: string | null; onClose: () => void; onOpen: () => void; onSelect: (id: string) => void; onNew: () => void; onDelete: (id: string) => void; onRename: (id: string, title: string) => void; onClearAll: () => void; } const UNTITLED = '未命名对话'; const SixStepChatHistory: React.FC = ({ isOpen, isDark, conversations, activeId, onClose, onOpen, onSelect, onNew, onDelete, onRename, onClearAll, }) => { const [editingId, setEditingId] = useState(null); const [draftTitle, setDraftTitle] = useState(''); const inputRef = useRef(null); useEffect(() => { if (editingId && inputRef.current) { inputRef.current.focus(); inputRef.current.select(); } }, [editingId]); const startEdit = (conversation: SixStepConversationMeta) => { setEditingId(conversation.id); setDraftTitle(conversation.title); }; const commitEdit = () => { if (!editingId) return; onRename(editingId, draftTitle.trim() || UNTITLED); setEditingId(null); setDraftTitle(''); }; const cancelEdit = () => { setEditingId(null); setDraftTitle(''); }; const handleDelete = (conversation: SixStepConversationMeta) => { const ok = window.confirm(`确认删除对话“${conversation.title || UNTITLED}”吗？`); if (!ok) return; onDelete(conversation.id); }; const handleClearAll = () => { if (conversations.length === 0) return; const ok = window.confirm('确认清空当前对话列表中的全部历史记录吗？此操作无法撤销。'); if (!ok) return; onClearAll(); }; const railButtonClass = (active = false) => `flex h-11 w-11 shrink-0 items-center justify-center rounded-2xl border transition ${ active ? isDark ? 'border-cyan-400/40 bg-cyan-500/10 text-cyan-200 shadow-sm' : 'border-red-200 bg-red-50/70 text-red-500 shadow-sm' : isDark ? 'border-slate-700 bg-slate-800 text-slate-400 hover:bg-slate-700 hover:text-slate-100' : 'border-gray-200 bg-white text-gray-500 hover:bg-gray-50 hover:text-gray-900' }`; const handleCollapsedSelect = (id: string) => { onOpen(); window.setTimeout(() => { onSelect(id); }, 120); }; const handleCollapsedNew = () => { onOpen(); window.setTimeout(() => { onNew(); }, 120); }; return ( ); }; export default SixStepChatHistory;