5e937d0ce2
Some checks failed
CI / Lint & TypeCheck (push) Has been cancelled
CI / Unit Tests (push) Has been cancelled
CI / Build Frontend (push) Has been cancelled
CI / Rust Check (push) Has been cancelled
CI / Security Scan (push) Has been cancelled
CI / E2E Tests (push) Has been cancelled
- SimpleSidebar: 移除空壳"行业资讯" Tab 和 Newspaper icon import - ModelsAPI.tsx: AVAILABLE_PROVIDERS 引用 LLM_PROVIDER_URLS 常量 - models.ts: PROVIDER_DEFAULTS 引用 api-urls.ts，消除重复 URL 定义 - 所有 Provider URL 现在统一在 api-urls.ts 维护
80 lines
3.0 KiB
TypeScript
80 lines
3.0 KiB
TypeScript
/**
|
|
* SimpleSidebar - Trae Solo 风格的简洁侧边栏
|
|
*
|
|
* 仅显示：对话列表
|
|
* 底部：模式切换 + 设置
|
|
*/
|
|
|
|
import { useState } from 'react';
|
|
import {
|
|
Settings, LayoutGrid,
|
|
Search, X,
|
|
} from 'lucide-react';
|
|
import { ConversationList } from './ConversationList';
|
|
|
|
interface SimpleSidebarProps {
|
|
onOpenSettings?: () => void;
|
|
onToggleMode?: () => void;
|
|
}
|
|
|
|
export function SimpleSidebar({ onOpenSettings, onToggleMode }: SimpleSidebarProps) {
|
|
const [searchQuery, setSearchQuery] = useState('');
|
|
|
|
return (
|
|
<aside className="w-64 sidebar-bg border-r border-[#e8e6e1] dark:border-gray-800 flex flex-col h-full shrink-0">
|
|
{/* Logo area */}
|
|
<div className="h-14 flex items-center px-4 border-b border-[#e8e6e1]/50 dark:border-gray-800">
|
|
<span className="text-lg font-semibold tracking-tight bg-gradient-to-r from-orange-500 to-amber-500 bg-clip-text text-transparent">
|
|
ZCLAW
|
|
</span>
|
|
</div>
|
|
|
|
{/* 内容区域 */}
|
|
<div className="flex-1 overflow-hidden">
|
|
<div className="p-2 h-full overflow-y-auto">
|
|
{/* 搜索框 */}
|
|
<div className="relative mb-2">
|
|
<Search className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-4 h-4" />
|
|
<input
|
|
type="text"
|
|
placeholder="搜索对话..."
|
|
value={searchQuery}
|
|
onChange={(e) => setSearchQuery(e.target.value)}
|
|
className="w-full pl-9 pr-8 py-1.5 bg-white/60 dark:bg-gray-800 border border-[#e8e6e1] dark:border-gray-700 rounded-lg text-sm focus:outline-none focus:border-gray-400 transition-all text-gray-700 dark:text-gray-300 placeholder-gray-400"
|
|
/>
|
|
{searchQuery && (
|
|
<button
|
|
onClick={() => setSearchQuery('')}
|
|
className="absolute right-2 top-1/2 -translate-y-1/2 p-1 hover:bg-gray-200 dark:hover:bg-gray-700 rounded text-gray-400"
|
|
>
|
|
<X className="w-3 h-3" />
|
|
</button>
|
|
)}
|
|
</div>
|
|
<ConversationList searchQuery={searchQuery} />
|
|
</div>
|
|
</div>
|
|
|
|
{/* 底部操作栏 */}
|
|
<div className="p-2 border-t border-[#e8e6e1] dark:border-gray-700 space-y-1">
|
|
<button
|
|
onClick={onToggleMode}
|
|
className="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-sm text-gray-600 dark:text-gray-400 hover:bg-black/5 dark:hover:bg-white/5 transition-colors"
|
|
>
|
|
<LayoutGrid className="w-4 h-4" />
|
|
<span>专业模式</span>
|
|
</button>
|
|
<button
|
|
onClick={onOpenSettings}
|
|
aria-label="打开设置"
|
|
title="设置和更多"
|
|
className="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-sm text-gray-600 dark:text-gray-400 hover:bg-black/5 dark:hover:bg-white/5 transition-colors"
|
|
>
|
|
<Settings className="w-4 h-4" />
|
|
<span>设置</span>
|
|
</button>
|
|
</div>
|
|
</aside>
|
|
);
|
|
}
|