mirror of
https://gitee.com/wanwujie/deer-flow
synced 2026-04-28 08:14:48 +08:00
refactor: rename
This commit is contained in:
123
frontend/src/app/workspace/chats/[thread_id]/page.tsx
Normal file
123
frontend/src/app/workspace/chats/[thread_id]/page.tsx
Normal file
@@ -0,0 +1,123 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { type HumanMessage } from "@langchain/core/messages";
|
||||||
|
import { useStream } from "@langchain/langgraph-sdk/react";
|
||||||
|
import { useQueryClient } from "@tanstack/react-query";
|
||||||
|
import { useParams, useRouter } from "next/navigation";
|
||||||
|
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||||
|
|
||||||
|
import type { PromptInputMessage } from "@/components/ai-elements/prompt-input";
|
||||||
|
import { BreadcrumbItem } from "@/components/ui/breadcrumb";
|
||||||
|
import { InputBox } from "@/components/workspace/input-box";
|
||||||
|
import { MessageList } from "@/components/workspace/message-list/message-list";
|
||||||
|
import {
|
||||||
|
WorkspaceContainer,
|
||||||
|
WorkspaceBody,
|
||||||
|
WorkspaceHeader,
|
||||||
|
WorkspaceFooter,
|
||||||
|
} from "@/components/workspace/workspace-container";
|
||||||
|
import { getLangGraphClient } from "@/core/api";
|
||||||
|
import type {
|
||||||
|
AgentThread,
|
||||||
|
AgentThreadContext,
|
||||||
|
AgentThreadState,
|
||||||
|
} from "@/core/threads";
|
||||||
|
import { titleOfThread } from "@/core/threads/utils";
|
||||||
|
import { uuid } from "@/core/utils/uuid";
|
||||||
|
|
||||||
|
const langGraphClient = getLangGraphClient();
|
||||||
|
|
||||||
|
export default function ChatPage() {
|
||||||
|
const router = useRouter();
|
||||||
|
const queryClient = useQueryClient();
|
||||||
|
const { thread_id: threadIdFromPath } = useParams<{ thread_id: string }>();
|
||||||
|
const isNewThread = useMemo(
|
||||||
|
() => threadIdFromPath === "new",
|
||||||
|
[threadIdFromPath],
|
||||||
|
);
|
||||||
|
const [threadId, setThreadId] = useState<string | null>(null);
|
||||||
|
const [threadContext, setThreadContext] = useState<AgentThreadContext>({
|
||||||
|
thread_id: "",
|
||||||
|
model: "deepseek-v3.2",
|
||||||
|
thinking_enabled: true,
|
||||||
|
});
|
||||||
|
useEffect(() => {
|
||||||
|
if (threadIdFromPath !== "new") {
|
||||||
|
setThreadId(threadIdFromPath);
|
||||||
|
} else {
|
||||||
|
setThreadId(uuid());
|
||||||
|
}
|
||||||
|
}, [threadIdFromPath]);
|
||||||
|
const thread = useStream<AgentThreadState>({
|
||||||
|
client: langGraphClient,
|
||||||
|
assistantId: "lead_agent",
|
||||||
|
threadId: !isNewThread ? threadId : undefined,
|
||||||
|
reconnectOnMount: true,
|
||||||
|
fetchStateHistory: true,
|
||||||
|
onFinish() {
|
||||||
|
void queryClient.invalidateQueries({ queryKey: ["threads", "search"] });
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const handleSubmit = useCallback(
|
||||||
|
async (message: PromptInputMessage) => {
|
||||||
|
const text = message.text.trim();
|
||||||
|
if (isNewThread) {
|
||||||
|
router.replace(`/workspace/chats/${threadId}`);
|
||||||
|
}
|
||||||
|
await thread.submit(
|
||||||
|
{
|
||||||
|
messages: [
|
||||||
|
{
|
||||||
|
type: "human",
|
||||||
|
content: [
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
] as HumanMessage[],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
threadId: isNewThread ? threadId! : undefined,
|
||||||
|
streamSubgraphs: true,
|
||||||
|
streamResumable: true,
|
||||||
|
context: {
|
||||||
|
...threadContext,
|
||||||
|
thread_id: threadId!,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
);
|
||||||
|
void queryClient.invalidateQueries({ queryKey: ["threads", "search"] });
|
||||||
|
},
|
||||||
|
[isNewThread, queryClient, router, thread, threadContext, threadId],
|
||||||
|
);
|
||||||
|
const handleStop = useCallback(async () => {
|
||||||
|
await thread.stop();
|
||||||
|
}, [thread]);
|
||||||
|
return (
|
||||||
|
<WorkspaceContainer>
|
||||||
|
<WorkspaceHeader>
|
||||||
|
<BreadcrumbItem className="hidden md:block">
|
||||||
|
{isNewThread
|
||||||
|
? "New"
|
||||||
|
: titleOfThread(thread as unknown as AgentThread)}
|
||||||
|
</BreadcrumbItem>
|
||||||
|
</WorkspaceHeader>
|
||||||
|
<WorkspaceBody>
|
||||||
|
<div className="flex size-full justify-center">
|
||||||
|
<MessageList className="size-full" thread={thread} />
|
||||||
|
</div>
|
||||||
|
</WorkspaceBody>
|
||||||
|
<WorkspaceFooter>
|
||||||
|
<InputBox
|
||||||
|
className="max-w-(--container-width-md)"
|
||||||
|
autoFocus={isNewThread}
|
||||||
|
status={thread.isLoading ? "streaming" : "ready"}
|
||||||
|
onSubmit={handleSubmit}
|
||||||
|
onStop={handleStop}
|
||||||
|
/>
|
||||||
|
</WorkspaceFooter>
|
||||||
|
</WorkspaceContainer>
|
||||||
|
);
|
||||||
|
}
|
||||||
18
frontend/src/app/workspace/chats/page.tsx
Normal file
18
frontend/src/app/workspace/chats/page.tsx
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import {
|
||||||
|
WorkspaceBody,
|
||||||
|
WorkspaceContainer,
|
||||||
|
WorkspaceHeader,
|
||||||
|
} from "@/components/workspace/workspace-container";
|
||||||
|
|
||||||
|
export default function ChatsPage() {
|
||||||
|
return (
|
||||||
|
<WorkspaceContainer>
|
||||||
|
<WorkspaceHeader></WorkspaceHeader>
|
||||||
|
<WorkspaceBody>
|
||||||
|
<div className="flex size-full justify-center"></div>
|
||||||
|
</WorkspaceBody>
|
||||||
|
</WorkspaceContainer>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -1,26 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { useStream } from "@langchain/langgraph-sdk/react";
|
|
||||||
import { useParams } from "next/navigation";
|
|
||||||
|
|
||||||
import { getLangGraphClient } from "@/core/api";
|
|
||||||
import type { AgentThreadState } from "@/core/threads";
|
|
||||||
|
|
||||||
const apiClient = getLangGraphClient();
|
|
||||||
|
|
||||||
export default function TestPage() {
|
|
||||||
const { thread_id: threadId } = useParams<{ thread_id: string }>();
|
|
||||||
const thread = useStream<AgentThreadState>({
|
|
||||||
client: apiClient,
|
|
||||||
assistantId: "lead_agent",
|
|
||||||
threadId,
|
|
||||||
reconnectOnMount: true,
|
|
||||||
fetchStateHistory: true,
|
|
||||||
});
|
|
||||||
return (
|
|
||||||
<div className="p-4">
|
|
||||||
<div>{threadId}</div>
|
|
||||||
<div>{thread.isLoading ? "loading" : "not loading"}</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user