/**
 * RVW侧边栏组件
 */
import { LayoutGrid, Archive, Settings, BrainCircuit } from 'lucide-react';

interface SidebarProps {
  currentView: 'dashboard' | 'archive';
  onViewChange: (view: 'dashboard' | 'archive') => void;
  onSettingsClick?: () => void;
}

export default function Sidebar({ currentView, onViewChange, onSettingsClick }: SidebarProps) {
  return (
    <aside className="w-[72px] bg-slate-900 flex flex-col items-center py-6 gap-4 z-20 shadow-xl flex-shrink-0 relative">
      {/* Logo */}
      <div 
        className="w-10 h-10 bg-indigo-500 rounded-xl flex items-center justify-center text-white shadow-lg mb-4"
        title="智能审稿系统"
      >
        <BrainCircuit className="w-6 h-6" />
      </div>
      
      {/* 审稿工作台 */}
      <button
        onClick={() => onViewChange('dashboard')}
        className={`sidebar-btn w-10 h-10 rounded-lg flex items-center justify-center transition-colors relative group
          ${currentView === 'dashboard' 
            ? 'bg-white/10 text-white' 
            : 'text-slate-400 hover:bg-white/10 hover:text-white'
          }`}
        title="审稿工作台"
      >
        <LayoutGrid className="w-5 h-5" />
        <span className="sidebar-tooltip">审稿工作台</span>
      </button>
      
      {/* 历史归档 */}
      <button
        onClick={() => onViewChange('archive')}
        className={`sidebar-btn w-10 h-10 rounded-lg flex items-center justify-center transition-colors relative group
          ${currentView === 'archive'
            ? 'bg-white/10 text-white'
            : 'text-slate-400 hover:bg-white/10 hover:text-white'
          }`}
        title="历史归档"
      >
        <Archive className="w-5 h-5" />
        <span className="sidebar-tooltip">历史归档</span>
      </button>
      
      {/* 底部区域 */}
      <div className="mt-auto flex flex-col gap-4 relative">
        {/* 系统设置 */}
        <button
          onClick={onSettingsClick}
          className="sidebar-btn w-10 h-10 rounded-lg text-slate-400 flex items-center justify-center hover:bg-white/10 hover:text-white transition-colors relative group"
          title="系统设置"
        >
          <Settings className="w-5 h-5" />
          <span className="sidebar-tooltip">系统设置</span>
        </button>
        
        {/* 用户头像 */}
        <div className="relative">
          <div className="w-10 h-10 rounded-full bg-gradient-to-tr from-indigo-500 to-purple-500 flex items-center justify-center text-xs font-bold text-white border-2 border-slate-700 cursor-pointer hover:border-white transition-all shadow-md">
            编辑
          </div>
        </div>
      </div>
    </aside>
  );
}