From d86cb4cb2b0bddfec12361b49372ec72ad01ae5a Mon Sep 17 00:00:00 2001
From: "paseo-bot[bot]" <266920839+paseo-bot[bot]@users.noreply.github.com>
Date: Wed, 7 Oct 2026 17:04:34 +0200
Subject: [PATCH] fix(app): show the sidebar toggle on plugin screens

Plugin screens rendered only their icon and title on the left of the header,
so on wide web and Android layouts there was no way to collapse the sidebar
from them, or to reopen it after it was closed elsewhere.

Fixes #6315
---
 .../e2e/browser/plugin-sidebar-items.spec.ts  | 26 +++++++++++++++++++
 packages/app/src/plugins/surface-screen.tsx   |  2 ++
 2 files changed, 28 insertions(+)

diff --git a/packages/app/e2e/browser/plugin-sidebar-items.spec.ts b/packages/app/e2e/browser/plugin-sidebar-items.spec.ts
index 900fb42db9..ee2057dddc 100644
--- a/packages/app/e2e/browser/plugin-sidebar-items.spec.ts
+++ b/packages/app/e2e/browser/plugin-sidebar-items.spec.ts
@@ -241,6 +241,32 @@ test.describe("Plugin sidebar items", () => {
     });
   });
 
+  test("a plugin screen toggles the sidebar on a wide layout", async ({ page }) => {
+    await page.setViewportSize(WIDE);
+    await gotoWorkspace(page, workspaceId);
+    const row = headerRow(page, SHOWCASE_PLUGIN_ID, "deploys");
+    await expect(row).toBeVisible({ timeout: 30_000 });
+
+    await row.click();
+    await expect(page.getByText("Deploys screen body", { exact: true })).toBeVisible();
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).not.toBeVisible();
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).toBeVisible();
+    await closeScreen(page);
+
+    // With the sidebar closed elsewhere, the screen's own toggle is the way back to it.
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).not.toBeVisible();
+    await page.keyboard.press("Control+k");
+    const panel = page.getByTestId("command-center-panel");
+    await panel.getByTestId("command-center-input").fill("Open deploys");
+    await panel.getByRole("button", { name: "Open deploys", exact: true }).click();
+    await expect(page.getByText("Deploys screen body", { exact: true })).toBeVisible();
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).toBeVisible();
+  });
+
   test("a header row's shortcut hint presses the row", async ({ page }) => {
     await page.setViewportSize(WIDE);
     await gotoWorkspace(page, workspaceId);
diff --git a/packages/app/src/plugins/surface-screen.tsx b/packages/app/src/plugins/surface-screen.tsx
index 378965cd8f..8c6e42ca59 100644
--- a/packages/app/src/plugins/surface-screen.tsx
+++ b/packages/app/src/plugins/surface-screen.tsx
@@ -8,6 +8,7 @@ import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import { HeaderIconBadge } from "@/components/headers/header-icon-badge";
 import { HeaderToggleButton } from "@/components/headers/header-toggle-button";
 import { CompactHeader } from "@/components/headers/compact-header";
+import { SidebarMenuToggle } from "@/components/headers/sidebar-menu-toggle";
 import { ScreenHeader } from "@/components/headers/screen-header";
 import { ScreenTitle } from "@/components/headers/screen-title";
 import { HostFilter } from "@/components/hosts/host-filter";
@@ -172,6 +173,7 @@ export function PluginSurfaceScreen() {
   const headerLeft = useMemo(
     () => (
       <>
+        <SidebarMenuToggle />
         {Icon ? (
           <HeaderIconBadge>
             <ThemedPluginHeaderIcon Icon={Icon} uniProps={mutedColorMapping} />