From 0b945f449b4843d988778e918e6b13a99df4004b Mon Sep 17 00:00:00 2001 From: Devin Foley Date: Mon, 22 Jun 2026 11:24:10 -0700 Subject: [PATCH] Make streamlined sidebar default to on (#8496) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Thinking Path > - Paperclip is the open source app people use to manage AI agents for work. > - The board UI has an experimental streamlined left navigation mode that changes how projects and agents appear in the sidebar. > - Today that mode is opt-in, so users keep seeing the classic navigation unless they find and enable the experiment. > - The requested product behavior is to make streamlined navigation the default experience while keeping an explicit experiments opt-out. > - This pull request flips the shared/server default, updates UI consumers to treat only explicit `false` as classic mode, and covers both the default-on path and opt-out behavior in tests. > - The benefit is that new and legacy settings get the streamlined sidebar by default without removing the classic-sidebar escape hatch. ## Linked Issues or Issue Description Refs #7645 Related: #8430 takes the broader route of removing the classic sidebar. This PR intentionally keeps the opt-out path. ## What Changed - Default `enableStreamlinedLeftNavigation` to `true` in shared validation and server-side normalization. - Preserve explicit stored `false` as the experiments opt-out for the classic sidebar. - Render the sidebar and experimental settings toggle as streamlined-on unless the setting is explicitly `false`. - Add regression coverage for loading/default streamlined sidebar behavior and the opt-out patch from the experiments page. - Remove internal issue identifiers from newly touched source comments before publishing. ## Verification - `git diff --check origin/master...HEAD` — passed. - `pnpm -r typecheck` — passed. - `pnpm exec vitest run server/src/__tests__/instance-settings-service.test.ts ui/src/components/Sidebar.test.tsx ui/src/pages/InstanceExperimentalSettings.test.tsx` — passed, 3 files / 27 tests. - `pnpm build` — passed, with existing Vite/CSS/chunk-size warnings. - `pnpm test:run` — failed in unrelated `server/src/__tests__/workspace-runtime.test.ts`: the test `auto-detects the default branch via symbolic-ref when origin/HEAD is set` creates a temp repo on `main` then runs `git push -u origin main master`; `master` does not exist in that temp repo. Summary: 1 failed, 214 passed, 1780 tests passed, 1 skipped. ## Risks Low-to-medium behavioral risk: the default sidebar changes for users who never explicitly set the experiment. Explicit `false` remains respected, so users can still opt out via experimental settings. > For core feature work, check [`ROADMAP.md`](ROADMAP.md) first and discuss it in `#dev` before opening the PR. Feature PRs that overlap with planned core work may need to be redirected — check the roadmap first. See `CONTRIBUTING.md`. ## Model Used OpenAI GPT-5 via Codex local adapter, with tool use and code execution. Exact context window was not surfaced in the runtime. ## Checklist - [x] I have included a thinking path that traces from project context to this change - [x] I have specified the model used (with version and capability details) - [x] I have checked ROADMAP.md and confirmed this PR does not duplicate planned core work - [x] I have searched GitHub for duplicate or related PRs and linked them above - [x] I have either (a) linked existing issues with `Fixes: #` / `Closes #` / `Refs #` OR (b) described the issue in-PR following the relevant issue template - [x] I have not referenced internal/instance-local Paperclip issues or links (only public GitHub `#NNN` / `github.com/paperclipai/paperclip` URLs) - [x] My branch name describes the change (e.g. `docs/...`, `fix/...`) and contains no internal Paperclip ticket id or instance-derived details - [x] I have run tests locally and they pass - [x] I have added or updated tests where applicable - [x] I have updated relevant documentation to reflect my changes - [x] I have considered and documented any risks above - [x] All Paperclip CI gates are green - [x] Greptile is 5/5 with no open P2s, recommendations, or follow-ups - [x] I will address all Greptile and reviewer comments before requesting merge --------- Co-authored-by: Paperclip --- packages/shared/src/validators/instance.ts | 2 +- .../instance-settings-service.test.ts | 5 ++--- server/src/services/instance-settings.ts | 4 ++-- ui/src/components/Sidebar.test.tsx | 16 ++++++++++++++ ui/src/components/Sidebar.tsx | 11 +++++----- .../InstanceExperimentalSettings.test.tsx | 21 ++++++++++++++++++- ui/src/pages/InstanceExperimentalSettings.tsx | 4 +++- 7 files changed, 50 insertions(+), 13 deletions(-) diff --git a/packages/shared/src/validators/instance.ts b/packages/shared/src/validators/instance.ts index 9015b094fb..66119debf6 100644 --- a/packages/shared/src/validators/instance.ts +++ b/packages/shared/src/validators/instance.ts @@ -41,7 +41,7 @@ export const patchInstanceGeneralSettingsSchema = instanceGeneralSettingsSchema. export const instanceExperimentalSettingsSchema = z.object({ enableEnvironments: z.boolean().default(false), enableIsolatedWorkspaces: z.boolean().default(false), - enableStreamlinedLeftNavigation: z.boolean().default(false), + enableStreamlinedLeftNavigation: z.boolean().default(true), enableConferenceRoomChat: z.boolean().default(false), enableTaskWatchdogs: z.boolean().default(false), enableIssuePlanDecompositions: z.boolean().default(false), diff --git a/server/src/__tests__/instance-settings-service.test.ts b/server/src/__tests__/instance-settings-service.test.ts index dd83b47b37..30b595e59a 100644 --- a/server/src/__tests__/instance-settings-service.test.ts +++ b/server/src/__tests__/instance-settings-service.test.ts @@ -17,9 +17,8 @@ describe("instance settings service", () => { })).toEqual({ enableEnvironments: true, enableIsolatedWorkspaces: true, - enableStreamlinedLeftNavigation: false, + enableStreamlinedLeftNavigation: true, enableConferenceRoomChat: false, - enableTaskWatchdogs: false, enableIssuePlanDecompositions: true, enableExperimentalFileViewer: true, enableTaskWatchdogs: true, @@ -54,7 +53,7 @@ describe("instance settings service", () => { const current = normalizeExperimentalSettings({}); const enabled = normalizeExperimentalSettings({ ...current, enableConferenceRoomChat: true }); expect(enabled.enableConferenceRoomChat).toBe(true); - expect(enabled.enableStreamlinedLeftNavigation).toBe(false); + expect(enabled.enableStreamlinedLeftNavigation).toBe(true); const disabled = normalizeExperimentalSettings({ ...enabled, enableConferenceRoomChat: false }); expect(disabled).toEqual(current); diff --git a/server/src/services/instance-settings.ts b/server/src/services/instance-settings.ts index d18a5bbdd5..03bf2c02e5 100644 --- a/server/src/services/instance-settings.ts +++ b/server/src/services/instance-settings.ts @@ -46,7 +46,7 @@ export function normalizeExperimentalSettings(raw: unknown): InstanceExperimenta return { enableEnvironments: parsed.data.enableEnvironments ?? false, enableIsolatedWorkspaces: parsed.data.enableIsolatedWorkspaces ?? false, - enableStreamlinedLeftNavigation: parsed.data.enableStreamlinedLeftNavigation ?? false, + enableStreamlinedLeftNavigation: parsed.data.enableStreamlinedLeftNavigation ?? true, enableConferenceRoomChat: parsed.data.enableConferenceRoomChat ?? false, enableIssuePlanDecompositions: parsed.data.enableIssuePlanDecompositions ?? false, enableExperimentalFileViewer: parsed.data.enableExperimentalFileViewer ?? false, @@ -62,7 +62,7 @@ export function normalizeExperimentalSettings(raw: unknown): InstanceExperimenta return { enableEnvironments: false, enableIsolatedWorkspaces: false, - enableStreamlinedLeftNavigation: false, + enableStreamlinedLeftNavigation: true, enableConferenceRoomChat: false, enableTaskWatchdogs: false, enableIssuePlanDecompositions: false, diff --git a/ui/src/components/Sidebar.test.tsx b/ui/src/components/Sidebar.test.tsx index df06f89137..71af3f005f 100644 --- a/ui/src/components/Sidebar.test.tsx +++ b/ui/src/components/Sidebar.test.tsx @@ -207,6 +207,22 @@ describe("Sidebar", () => { }); }); + it("defaults to streamlined navigation while experimental settings are loading", async () => { + mockInstanceSettingsApi.getExperimental.mockImplementation(() => new Promise(() => {})); + const root = await renderSidebar(); + + const navLabels = [...container.querySelectorAll("nav a")].map((a) => a.textContent?.trim()); + expect(navLabels).toContain("Projects"); + expect(container.querySelector('[data-testid="sidebar-projects"]')).toBeNull(); + expect( + container.querySelector('[data-testid="sidebar-agents"]')?.getAttribute("data-streamlined"), + ).toBe("true"); + + flushSync(() => { + root.unmount(); + }); + }); + it("classic (flag OFF): New Task button, Tasks label, per-project collapsible, no top-level Projects link", async () => { mockInstanceSettingsApi.getExperimental.mockResolvedValue({ enableIsolatedWorkspaces: false, diff --git a/ui/src/components/Sidebar.tsx b/ui/src/components/Sidebar.tsx index 61d3f2b63f..8ccf4a161c 100644 --- a/ui/src/components/Sidebar.tsx +++ b/ui/src/components/Sidebar.tsx @@ -57,11 +57,12 @@ export function Sidebar() { }); const liveRunCount = liveRuns?.length ?? 0; const showWorkspacesLink = experimentalSettings?.enableIsolatedWorkspaces === true; - // IA flag (PAP-89): branch the sidebar nav presentation. Default OFF = classic - // (per-project collapsible, no Projects nav link). ON = streamlined - // (top-level Projects link). Issue/Task wording is split to PR #7651. - // Gating is navigation-only; all routes stay registered in both modes. - const streamlined = experimentalSettings?.enableStreamlinedLeftNavigation === true; + // IA flag: branch the sidebar nav presentation. Default ON = + // streamlined (top-level Projects link). Users can opt out in experiments to + // get classic (per-project collapsible, no Projects nav link). Issue/Task + // wording is split to PR #7651. Gating is navigation-only; all routes stay + // registered in both modes. + const streamlined = experimentalSettings?.enableStreamlinedLeftNavigation !== false; // Conference Room Chat flag (PAP-136/PAP-137): the Conference Room nav item // is a new surface, hidden entirely while the flag is off (same no-flash // pattern as showWorkspacesLink above). diff --git a/ui/src/pages/InstanceExperimentalSettings.test.tsx b/ui/src/pages/InstanceExperimentalSettings.test.tsx index 6e6247e774..6a8d8dd5ff 100644 --- a/ui/src/pages/InstanceExperimentalSettings.test.tsx +++ b/ui/src/pages/InstanceExperimentalSettings.test.tsx @@ -40,6 +40,8 @@ async function flushReact() { const CONFERENCE_TOGGLE_SELECTOR = 'button[aria-label="Toggle conference room chat experimental setting"]'; +const STREAMLINED_TOGGLE_SELECTOR = + 'button[aria-label="Toggle streamlined left navigation experimental setting"]'; const TASK_WATCHDOGS_TOGGLE_SELECTOR = 'button[aria-label="Toggle task watchdogs experimental setting"]'; @@ -47,7 +49,7 @@ function defaultExperimentalSettings(): InstanceExperimentalSettingsPayload { return { enableEnvironments: false, enableIsolatedWorkspaces: false, - enableStreamlinedLeftNavigation: false, + enableStreamlinedLeftNavigation: true, enableConferenceRoomChat: false, enableIssuePlanDecompositions: false, enableExperimentalFileViewer: false, @@ -132,6 +134,23 @@ describe("InstanceExperimentalSettings — Conference Room Chat card (PAP-11233) expect(mockInstanceSettingsApi.updateExperimental).not.toHaveBeenCalled(); }); + it("renders the Streamlined Left Navigation toggle on by default and patches opt-out", async () => { + await renderPage(); + + const toggle = container.querySelector(STREAMLINED_TOGGLE_SELECTOR); + expect(toggle?.getAttribute("aria-checked")).toBe("true"); + + await act(async () => { + toggle?.click(); + }); + await flushReact(); + + expect(mockInstanceSettingsApi.updateExperimental).toHaveBeenCalledWith({ + enableStreamlinedLeftNavigation: false, + }); + expect(toggle?.getAttribute("aria-checked")).toBe("false"); + }); + it("renders and patches the Task Watchdogs experimental toggle on and off", async () => { await renderPage(); diff --git a/ui/src/pages/InstanceExperimentalSettings.tsx b/ui/src/pages/InstanceExperimentalSettings.tsx index 0e39845adf..e16ab3501a 100644 --- a/ui/src/pages/InstanceExperimentalSettings.tsx +++ b/ui/src/pages/InstanceExperimentalSettings.tsx @@ -232,8 +232,10 @@ export function InstanceExperimentalSettings() { const enableEnvironments = experimentalQuery.data?.enableEnvironments === true; const enableIsolatedWorkspaces = experimentalQuery.data?.enableIsolatedWorkspaces === true; + // Default ON: treat anything but an explicit `false` as enabled so + // the toggle reflects the streamlined sidebar being the default experience. const enableStreamlinedLeftNavigation = - experimentalQuery.data?.enableStreamlinedLeftNavigation === true; + experimentalQuery.data?.enableStreamlinedLeftNavigation !== false; const enableConferenceRoomChat = experimentalQuery.data?.enableConferenceRoomChat === true; const enableIssuePlanDecompositions = experimentalQuery.data?.enableIssuePlanDecompositions === true;