diff --git a/autogpt_platform/frontend/src/app/(platform)/build/components/BuilderViewTabs/BuilderViewTabs.tsx b/autogpt_platform/frontend/src/app/(platform)/build/components/BuilderViewTabs/BuilderViewTabs.tsx
deleted file mode 100644
index 4f4237445b..0000000000
--- a/autogpt_platform/frontend/src/app/(platform)/build/components/BuilderViewTabs/BuilderViewTabs.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-"use client";
-
-import { Tabs, TabsList, TabsTrigger } from "@/components/__legacy__/ui/tabs";
-
-export type BuilderView = "old" | "new";
-
-export function BuilderViewTabs({
- value,
- onChange,
-}: {
- value: BuilderView;
- onChange: (value: BuilderView) => void;
-}) {
- return (
-
- onChange(v as BuilderView)}
- >
-
-
- Old
-
-
- New
-
-
-
-
- );
-}
diff --git a/autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/Flow/Flow.tsx b/autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/Flow/Flow.tsx
index 87ae4300b8..28bba580b4 100644
--- a/autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/Flow/Flow.tsx
+++ b/autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/Flow/Flow.tsx
@@ -23,6 +23,9 @@ import { useCopyPaste } from "./useCopyPaste";
import { useFlow } from "./useFlow";
import { useFlowRealtime } from "./useFlowRealtime";
+import "@xyflow/react/dist/style.css";
+import "./flow.css";
+
export const Flow = () => {
const [{ flowID, flowExecutionID }] = useQueryStates({
flowID: parseAsString,
diff --git a/autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/Flow/flow.css b/autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/Flow/flow.css
new file mode 100644
index 0000000000..0f73d047a9
--- /dev/null
+++ b/autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/Flow/flow.css
@@ -0,0 +1,9 @@
+/* Reset default xyflow handle styles so custom Phosphor icon handles render correctly */
+.react-flow__handle {
+ background: transparent;
+ width: auto;
+ height: auto;
+ border: 0;
+ position: relative;
+ transform: none;
+}
diff --git a/autogpt_platform/frontend/src/app/(platform)/build/components/RIghtSidebar.tsx b/autogpt_platform/frontend/src/app/(platform)/build/components/RIghtSidebar.tsx
deleted file mode 100644
index cc0c7ff765..0000000000
--- a/autogpt_platform/frontend/src/app/(platform)/build/components/RIghtSidebar.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import { useMemo } from "react";
-
-import { Link } from "@/app/api/__generated__/models/link";
-import { useEdgeStore } from "../stores/edgeStore";
-import { useNodeStore } from "../stores/nodeStore";
-import { scrollbarStyles } from "@/components/styles/scrollbars";
-import { cn } from "@/lib/utils";
-import { customEdgeToLink } from "./helper";
-
-export const RightSidebar = () => {
- const edges = useEdgeStore((s) => s.edges);
- const nodes = useNodeStore((s) => s.nodes);
-
- const backendLinks: Link[] = useMemo(
- () => edges.map(customEdgeToLink),
- [edges],
- );
-
- return (
-
-
-
- Graph Debug Panel
-
-
-
-
-
- Nodes ({nodes.length})
-
-
- {nodes.map((n) => (
-
-
- #{n.id} {n.data?.title ? `– ${n.data.title}` : ""}
-
-
- hardcodedValues
-
-
- {JSON.stringify(n.data?.hardcodedValues ?? {}, null, 2)}
-
-
- ))}
-
-
-
- Links ({backendLinks.length})
-
-
- {backendLinks.map((l) => (
-
-
- {l.source_id}[{l.source_name}] → {l.sink_id}[{l.sink_name}]
-
-
- edge.id: {l.id}
-
-
- ))}
-
-
-
- Backend Links JSON
-
-
- {JSON.stringify(backendLinks, null, 2)}
-
-
-
- );
-};
diff --git a/autogpt_platform/frontend/src/app/(platform)/build/page.tsx b/autogpt_platform/frontend/src/app/(platform)/build/page.tsx
index f1d62ee5fb..a8ed8a5e8e 100644
--- a/autogpt_platform/frontend/src/app/(platform)/build/page.tsx
+++ b/autogpt_platform/frontend/src/app/(platform)/build/page.tsx
@@ -1,64 +1,13 @@
"use client";
-
-import FlowEditor from "@/app/(platform)/build/components/legacy-builder/Flow/Flow";
-import { useOnboarding } from "@/providers/onboarding/onboarding-provider";
-// import LoadingBox from "@/components/__legacy__/ui/loading";
-import { GraphID } from "@/lib/autogpt-server-api/types";
import { ReactFlowProvider } from "@xyflow/react";
-import { useSearchParams } from "next/navigation";
-import { useEffect } from "react";
-import { BuilderViewTabs } from "./components/BuilderViewTabs/BuilderViewTabs";
import { Flow } from "./components/FlowEditor/Flow/Flow";
-import { useBuilderView } from "./useBuilderView";
-
-function BuilderContent() {
- const query = useSearchParams();
- const { completeStep } = useOnboarding();
-
- useEffect(() => {
- completeStep("BUILDER_OPEN");
- }, [completeStep]);
-
- const _graphVersion = query.get("flowVersion");
- const graphVersion = _graphVersion ? parseInt(_graphVersion) : undefined;
- return (
-
- );
-}
export default function BuilderPage() {
- const {
- isSwitchEnabled,
- selectedView,
- setSelectedView,
- isNewFlowEditorEnabled,
- } = useBuilderView();
-
- // Switch is temporary, we will remove it once our new flow editor is ready
- if (isSwitchEnabled) {
- return (
-
-
- {selectedView === "new" ? (
-
-
-
- ) : (
-
- )}
-
- );
- }
-
- return isNewFlowEditorEnabled ? (
-
-
-
- ) : (
-
+ return (
+
+
+
+
+
);
}
diff --git a/autogpt_platform/frontend/src/app/(platform)/build/useBuilderView.ts b/autogpt_platform/frontend/src/app/(platform)/build/useBuilderView.ts
deleted file mode 100644
index e0e524ddf8..0000000000
--- a/autogpt_platform/frontend/src/app/(platform)/build/useBuilderView.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-import { Flag, useGetFlag } from "@/services/feature-flags/use-get-flag";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import { useEffect, useMemo } from "react";
-import { BuilderView } from "./components/BuilderViewTabs/BuilderViewTabs";
-
-export function useBuilderView() {
- const isNewFlowEditorEnabled = useGetFlag(Flag.NEW_FLOW_EDITOR);
- const isBuilderViewSwitchEnabled = useGetFlag(Flag.BUILDER_VIEW_SWITCH);
-
- const router = useRouter();
- const pathname = usePathname();
- const searchParams = useSearchParams();
-
- const currentView = searchParams.get("view");
- const defaultView = "old";
- const selectedView = useMemo(() => {
- if (currentView === "new" || currentView === "old") return currentView;
- return defaultView;
- }, [currentView, defaultView]);
-
- useEffect(() => {
- if (isBuilderViewSwitchEnabled === true) {
- if (currentView !== "new" && currentView !== "old") {
- const params = new URLSearchParams(searchParams);
- params.set("view", defaultView);
- router.replace(`${pathname}?${params.toString()}`);
- }
- }
- // eslint-disable-next-line react-hooks/exhaustive-deps
- }, [isBuilderViewSwitchEnabled, defaultView, pathname, router, searchParams]);
-
- const setSelectedView = (value: BuilderView) => {
- const params = new URLSearchParams(searchParams);
- params.set("view", value);
- router.push(`${pathname}?${params.toString()}`);
- };
-
- return {
- isSwitchEnabled: isBuilderViewSwitchEnabled === true,
- selectedView,
- setSelectedView,
- isNewFlowEditorEnabled: Boolean(isNewFlowEditorEnabled),
- } as const;
-}
diff --git a/autogpt_platform/frontend/src/services/feature-flags/use-get-flag.ts b/autogpt_platform/frontend/src/services/feature-flags/use-get-flag.ts
index c61fc9749d..3a27aa6e9b 100644
--- a/autogpt_platform/frontend/src/services/feature-flags/use-get-flag.ts
+++ b/autogpt_platform/frontend/src/services/feature-flags/use-get-flag.ts
@@ -10,8 +10,6 @@ export enum Flag {
NEW_AGENT_RUNS = "new-agent-runs",
GRAPH_SEARCH = "graph-search",
ENABLE_ENHANCED_OUTPUT_HANDLING = "enable-enhanced-output-handling",
- NEW_FLOW_EDITOR = "new-flow-editor",
- BUILDER_VIEW_SWITCH = "builder-view-switch",
SHARE_EXECUTION_RESULTS = "share-execution-results",
AGENT_FAVORITING = "agent-favoriting",
MARKETPLACE_SEARCH_TERMS = "marketplace-search-terms",
@@ -27,8 +25,6 @@ const defaultFlags = {
[Flag.NEW_AGENT_RUNS]: false,
[Flag.GRAPH_SEARCH]: false,
[Flag.ENABLE_ENHANCED_OUTPUT_HANDLING]: false,
- [Flag.NEW_FLOW_EDITOR]: false,
- [Flag.BUILDER_VIEW_SWITCH]: false,
[Flag.SHARE_EXECUTION_RESULTS]: false,
[Flag.AGENT_FAVORITING]: false,
[Flag.MARKETPLACE_SEARCH_TERMS]: DEFAULT_SEARCH_TERMS,