diff --git a/apps/web/src/pages/library-page.tsx b/apps/web/src/pages/library-page.tsx
index 9d9674254..405ea64ad 100644
--- a/apps/web/src/pages/library-page.tsx
+++ b/apps/web/src/pages/library-page.tsx
@@ -480,33 +480,60 @@ export function LibraryPage({
) : null}
{workbenchScope !== null && onScopeChange !== undefined ? (
// One control, two states — answers exactly one question
- // ("whose files"), styled as the bordered segmented group
- // `ViewToggle` already uses for rows/grid in this same bar, so
- // it reads as one control rather than two stray chips.
-
-
onScopeChange("workbench")}
+ // ("whose files"). At lg the bordered segmented group matches
+ // `ViewToggle` in this bar; below lg that group is hidden and
+ // the overflow menu in this same slot is the way to reach
+ // All workbenches.
+ <>
+
- {workbenchScope.title}
-
- onScopeChange("all")}
- >
- All workbenches
-
-
+ onScopeChange("workbench")}
+ >
+ {workbenchScope.title}
+
+ onScopeChange("all")}
+ >
+ All workbenches
+
+
+
+
+
+
+ {scope === "all"
+ ? "All workbenches"
+ : workbenchScope.title}
+
+
+
+ onScopeChange("workbench")}>
+ {workbenchScope.title}
+
+ onScopeChange("all")}>
+ All workbenches
+
+
+
+
+ >
) : null}
diff --git a/apps/web/test/library-page-selection.test.tsx b/apps/web/test/library-page-selection.test.tsx
index a9f3753a2..983929ebe 100644
--- a/apps/web/test/library-page-selection.test.tsx
+++ b/apps/web/test/library-page-selection.test.tsx
@@ -350,6 +350,33 @@ describe("LibraryPage top-nav action placement", () => {
);
});
+ test("the files scope control stays in the document below the lg breakpoint", () => {
+ act(() => {
+ root.render(
+ undefined}
+ />,
+ );
+ });
+ const topBarActions = container.querySelector(
+ '[data-testid="stage-top-bar-actions"]',
+ );
+ const scopeControls = [
+ ...(topBarActions?.querySelectorAll('[aria-label="Files scope"]') ?? []),
+ ];
+ expect(scopeControls.length).toBeGreaterThan(0);
+ // `hidden` is display:none. A Files-scope control that only exists
+ // behind `hidden lg:flex` vanishes below 1024px with no way to reach
+ // All workbenches. At least one control must stay in the tree without
+ // that class — the overflow menu in this bar, or the group itself.
+ expect(
+ scopeControls.some((el) => !el.className.split(/\s+/).includes("hidden")),
+ ).toBe(true);
+ });
+
test("the file detail pane fills the available height", () => {
act(() => {
root.render(