mirror of
https://git.mirrors.martin98.com/https://github.com/bytedance/deer-flow
synced 2025-08-20 19:59:06 +08:00
feat: adjust the layout
This commit is contained in:
parent
5722078699
commit
63a7de2ec0
@ -37,7 +37,7 @@ import { useIntersectionObserver } from "~/hooks/use-intersection-observer";
|
|||||||
|
|
||||||
import { Tooltip } from "./tooltip";
|
import { Tooltip } from "./tooltip";
|
||||||
|
|
||||||
const ROW_HEIGHT = 75;
|
const ROW_HEIGHT = 80;
|
||||||
const ROW_1 = 0;
|
const ROW_1 = 0;
|
||||||
const ROW_2 = ROW_HEIGHT;
|
const ROW_2 = ROW_HEIGHT;
|
||||||
const ROW_3 = ROW_HEIGHT * 2;
|
const ROW_3 = ROW_HEIGHT * 2;
|
||||||
@ -56,7 +56,7 @@ const initialNodes: WorkflowNode[] = [
|
|||||||
id: "Start",
|
id: "Start",
|
||||||
type: "circle",
|
type: "circle",
|
||||||
data: { label: "Start" },
|
data: { label: "Start" },
|
||||||
position: { x: 25, y: ROW_1 },
|
position: { x: -75, y: ROW_1 },
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "Coordinator",
|
id: "Coordinator",
|
||||||
@ -218,6 +218,7 @@ const WORKFLOW_STEPS = [
|
|||||||
"If the user's problem is clearly defined, the Coordinator will hand it over to the Planner.",
|
"If the user's problem is clearly defined, the Coordinator will hand it over to the Planner.",
|
||||||
activeNodes: ["Coordinator", "Planner"],
|
activeNodes: ["Coordinator", "Planner"],
|
||||||
activeEdges: ["Coordinator->Planner"],
|
activeEdges: ["Coordinator->Planner"],
|
||||||
|
tooltipPosition: "left",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
description: "Awaiting human feedback to refine the plan.",
|
description: "Awaiting human feedback to refine the plan.",
|
||||||
@ -226,37 +227,41 @@ const WORKFLOW_STEPS = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
description: "Updating the plan based on human feedback.",
|
description: "Updating the plan based on human feedback.",
|
||||||
activeNodes: ["Planner", "HumanFeedback"],
|
activeNodes: ["HumanFeedback", "Planner"],
|
||||||
activeEdges: ["HumanFeedback->Planner"],
|
activeEdges: ["HumanFeedback->Planner"],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
description:
|
description:
|
||||||
"The Research Team is responsible for conducting the core research tasks.",
|
"The Research Team is responsible for conducting the core research tasks.",
|
||||||
|
tooltipPosition: "left",
|
||||||
activeNodes: ["HumanFeedback", "ResearchTeam"],
|
activeNodes: ["HumanFeedback", "ResearchTeam"],
|
||||||
activeEdges: ["HumanFeedback->ResearchTeam", "ResearchTeam->HumanFeedback"],
|
activeEdges: ["HumanFeedback->ResearchTeam", "ResearchTeam->HumanFeedback"],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
description:
|
description:
|
||||||
"The Researcher is responsible for gathering information using search and crawling tools.",
|
"The Researcher is responsible for gathering information using search and crawling tools.",
|
||||||
|
tooltipPosition: "bottom",
|
||||||
activeNodes: ["ResearchTeam", "Researcher"],
|
activeNodes: ["ResearchTeam", "Researcher"],
|
||||||
activeEdges: ["ResearchTeam->Researcher", "Researcher->ResearchTeam"],
|
activeEdges: ["ResearchTeam->Researcher", "Researcher->ResearchTeam"],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
description:
|
description:
|
||||||
"The Coder is responsible for writing and executing Python code to solve problems such as mathematical computations, data analysis, and more.",
|
"The Coder is responsible for writing and executing Python code to solve problems such as mathematical computations, data analysis, and more.",
|
||||||
|
tooltipPosition: "bottom",
|
||||||
activeNodes: ["ResearchTeam", "Coder"],
|
activeNodes: ["ResearchTeam", "Coder"],
|
||||||
activeEdges: ["ResearchTeam->Coder", "Coder->ResearchTeam"],
|
activeEdges: ["ResearchTeam->Coder", "Coder->ResearchTeam"],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
description:
|
description:
|
||||||
"Once the research tasks are completed, the Researcher will hand over to the Planner.",
|
"Once the research tasks are completed, the Researcher will hand over to the Planner.",
|
||||||
|
tooltipPosition: "bottom",
|
||||||
activeNodes: ["ResearchTeam", "Planner"],
|
activeNodes: ["ResearchTeam", "Planner"],
|
||||||
activeEdges: ["ResearchTeam->Planner"],
|
activeEdges: ["ResearchTeam->Planner"],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
description:
|
description:
|
||||||
"If no additional information is required, the Planner will handoff to the Reporter.",
|
"If no additional information is required, the Planner will handoff to the Reporter.",
|
||||||
activeNodes: ["Planner", "Reporter"],
|
activeNodes: ["Reporter", "Planner"],
|
||||||
activeEdges: ["Planner->Reporter"],
|
activeEdges: ["Planner->Reporter"],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -302,6 +307,7 @@ function useWorkflowRun(
|
|||||||
step.activeNodes.indexOf(node.id) === step.activeNodes.length - 1
|
step.activeNodes.indexOf(node.id) === step.activeNodes.length - 1
|
||||||
? step.description
|
? step.description
|
||||||
: undefined,
|
: undefined,
|
||||||
|
stepTooltipPosition: step.tooltipPosition,
|
||||||
},
|
},
|
||||||
}));
|
}));
|
||||||
});
|
});
|
||||||
@ -429,6 +435,7 @@ function AgentNode({
|
|||||||
label: string;
|
label: string;
|
||||||
active: boolean;
|
active: boolean;
|
||||||
stepDescription?: string;
|
stepDescription?: string;
|
||||||
|
stepTooltipPosition?: "left" | "right" | "top" | "bottom";
|
||||||
};
|
};
|
||||||
id: string;
|
id: string;
|
||||||
}) {
|
}) {
|
||||||
@ -441,9 +448,10 @@ function AgentNode({
|
|||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
<Tooltip
|
<Tooltip
|
||||||
className="max-w-50"
|
className="max-w-50 opacity-66"
|
||||||
open={data.active && !!data.stepDescription}
|
open={data.active && !!data.stepDescription}
|
||||||
title={data.stepDescription}
|
title={data.stepDescription}
|
||||||
|
side={data.stepTooltipPosition}
|
||||||
sideOffset={20}
|
sideOffset={20}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
Loading…
x
Reference in New Issue
Block a user