diff --git a/web/src/app/chat/components/message-list-view.tsx b/web/src/app/chat/components/message-list-view.tsx index 0a516d2..377cb25 100644 --- a/web/src/app/chat/components/message-list-view.tsx +++ b/web/src/app/chat/components/message-list-view.tsx @@ -3,7 +3,13 @@ import { LoadingOutlined } from "@ant-design/icons"; import { motion } from "framer-motion"; -import { Download, Headphones, ChevronDown, ChevronRight, Brain } from "lucide-react"; +import { + Download, + Headphones, + ChevronDown, + ChevronRight, + Brain, +} from "lucide-react"; import React, { useCallback, useMemo, useRef, useState } from "react"; import { LoadingAnimation } from "~/components/deer-flow/loading-animation"; @@ -23,7 +29,11 @@ import { CardHeader, CardTitle, } from "~/components/ui/card"; -import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "~/components/ui/collapsible"; +import { + Collapsible, + CollapsibleContent, + CollapsibleTrigger, +} from "~/components/ui/collapsible"; import type { Message, Option } from "~/core/messages"; import { closeResearch, @@ -323,59 +333,63 @@ function ThoughtBlock({ } return ( -
+
- - + + @@ -417,7 +431,9 @@ function PlanCard({ }, [message.content]); const reasoningContent = message.reasoningContent; - const hasMainContent = Boolean(message.content && message.content.trim() !== ""); + const hasMainContent = Boolean( + message.content && message.content.trim() !== "", + ); // 判断是否正在思考:有推理内容但还没有主要内容 const isThinking = Boolean(reasoningContent && !hasMainContent); @@ -461,55 +477,61 @@ function PlanCard({ - - - {plan.thought} - - {plan.steps && ( -
    - {plan.steps.map((step, i) => ( -
  • -

    - {step.title} -

    -
    - {step.description} -
    -
  • - ))} -
- )} -
- - {!message.isStreaming && interruptMessage?.options?.length && ( - - {interruptMessage?.options.map((option) => ( - - ))} - - )} - -
+ + + {plan.thought} + + {plan.steps && ( +
    + {plan.steps.map((step, i) => ( +
  • +

    + + {step.title} + +

    +
    + + {step.description} + +
    +
  • + ))} +
+ )} +
+ + {!message.isStreaming && interruptMessage?.options?.length && ( + + {interruptMessage?.options.map((option) => ( + + ))} + + )} + +
)}