Make sidebar shortcuts leave focus mode (#2717)

* fix(app): exit focus mode for sidebar shortcuts

Focus mode kept sidebar actions hidden after their handlers ran. Exit only after a sidebar action is handled so the requested action still takes effect.

* fix(app): order focus exit before sidebar action

Leave focus mode before dispatching the sidebar command so its handler runs against the visible panel state.

* fix(app): preserve focus mode outside workspaces

Only exit active workspace focus mode after a sidebar shortcut is handled. Keep persisted focus state unchanged when the shortcut has no foreground workspace target.

packages/app/e2e/workspace-focus-mode.spec.ts

@@ -1,23 +1,73 @@
-import { expect, test } from "./fixtures";
+import { expect, test, type Page } from "./fixtures";
 
 const modifier = process.platform === "darwin" ? "Meta" : "Control";
 
-async function pressFocusModeShortcut(page: import("@playwright/test").Page) {
+async function pressFocusModeShortcut(page: Page) {
   await page.keyboard.press(`${modifier}+Shift+F`);
 }
 
-async function pressSettingsShortcut(page: import("@playwright/test").Page) {
+async function pressSettingsShortcut(page: Page) {
   await page.keyboard.press(`${modifier}+Comma`);
 }
 
-async function blurActiveElement(page: import("@playwright/test").Page) {
+async function pressRightSidebarShortcut(page: Page) {
+  await page.keyboard.press(`${modifier}+E`);
+}
+
+async function returnToWorkspace(page: Page, workspaceUrl: string) {
+  await page.goto(workspaceUrl);
+}
+
+async function blurActiveElement(page: Page) {
   await page.evaluate(() => (document.activeElement as HTMLElement | null)?.blur());
 }
 
+function exitFocusModeButton(page: Page) {
+  return page.getByRole("button", { name: "Exit focus mode" });
+}
+
+async function enterFocusMode(page: Page) {
+  await blurActiveElement(page);
+  await pressFocusModeShortcut(page);
+  await expect(exitFocusModeButton(page)).toBeVisible();
+}
+
+test("sidebar shortcuts exit focus mode and execute their action", async ({
+  page,
+  withWorkspace,
+}) => {
+  const workspace = await withWorkspace({ prefix: "focus-mode-sidebar-shortcut-" });
+  await workspace.navigateTo();
+  await enterFocusMode(page);
+
+  await pressRightSidebarShortcut(page);
+
+  await expect(exitFocusModeButton(page)).toHaveCount(0);
+  await expect(page.getByText("Changes", { exact: true })).toBeVisible();
+});
+
+test("sidebar shortcuts outside a workspace preserve its focus mode", async ({
+  page,
+  withWorkspace,
+}) => {
+  const workspace = await withWorkspace({ prefix: "focus-mode-sidebar-boundary-" });
+  await workspace.navigateTo();
+  await enterFocusMode(page);
+  const workspaceUrl = page.url();
+
+  await pressSettingsShortcut(page);
+  await expect(page.getByRole("navigation", { name: "Settings" })).toBeVisible();
+
+  await pressRightSidebarShortcut(page);
+  await returnToWorkspace(page, workspaceUrl);
+
+  await expect(exitFocusModeButton(page)).toBeVisible();
+});
+
 test("focus mode only applies to the active workspace screen", async ({ page, withWorkspace }) => {
   const workspace = await withWorkspace({ prefix: "focus-mode-boundary-" });
   await workspace.navigateTo();
-  const exitFocusMode = page.getByRole("button", { name: "Exit focus mode" });
+  const exitFocusMode = exitFocusModeButton(page);
   const settingsButton = page.getByRole("button", { name: "Settings", exact: true });
   const settingsSidebar = page.getByRole("navigation", { name: "Settings" });
 
@@ -41,7 +91,7 @@ test("focus mode only applies to the active workspace screen", async ({ page, wi
   await expect(exitFocusMode).toHaveCount(0);
 
   await pressFocusModeShortcut(page);
-  await page.goto(workspaceUrl);
+  await returnToWorkspace(page, workspaceUrl);
 
   await expect(exitFocusMode).toBeVisible();
   await exitFocusMode.click();