refactor: merge agent workbench into chat

desktop/src/components/chat/AgentWorkbenchComposer.tsx

@@ -0,0 +1,523 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { App, Button, Dropdown, Input, Select, Switch, Tag, theme } from 'antd';
+import type { MenuProps } from 'antd';
+import {
+  ArrowUp,
+  AtSign,
+  ChevronDown,
+  Clapperboard,
+  ImagePlus,
+  Mic2,
+  Music2,
+  Plus,
+  SlidersHorizontal,
+  Sparkles,
+  UserRound,
+  WandSparkles,
+  Wrench,
+  X,
+} from 'lucide-react';
+import { invoke } from '@/lib/invoke';
+import { useConversationStore, useProviderStore, useSkillStore } from '@/stores';
+import type { AttachmentInput, Model } from '@/types';
+
+type CreationMode = 'agent' | 'image' | 'video' | 'music' | 'voice' | 'digital-human' | 'action';
+
+interface CreationModeOption {
+  key: CreationMode;
+  label: string;
+  hint: string;
+  icon: React.ReactNode;
+}
+
+interface AttachmentItem {
+  id: string;
+  name: string;
+  type: string;
+  size: number;
+  data: string;
+}
+
+interface ChatModelOption {
+  value: string;
+  label: string;
+  providerId: string;
+  modelId: string;
+}
+
+const CREATION_MODES: CreationModeOption[] = [
+  { key: 'agent', label: 'Agent 模式', hint: '拆解任务、读写文件、执行工具', icon: <WandSparkles size={16} /> },
+  { key: 'image', label: '图片生成', hint: '即梦图片、参考图与风格控制', icon: <ImagePlus size={16} /> },
+  { key: 'video', label: '视频生成', hint: '即梦视频、图生视频与分镜', icon: <Clapperboard size={16} /> },
+  { key: 'music', label: '音乐生成', hint: '配乐、氛围与短片 BGM', icon: <Music2 size={16} /> },
+  { key: 'voice', label: '配音生成', hint: 'TTS 音色、语速与试听', icon: <Mic2 size={16} /> },
+  { key: 'digital-human', label: '数字人', hint: '口播、形象与视频工作流', icon: <UserRound size={16} /> },
+  { key: 'action', label: '动作模仿', hint: '动作迁移与主体参考', icon: <Sparkles size={16} /> },
+];
+
+const JIMENG_IMAGE_MODELS = [
+  { value: 'jimeng_t2i_v40', label: '即梦图片 4.0' },
+  { value: 'custom', label: '自定义 req_key' },
+];
+
+const JIMENG_VIDEO_MODELS = [
+  { value: 'jimeng_ti2v_v30_pro', label: '即梦图生视频 3.0 Pro' },
+  { value: 'custom', label: '自定义 req_key' },
+];
+
+const JIANYING_SKILL_NAME = 'jianying-editor';
+const JIANYING_SKILL_SOURCE = 'luoluoluo22/jianying-editor-skill';
+const JIANYING_PROMPT_PREFIX = '请使用 jianying-editor Skill 自动创建剪映草稿：';
+
+function formatFileSize(size: number): string {
+  if (size < 1024) return `${size} B`;
+  if (size < 1024 * 1024) return `${(size / 1024).toFixed(1)} KB`;
+  return `${(size / 1024 / 1024).toFixed(1)} MB`;
+}
+
+function modelOptionLabel(model: Model, providerName: string): string {
+  return `${model.name || model.model_id} · ${providerName}`;
+}
+
+function isUsableChatModel(model: Model): boolean {
+  return model.enabled && (model.model_type === 'Chat' || model.capabilities.includes('TextChat'));
+}
+
+function getAttachmentMimeType(fileName: string, mimeType?: string): string {
+  if (mimeType) return mimeType;
+  const extension = fileName.split('.').pop()?.toLowerCase();
+  if (extension === 'pdf') return 'application/pdf';
+  if (extension === 'txt') return 'text/plain';
+  if (extension === 'md') return 'text/markdown';
+  if (extension === 'json') return 'application/json';
+  return 'application/octet-stream';
+}
+
+async function fileToAttachmentItem(file: File): Promise<AttachmentItem> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onerror = () => reject(reader.error ?? new Error(`读取文件失败：${file.name}`));
+    reader.onload = () => {
+      const base64 = (reader.result as string).split(',')[1] || '';
+      resolve({
+        id: `${file.name}-${file.size}-${file.lastModified}-${globalThis.crypto?.randomUUID?.() ?? Date.now()}`,
+        name: file.name,
+        type: getAttachmentMimeType(file.name, file.type),
+        size: file.size,
+        data: base64,
+      });
+    };
+    reader.readAsDataURL(file);
+  });
+}
+
+function toAttachmentInput(item: AttachmentItem): AttachmentInput {
+  return {
+    file_name: item.name,
+    file_type: item.type,
+    file_size: item.size,
+    data: item.data,
+  };
+}
+
+export function AgentWorkbenchComposer() {
+  const { token } = theme.useToken();
+  const { message } = App.useApp();
+  const fileInputRef = useRef<HTMLInputElement>(null);
+  const providers = useProviderStore((s) => s.providers);
+  const fetchProviders = useProviderStore((s) => s.fetchProviders);
+  const createConversation = useConversationStore((s) => s.createConversation);
+  const updateConversation = useConversationStore((s) => s.updateConversation);
+  const sendAgentMessage = useConversationStore((s) => s.sendAgentMessage);
+  const skills = useSkillStore((s) => s.skills);
+  const loadSkills = useSkillStore((s) => s.loadSkills);
+  const installSkill = useSkillStore((s) => s.installSkill);
+  const toggleSkill = useSkillStore((s) => s.toggleSkill);
+  const [creationMode, setCreationMode] = useState<CreationMode>('agent');
+  const [autoMode, setAutoMode] = useState(true);
+  const [prompt, setPrompt] = useState('');
+  const [agentModel, setAgentModel] = useState('custom');
+  const [customAgentModel, setCustomAgentModel] = useState('');
+  const [imageModel, setImageModel] = useState('jimeng_t2i_v40');
+  const [videoModel, setVideoModel] = useState('jimeng_ti2v_v30_pro');
+  const [customJimengModel, setCustomJimengModel] = useState('');
+  const [attachments, setAttachments] = useState<AttachmentItem[]>([]);
+  const [subjectOpen, setSubjectOpen] = useState(false);
+  const [skillOpen, setSkillOpen] = useState(false);
+  const [submitting, setSubmitting] = useState(false);
+  const [installingJianying, setInstallingJianying] = useState(false);
+  const [result, setResult] = useState('');
+
+  useEffect(() => {
+    if (providers.length === 0) {
+      void fetchProviders().catch((error) => message.error(String(error)));
+    }
+  }, [fetchProviders, message, providers.length]);
+
+  useEffect(() => {
+    void loadSkills();
+  }, [loadSkills]);
+
+  const chatModelOptions = useMemo<ChatModelOption[]>(() => {
+    const rows = providers
+      .filter((provider) => provider.enabled)
+      .flatMap((provider) =>
+        provider.models
+          .filter(isUsableChatModel)
+          .map((model) => ({
+            value: `${provider.id}::${model.model_id}`,
+            label: modelOptionLabel(model, provider.name),
+            providerId: provider.id,
+            modelId: model.model_id,
+          })),
+      );
+    const seen = new Set<string>();
+    return rows.filter((item) => {
+      if (seen.has(item.value)) return false;
+      seen.add(item.value);
+      return true;
+    });
+  }, [providers]);
+
+  useEffect(() => {
+    if (agentModel !== 'custom') return;
+    if (customAgentModel || chatModelOptions.length === 0) return;
+    setAgentModel(chatModelOptions[0].value);
+  }, [agentModel, chatModelOptions, customAgentModel]);
+
+  const currentMode = CREATION_MODES.find((item) => item.key === creationMode) ?? CREATION_MODES[0];
+  const selectedModel = creationMode === 'agent'
+    ? (agentModel === 'custom' ? customAgentModel.trim() || '自定义模型' : agentModel)
+    : creationMode === 'image'
+      ? (imageModel === 'custom' ? customJimengModel.trim() || '自定义 req_key' : imageModel)
+      : creationMode === 'video'
+        ? (videoModel === 'custom' ? customJimengModel.trim() || '自定义 req_key' : videoModel)
+        : '待配置';
+
+  const modeItems: MenuProps['items'] = CREATION_MODES.map((item) => ({
+    key: item.key,
+    label: (
+      <div className="agent-workbench-mode-item">
+        <span>{item.icon}</span>
+        <div>
+          <strong>{item.label}</strong>
+          <small>{item.hint}</small>
+        </div>
+        {item.key === creationMode && <em>✓</em>}
+      </div>
+    ),
+  }));
+
+  const selectedChatModel = useMemo(() => (
+    chatModelOptions.find((item) => item.value === agentModel) ?? null
+  ), [agentModel, chatModelOptions]);
+
+  const jianyingSkill = useMemo(() => (
+    skills.find((item) => item.name === JIANYING_SKILL_NAME) ?? null
+  ), [skills]);
+
+  const handleFilesSelected = useCallback((files: FileList | null) => {
+    if (!files || files.length === 0) return;
+    void Promise.all(Array.from(files).map(fileToAttachmentItem))
+      .then((next) => {
+        setAttachments((current) => [...current, ...next]);
+      })
+      .catch((error) => message.error(String(error)))
+      .finally(() => {
+        if (fileInputRef.current) fileInputRef.current.value = '';
+      });
+  }, [message]);
+
+  const removeAttachment = useCallback((id: string) => {
+    setAttachments((current) => current.filter((item) => item.id !== id));
+  }, []);
+
+  const applyJianyingSkill = useCallback(async () => {
+    if (installingJianying) return;
+    setInstallingJianying(true);
+    try {
+      if (!jianyingSkill) {
+        await installSkill(JIANYING_SKILL_SOURCE);
+        message.success('剪映 Skill 已安装');
+      } else if (!jianyingSkill.enabled) {
+        await toggleSkill(JIANYING_SKILL_NAME, true);
+        message.success('剪映 Skill 已启用');
+      }
+      setCreationMode('agent');
+      setPrompt((value) => {
+        const text = value.trim();
+        if (text.includes(JIANYING_SKILL_NAME) || text.includes('剪映')) return value;
+        return text ? `${JIANYING_PROMPT_PREFIX}${text}` : `${JIANYING_PROMPT_PREFIX}`;
+      });
+      setSkillOpen(false);
+    } catch (error) {
+      message.error(`剪映 Skill 集成失败：${String(error)}`);
+    } finally {
+      setInstallingJianying(false);
+    }
+  }, [installSkill, installingJianying, jianyingSkill, message, toggleSkill]);
+
+  const submit = useCallback(async () => {
+    const text = prompt.trim();
+    if (!text) {
+      message.warning('先输入想法、剧本或任务说明');
+      return;
+    }
+    if (submitting) return;
+
+    if (creationMode !== 'agent') {
+      setResult(`${currentMode.label} 已准备好。模型：${selectedModel}；参考素材：${attachments.length} 个。即梦/媒体生成链路下一步接入。`);
+      return;
+    }
+
+    const fallbackProvider = providers.find((provider) => provider.enabled);
+    const providerId = selectedChatModel?.providerId ?? fallbackProvider?.id;
+    const modelId = selectedChatModel?.modelId ?? customAgentModel.trim();
+    if (!providerId || !modelId) {
+      message.warning('先在供应商里启用一个对话模型，或填写自定义模型名');
+      return;
+    }
+
+    setSubmitting(true);
+    try {
+      const title = text.slice(0, 24) || 'Agent 创作';
+      const conversation = await createConversation(title, modelId, providerId);
+      await updateConversation(conversation.id, { mode: 'agent', provider_id: providerId, model_id: modelId });
+      await invoke('agent_update_session', {
+        conversationId: conversation.id,
+        permissionMode: autoMode ? 'accept_edits' : 'default',
+      });
+      await sendAgentMessage(text, attachments.map(toAttachmentInput));
+      setResult(`Agent 已开始执行。模型：${modelId}；参考素材：${attachments.length} 个。`);
+      setPrompt('');
+      setAttachments([]);
+    } catch (error) {
+      message.error(String(error));
+      setResult(`Agent 启动失败：${String(error)}`);
+    } finally {
+      setSubmitting(false);
+    }
+  }, [
+    attachments,
+    autoMode,
+    createConversation,
+    creationMode,
+    currentMode.label,
+    customAgentModel,
+    message,
+    prompt,
+    providers,
+    selectedChatModel,
+    selectedModel,
+    sendAgentMessage,
+    submitting,
+    updateConversation,
+  ]);
+
+  return (
+    <div className="agent-workbench-desktop" style={{ background: token.colorBgContainer }}>
+      <div className="agent-workbench-desktop-bg" />
+      <section className="agent-workbench-desktop-hero">
+        <h1>你好，想创作什么？</h1>
+        <div className="agent-workbench-desktop-composer">
+          <input
+            ref={fileInputRef}
+            className="agent-workbench-file-input"
+            type="file"
+            multiple
+            accept="image/*,video/*,audio/*,.pdf,.txt,.md,.json"
+            onChange={(event) => handleFilesSelected(event.target.files)}
+          />
+          <button
+            className="agent-workbench-upload"
+            type="button"
+            onClick={() => fileInputRef.current?.click()}
+            aria-label="上传参考素材"
+          >
+            <Plus size={24} />
+          </button>
+          <Input.TextArea
+            className="agent-workbench-prompt"
+            value={prompt}
+            onChange={(event) => setPrompt(event.target.value)}
+            onPressEnter={(event) => {
+              if (event.metaKey || event.ctrlKey) {
+                event.preventDefault();
+                void submit();
+              }
+            }}
+            placeholder="输入想法、剧本或上传参考，支持 “/” 使用技能，@ 添加主体，和 Agent 一起创作"
+            autoSize={{ minRows: 4, maxRows: 8 }}
+          />
+          {attachments.length > 0 && (
+            <div className="agent-workbench-attachments">
+              {attachments.map((item) => (
+                <Tag
+                  key={item.id}
+                  closeIcon={<X size={12} />}
+                  onClose={(event) => {
+                    event.preventDefault();
+                    removeAttachment(item.id);
+                  }}
+                >
+                  {item.name} <span>{formatFileSize(item.size)}</span>
+                </Tag>
+              ))}
+            </div>
+          )}
+          <div className="agent-workbench-toolbar">
+            <div className="agent-workbench-tool-left">
+              <Dropdown
+                trigger={['click']}
+                menu={{
+                  items: modeItems,
+                  selectable: true,
+                  selectedKeys: [creationMode],
+                  onClick: ({ key }) => setCreationMode(key as CreationMode),
+                }}
+                overlayClassName="agent-workbench-mode-menu"
+              >
+                <Button className="agent-workbench-pill active" icon={currentMode.icon}>
+                  {currentMode.label} <ChevronDown size={14} />
+                </Button>
+              </Dropdown>
+              <Button className="agent-workbench-pill" icon={<SlidersHorizontal size={15} />} onClick={() => setAutoMode((value) => !value)}>
+                自动
+                <Switch size="small" checked={autoMode} onChange={setAutoMode} onClick={(_, event) => event.stopPropagation()} />
+              </Button>
+              {creationMode === 'agent' && (
+                <>
+                  <Select
+                    className="agent-workbench-model-select"
+                    value={agentModel}
+                    onChange={(value) => {
+                      setAgentModel(value);
+                      if (value !== 'custom') setCustomAgentModel('');
+                    }}
+                    options={[
+                      ...chatModelOptions,
+                      { value: 'custom', label: '自定义模型' },
+                    ]}
+                    popupMatchSelectWidth={false}
+                  />
+                  {agentModel === 'custom' && (
+                    <Input
+                      className="agent-workbench-model-input"
+                      value={customAgentModel}
+                      onChange={(event) => setCustomAgentModel(event.target.value)}
+                      placeholder="输入 BoosAPI 模型名"
+                    />
+                  )}
+                </>
+              )}
+              {creationMode === 'image' && (
+                <>
+                  <Select
+                    className="agent-workbench-model-select"
+                    value={imageModel}
+                    onChange={setImageModel}
+                    options={JIMENG_IMAGE_MODELS}
+                    popupMatchSelectWidth={false}
+                  />
+                  {imageModel === 'custom' && (
+                    <Input
+                      className="agent-workbench-model-input"
+                      value={customJimengModel}
+                      onChange={(event) => setCustomJimengModel(event.target.value)}
+                      placeholder="输入火山 req_key"
+                    />
+                  )}
+                </>
+              )}
+              {creationMode === 'video' && (
+                <>
+                  <Select
+                    className="agent-workbench-model-select"
+                    value={videoModel}
+                    onChange={setVideoModel}
+                    options={JIMENG_VIDEO_MODELS}
+                    popupMatchSelectWidth={false}
+                  />
+                  {videoModel === 'custom' && (
+                    <Input
+                      className="agent-workbench-model-input"
+                      value={customJimengModel}
+                      onChange={(event) => setCustomJimengModel(event.target.value)}
+                      placeholder="输入火山 req_key"
+                    />
+                  )}
+                </>
+              )}
+              <Dropdown
+                open={skillOpen}
+                onOpenChange={setSkillOpen}
+                trigger={['click']}
+                dropdownRender={() => (
+                  <div className="agent-workbench-popover">
+                    <Input placeholder="搜索技能" prefix={<Wrench size={15} />} />
+                    <button type="button" onClick={() => void applyJianyingSkill()}>
+                      <Clapperboard size={16} />
+                      剪映自动剪辑
+                      <small>
+                        {installingJianying
+                          ? '正在安装/启用...'
+                          : jianyingSkill?.enabled
+                            ? '已启用，生成草稿、字幕、配音、特效和导出'
+                            : jianyingSkill
+                              ? '已安装，点击启用并写入提示'
+                              : '一键安装 luoluoluo22/jianying-editor-skill'}
+                      </small>
+                    </button>
+                    <button type="button"><Wrench size={16} /> 剧情短片 <small>自动生成故事大纲、分镜脚本并产出短片</small></button>
+                    <button type="button"><Wrench size={16} /> 电商套图 <small>生成风格统一的商品全套视觉素材</small></button>
+                    <button type="button"><Plus size={16} /> 用 Agent 创建技能</button>
+                  </div>
+                )}
+              >
+                <Button className="agent-workbench-pill" icon={<Wrench size={15} />}>使用技能</Button>
+              </Dropdown>
+              <Dropdown
+                open={subjectOpen}
+                onOpenChange={setSubjectOpen}
+                trigger={['click']}
+                dropdownRender={() => (
+                  <div className="agent-workbench-subject-popover">
+                    <span>可能@的内容</span>
+                    <div>
+                      <AtSign size={36} />
+                      <strong>你还没有创建过主体</strong>
+                      <button
+                        type="button"
+                        onClick={() => {
+                          setPrompt((value) => `${value}${value && !value.endsWith(' ') ? ' ' : ''}@主体 `);
+                          setSubjectOpen(false);
+                        }}
+                      >
+                        + 创建主体
+                      </button>
+                    </div>
+                  </div>
+                )}
+              >
+                <Button className="agent-workbench-pill square" icon={<AtSign size={16} />} />
+              </Dropdown>
+            </div>
+            <Button
+              className="agent-workbench-submit"
+              type="primary"
+              icon={<ArrowUp size={18} />}
+              loading={submitting}
+              onClick={() => void submit()}
+            />
+          </div>
+        </div>
+        {result && (
+          <div className="agent-workbench-result">
+            <strong>{currentMode.label}</strong>
+            <p>{result}</p>
+          </div>
+        )}
+      </section>
+    </div>
+  );
+}

desktop/src/components/chat/ChatView.tsx

@@ -2,16 +2,13 @@ import React, { useMemo, useCallback, useRef, useState, useEffect, useSyncExtern
 import { CloseCircleFilled, SyncOutlined } from '@ant-design/icons';
 import { Typography, Button, Dropdown, Input, App, Avatar, Alert, Popconfirm, Popover, theme, Tag, Image, Tooltip, Modal, Spin } from 'antd';
 import type { InputRef } from 'antd';
-import { Pencil, Share2, FileImage, FileCode, FileText, FileType, Bot, Brain, Lightbulb, Code, Languages, Copy, Check, RotateCcw, User, Trash2, ChevronLeft, ChevronRight, ChevronDown, Scissors, Paperclip, AlertCircle, X, ArrowDown, ArrowUp, ArrowLeftRight, Zap, Sparkles, TextCursorInput, GitBranch, ChartNoAxesColumn, MessageSquare, ArrowUpRight, ArrowDownRight, Coins, Clock, Timer, Download, PanelLeftClose, PanelLeftOpen } from 'lucide-react';
+import { Pencil, Share2, FileImage, FileCode, FileText, FileType, Bot, Brain, Code, Copy, Check, RotateCcw, User, Trash2, ChevronLeft, ChevronRight, ChevronDown, Scissors, Paperclip, AlertCircle, X, ArrowDown, ArrowUp, ArrowLeftRight, Zap, Sparkles, TextCursorInput, GitBranch, ChartNoAxesColumn, MessageSquare, ArrowUpRight, ArrowDownRight, Coins, Clock, Timer, Download, PanelLeftClose, PanelLeftOpen } from 'lucide-react';
 import { ModelIcon } from '@lobehub/icons';
 import { getConvIcon } from '@/lib/convIcon';
-import { normalizeAutoConversationTitle } from '@/lib/conversationTitle';
 import Bubble from '@ant-design/x/es/bubble';
-import Prompts from '@ant-design/x/es/prompts';
 import Actions from '@ant-design/x/es/actions';
 import Think from '@ant-design/x/es/think';
 import type { BubbleItemType, BubbleListRef, RoleType } from '@ant-design/x/es/bubble/interface';
-import type { PromptsItemType } from '@ant-design/x/es/prompts';
 import NodeRenderer, { setCustomComponents, withMarkstreamComponentDisplay, type NodeComponentProps, type CodeBlockActionContext, type CodeBlockPreviewPayload, type MermaidBlockActionContext, type InfographicBlockActionContext } from 'markstream-react';
 import { useTranslation } from 'react-i18next';
 import { CodeBlockHeaderActions } from './CodeBlockHeaderActions';
@@ -33,6 +30,7 @@ import { useUserProfileStore } from '@/stores/userProfileStore';
 import { useResolvedDarkMode } from '@/hooks/useResolvedDarkMode';
 import { InputArea } from './InputArea';
 import { ModelSelector } from './ModelSelector';
+import { AgentWorkbenchComposer } from './AgentWorkbenchComposer';
 import { parseSearchContent } from '@/lib/searchUtils';
 import {
   CHAT_CUSTOM_HTML_TAGS,
@@ -2111,7 +2109,6 @@ export function ChatView() {
   const [mermaidPreviewSvg, setMermaidPreviewSvg] = useState<string | null>(null);
   const [mermaidPreviewOpen, setMermaidPreviewOpen] = useState(false);
   const [streamStatusNow, setStreamStatusNow] = useState(() => Date.now());
-  const createConversation = useConversationStore((s) => s.createConversation);
   const providers = useProviderStore((s) => s.providers);
   const settings = useSettingsStore((s) => s.settings);
   const saveSettings = useSettingsStore((s) => s.saveSettings);
@@ -2780,62 +2777,6 @@ export function ChatView() {
     [messages, activeConversation, t, messageApi],
   );
 
-  // ── Welcome prompt items ───────────────────────────────────────────
-  const greetingText = useMemo(() => {
-    const hour = new Date().getHours();
-    let key: string;
-    if (hour >= 5 && hour < 12) key = 'chat.greetingMorning';
-    else if (hour >= 12 && hour < 14) key = 'chat.greetingNoon';
-    else if (hour >= 14 && hour < 18) key = 'chat.greetingAfternoon';
-    else key = 'chat.greetingEvening';
-    return `👋 ${t(key)}`;
-  }, [t]);
-
-  const promptItems: PromptsItemType[] = useMemo(
-    () => [
-      { key: '1', icon: <Lightbulb size={16} />, label: t('chat.welcomePrompt1') },
-      { key: '2', icon: <Languages size={16} />, label: t('chat.welcomePrompt2') },
-      { key: '3', icon: <Code size={16} />, label: t('chat.welcomePrompt3') },
-      { key: '4', icon: <Lightbulb size={16} />, label: t('chat.welcomePrompt4') },
-    ],
-    [t],
-  );
-
-  const handlePromptClick = useCallback(
-    async (info: { data: PromptsItemType }) => {
-      const text = typeof info.data.label === 'string' ? info.data.label : '';
-      if (!text) return;
-
-      try {
-        if (!activeConversationId) {
-          // Prefer settings default model, fall back to first enabled
-          let provider = settings.default_provider_id
-            ? providers.find((p) => p.id === settings.default_provider_id && p.enabled)
-            : undefined;
-          let model = provider?.models.find(
-            (m) => m.model_id === settings.default_model_id && m.enabled,
-          );
-          if (!provider || !model) {
-            provider = providers.find((p) => p.enabled && p.models.some((m) => m.enabled));
-            model = provider?.models.find((m) => m.enabled);
-          }
-          if (!provider || !model) {
-            messageApi.warning(t('chat.noModel'));
-            return;
-          }
-          await createConversation(normalizeAutoConversationTitle(text), model.model_id, provider.id);
-        }
-
-        // Route through InputArea's send pipeline so companion models are respected
-        useConversationStore.getState().setPendingPromptText(text);
-      } catch (e) {
-        console.error('[handlePromptClick] error:', e);
-        messageApi.error(String(e));
-      }
-    },
-    [activeConversationId, providers, settings, createConversation, messageApi, t],
-  );
-
   // ── Bubble items (only show active messages) ────────────────────────
   const activeMessages = useMemo(
     () => messages.filter((msg) => msg.is_active !== false),
@@ -4201,15 +4142,7 @@ export function ChatView() {
             </div>
           ) : (
             <div className="flex flex-col items-center justify-center h-full" style={{ padding: '0 24px' }}>
-              <Typography.Title level={3} style={{ marginBottom: 24, fontWeight: 500 }}>
-                {greetingText}
-              </Typography.Title>
-              <Prompts
-                items={promptItems}
-                onItemClick={handlePromptClick}
-                wrap
-                style={{ marginTop: 16 }}
-              />
+              <AgentWorkbenchComposer />
             </div>
           )
         ) : (
@@ -4254,6 +4187,7 @@ export function ChatView() {
       )}
 
       {/* Input Area */}
+      {messages.length > 0 && (
       <div className="relative">
         {showScrollToBottom && (
           <Button
@@ -4275,6 +4209,7 @@ export function ChatView() {
         )}
         <InputArea />
       </div>
+      )}
       <Modal
         title={t('chat.compressionSummary')}
         open={summaryModalOpen}

desktop/src/components/layout/ContentArea.tsx

@@ -1,5 +1,4 @@
 import type { PageKey } from '@/types';
-import { AgentWorkbenchPage } from '@/pages/AgentWorkbenchPage';
 import { ChatPage } from '@/pages/ChatPage';
 import { DrawingPage } from '@/pages/DrawingPage';
 import { KnowledgePage } from '@/pages/KnowledgePage';
@@ -17,8 +16,6 @@ export function ContentArea({ activePage }: ContentAreaProps) {
   switch (activePage) {
     case 'chat':
       return <ChatPage />;
-    case 'agent-workbench':
-      return <AgentWorkbenchPage />;
     case 'drawing':
       return <DrawingPage />;
     case 'knowledge':

desktop/src/components/layout/Sidebar.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { Tooltip, Avatar, theme } from 'antd';
-import { MessageSquare, BookOpen, Brain, Router, FolderOpen, User, Sparkles, ImagePlus, WandSparkles } from 'lucide-react';
+import { MessageSquare, BookOpen, Brain, Router, FolderOpen, User, Sparkles, ImagePlus } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { useUIStore, useSettingsStore } from '@/stores';
 import { useUserProfileStore } from '@/stores/userProfileStore';
@@ -12,7 +12,6 @@ import type { PageKey } from '@/types';
 
 const mainNavItems: { key: PageKey; icon: React.ReactNode; labelKey: string }[] = [
   { key: 'chat', icon: <MessageSquare size={18} />, labelKey: 'nav.chat' },
-  { key: 'agent-workbench', icon: <WandSparkles size={18} />, labelKey: 'nav.agentWorkbench' },
   { key: 'drawing', icon: <ImagePlus size={18} />, labelKey: 'nav.drawing' },
   { key: 'skills', icon: <Sparkles size={18} />, labelKey: 'nav.skills' },
   { key: 'knowledge', icon: <BookOpen size={18} />, labelKey: 'nav.knowledge' },