diff --git a/packages/dashboard/app/components/WorkflowNodeEditor.css b/packages/dashboard/app/components/WorkflowNodeEditor.css
index 133f5b381e..5d37333a59 100644
--- a/packages/dashboard/app/components/WorkflowNodeEditor.css
+++ b/packages/dashboard/app/components/WorkflowNodeEditor.css
@@ -1705,4 +1705,21 @@
border-top: 1px solid var(--border);
overflow-y: auto;
}
+
+ .wf-editor-body--mobile-node-detail .wf-editor-canvas-wrap {
+ display: none;
+ min-height: 0;
+ }
+
+ .wf-editor-body--mobile-node-detail .wf-editor-inspector {
+ display: flex;
+ flex: 1 1 auto;
+ width: 100%;
+ min-width: 0;
+ min-height: 0;
+ max-height: none;
+ border-left: none;
+ border-top: none;
+ overflow-y: auto;
+ }
}
diff --git a/packages/dashboard/app/components/WorkflowNodeEditor.tsx b/packages/dashboard/app/components/WorkflowNodeEditor.tsx
index aa1a5dd041..00f17cdbad 100644
--- a/packages/dashboard/app/components/WorkflowNodeEditor.tsx
+++ b/packages/dashboard/app/components/WorkflowNodeEditor.tsx
@@ -1879,6 +1879,11 @@ function InnerEditor({
}, [nodes, unplaced, serverNodeError, t]);
const selectedNode = nodes.find((n) => n.id === selectedNodeId) ?? null;
+ const selectedNodeHasInspector =
+ selectedNode !== null &&
+ selectedNode.data.kind !== "start" &&
+ selectedNode.data.kind !== "end";
+ const mobileNodeDetailStage = isMobileViewport && selectedNodeHasInspector && !inspectorCollapsed;
const selectedEdge = edges.find((e) => e.id === selectedEdgeId) ?? null;
const [isPromptExpanded, setIsPromptExpanded] = useState(false);
const handleTogglePromptExpand = useCallback(() => {
@@ -2210,6 +2215,7 @@ function InnerEditor({