From f5a38652c20a2b657a568a58047457fa6457ce37 Mon Sep 17 00:00:00 2001
From: danielhanchen <danielhanchen@gmail.com>
Date: Fri, 24 Apr 2026 16:18:34 +0000
Subject: [PATCH] Studio: auto-switch Easy mode to Runs pane on run start

Easy mode had no progress island or canvas overlay, so after clicking Run
the only visible state was the button label flipping to "Running..." while
the screen otherwise stayed identical. This reads as stuck even though the
job is progressing.

Wire an onExecutionStart callback from recipe-studio-page.tsx through to
useRecipeExecutions so that when a run is kicked off from easy mode, the
page flips to the executions view where the Runs sidebar, progress bar,
rate/ETA panel, and live log are rendered. Advanced/editor mode keeps its
existing behavior and stays on the canvas (it already has the floating
ExecutionProgressIsland).
---
 .../src/features/recipe-studio/recipe-studio-page.tsx  | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/studio/frontend/src/features/recipe-studio/recipe-studio-page.tsx b/studio/frontend/src/features/recipe-studio/recipe-studio-page.tsx
index 5b7beeaa9f..312cf8cfc7 100644
--- a/studio/frontend/src/features/recipe-studio/recipe-studio-page.tsx
+++ b/studio/frontend/src/features/recipe-studio/recipe-studio-page.tsx
@@ -227,6 +227,15 @@ export function RecipeStudioPage({
     },
     [viewModeStorageKey],
   );
+  // Easy mode has no canvas overlay/progress island, so once a run starts the
+  // user sees the Run button stuck on "Running..." with nothing else changing.
+  // Flip to the Runs pane so they land where progress is actually rendered.
+  // Advanced (editor) keeps its island and stays put.
+  const handleExecutionStart = useCallback(() => {
+    setActiveView((currentView) =>
+      currentView === "easy" ? "executions" : currentView,
+    );
+  }, [setActiveView]);
   const [processorsOpen, setProcessorsOpen] = useState(false);
   const [interactive, setInteractive] = useState(true);
   const [runtimeIslandMinimized, setRuntimeIslandMinimized] = useState(false);
@@ -364,6 +373,7 @@ export function RecipeStudioPage({
     resetRecipe,
     loadRecipe,
     getCurrentPayloadFromStore,
+    onExecutionStart: handleExecutionStart,
   });
   const {
     activeExecution,