'use client'; import { FormEvent, KeyboardEvent, useMemo, useState } from 'react'; import { BotMessageSquare, Image as ImageIcon, MessageCircleQuestionMark, Mic, Search, SendHorizontal, Sparkles, SquarePen, } from 'lucide-react'; import { WENFAN_HELP_ARTICLES, type HelpArticle } from '@/lib/wenfan-help-articles'; import { getFallbackHelpSuggestions, searchHelpArticles, type HelpSearchResult } from '@/lib/wenfan-help-search'; type ChatMessage = | { id: string; role: 'assistant'; type: 'intro'; content: string; } | { id: string; role: 'user'; type: 'text'; content: string; } | { id: string; role: 'assistant'; type: 'article'; result: HelpSearchResult; } | { id: string; role: 'assistant'; type: 'fallback'; content: string; suggestions: string[]; }; const INITIAL_MESSAGES: ChatMessage[] = [ { id: 'intro', role: 'assistant', type: 'intro', content: '我是问翻小宝,第一阶段只从内置帮助中心回答系统怎么用,不调用 AI,也不消耗模型 token。你可以问产品、项目、版本、需求池、开发任务、测试用例、Bug 和日志记录。', }, ]; const STARTER_QUESTIONS = getFallbackHelpSuggestions(); export default function WenfanXiaobaoPage() { const [messages, setMessages] = useState(INITIAL_MESSAGES); const [input, setInput] = useState(''); const [history, setHistory] = useState([ '怎么新建产品?', '怎么把需求纳入版本?', '开发任务怎么提测?', '测试用例失败后怎么提 Bug?', '日志记录会记录哪些行为?', ]); const visibleHistory = useMemo(() => history.slice(0, 12), [history]); function askQuestion(rawQuestion: string) { const question = rawQuestion.trim(); if (!question) return; const results = searchHelpArticles(question, WENFAN_HELP_ARTICLES); const userMessage: ChatMessage = { id: `user-${Date.now()}`, role: 'user', type: 'text', content: question, }; const assistantMessage: ChatMessage = results.length > 0 ? { id: `article-${Date.now()}`, role: 'assistant', type: 'article', result: results[0], } : { id: `fallback-${Date.now()}`, role: 'assistant', type: 'fallback', content: '暂时没有找到对应的内置帮助内容。你可以换个关键词,或者从下面这些常见问题开始。', suggestions: STARTER_QUESTIONS, }; setMessages((current) => [...current, userMessage, assistantMessage]); setHistory((current) => [question, ...current.filter((item) => item !== question)]); setInput(''); } function handleSubmit(event: FormEvent) { event.preventDefault(); askQuestion(input); } function handleTextareaKeyDown(event: KeyboardEvent) { if (event.key === 'Enter' && !event.shiftKey) { event.preventDefault(); askQuestion(input); } } return (

问翻小宝

内置帮助
{messages.map((message) => ( ))}
{STARTER_QUESTIONS.map((question) => ( ))}