From 14f86196fe662e64e1b3828be6481ae7254b5718 Mon Sep 17 00:00:00 2001
From: Maksym Yezhov <maxim.ezhov@shopify.com>
Date: Tue, 2 Jun 2026 21:23:40 -0700
Subject: [PATCH] refactor: v2 - run view - windows top menu

---
 .../EditorMenuBar/EditorMenuBar.tsx           |  4 ++--
 .../RunViewMenuBar/RunViewMenuBar.tsx         |  2 ++
 .../components/WindowsMenu.tsx                | 24 +++++++++++--------
 3 files changed, 18 insertions(+), 12 deletions(-)
 rename src/routes/v2/{pages/Editor/components/EditorMenuBar => shared}/components/WindowsMenu.tsx (82%)

diff --git a/src/routes/v2/pages/Editor/components/EditorMenuBar/EditorMenuBar.tsx b/src/routes/v2/pages/Editor/components/EditorMenuBar/EditorMenuBar.tsx
index a82f3b6b6..f882eff62 100644
--- a/src/routes/v2/pages/Editor/components/EditorMenuBar/EditorMenuBar.tsx
+++ b/src/routes/v2/pages/Editor/components/EditorMenuBar/EditorMenuBar.tsx
@@ -11,6 +11,7 @@ import { Text } from "@/components/ui/typography";
 import { usePipelineRename } from "@/routes/v2/pages/Editor/hooks/usePipelineRename";
 import { useEditorSession } from "@/routes/v2/pages/Editor/store/EditorSessionContext";
 import { AppMenuActions } from "@/routes/v2/shared/components/AppMenuActions";
+import { WindowsMenu } from "@/routes/v2/shared/components/WindowsMenu";
 import { useSharedStores } from "@/routes/v2/shared/store/SharedStoreContext";
 import { TOP_NAV_HEIGHT } from "@/utils/constants";
 import { tracking } from "@/utils/tracking";
@@ -22,7 +23,6 @@ import { NodeMenu } from "./components/NodeMenu";
 import { QuickRunButton } from "./components/QuickRunButton";
 import { RunsMenu } from "./components/RunsMenu";
 import { ViewMenu } from "./components/ViewMenu";
-import { WindowsMenu } from "./components/WindowsMenu";
 
 export const EditorMenuBar = observer(function EditorMenuBar() {
   const { navigation } = useSharedStores();
@@ -107,7 +107,7 @@ export const EditorMenuBar = observer(function EditorMenuBar() {
                 <ViewMenu />
                 <RunsMenu />
                 <ComponentsLibraryMenu />
-                <WindowsMenu />
+                <WindowsMenu trackingPrefix="v2.pipeline_editor.windows_menu" />
                 <NodeMenu />
               </InlineStack>
             </BlockStack>
diff --git a/src/routes/v2/pages/RunView/components/RunViewMenuBar/RunViewMenuBar.tsx b/src/routes/v2/pages/RunView/components/RunViewMenuBar/RunViewMenuBar.tsx
index db74ca94f..05dbc204b 100644
--- a/src/routes/v2/pages/RunView/components/RunViewMenuBar/RunViewMenuBar.tsx
+++ b/src/routes/v2/pages/RunView/components/RunViewMenuBar/RunViewMenuBar.tsx
@@ -5,6 +5,7 @@ import { BlockStack, InlineStack } from "@/components/ui/layout";
 import { Link } from "@/components/ui/link";
 import { Text } from "@/components/ui/typography";
 import { AppMenuActions } from "@/routes/v2/shared/components/AppMenuActions";
+import { WindowsMenu } from "@/routes/v2/shared/components/WindowsMenu";
 import { useSharedStores } from "@/routes/v2/shared/store/SharedStoreContext";
 import { TOP_NAV_HEIGHT } from "@/utils/constants";
 import { tracking } from "@/utils/tracking";
@@ -62,6 +63,7 @@ export const RunViewMenuBar = observer(function RunViewMenuBar() {
             <InlineStack wrap="nowrap" blockAlign="center">
               <RunMenu />
               <RunViewViewMenu />
+              <WindowsMenu trackingPrefix="v2.run_view.windows_menu" />
             </InlineStack>
           </BlockStack>
         </InlineStack>
diff --git a/src/routes/v2/pages/Editor/components/EditorMenuBar/components/WindowsMenu.tsx b/src/routes/v2/shared/components/WindowsMenu.tsx
similarity index 82%
rename from src/routes/v2/pages/Editor/components/EditorMenuBar/components/WindowsMenu.tsx
rename to src/routes/v2/shared/components/WindowsMenu.tsx
index c41556fcb..8858f319a 100644
--- a/src/routes/v2/pages/Editor/components/EditorMenuBar/components/WindowsMenu.tsx
+++ b/src/routes/v2/shared/components/WindowsMenu.tsx
@@ -21,7 +21,14 @@ import {
 } from "@/routes/v2/shared/windows/viewPresets";
 import { tracking } from "@/utils/tracking";
 
-export const WindowsMenu = observer(function WindowsMenu() {
+interface WindowsMenuProps {
+  /** Tracking id for the menu trigger; sub-events are derived from it. */
+  trackingPrefix: string;
+}
+
+export const WindowsMenu = observer(function WindowsMenu({
+  trackingPrefix,
+}: WindowsMenuProps) {
   const { track } = useAnalytics();
   const { windows } = useSharedStores();
   const sortedWindows = [...windows.getAllWindows()]
@@ -29,7 +36,7 @@ export const WindowsMenu = observer(function WindowsMenu() {
     .sort((a, b) => a.title.localeCompare(b.title));
 
   const applyPreset = (preset: ViewPreset) => {
-    track("v2.pipeline_editor.windows_menu.view_preset.click", {
+    track(`${trackingPrefix}.view_preset.click`, {
       preset_label: preset.label,
     });
     windows.applyViewPreset(preset);
@@ -38,7 +45,7 @@ export const WindowsMenu = observer(function WindowsMenu() {
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
-        <MenuTriggerButton {...tracking("v2.pipeline_editor.windows_menu")}>
+        <MenuTriggerButton {...tracking(trackingPrefix)}>
           Windows
         </MenuTriggerButton>
       </DropdownMenuTrigger>
@@ -49,13 +56,10 @@ export const WindowsMenu = observer(function WindowsMenu() {
             checked={win.state !== "hidden"}
             onSelect={(e) => e.preventDefault()}
             onCheckedChange={(checked) => {
-              track(
-                "v2.pipeline_editor.windows_menu.window_visibility.toggle",
-                {
-                  window_id: win.id,
-                  visible: checked,
-                },
-              );
+              track(`${trackingPrefix}.window_visibility.toggle`, {
+                window_id: win.id,
+                visible: checked,
+              });
               if (checked) {
                 win.restore();
               } else {