{!isTauri && disabled ? (
;
hide_assistant?: boolean;
rootClassName?: string;
@@ -35,6 +42,10 @@ interface ChatMessageProps {
actionIconSize?: number;
copyButtonId?: string;
formatUrl?: (data: any) => string;
+ activeDeepResearchViewKey?: string;
+ onOpenDeepResearch?: (payload: DeepResearchPanelPayload) => void;
+ onUpdateDeepResearch?: (payload: DeepResearchPanelPayload) => void;
+ onRequestDeepResearchCancel?: () => void;
}
export const ChatMessage = memo(function ChatMessage({
@@ -47,7 +58,10 @@ export const ChatMessage = memo(function ChatMessage({
deep_read,
think,
response,
+ deepResearch = [],
+ replyEnd = [],
onResend,
+ onCancel,
loadingStep,
hide_assistant = false,
rootClassName,
@@ -55,11 +69,16 @@ export const ChatMessage = memo(function ChatMessage({
actionIconSize,
copyButtonId,
formatUrl,
+ activeDeepResearchViewKey,
+ onOpenDeepResearch,
+ onUpdateDeepResearch,
+ onRequestDeepResearchCancel,
}: ChatMessageProps) {
const { t } = useTranslation();
const currentAssistant = useConnectStore((state) => state.currentAssistant);
const assistantList = useConnectStore((state) => state.assistantList);
+ const isDark = useThemeStore((state) => state.isDark);
const [assistant, setAssistant] = useState({});
const isAssistant = message?._source?.type === "assistant";
@@ -92,6 +111,28 @@ export const ChatMessage = memo(function ChatMessage({
const attachments = message?._source?.attachments ?? [];
const details = message?._source?.details || [];
const question = message?._source?.question || "";
+ const payload = message?._source?.payload;
+ const sessionId = message?._source?.session_id || deepResearch[0]?.session_id;
+ const messageId = message?._id || deepResearch[0]?.message_id;
+
+ const deepResearchDetail = details.find(
+ (item) => item.type === "deep_research"
+ );
+
+ const endChunk = useMemo(() => {
+ const endDetail = details.find((item) => item.type === "reply_end");
+ if (endDetail) {
+ return endDetail;
+ }
+ const last = replyEnd.length > 0 ? replyEnd[replyEnd.length - 1] : undefined;
+ const endPayload = parseReplyEndPayload(last?.message_chunk);
+ return last ? { type: last.chunk_type, payload: endPayload } : undefined;
+ }, [details, replyEnd]);
+
+ const isCancelled = endChunk?.payload?.reason === "user_cancelled";
+ const isError = endChunk?.payload?.reason === "error";
+ const isTimeout = endChunk?.payload?.reason === "timeout";
+ const isDeepResearching = !!deepResearchDetail || deepResearch.length > 0;
const showActions =
isTyping === false && (messageContent || response?.message_chunk);
@@ -148,7 +189,60 @@ export const ChatMessage = memo(function ChatMessage({
loading={isTyping}
onDoubleClickCapture={() => {}}
/>
- {isTyping && (
+ = (props) => {
deep_read,
think,
response,
+ deepResearch,
+ replyEnd,
},
handlers,
clearAllChunkData,
@@ -172,6 +186,7 @@ const AskAi: FC = (props) => {
deep_read: false,
think: false,
response: false,
+ deepResearch: false,
[chunkData.chunk_type]: true,
}));
@@ -189,7 +204,12 @@ const AskAi: FC = (props) => {
handlers.deal_think(chunkData);
} else if (chunkData.chunk_type === "response") {
handlers.deal_response(chunkData);
+ } else if (
+ DEEP_RESEARCH_CHUNK_TYPES.includes(chunkData.chunk_type)
+ ) {
+ handlers.deal_deep_research(chunkData);
} else if (chunkData.chunk_type === "reply_end") {
+ handlers.deal_reply_end(chunkData);
console.log("AI finished output");
setIsTyping(false);
return;
@@ -272,6 +292,8 @@ const AskAi: FC = (props) => {
deep_read={deep_read}
think={think}
response={response}
+ deepResearch={deepResearch}
+ replyEnd={replyEnd}
loadingStep={loadingStep}
copyButtonId={state.copyButtonId}
/>
diff --git a/src/components/SearchChat/index.tsx b/src/components/SearchChat/index.tsx
index beb50290..a7250399 100644
--- a/src/components/SearchChat/index.tsx
+++ b/src/components/SearchChat/index.tsx
@@ -289,8 +289,8 @@ function SearchChat({
[isChatMode]
);
- const cancelChat = useCallback(() => {
- chatAIRef.current?.cancelChat();
+ const requestCancelChat = useCallback(() => {
+ chatAIRef.current?.requestCancelChat();
}, []);
const setInput = useCallback((value: string) => {
@@ -496,7 +496,7 @@ function SearchChat({
inputValue={input}
onSend={handleSendMessage}
disabled={isTyping}
- disabledChange={cancelChat}
+ disabledChange={requestCancelChat}
changeMode={changeMode}
changeInput={setInput}
isSearchActive={isSearchActive}
diff --git a/src/components/Settings/GeneralSettings.tsx b/src/components/Settings/GeneralSettings.tsx
index 8fbe3512..cd2d0555 100644
--- a/src/components/Settings/GeneralSettings.tsx
+++ b/src/components/Settings/GeneralSettings.tsx
@@ -189,6 +189,12 @@ export default function GeneralSettings() {
const currentLanguage = language || i18n.language;
+ const changeLanguage = (lang: string) => {
+ setLanguage(lang);
+ platformAdapter.emitEvent("app:language-changed", { language: lang });
+ platformAdapter.invokeBackend("update_app_lang", { lang });
+ };
+
const windowModes: Array<{
icon: ReactElement;
value: WindowMode;
@@ -320,10 +326,7 @@ export default function GeneralSettings() {
- {(!activeChat || activeChat?.messages?.length === 0) &&
- !visibleStartPage && (
+ null
+ );
+ const { t: tOriginal } = useTranslation();
+ const t = tProp || tOriginal;
+
+ const confirmCancelResearch = () => {
+ onOpenChange(false);
+ onConfirm?.();
+ };
+
+ return (
+ ["plannerStatus"];
+ executionStatus: ReturnType["executionStatus"];
+ reportStatus: ReturnType["reportStatus"];
+}
+
+const sanitizeFilename = (value: string) => {
+ return value.replace(/[\\/:*?"<>|]+/g, "_").trim();
+};
+
+const ensureExtension = (filename: string, extension: string) => {
+ return filename.toLowerCase().endsWith(extension)
+ ? filename
+ : `${filename}${extension}`;
+};
+
+const getReportExtension = (format?: string) => {
+ if (format === "html") return ".html";
+ if (format === "pdf") return ".pdf";
+ return ".md";
+};
+
+const getReportMimeType = (format?: string) => {
+ if (format === "html") return "text/html;charset=utf-8";
+ if (format === "pdf") return "application/pdf";
+ return "text/markdown;charset=utf-8";
+};
+
+const arrayBufferToBase64 = (buffer: ArrayBuffer) => {
+ const bytes = new Uint8Array(buffer);
+ let binary = "";
+ for (let index = 0; index < bytes.length; index += 1) {
+ binary += String.fromCharCode(bytes[index]);
+ }
+ return window.btoa(binary);
+};
+
+export const buildDeepResearchViewFromChunks = (
+ chunks: IChunkData[],
+ reportDataOverride?: ResearchReportData,
+ endChunk?: DeepResearchEndChunk,
+ question?: string,
+ serverId?: string
+): DeepResearchViewData => {
+ const state = deriveDeepResearchState(chunks);
+ const steps = buildSteps(state);
+ const searchHits = buildSearchHits(state);
+ const statuses = buildStatuses(state, steps);
+ const reportData =
+ normalizeResearchReportData(reportDataOverride) ||
+ state.deepResearchReportData;
+ const isEnd =
+ !!endChunk?.payload?.reason ||
+ state.deepResearchReporterFinished ||
+ !!reportData?.url ||
+ !!reportData?.attachment ||
+ !!reportData?.content;
+
+ return {
+ steps,
+ searchHits,
+ reportData,
+ serverId,
+ endChunk,
+ question,
+ isEnd,
+ ...statuses,
+ };
+};
+
+export interface DeepResearchPanelHistoryPayload
+ extends DeepResearchPanelPayload {}
+
+export const buildDeepResearchPanelFromHistory = async (
+ sessionId: string,
+ messageId: string,
+ defaultTab: DeepResearchTabKey,
+ language?: string
+): Promise => {
+ const result = await Post(`/chat/${sessionId}/_open`, {});
+ const res: any = result?.[1];
+ const messages: any[] = res?.messages || res?.hits?.hits || [];
+ const msg = messages.find((m) => m?._id === messageId);
+ const details: any[] = msg?._source?.details || [];
+ const detail = details.find((d) => d?.type === "deep_research");
+ const chunks: IChunkData[] = Array.isArray(detail?.payload)
+ ? detail.payload
+ : [];
+ const endDetail = details.find((d) => d?.type === "reply_end");
+
+ return {
+ viewKey: `${sessionId}:${messageId}`,
+ chunks,
+ defaultTab,
+ reportData: normalizeResearchReportData(msg?._source?.payload),
+ serverId: msg?._source?.server_id,
+ endChunk: endDetail,
+ question: msg?._source?.question,
+ language,
+ };
+};
+
+interface DeepResearchPanelProps {
+ payload: DeepResearchPanelPayload;
+ onClose?: () => void;
+ className?: string;
+}
+
+export function DeepResearchPanel({
+ payload,
+ onClose,
+ className,
+}: DeepResearchPanelProps) {
+ const { t, i18n } = useTranslation();
+ const addError = useAppStore((state) => state.addError);
+ const withVisibility = useAppStore((state) => state.withVisibility);
+ const [activeTab, setActiveTab] = useState(
+ payload.defaultTab
+ );
+ const [mountedTabs, setMountedTabs] = useState<
+ Record
+ >({
+ report: payload.defaultTab === "report",
+ steps: payload.defaultTab === "steps",
+ searchResults: payload.defaultTab === "searchResults",
+ });
+
+ useEffect(() => {
+ setActiveTab(payload.defaultTab);
+ setMountedTabs({
+ report: payload.defaultTab === "report",
+ steps: payload.defaultTab === "steps",
+ searchResults: payload.defaultTab === "searchResults",
+ });
+ }, [payload.viewKey, payload.defaultTab]);
+
+ useEffect(() => {
+ setMountedTabs((current) =>
+ current[activeTab] ? current : { ...current, [activeTab]: true }
+ );
+ }, [activeTab]);
+
+ useEffect(() => {
+ if (payload.language) {
+ i18n.changeLanguage(payload.language);
+ }
+ }, [i18n, payload.language]);
+
+ const view = useMemo(
+ () =>
+ buildDeepResearchViewFromChunks(
+ payload.chunks,
+ payload.reportData,
+ payload.endChunk,
+ payload.question,
+ payload.serverId
+ ),
+ [
+ payload.chunks,
+ payload.endChunk,
+ payload.question,
+ payload.reportData,
+ payload.serverId,
+ ]
+ );
+
+ const reportUrl = resolveReportUrl(
+ view.reportData?.url || view.reportData?.attachment
+ );
+
+ const handleDownloadReport = useCallback(async () => {
+ if (!reportUrl || !view.reportData) return;
+
+ try {
+ const reportData = view.reportData;
+ const extension = getReportExtension(reportData.format);
+ const rawTitle = reportData.title || t("deepResearch.report.defaultTitle");
+ const filename = ensureExtension(
+ sanitizeFilename(rawTitle) || t("deepResearch.report.defaultTitle"),
+ extension
+ );
+ const isPdf = reportData.format === "pdf";
+
+ if (platformAdapter.isTauri()) {
+ const path = await withVisibility(() =>
+ platformAdapter.saveFileDialog({
+ defaultPath: filename,
+ filters: [
+ {
+ name:
+ reportData.format === "html"
+ ? "HTML"
+ : reportData.format === "pdf"
+ ? "PDF"
+ : "Markdown",
+ extensions: [extension.slice(1)],
+ },
+ ],
+ })
+ );
+
+ if (!path) return;
+
+ if (isPdf) {
+ const contentBase64 = view.serverId
+ ? (
+ await platformAdapter.commands<{
+ content_base64: string;
+ }>("fetch_attachment_binary", {
+ serverId: view.serverId,
+ path: toServerPath(reportUrl),
+ })
+ ).content_base64
+ : arrayBufferToBase64(
+ await (await fetchReportBlob(reportUrl, view.serverId)).arrayBuffer()
+ );
+ await platformAdapter.commands("write_binary_file", {
+ path,
+ contentBase64,
+ });
+ } else {
+ const content = await fetchReportText(reportUrl, view.serverId);
+ await platformAdapter.commands("write_text_file", {
+ path,
+ content,
+ });
+ }
+ addError(t("deepResearch.report.downloadSuccess"), "info");
+ return;
+ }
+
+ const blob = isPdf
+ ? await fetchReportBlob(reportUrl, view.serverId)
+ : new Blob([await fetchReportText(reportUrl, view.serverId)], {
+ type: getReportMimeType(reportData.format),
+ });
+ const objectUrl = URL.createObjectURL(blob);
+ const a = document.createElement("a");
+ a.href = objectUrl;
+ a.download = filename;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ URL.revokeObjectURL(objectUrl);
+ addError(t("deepResearch.report.downloadSuccess"), "info");
+ } catch (e) {
+ console.error("download research report failed", e);
+ addError(t("deepResearch.report.downloadFailed"), "error");
+ }
+ }, [addError, reportUrl, t, view.reportData, view.serverId, withVisibility]);
+
+ const tabs: { key: DeepResearchTabKey; label: string }[] = useMemo(
+ () => [
+ { key: "report", label: t("deepResearch.tab.report") },
+ { key: "steps", label: t("deepResearch.tab.steps") },
+ { key: "searchResults", label: t("deepResearch.tab.searchResults") },
+ ],
+ [t]
+ );
+
+ return (
+ (null);
+ const [numPages, setNumPages] = useState(0);
+ const [containerWidth, setContainerWidth] = useState(0);
+ const file = useMemo(() => blob, [blob]);
+
+ useEffect(() => {
+ const node = containerRef.current;
+ if (!node) return;
+
+ const updateWidth = () => {
+ setContainerWidth(node.clientWidth);
+ };
+
+ updateWidth();
+
+ const observer = new ResizeObserver(() => {
+ updateWidth();
+ });
+ observer.observe(node);
+
+ return () => {
+ observer.disconnect();
+ };
+ }, []);
+
+ const pageWidth = useMemo(() => {
+ if (!containerWidth) return undefined;
+ return Math.max(containerWidth - 32, 280);
+ }, [containerWidth]);
+
+ return (
+ (() =>
+ resolvedUrl ? getCachedReportText(resolvedUrl, serverId) : undefined
+ );
+ const [isFetching, setIsFetching] = useState(false);
+ const [fetchError, setFetchError] = useState();
+ const [pdfBlob, setPdfBlob] = useState();
+ const endReason = endChunk?.payload?.reason;
+
+ useEffect(() => {
+ if (content || embeddedContent) {
+ setRemoteContent(undefined);
+ return;
+ }
+
+ if (!resolvedUrl || data?.format === "pdf") {
+ setRemoteContent(undefined);
+ return;
+ }
+
+ setRemoteContent(getCachedReportText(resolvedUrl, serverId));
+ }, [content, data?.format, embeddedContent, resolvedUrl, serverId]);
+
+ useEffect(() => {
+ if (data?.format === "pdf") {
+ setRemoteContent(undefined);
+ setFetchError(undefined);
+ setIsFetching(false);
+ return;
+ }
+
+ if (content || embeddedContent || !resolvedUrl) {
+ setRemoteContent(undefined);
+ setFetchError(undefined);
+ setIsFetching(false);
+ return;
+ }
+
+ const cachedContent = getCachedReportText(resolvedUrl, serverId);
+ if (cachedContent) {
+ setRemoteContent(cachedContent);
+ setFetchError(undefined);
+ setIsFetching(false);
+ return;
+ }
+
+ let cancelled = false;
+ setIsFetching(true);
+ setFetchError(undefined);
+
+ (async () => {
+ try {
+ const text = await fetchReportText(resolvedUrl, serverId);
+ if (cancelled) return;
+
+ setRemoteContent(text);
+ } catch (e) {
+ if (cancelled) return;
+ console.error("fetch research report failed", e);
+ setFetchError(e instanceof Error ? e.message : String(e));
+ } finally {
+ if (!cancelled) setIsFetching(false);
+ }
+ })();
+
+ return () => {
+ cancelled = true;
+ };
+ }, [content, data?.format, embeddedContent, endpointHttp, resolvedUrl, serverId]);
+
+ useEffect(() => {
+ if (data?.format !== "pdf" || !resolvedUrl) {
+ setPdfBlob(undefined);
+ return;
+ }
+
+ const cachedBlob = getCachedReportBlob(resolvedUrl, serverId);
+ if (cachedBlob) {
+ setPdfBlob(cachedBlob);
+ setFetchError(undefined);
+ setIsFetching(false);
+ return;
+ }
+
+ let cancelled = false;
+ setIsFetching(true);
+ setFetchError(undefined);
+
+ (async () => {
+ try {
+ const blob = await fetchReportBlob(resolvedUrl, serverId);
+ if (cancelled) return;
+
+ setPdfBlob(blob);
+ } catch (e) {
+ if (cancelled) return;
+ console.error("fetch research report pdf failed", e);
+ setFetchError(e instanceof Error ? e.message : String(e));
+ } finally {
+ if (!cancelled) setIsFetching(false);
+ }
+ })();
+
+ return () => {
+ cancelled = true;
+ };
+ }, [data?.format, endpointHttp, resolvedUrl, serverId]);
+
+ const reportContent = content || embeddedContent || remoteContent;
+ const htmlContent = useMemo(
+ () =>
+ data?.format === "html" && reportContent
+ ? injectBaseTag(reportContent, resolvedUrl)
+ : reportContent,
+ [data?.format, reportContent, resolvedUrl]
+ );
+
+ if (!content && !data && endReason === "user_cancelled") {
+ return (
+ ();
+
+ for (const hit of hits) {
+ if (!hit || typeof hit !== "object") continue;
+ const title = typeof hit.title === "string" ? hit.title : "";
+ if (!title) continue;
+
+ if (!uniqueHitsMap.has(title)) {
+ uniqueHitsMap.set(title, hit);
+ }
+ }
+
+ return Array.from(uniqueHitsMap.values());
+ }, [hits]);
+
+ if (records.length === 0) {
+ return null;
+ }
+
+ return (
+ >(
+ new Set()
+ );
+ const [plansExpanded, setPlansExpanded] = useState(false);
+
+ const toggleSearch = (searchId: string) => {
+ setExpandedSearches((prev) => {
+ const next = new Set(prev);
+ if (next.has(searchId)) {
+ next.delete(searchId);
+ } else {
+ next.add(searchId);
+ }
+ return next;
+ });
+ };
+
+ const firstActiveIndex = data.findIndex((step) => step.status !== "pending");
+
+ const lastActiveIndex = data.reduce(
+ (lastIndex, step, index) => (step.status !== "pending" ? index : lastIndex),
+ -1
+ );
+
+ const autoExecutionStatus: StepStatus = (() => {
+ if (!data.length) return "pending";
+ if (data.some((step) => step.status === "in_progress")) {
+ return "in_progress";
+ }
+ if (data.every((step) => step.status === "done")) {
+ return "done";
+ }
+ if (data.some((step) => step.status === "done")) {
+ return "in_progress";
+ }
+ return "pending";
+ })();
+
+ const planner = plannerStatus ?? (data.length ? "done" : "pending");
+ const execution = executionStatus ?? autoExecutionStatus;
+ const report = reportStatus ?? "pending";
+
+ return (
+ (nanoid());
+
+ // 合并历史持久化 chunks（detail.payload）与实时流式 chunks（ChunkData）
+ const allChunks = useMemo(() => {
+ const saved = detail?.payload ?? [];
+ if (ChunkData.length > 0) return ChunkData;
+ return saved;
+ }, [detail?.payload, ChunkData]);
+
+ const state = useMemo(
+ () => deriveDeepResearchState(allChunks),
+ [allChunks]
+ );
+
+ const {
+ deepResearchPlans,
+ deepResearchCurrentStepIndex,
+ deepResearchQuery,
+ deepResearchResultCount,
+ deepResearchResearcherStarted,
+ deepResearchReporterStarted,
+ deepResearchReporterFinished,
+ deepResearchReportData,
+ } = state;
+
+ const hasDeepResearchPlan =
+ deepResearchPlans.length > 0 &&
+ deepResearchCurrentStepIndex >= 0 &&
+ deepResearchCurrentStepIndex < deepResearchPlans.length;
+
+ const stepTitle = hasDeepResearchPlan
+ ? deepResearchPlans[deepResearchCurrentStepIndex]
+ : "";
+ const isCancelled = endChunk?.payload?.reason === "user_cancelled";
+ const isError = endChunk?.payload?.reason === "error";
+ const isTimeout = endChunk?.payload?.reason === "timeout";
+ const mergedPayload = useMemo(
+ () => normalizeResearchReportData(payload) || deepResearchReportData,
+ [deepResearchReportData, payload]
+ );
+ const hasReportData = !!(
+ mergedPayload?.url ||
+ mergedPayload?.attachment ||
+ mergedPayload?.content
+ );
+ const isCompleted =
+ !isCancelled &&
+ !isError &&
+ !isTimeout &&
+ (endChunk?.payload?.reason === "completed" ||
+ deepResearchReporterFinished ||
+ hasReportData);
+ const isEnd = isCompleted || isCancelled || isError || isTimeout;
+ const isReportPhase =
+ deepResearchReporterStarted || deepResearchReporterFinished || hasReportData;
+ const isExecutionPhase =
+ !isReportPhase && deepResearchResearcherStarted && hasDeepResearchPlan;
+ const cardHeaderTitle = isCompleted
+ ? t("deepResearch.status.reportHeader")
+ : isReportPhase
+ ? t("deepResearch.steps.reportTitle")
+ : isExecutionPhase
+ ? stepTitle
+ : deepResearchPlans.length > 0
+ ? t("deepResearch.steps.planTitle")
+ : "——";
+
+ const deepResearchPlanningProgress = deepResearchPlans.length > 0 ? 1 : 0;
+ const deepResearchExecutionProgress = hasDeepResearchPlan
+ ? (deepResearchCurrentStepIndex + 1) / deepResearchPlans.length
+ : 0;
+ const deepResearchReportProgress = deepResearchReporterFinished
+ ? 1
+ : deepResearchReporterStarted
+ ? 0.5
+ : 0;
+
+ const progress =
+ (deepResearchPlanningProgress +
+ deepResearchExecutionProgress +
+ deepResearchReportProgress) /
+ 3;
+
+ const statusText = useMemo(() => {
+ if (isCompleted) {
+ return mergedPayload?.title || t("deepResearch.status.completed");
+ }
+ if (deepResearchReporterStarted) {
+ return t("deepResearch.report.generatingTitle");
+ }
+ if (deepResearchResearcherStarted) {
+ return t("deepResearch.status.executingPlan");
+ }
+ if (deepResearchPlans.length > 0) {
+ return t("deepResearch.status.planningResearch");
+ }
+ return undefined;
+ }, [
+ isCompleted,
+ deepResearchReporterStarted,
+ deepResearchResearcherStarted,
+ deepResearchPlans.length,
+ mergedPayload,
+ t,
+ ]);
+
+ const normalizedProgress = useMemo(() => {
+ if (isCompleted) return 1;
+ if (typeof progress !== "number" || Number.isNaN(progress)) return 0;
+ if (progress < 0) return 0;
+ if (progress > 1) return 1;
+ return progress;
+ }, [isCompleted, progress]);
+
+ const displayStatus = useMemo(() => {
+ if (statusText) return statusText;
+ if (normalizedProgress >= 1) {
+ if (typeof deepResearchResultCount === "number") {
+ return t("deepResearch.status.completedWithCount", {
+ count: deepResearchResultCount,
+ });
+ }
+ return t("deepResearch.status.completed");
+ }
+ if (normalizedProgress > 0) {
+ return t("deepResearch.status.running");
+ }
+ return t("deepResearch.status.preparing");
+ }, [statusText, normalizedProgress, deepResearchResultCount, t]);
+
+ const viewKey = `${sessionId || "session"}:${messageId || instanceIdRef.current}`;
+
+ const createDetailPayload = (
+ defaultTab: DeepResearchTabKey
+ ): DeepResearchPanelPayload => {
+ const reportData =
+ mergedPayload && (mergedPayload.url || mergedPayload.attachment)
+ ? {
+ ...mergedPayload,
+ url: resolveReportUrl(
+ mergedPayload.url || mergedPayload.attachment,
+ formatUrl
+ ),
+ }
+ : mergedPayload;
+
+ return {
+ viewKey,
+ chunks: allChunks,
+ defaultTab,
+ reportData,
+ endChunk,
+ question,
+ theme,
+ language: i18n.resolvedLanguage || i18n.language,
+ serverId,
+ };
+ };
+
+ useEffect(() => {
+ if (activeDetailViewKey !== viewKey) return;
+ onUpdateDetail?.(createDetailPayload(isCompleted ? "report" : "steps"));
+ }, [allChunks, endChunk, mergedPayload, activeDetailViewKey, viewKey]);
+
+ const openDetailWindow = (tab: DeepResearchTabKey) => {
+ onOpenDetail?.(createDetailPayload(tab));
+ };
+
+ if (!allChunks.length) {
+ return null;
+ }
+
+ return (
+ <>
+
);
diff --git a/src/components/ChatMessage/index.tsx b/src/components/ChatMessage/index.tsx
index 823f4fb3..05e3d771 100644
--- a/src/components/ChatMessage/index.tsx
+++ b/src/components/ChatMessage/index.tsx
@@ -1,4 +1,4 @@
-import { memo, useState, useEffect } from "react";
+import { memo, useState, useEffect, useMemo } from "react";
import { useTranslation } from "react-i18next";
import clsx from "clsx";
@@ -14,8 +14,12 @@ import { MessageActions } from "./MessageActions";
import Markdown from "./Markdown";
import { SuggestionList } from "./SuggestionList";
import { UserMessage } from "./UserMessage";
+import { DeepResearch } from "./DeepResearch";
import { useConnectStore } from "@/stores/connectStore";
+import { useThemeStore } from "@/stores/themeStore";
import FontIcon from "@/components/Common/Icons/FontIcon";
+import type { DeepResearchPanelPayload } from "./DeepResearch/DeepResearchPanel";
+import { parseReplyEndPayload } from "./DeepResearch/payload";
interface ChatMessageProps {
message: Message;
@@ -27,7 +31,10 @@ interface ChatMessageProps {
deep_read?: IChunkData;
think?: IChunkData;
response?: IChunkData;
+ deepResearch?: IChunkData[];
+ replyEnd?: IChunkData[];
onResend?: (value: string) => void;
+ onCancel?: () => void;
loadingStep?: Record
+
{uploadAttachments.length > 0 && (
diff --git a/src/components/ChatMessage/DeepResearch/DeepResearchCancelDialog.tsx b/src/components/ChatMessage/DeepResearch/DeepResearchCancelDialog.tsx
new file mode 100644
index 00000000..6721eb00
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/DeepResearchCancelDialog.tsx
@@ -0,0 +1,88 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { type TFunction } from "i18next";
+import { X } from "lucide-react";
+
+import { Button } from "@/components/ui/button";
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog";
+
+interface DeepResearchCancelDialogProps {
+ open: boolean;
+ onOpenChange: (open: boolean) => void;
+ onConfirm?: () => void;
+ t?: TFunction;
+}
+
+export function DeepResearchCancelDialog({
+ open,
+ onOpenChange,
+ onConfirm,
+ t: tProp,
+}: DeepResearchCancelDialogProps) {
+ const [portalContainer, setPortalContainer] = useState
+ {(!activeChat || activeChat?.messages?.length === 0) &&
+ !visibleStartPage && {
+ setDeepResearchPanel((current) => {
+ return current?.viewKey === payload.viewKey
+ ? payload
+ : current;
+ });
+ }}
+ />
+ ))}
- {(!curChatEnd ||
- query_intent ||
- tools ||
- fetch_source ||
- pick_source ||
- deep_read ||
- think ||
- response) &&
- activeChat?._source?.id ? (
- {
+ setDeepResearchPanel((current) => {
+ return current?.viewKey === payload.viewKey
+ ? payload
+ : current;
+ });
+ }}
+ />
+ ) : null}
- {timedoutShow ? (
-
+
+ {deepResearchPanel && (
+
+
+ )}
+ {portalContainer && (
+
+ )}
+
+ );
+}
diff --git a/src/components/ChatMessage/DeepResearch/DeepResearchLoadingState.tsx b/src/components/ChatMessage/DeepResearch/DeepResearchLoadingState.tsx
new file mode 100644
index 00000000..fa2fb71e
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/DeepResearchLoadingState.tsx
@@ -0,0 +1,27 @@
+import loadingSvg from "./loading.svg";
+import loadFailedSvg from "./load-failed.svg";
+
+interface DeepResearchLoadingStateProps {
+ label: string;
+ variant?: "loading" | "failed";
+}
+
+export const DeepResearchLoadingState = ({
+ label,
+ variant = "loading",
+}: DeepResearchLoadingStateProps) => {
+ const imageSrc = variant === "failed" ? loadFailedSvg : loadingSvg;
+
+ return (
+
+ 
+
+ );
+};
diff --git a/src/components/ChatMessage/DeepResearch/DeepResearchPanel.tsx b/src/components/ChatMessage/DeepResearch/DeepResearchPanel.tsx
new file mode 100644
index 00000000..99b8e43d
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/DeepResearchPanel.tsx
@@ -0,0 +1,414 @@
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Download, X } from "lucide-react";
+import clsx from "clsx";
+
+import { Post } from "@/api/axiosRequest";
+import type { IChunkData } from "@/types/chat";
+import { useAppStore } from "@/stores/appStore";
+import platformAdapter from "@/utils/platformAdapter";
+import { ResearchReportContent } from "./ResearchReportContent";
+import { ResearchSearchResultsContent } from "./ResearchSearchResultsContent";
+import { ResearchStepsContent } from "./ResearchStepsContent";
+import { fetchReportBlob, fetchReportText, toServerPath } from "./reportContent";
+import {
+ buildSearchHits,
+ buildStatuses,
+ buildSteps,
+ deriveDeepResearchState,
+} from "./deriveState";
+import { normalizeResearchReportData } from "./payload";
+import { resolveReportUrl } from "./resolveReportUrl";
+import type {
+ DeepResearchEndChunk,
+ ResearchReportData,
+ StepItem,
+ StepSearchHit,
+} from "./types";
+
+export type DeepResearchTabKey = "report" | "steps" | "searchResults";
+
+export interface DeepResearchPanelPayload {
+ viewKey: string;
+ chunks: IChunkData[];
+ defaultTab: DeepResearchTabKey;
+ reportData?: ResearchReportData;
+ serverId?: string;
+ endChunk?: DeepResearchEndChunk;
+ question?: string;
+ theme?: "light" | "dark";
+ language?: string;
+}
+
+export interface DeepResearchViewData {
+ steps: StepItem[];
+ searchHits: StepSearchHit[];
+ reportData?: ResearchReportData;
+ serverId?: string;
+ endChunk?: DeepResearchEndChunk;
+ question?: string;
+ isEnd: boolean;
+ plannerStatus: ReturnType
+ {label}
+
+
+
+ );
+}
diff --git a/src/components/ChatMessage/DeepResearch/PdfReportViewer.tsx b/src/components/ChatMessage/DeepResearch/PdfReportViewer.tsx
new file mode 100644
index 00000000..b42d66f3
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/PdfReportViewer.tsx
@@ -0,0 +1,75 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import { Document, Page, pdfjs } from "react-pdf";
+import "react-pdf/dist/Page/AnnotationLayer.css";
+import "react-pdf/dist/Page/TextLayer.css";
+
+pdfjs.GlobalWorkerOptions.workerSrc = `https://unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;
+
+interface PdfReportViewerProps {
+ blob: Blob;
+}
+
+export function PdfReportViewer({ blob }: PdfReportViewerProps) {
+ const containerRef = useRef
+
+
+
+
+
+ {tabs.map((tab) => (
+
+ ))}
+
+
+
+ {activeTab === "report" && reportUrl && (
+
+ )}
+ {onClose && (
+
+ )}
+
+
+ {mountedTabs.report && (
+
+
+
+ )}
+ {mountedTabs.steps && (
+
+
+ )}
+ {mountedTabs.searchResults && (
+
+
+ )}
+
+
+ );
+}
diff --git a/src/components/ChatMessage/DeepResearch/ResearchReportContent.tsx b/src/components/ChatMessage/DeepResearch/ResearchReportContent.tsx
new file mode 100644
index 00000000..e0b9dbb2
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/ResearchReportContent.tsx
@@ -0,0 +1,234 @@
+import {
+ memo,
+ useEffect,
+ useMemo,
+ useState,
+} from "react";
+import { useTranslation } from "react-i18next";
+import { type TFunction } from "i18next";
+
+import Markdown from "@/components/ChatMessage/Markdown";
+import { useAppStore } from "@/stores/appStore";
+import { useConnectStore } from "@/stores/connectStore";
+import { DeepResearchLoadingState } from "./DeepResearchLoadingState";
+import type { DeepResearchEndChunk, ResearchReportData } from "./types";
+import { PdfReportViewer } from "./PdfReportViewer";
+import { resolveReportUrl } from "./resolveReportUrl";
+import {
+ fetchReportBlob,
+ fetchReportText,
+ getCachedReportBlob,
+ getCachedReportText,
+ injectBaseTag,
+} from "./reportContent";
+
+export interface ResearchReportContentProps {
+ /** 已抓取的报告正文（markdown 或 html 文本）。优先于 data.url 渲染。 */
+ content?: string;
+ data?: ResearchReportData;
+ endChunk?: DeepResearchEndChunk;
+ serverId?: string;
+ formatUrl?: (data: any) => string;
+ t?: TFunction;
+}
+
+/**
+ * 「报告」tab：渲染最终研究报告。
+ * - html 格式 → iframe
+ * - markdown 格式 → App Markdown（content 由窗口页抓取后传入）
+ */
+const ResearchReportContentComponent = ({
+ content,
+ data,
+ endChunk,
+ serverId: serverIdProp,
+ formatUrl,
+ t: tProp,
+}: ResearchReportContentProps) => {
+ const { t: tOriginal } = useTranslation();
+ const t = tProp || tOriginal;
+ const currentServiceId = useConnectStore((state) => state.currentService?.id);
+ const cloudServiceId = useConnectStore((state) => state.cloudSelectService?.id);
+ const serverId = serverIdProp || currentServiceId || cloudServiceId;
+ const endpointHttp = useAppStore((state) => state.endpoint_http);
+ const resolvedUrl = resolveReportUrl(data?.url || data?.attachment, formatUrl);
+ const embeddedContent = data?.content;
+ const [remoteContent, setRemoteContent] = useState
+ {
+ setNumPages(pdf.numPages);
+ }}
+ onLoadError={(error) => {
+ console.error("load pdf document failed", error);
+ }}
+ className="flex w-full flex-col items-center gap-6"
+ >
+ {Array.from({ length: numPages }, (_, index) => (
+
+
+
+ {data?.format === "pdf" && pdfBlob &&
+ );
+};
+
+export const ResearchReportContent = memo(ResearchReportContentComponent);
diff --git a/src/components/ChatMessage/DeepResearch/ResearchSearchResultsContent.tsx b/src/components/ChatMessage/DeepResearch/ResearchSearchResultsContent.tsx
new file mode 100644
index 00000000..757a10b4
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/ResearchSearchResultsContent.tsx
@@ -0,0 +1,77 @@
+import { useMemo } from "react";
+import { SquareArrowOutUpRight } from "lucide-react";
+
+import platformAdapter from "@/utils/platformAdapter";
+import type { StepSearchHit } from "./types";
+
+interface ResearchSearchResultsContentProps {
+ hits?: StepSearchHit[];
+ theme?: "light" | "dark";
+}
+
+/**
+ * 「搜索结果」tab：按 title 去重后，平铺展示所有步骤的搜索命中。
+ * App 没有统一的 SearchResults 组件，这里复用聊天内搜索卡片的轻量样式自建列表。
+ */
+export const ResearchSearchResultsContent = ({
+ hits,
+}: ResearchSearchResultsContentProps) => {
+ const records = useMemo(() => {
+ if (!hits || !Array.isArray(hits)) return [];
+
+ const uniqueHitsMap = new Map
+
+ ))}
+
+ {!reportContent && !pdfBlob && isFetching && (
+
+ {records.map((hit, idx) => (
+
+ );
+};
diff --git a/src/components/ChatMessage/DeepResearch/ResearchStepsContent.tsx b/src/components/ChatMessage/DeepResearch/ResearchStepsContent.tsx
new file mode 100644
index 00000000..b7e8c173
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/ResearchStepsContent.tsx
@@ -0,0 +1,380 @@
+import {
+ Search,
+ FileText,
+ ChevronDown,
+ BookOpen,
+ List,
+ ChevronUp,
+ Hourglass,
+ Check,
+ SquarePen,
+ SquareArrowOutUpRight,
+} from "lucide-react";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { type TFunction } from "i18next";
+
+import platformAdapter from "@/utils/platformAdapter";
+import type { StepItem, StepStatus } from "./types";
+
+interface ResearchStepsContentProps {
+ steps?: StepItem[];
+ plannerStatus?: StepStatus;
+ executionStatus?: StepStatus;
+ reportStatus?: StepStatus;
+ isEnd?: boolean;
+ t?: TFunction;
+}
+
+/**
+ * 深度研究步骤内容组件
+ * 展示研究计划、执行步骤和报告生成的全过程状态
+ */
+export const ResearchStepsContent = ({
+ steps,
+ plannerStatus,
+ executionStatus,
+ reportStatus,
+ isEnd,
+ t: tProp,
+}: ResearchStepsContentProps) => {
+ const { t: tOriginal } = useTranslation();
+ const t = tProp || tOriginal;
+ const data = steps ?? [];
+ const [expandedSearches, setExpandedSearches] = useState {
+ if (typeof hit.url === "string") {
+ platformAdapter.openUrl(hit.url);
+ }
+ }}
+ >
+
+ ))}
+
+
+
+
+ {hit.url && (
+
+ {hit.title}
+
+ {hit.content && (
+
+ {hit.content}
+
+ )}
+ {hit.source && (
+
+ {hit.source}
+
+ )}
+
+
+ );
+};
diff --git a/src/components/ChatMessage/DeepResearch/deriveState.ts b/src/components/ChatMessage/DeepResearch/deriveState.ts
new file mode 100644
index 00000000..d011c9a2
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/deriveState.ts
@@ -0,0 +1,292 @@
+import type { IChunkData } from "@/types/chat";
+import type {
+ DeepResearchState,
+ StepItem,
+ StepStatus,
+ StepSearch,
+ StepSearchStatus,
+ StepSearchHit,
+} from "./types";
+import { normalizeResearchReportData, parseMaybeJson } from "./payload";
+
+/**
+ * 从原始 chunk 数组派生深度研究展示状态。
+ * 与 coco-server 的 deriveDeepResearchState 保持完全一致的逻辑，
+ * 供聊天内卡片与独立详情窗口共用。
+ */
+export const deriveDeepResearchState = (
+ chunks: IChunkData[]
+): DeepResearchState => {
+ const state: DeepResearchState = {
+ deepResearchPlans: [],
+ deepResearchCurrentStepIndex: -1,
+ deepResearchCurrentStepFinished: false,
+ deepResearchQuery: "",
+ deepResearchResultCount: undefined,
+ deepResearchPlannerStarted: false,
+ deepResearchResearcherStarted: false,
+ deepResearchReporterStarted: false,
+ deepResearchReporterFinished: false,
+ deepResearchReportData: undefined,
+ deepResearchSearchMap: {},
+ };
+
+ chunks.forEach((chunkData) => {
+ if (chunkData.chunk_type === "research_planner_start") {
+ state.deepResearchPlans = [];
+ state.deepResearchCurrentStepIndex = -1;
+ state.deepResearchCurrentStepFinished = false;
+ state.deepResearchQuery = "";
+ state.deepResearchResultCount = undefined;
+ state.deepResearchPlannerStarted = true;
+ state.deepResearchResearcherStarted = false;
+ state.deepResearchReporterStarted = false;
+ state.deepResearchReporterFinished = false;
+ state.deepResearchReportData = undefined;
+ state.deepResearchSearchMap = {};
+ return;
+ }
+
+ if (chunkData.chunk_type === "research_planner_end") {
+ if (typeof chunkData.message_chunk === "string") {
+ try {
+ const payload = parseMaybeJson(chunkData.message_chunk) as any;
+ if (Array.isArray(payload)) {
+ const plans = payload.map((item) => String(item));
+ state.deepResearchPlans = plans;
+ state.deepResearchCurrentStepIndex = plans.length > 0 ? 0 : -1;
+ }
+ state.deepResearchPlannerStarted = false;
+ } catch (error) {
+ console.error(error);
+ }
+ }
+ return;
+ }
+
+ if (chunkData.chunk_type === "research_researcher_start") {
+ if (
+ typeof chunkData.message_chunk === "string" &&
+ chunkData.message_chunk
+ ) {
+ try {
+ const payload = parseMaybeJson(chunkData.message_chunk) as any;
+ const planText =
+ typeof payload?.plan === "string" ? payload.plan : "";
+ if (planText) {
+ state.deepResearchResearcherStarted = true;
+ state.deepResearchCurrentStepFinished = false;
+
+ let index = state.deepResearchPlans.findIndex(
+ (title) => title === planText
+ );
+
+ // If plan not found, add it to the list
+ if (index === -1) {
+ state.deepResearchPlans.push(planText);
+ index = state.deepResearchPlans.length - 1;
+ }
+
+ state.deepResearchCurrentStepIndex = index;
+ }
+ } catch (error) {
+ console.error(error);
+ }
+ }
+ return;
+ }
+
+ if (chunkData.chunk_type === "research_researcher_step_start") {
+ if (
+ typeof chunkData.message_chunk === "string" &&
+ chunkData.message_chunk
+ ) {
+ try {
+ const payload = parseMaybeJson(chunkData.message_chunk) as any;
+ const planText =
+ typeof payload?.plan === "string" ? payload.plan : "";
+ const stepQuery = payload?.step?.payload?.query;
+
+ // Ensure plan exists in state if not already
+ if (planText && !state.deepResearchPlans.includes(planText)) {
+ state.deepResearchPlans.push(planText);
+ if (state.deepResearchCurrentStepIndex === -1) {
+ state.deepResearchCurrentStepIndex =
+ state.deepResearchPlans.length - 1;
+ }
+ }
+
+ if (typeof stepQuery === "string") {
+ state.deepResearchQuery = stepQuery;
+ }
+ state.deepResearchResultCount = undefined;
+ if (planText && typeof stepQuery === "string") {
+ const prevInfo = state.deepResearchSearchMap[planText] ?? {};
+ state.deepResearchSearchMap[planText] = {
+ ...prevInfo,
+ query: stepQuery,
+ };
+ }
+ } catch (error) {
+ console.error(error);
+ }
+ }
+ return;
+ }
+
+ if (chunkData.chunk_type === "research_researcher_step_end") {
+ if (
+ typeof chunkData.message_chunk === "string" &&
+ chunkData.message_chunk
+ ) {
+ try {
+ const payload = parseMaybeJson(chunkData.message_chunk) as any;
+ const planText =
+ typeof payload?.plan === "string" ? payload.plan : "";
+ const hits = payload?.step?.payload?.hits;
+ if (Array.isArray(hits)) {
+ state.deepResearchResultCount = hits.length;
+ if (planText) {
+ const prevInfo = state.deepResearchSearchMap[planText] ?? {};
+ state.deepResearchSearchMap[planText] = {
+ ...prevInfo,
+ resultCount: hits.length,
+ hits: hits,
+ };
+ }
+ }
+ } catch (error) {
+ console.error(error);
+ }
+ }
+ return;
+ }
+
+ if (chunkData.chunk_type === "research_researcher_end") {
+ state.deepResearchQuery = "";
+ state.deepResearchCurrentStepFinished = true;
+ return;
+ }
+
+ if (chunkData.chunk_type === "research_reporter_start") {
+ state.deepResearchReporterStarted = true;
+ return;
+ }
+
+ if (chunkData.chunk_type === "research_reporter_end") {
+ state.deepResearchReporterStarted = true;
+ state.deepResearchReporterFinished = true;
+ if (
+ typeof chunkData.message_chunk === "string" &&
+ chunkData.message_chunk
+ ) {
+ try {
+ state.deepResearchReportData = normalizeResearchReportData(
+ chunkData.message_chunk
+ );
+ } catch (error) {
+ console.error(error);
+ }
+ }
+ }
+ });
+
+ return state;
+};
+
+/** 把派生状态转换成步骤列表（供「步骤」tab 渲染） */
+export const buildSteps = (state: DeepResearchState): StepItem[] => {
+ const {
+ deepResearchPlans,
+ deepResearchReporterFinished,
+ deepResearchReporterStarted,
+ deepResearchResearcherStarted,
+ deepResearchSearchMap,
+ deepResearchCurrentStepIndex,
+ deepResearchCurrentStepFinished,
+ } = state;
+
+ if (!deepResearchPlans.length) return [];
+
+ return deepResearchPlans.map((title, index) => {
+ let status: StepStatus = "pending";
+
+ if (deepResearchReporterFinished || deepResearchReporterStarted) {
+ status = "done";
+ } else if (deepResearchResearcherStarted) {
+ if (index < deepResearchCurrentStepIndex) {
+ status = "done";
+ } else if (index === deepResearchCurrentStepIndex) {
+ status = deepResearchCurrentStepFinished ? "done" : "in_progress";
+ }
+ }
+
+ const searchInfo = deepResearchSearchMap[title];
+ const searches: StepSearch[] | undefined = searchInfo?.query
+ ? [
+ {
+ id: `step-${index + 1}-search-1`,
+ query: searchInfo.query,
+ resultCount: searchInfo.resultCount,
+ status:
+ typeof searchInfo.resultCount === "number"
+ ? ("done" as StepSearchStatus)
+ : ("searching" as StepSearchStatus),
+ hits: searchInfo.hits,
+ },
+ ]
+ : undefined;
+
+ return {
+ id: `step-${index + 1}`,
+ title,
+ status,
+ searches,
+ showOptimizePlan: false,
+ };
+ });
+};
+
+/** 汇总所有步骤的搜索命中（供「搜索结果」tab 渲染） */
+export const buildSearchHits = (state: DeepResearchState): StepSearchHit[] => {
+ const allHits: StepSearchHit[] = [];
+ Object.values(state.deepResearchSearchMap).forEach((info) => {
+ if (info.hits && Array.isArray(info.hits)) {
+ allHits.push(...info.hits);
+ }
+ });
+ return allHits;
+};
+
+/** 三阶段状态（规划 / 执行 / 报告），供「步骤」tab 头部图标渲染 */
+export const buildStatuses = (
+ state: DeepResearchState,
+ steps: StepItem[]
+): {
+ plannerStatus: StepStatus;
+ executionStatus: StepStatus;
+ reportStatus: StepStatus;
+} => {
+ const reportStatus: StepStatus = state.deepResearchReporterFinished
+ ? "done"
+ : state.deepResearchReporterStarted
+ ? "in_progress"
+ : "pending";
+
+ const plannerStatus: StepStatus = state.deepResearchPlans.length
+ ? "done"
+ : state.deepResearchPlannerStarted
+ ? "in_progress"
+ : "pending";
+
+ let executionStatus: StepStatus = "pending";
+ if (steps.length) {
+ if (steps.some((step) => step.status === "in_progress")) {
+ executionStatus = "in_progress";
+ } else if (steps.some((step) => step.status === "done")) {
+ executionStatus = "done";
+ }
+ }
+
+ return { plannerStatus, executionStatus, reportStatus };
+};
diff --git a/src/components/ChatMessage/DeepResearch/index.tsx b/src/components/ChatMessage/DeepResearch/index.tsx
new file mode 100644
index 00000000..1a1cfb65
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/index.tsx
@@ -0,0 +1,363 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { type TFunction } from "i18next";
+import { Hourglass, BookOpen, Search, Square, Ban, Check, X } from "lucide-react";
+import { nanoid } from "nanoid";
+
+import type { IChunkData } from "@/types/chat";
+import { useConnectStore } from "@/stores/connectStore";
+import { deriveDeepResearchState } from "./deriveState";
+import { normalizeResearchReportData } from "./payload";
+import type { DeepResearchEndChunk, ResearchReportData } from "./types";
+import { resolveReportUrl } from "./resolveReportUrl";
+import { DeepResearchCancelDialog } from "./DeepResearchCancelDialog";
+import type {
+ DeepResearchPanelPayload,
+ DeepResearchTabKey,
+} from "./DeepResearchPanel";
+
+export interface DeepResearchProps {
+ detail?: { type: string; payload?: IChunkData[] };
+ endChunk?: DeepResearchEndChunk;
+ ChunkData?: IChunkData[];
+ question?: string;
+ formatUrl?: (data: any) => string;
+ theme?: "light" | "dark";
+ t?: TFunction;
+ payload?: ResearchReportData;
+ onCancel?: () => void;
+ /** 用于独立详情窗口回拉历史的兜底参数 */
+ sessionId?: string;
+ messageId?: string;
+ activeDetailViewKey?: string;
+ onOpenDetail?: (payload: DeepResearchPanelPayload) => void;
+ onUpdateDetail?: (payload: DeepResearchPanelPayload) => void;
+ onRequestCancel?: () => void;
+}
+
+export const DeepResearch = ({
+ detail,
+ endChunk,
+ ChunkData = [],
+ question,
+ formatUrl,
+ theme,
+ t: tProp,
+ payload,
+ onCancel,
+ sessionId,
+ messageId,
+ activeDetailViewKey,
+ onOpenDetail,
+ onUpdateDetail,
+ onRequestCancel,
+}: DeepResearchProps) => {
+ const { t: tOriginal, i18n } = useTranslation();
+ const t = tProp || tOriginal;
+ const serverId = useConnectStore((state) => state.currentService?.id);
+ const [cancelDialogOpen, setCancelDialogOpen] = useState(false);
+
+ // 本卡片实例的唯一标识，用于判断当前是否由“我”掌控详情窗
+ const instanceIdRef = useRef
+ {t("deepResearch.steps.intro")}
+
+
+ {/* 计划生成阶段 */}
+
+
+
+ {/* 执行阶段 */}
+
+ {planner === "in_progress" ? (
+
+
+ {t("deepResearch.steps.planDescription")}
+
+
+ {/* 计划列表展开开关 */}
+ setPlansExpanded((prev) => !prev)}
+ >
+
+
+ {/* 计划列表详情 */}
+ {plansExpanded && data.length > 0 && (
+
+
+ {plansExpanded ? (
+
+ {data.map((step, index) => (
+
+ )}
+
+
+ {index + 1}.
+
+
+ {step.title}
+
+
+ ))}
+
+
+
+
+
+ {/* 步骤列表渲染 */}
+ {data.map((step, index) => {
+ const isActive = step.status !== "pending";
+ const isFirstActive = index === firstActiveIndex;
+ const isLastActive = index === lastActiveIndex;
+
+ const isSimplePending = step.status === "pending" && !step.searches;
+
+ return (
+
+ {/* 步骤之间的连接虚线 */}
+ {isActive &&
+ firstActiveIndex !== -1 &&
+ lastActiveIndex !== -1 && (
+
+ )}
+
+ {/* 完成状态图标 */}
+ {step.status === "done" && (
+
+
+ );
+ })}
+
+ {/* 报告生成阶段 */}
+
+
+ ) : (
+ <>
+ {/* 步骤标题 */}
+
+ {step.title}
+
+ + {step.title} +
+ + {/* 步骤描述 */} + {step.description && ( ++ {step.description} +
+ )} + + {/* 搜索任务列表 */} + {step.searches && ( +
+ {step.searches.map((search) =>
+ search.status === "searching" ? (
+ // 正在搜索状态
+
+ )}
+
+ )}
+
+
+ ) : (
+ // 搜索完成状态
+
+
+
+
+ )
+ )}
+
+ {/* 优化计划提示 */}
+ {step.showOptimizePlan && (
+ toggleSearch(search.id)}
+ >
+
+
+ {/* 展开的搜索结果详情 */}
+ {expandedSearches.has(search.id) && search.hits && (
+
+
+ {typeof search.resultCount === "number" && (
+
+
+ )}
+
+ {search.resultCount}
+
+ {expandedSearches.has(search.id) ? (
+
+ {search.hits.map((hit, idx) => (
+
+ )}
+
+ {search.note && (
+ {
+ if (typeof hit.url === "string") {
+ platformAdapter.openUrl(hit.url);
+ }
+ }}
+ >
+
+ ))}
+
+
+
+
+ {hit.url && (
+
+ {hit.title}
+
+ {hit.content && (
+
+ {hit.content}
+
+ )}
+ + {search.note} +
+ )} +
+
+ )}
+
+
+
+
+
+ {report === "in_progress" ? (
+
+ {
+ void openDetailWindow(isCompleted ? "report" : "steps");
+ }}
+ >
+ ;
+
+const isRecord = (value: unknown): value is RecordValue => {
+ return typeof value === "object" && value !== null && !Array.isArray(value);
+};
+
+export const parseMaybeJson = (value: unknown): unknown => {
+ let parsed = value;
+
+ for (let index = 0; index < 2; index += 1) {
+ if (typeof parsed !== "string") return parsed;
+
+ const text = parsed.trim();
+ if (!text) return undefined;
+
+ try {
+ parsed = JSON.parse(text);
+ } catch {
+ return parsed;
+ }
+ }
+
+ return parsed;
+};
+
+const getNestedRecord = (value: RecordValue, key: string) => {
+ const nested = value[key];
+ const parsed = parseMaybeJson(nested);
+ return isRecord(parsed) ? parsed : undefined;
+};
+
+const looksLikeReportData = (value: RecordValue) => {
+ return (
+ typeof value.url === "string" ||
+ typeof value.attachment === "string" ||
+ typeof value.content === "string" ||
+ typeof value.title === "string"
+ );
+};
+
+export const normalizeResearchReportData = (
+ value: unknown
+): ResearchReportData | undefined => {
+ const parsed = parseMaybeJson(value);
+
+ if (typeof parsed === "string") {
+ const text = parsed.trim();
+ if (!text) return undefined;
+
+ if (/^(https?:\/\/|\/|files?\/|attachments?\/)/i.test(text)) {
+ return { url: text };
+ }
+
+ return undefined;
+ }
+
+ if (!isRecord(parsed)) return undefined;
+
+ const candidates = [
+ parsed,
+ getNestedRecord(parsed, "payload"),
+ getNestedRecord(parsed, "data"),
+ getNestedRecord(parsed, "result"),
+ getNestedRecord(parsed, "report"),
+ getNestedRecord(parsed, "report_data"),
+ ].filter((item): item is RecordValue => Boolean(item));
+
+ const report = candidates.find(looksLikeReportData);
+ if (!report) return undefined;
+
+ const url =
+ typeof report.url === "string"
+ ? report.url
+ : typeof report.attachment === "string"
+ ? report.attachment
+ : undefined;
+
+ return {
+ ...report,
+ title: typeof report.title === "string" ? report.title : undefined,
+ url,
+ created: typeof report.created === "string" ? report.created : undefined,
+ attachment:
+ typeof report.attachment === "string" ? report.attachment : undefined,
+ format: typeof report.format === "string" ? report.format : undefined,
+ content: typeof report.content === "string" ? report.content : undefined,
+ };
+};
+
+export const parseReplyEndPayload = (
+ value: unknown
+): DeepResearchEndChunk["payload"] | undefined => {
+ const parsed = parseMaybeJson(value);
+
+ if (isRecord(parsed)) {
+ const payload = isRecord(parsed.payload) ? parsed.payload : parsed;
+ const reason = payload.reason;
+
+ return {
+ ...payload,
+ reason:
+ reason === "completed" ||
+ reason === "user_cancelled" ||
+ reason === "error" ||
+ reason === "timeout"
+ ? reason
+ : undefined,
+ };
+ }
+
+ if (typeof parsed !== "string") return undefined;
+
+ const text = parsed.trim().toLowerCase();
+ if (!text) return undefined;
+ if (text.includes("cancel")) return { reason: "user_cancelled" };
+ if (text.includes("timeout")) return { reason: "timeout" };
+ if (text.includes("error") || text.includes("failed")) {
+ return { reason: "error", error: parsed };
+ }
+ if (text.includes("completed") || text.includes("complete")) {
+ return { reason: "completed" };
+ }
+
+ return undefined;
+};
diff --git a/src/components/ChatMessage/DeepResearch/reportContent.ts b/src/components/ChatMessage/DeepResearch/reportContent.ts
new file mode 100644
index 00000000..14acbd44
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/reportContent.ts
@@ -0,0 +1,291 @@
+import platformAdapter from "@/utils/platformAdapter";
+
+const DEFAULT_REPORT_FETCH_TIMEOUT_MS = 45_000;
+const MAX_REPORT_CACHE_SIZE = 20;
+
+interface ReportTextCacheEntry {
+ promise?: Promise;
+ text?: string;
+}
+
+interface ReportBlobCacheEntry {
+ promise?: Promise;
+ blob?: Blob;
+}
+
+const reportTextCache = new Map();
+const reportBlobCache = new Map();
+
+const buildReportCacheKey = (url: string, serverId?: string) => {
+ return `${serverId || "browser"}:${url}`;
+};
+
+const rememberReportText = (key: string, entry: ReportTextCacheEntry) => {
+ if (reportTextCache.has(key)) {
+ reportTextCache.delete(key);
+ }
+ reportTextCache.set(key, entry);
+
+ while (reportTextCache.size > MAX_REPORT_CACHE_SIZE) {
+ const oldestKey = reportTextCache.keys().next().value;
+ if (!oldestKey) break;
+ reportTextCache.delete(oldestKey);
+ }
+};
+
+const withTimeout = async (
+ promise: Promise,
+ timeoutMs: number
+): Promise => {
+ let timeoutId: ReturnType | undefined;
+
+ try {
+ return await Promise.race([
+ promise,
+ new Promise((_, reject) => {
+ timeoutId = setTimeout(() => {
+ reject(new Error("Request timed out"));
+ }, timeoutMs);
+ }),
+ ]);
+ } finally {
+ if (timeoutId) {
+ clearTimeout(timeoutId);
+ }
+ }
+};
+
+const readRequestHeaders = () => {
+ try {
+ return JSON.parse(localStorage.getItem("headers") || "{}");
+ } catch (e) {
+ return {};
+ }
+};
+
+export const injectBaseTag = (html: string, url?: string) => {
+ if (!url) return html;
+
+ const base = `]*>/i.test(html)) {
+ return html.replace(/]*)>/i, `${base}`);
+ }
+ return `${base}${html}`;
+};
+
+export const toServerPath = (url: string) => {
+ try {
+ if (/^[a-z][a-z\d+\-.]*:/i.test(url)) {
+ const parsed = new URL(url);
+ return `${parsed.pathname}${parsed.search}`;
+ }
+ } catch (e) {
+ // Fall through to relative path handling.
+ }
+
+ return url.startsWith("/") ? url : `/${url}`;
+};
+
+export const getCachedReportText = (url: string, serverId?: string) => {
+ const key = buildReportCacheKey(url, serverId);
+ const entry = reportTextCache.get(key);
+ if (!entry?.text) return undefined;
+
+ rememberReportText(key, entry);
+ return entry.text;
+};
+
+const buildReportBlobCacheKey = (url: string, serverId?: string) => {
+ return buildReportCacheKey(url, serverId);
+};
+
+const rememberReportBlob = (key: string, entry: ReportBlobCacheEntry) => {
+ if (reportBlobCache.has(key)) {
+ reportBlobCache.delete(key);
+ }
+ reportBlobCache.set(key, entry);
+
+ while (reportBlobCache.size > MAX_REPORT_CACHE_SIZE) {
+ const oldestKey = reportBlobCache.keys().next().value;
+ if (!oldestKey) break;
+ reportBlobCache.delete(oldestKey);
+ }
+};
+
+export const getCachedReportBlob = (url: string, serverId?: string) => {
+ const key = buildReportBlobCacheKey(url, serverId);
+ const entry = reportBlobCache.get(key);
+ if (!entry?.blob) return undefined;
+
+ rememberReportBlob(key, entry);
+ return entry.blob;
+};
+
+const base64ToUint8Array = (base64: string) => {
+ const binary = window.atob(base64);
+ const bytes = new Uint8Array(binary.length);
+ for (let index = 0; index < binary.length; index += 1) {
+ bytes[index] = binary.charCodeAt(index);
+ }
+ return bytes;
+};
+
+const fetchReportBlobUncached = async (
+ url: string,
+ serverId?: string,
+ timeoutMs = DEFAULT_REPORT_FETCH_TIMEOUT_MS
+) => {
+ const headers = readRequestHeaders();
+
+ if (platformAdapter.isTauri() && serverId) {
+ const response = await withTimeout(
+ platformAdapter.commands<{ content_base64: string }>(
+ "fetch_attachment_binary",
+ {
+ serverId,
+ path: toServerPath(url),
+ }
+ ),
+ timeoutMs
+ );
+ return new Blob([base64ToUint8Array(response.content_base64)], {
+ type: "application/pdf",
+ });
+ }
+
+ const controller = new AbortController();
+ const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
+
+ let response: Response;
+ let buffer: ArrayBuffer;
+ try {
+ response = await window.fetch(url, {
+ credentials: "include",
+ headers,
+ signal: controller.signal,
+ });
+ buffer = await response.arrayBuffer();
+ } catch (e) {
+ if (e instanceof DOMException && e.name === "AbortError") {
+ throw new Error("Request timed out");
+ }
+ throw e;
+ } finally {
+ clearTimeout(timeoutId);
+ }
+
+ if (!response.ok) {
+ throw new Error(`Request failed (${response.status})`);
+ }
+
+ return new Blob([buffer], { type: response.headers.get("content-type") || "application/pdf" });
+};
+
+export const fetchReportBlob = async (
+ url: string,
+ serverId?: string,
+ timeoutMs = DEFAULT_REPORT_FETCH_TIMEOUT_MS
+) => {
+ const key = buildReportBlobCacheKey(url, serverId);
+ const cached = reportBlobCache.get(key);
+
+ if (cached?.blob) {
+ rememberReportBlob(key, cached);
+ return cached.blob;
+ }
+
+ if (cached?.promise) {
+ return cached.promise;
+ }
+
+ const promise = fetchReportBlobUncached(url, serverId, timeoutMs)
+ .then((blob) => {
+ rememberReportBlob(key, { blob });
+ return blob;
+ })
+ .catch((error) => {
+ reportBlobCache.delete(key);
+ throw error;
+ });
+
+ rememberReportBlob(key, { promise });
+ return promise;
+};
+
+const fetchReportTextUncached = async (
+ url: string,
+ serverId?: string,
+ timeoutMs = DEFAULT_REPORT_FETCH_TIMEOUT_MS
+) => {
+ const headers = readRequestHeaders();
+
+ if (platformAdapter.isTauri() && serverId) {
+ const response = await withTimeout(
+ platformAdapter.commands<{ content: string }>("fetch_attachment_text", {
+ serverId,
+ path: toServerPath(url),
+ }),
+ timeoutMs
+ );
+ return response.content;
+ }
+
+ const controller = new AbortController();
+ const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
+
+ let response: Response;
+ let text: string;
+ try {
+ response = await window.fetch(url, {
+ credentials: "include",
+ headers,
+ signal: controller.signal,
+ });
+ text = await response.text();
+ } catch (e) {
+ if (e instanceof DOMException && e.name === "AbortError") {
+ throw new Error("Request timed out");
+ }
+ throw e;
+ } finally {
+ clearTimeout(timeoutId);
+ }
+
+ if (!response.ok) {
+ throw new Error(text || `Request failed (${response.status})`);
+ }
+
+ return text;
+};
+
+export const fetchReportText = async (
+ url: string,
+ serverId?: string,
+ timeoutMs = DEFAULT_REPORT_FETCH_TIMEOUT_MS
+) => {
+ const key = buildReportCacheKey(url, serverId);
+ const cached = reportTextCache.get(key);
+
+ if (cached?.text) {
+ rememberReportText(key, cached);
+ return cached.text;
+ }
+
+ if (cached?.promise) {
+ return cached.promise;
+ }
+
+ const promise = fetchReportTextUncached(url, serverId, timeoutMs)
+ .then((text) => {
+ rememberReportText(key, { text });
+ return text;
+ })
+ .catch((error) => {
+ reportTextCache.delete(key);
+ throw error;
+ });
+
+ rememberReportText(key, { promise });
+ return promise;
+};
diff --git a/src/components/ChatMessage/DeepResearch/resolveReportUrl.ts b/src/components/ChatMessage/DeepResearch/resolveReportUrl.ts
new file mode 100644
index 00000000..e1fde7bf
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/resolveReportUrl.ts
@@ -0,0 +1,48 @@
+import { useAppStore } from "@/stores/appStore";
+
+const ABSOLUTE_URL_RE = /^[a-z][a-z\d+\-.]*:/i;
+
+const trimTrailingSlash = (value: string) => value.replace(/\/+$/, "");
+
+const getEndpointHttp = () => {
+ const endpointFromStore = useAppStore.getState().endpoint_http;
+ if (endpointFromStore && endpointFromStore !== "undefined") {
+ return endpointFromStore;
+ }
+
+ try {
+ const appStore = JSON.parse(localStorage.getItem("app-store") || "{}");
+ const endpointFromStorage = appStore?.state?.endpoint_http;
+ if (endpointFromStorage && endpointFromStorage !== "undefined") {
+ return endpointFromStorage;
+ }
+ } catch (e) {
+ // Ignore malformed persisted state and fall back to the original URL.
+ }
+
+ return "";
+};
+
+export const resolveReportUrl = (
+ url?: string,
+ formatUrl?: (data: any) => string
+) => {
+ if (!url) return undefined;
+
+ const formattedUrl = (formatUrl && formatUrl({ url })) || url;
+ if (
+ !formattedUrl ||
+ ABSOLUTE_URL_RE.test(formattedUrl) ||
+ formattedUrl.startsWith("//")
+ ) {
+ return formattedUrl;
+ }
+
+ const endpointHttp = getEndpointHttp();
+ if (!endpointHttp) return formattedUrl;
+
+ const path = formattedUrl.startsWith("/")
+ ? formattedUrl
+ : `/${formattedUrl}`;
+ return `${trimTrailingSlash(endpointHttp)}${path}`;
+};
diff --git a/src/components/ChatMessage/DeepResearch/types.ts b/src/components/ChatMessage/DeepResearch/types.ts
new file mode 100644
index 00000000..5eacfcea
--- /dev/null
+++ b/src/components/ChatMessage/DeepResearch/types.ts
@@ -0,0 +1,85 @@
+/**
+ * 步骤状态类型定义
+ * done: 已完成 | in_progress: 进行中 | pending: 等待中
+ */
+export type StepStatus = "done" | "in_progress" | "pending";
+
+/**
+ * 搜索状态类型定义
+ * done: 搜索完成 | searching: 正在搜索
+ */
+export type StepSearchStatus = "done" | "searching";
+
+/** 搜索结果条目 */
+export interface StepSearchHit {
+ source?: string;
+ title: string;
+ url?: string;
+ content?: string;
+ score?: number;
+}
+
+/** 搜索任务 */
+export interface StepSearch {
+ id: string;
+ query: string;
+ resultCount?: number;
+ status: StepSearchStatus;
+ note?: string;
+ hits?: StepSearchHit[];
+}
+
+/** 研究步骤条目 */
+export interface StepItem {
+ id: string;
+ title: string;
+ description?: string;
+ status: StepStatus;
+ searches?: StepSearch[];
+ showOptimizePlan?: boolean;
+}
+
+/** 最终研究报告数据 */
+export interface ResearchReportData {
+ title?: string;
+ url?: string;
+ created?: string;
+ attachment?: string;
+ format?: string;
+ content?: string;
+}
+
+/** 从 chunk 数组派生出的深度研究展示状态 */
+export interface DeepResearchState {
+ deepResearchPlans: string[];
+ deepResearchCurrentStepIndex: number;
+ deepResearchCurrentStepFinished: boolean;
+ deepResearchQuery: string;
+ deepResearchResultCount: number | undefined;
+ deepResearchPlannerStarted: boolean;
+ deepResearchResearcherStarted: boolean;
+ deepResearchReporterStarted: boolean;
+ deepResearchReporterFinished: boolean;
+ deepResearchReportData: ResearchReportData | undefined;
+ deepResearchSearchMap: Record<
+ string,
+ { query?: string; resultCount?: number; hits?: StepSearchHit[] }
+ >;
+}
+
+export type DeepResearchEndReason =
+ | "completed"
+ | "user_cancelled"
+ | "error"
+ | "timeout";
+
+export interface DeepResearchEndChunk {
+ type?: string;
+ payload?: {
+ reason?: DeepResearchEndReason;
+ error?: string;
+ type?: string;
+ title?: string;
+ [key: string]: any;
+ };
+}
diff --git a/src/components/ChatMessage/Markdown.tsx b/src/components/ChatMessage/Markdown.tsx
index 3e039cd0..b8f57560 100644
--- a/src/components/ChatMessage/Markdown.tsx
+++ b/src/components/ChatMessage/Markdown.tsx
@@ -66,7 +66,7 @@ function Mermaid(props: { code: string }) {
}
// 7
-function PreCode(props: { children?: any }) {
+function PreCode(props: { children?: any; enableMermaid?: boolean }) {
const ref = useRef(null);
// const previewRef = useRef(null);
const [mermaidCode, setMermaidCode] = useState("");
@@ -76,6 +76,8 @@ function PreCode(props: { children?: any }) {
const renderArtifacts = useDebouncedCallback(() => {
if (!ref.current) return;
+ if (!props.enableMermaid) return;
+
const mermaidDom = ref.current.querySelector("code.language-mermaid");
if (mermaidDom) {
setMermaidCode((mermaidDom as HTMLElement).innerText);
@@ -231,26 +233,53 @@ function tryWrapHtmlCode(text: string) {
}
// 3
-function _MarkDownContent(props: { content: string }) {
+function _MarkDownContent(props: {
+ content: string;
+ enableSyntaxHighlight?: boolean;
+ enableMermaid?: boolean;
+ enableMath?: boolean;
+}) {
+ const enableMath = props.enableMath !== false;
+
const escapedContent = useMemo(() => {
- return tryWrapHtmlCode(escapeBrackets(props.content));
- }, [props.content]);
+ const content = enableMath ? escapeBrackets(props.content) : props.content;
+ return tryWrapHtmlCode(content);
+ }, [enableMath, props.content]);
+
+ const remarkPlugins = useMemo(() => {
+ return enableMath
+ ? [RemarkMath, RemarkGfm, RemarkBreaks]
+ : [RemarkGfm, RemarkBreaks];
+ }, [enableMath]);
+
+ const rehypePlugins = useMemo(() => {
+ const plugins = [];
+
+ if (enableMath) {
+ plugins.push(RehypeKatex);
+ }
+
+ if (props.enableSyntaxHighlight !== false) {
+ plugins.push([
+ RehypeHighlight,
+ {
+ detect: false,
+ ignoreMissing: true,
+ },
+ ]);
+ }
+
+ return plugins;
+ }, [enableMath, props.enableSyntaxHighlight]);
return (
(
+ ;
defaultShow?: boolean;
+ enableSyntaxHighlight?: boolean;
+ enableMermaid?: boolean;
+ enableMath?: boolean;
} & React.DOMAttributes
) {
const mdRef = useRef(null);
@@ -309,7 +341,12 @@ export default function Markdown(
onDoubleClickCapture={props.onDoubleClickCapture}
dir="auto"
>
-
+
+
+ {isCompleted ? (
+ <>
+
+ {isCompleted && (
+
+ {t("deepResearch.status.reportHeader")}
+
+
+ ) : (
+ <>
+
+ {cardHeaderTitle}
+
+
+ )}
+
+ {t("deepResearch.status.reportDescription")}
+
+ )}
+
+
+
+
+ {isCompleted || isReportPhase ? (
+
+
+ {displayStatus}
+ {!isCompleted && (deepResearchQuery || question) && (
+
+ ｜ {deepResearchQuery || question}
+
+ )}
+
+
+ {normalizedProgress < 1 &&
+ typeof deepResearchResultCount === "number" ? (
+
+
+ {deepResearchResultCount}
+
+ ) : null}
+ {normalizedProgress >= 1 && (
+
+ )}
+
+
+
+
+ = 1
+ ? "bg-[#00C868]"
+ : "bg-[#1784FC]"
+ }`}
+ style={{ width: `${normalizedProgress * 100}%` }}
+ />
+
+
+ {isCancelled ? (
+
+
+ {isDeepResearching
+ ? t("deepResearch.status.cancelled")
+ : t("labels.cancelled")}
+
+ )}
+ {isError && (
+
+
+ )}
+ {isTimeout && (
+
+ {isDeepResearching
+ ? t("deepResearch.status.error")
+ : t("labels.error")}
+
+ {endChunk?.payload?.error && (
+
+ {endChunk.payload.error}
+
+ )}
+
+
+ )}
+ {deepResearch.length === 0 && isTyping && (
)}
{showActions && (
diff --git a/src/components/ChatMessage/markdown.scss b/src/components/ChatMessage/markdown.scss
index 5379a112..404cae9e 100644
--- a/src/components/ChatMessage/markdown.scss
+++ b/src/components/ChatMessage/markdown.scss
@@ -239,14 +239,11 @@
}
.markdown-body hr {
- box-sizing: content-box;
- overflow: hidden;
- background: transparent;
- border-bottom: 1px solid var(--color-border-muted);
- height: 0.25em;
+ height: 1px;
padding: 0;
- margin: 24px 0;
- background-color: var(--color-border-default);
+ margin: 28px 0;
+ background: var(--color-border-muted);
+ border: 0;
}
.markdown-body input {
diff --git a/src/components/Search/AskAi.tsx b/src/components/Search/AskAi.tsx
index 74396d88..3f52d109 100644
--- a/src/components/Search/AskAi.tsx
+++ b/src/components/Search/AskAi.tsx
@@ -22,6 +22,18 @@ interface AskAiProps {
changeMode?: (isChatMode: boolean) => void;
}
+const DEEP_RESEARCH_CHUNK_TYPES = [
+ "research_planner_start",
+ "research_planner_progress",
+ "research_planner_end",
+ "research_researcher_start",
+ "research_researcher_step_start",
+ "research_researcher_step_end",
+ "research_researcher_end",
+ "research_reporter_start",
+ "research_reporter_end",
+];
+
interface State {
serverId?: string;
assistantId?: string;
@@ -53,6 +65,8 @@ const AskAi: FC
+ {endChunk?.payload?.type
+ ? t(`labels.timeout_${endChunk.payload.type}`)
+ : isDeepResearching
+ ? t("deepResearch.status.timeout")
+ : t("labels.timeout")}
+
+ {endChunk?.payload?.error && (
+
+ {endChunk.payload.error}
+
+ )}
+