From 43514fb96a886086ac8a7d2da58da4d0e15ca17a Mon Sep 17 00:00:00 2001
From: Owen McGirr <o.a.mcgirr@gmail.com>
Date: Tue, 6 Oct 2026 19:35:16 +0100
Subject: [PATCH 1/5] Show the account in the sidebar instead of the version

The sidebar footer now shows the settings sync account: "Account" with
the signed-in email (shortened with an ellipsis), or "Sign in" when signed
out. Selecting it opens Settings on the Account section with focus there,
the way update notices open the Updates section. It follows account changes
live. Builds without accounts keep showing the version, which also remains
in Settings > Updates and on Home.

Refs #992

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 src/App.test.tsx                | 52 ++++++++++++++++++++++++++++++++-
 src/App.tsx                     | 41 +++++++++++++++++++++++---
 src/settings/AccountSection.tsx | 16 +++++-----
 src/settings/SettingsView.tsx   | 22 ++++++++++++--
 src/ui/app.css                  |  6 ++++
 5 files changed, 121 insertions(+), 16 deletions(-)

diff --git a/src/App.test.tsx b/src/App.test.tsx
index 8c0840ef..690f454e 100644
--- a/src/App.test.tsx
+++ b/src/App.test.tsx
@@ -2,7 +2,7 @@ import { act, fireEvent, render, screen, waitFor, within } from "@testing-librar
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { App } from "./App";
 import { api, browserState } from "./api";
-import type { BluetoothState, SwitchProfile } from "./types";
+import type { AccountView, BluetoothState, SwitchProfile } from "./types";
 
 import * as switchHooks from "./scanning/useSwitches";
 import * as scanHooks from "./scanning/useScanning";
@@ -580,6 +580,56 @@ describe("Switchify PC shell", () => {
     await waitFor(() => expect(opener).toHaveFocus());
   });
 
+  describe("sidebar account", () => {
+    const signedIn: AccountView = { available: true, signedIn: true, email: "me@example.com", pendingEmail: null, keychainUnavailable: false };
+    const signedOut: AccountView = { ...signedIn, signedIn: false, email: null };
+    const sidebar = async () => {
+      await screen.findByRole("navigation");
+      return within(document.querySelector("aside") as HTMLElement);
+    };
+    const mockAccount = (view: AccountView) => {
+      let receive: (next: AccountView) => void = () => undefined;
+      vi.spyOn(api, "account").mockResolvedValue(view);
+      vi.spyOn(api, "onAccount").mockImplementation(async (handler) => { receive = handler; return () => undefined; });
+      vi.spyOn(api, "settingsSync").mockResolvedValue({ status: "upToDate", lastSyncedAt: null, message: null });
+      vi.spyOn(api, "onSettingsSync").mockResolvedValue(() => undefined);
+      return (next: AccountView) => receive(next);
+    };
+
+    it("replaces the version with the signed-in account", async () => {
+      mockAccount(signedIn);
+      render(<App />);
+      const entry = await (await sidebar()).findByRole("button", { name: "Account, signed in as me@example.com" });
+      expect(entry).toHaveTextContent("Accountme@example.com");
+      expect((await sidebar()).queryByText(/^v\d/)).not.toBeInTheDocument();
+    });
+
+    it("offers sign-in when signed out and follows account changes", async () => {
+      const receive = mockAccount(signedOut);
+      render(<App />);
+      expect(await (await sidebar()).findByRole("button", { name: "Sign in to your account" })).toHaveTextContent("Sign in");
+      act(() => receive(signedIn));
+      expect(await (await sidebar()).findByRole("button", { name: "Account, signed in as me@example.com" })).toBeInTheDocument();
+    });
+
+    it("opens Settings on the Account section", async () => {
+      mockAccount(signedIn);
+      render(<App />);
+      fireEvent.click(await (await sidebar()).findByRole("button", { name: /^Account, signed in/ }));
+      expect(screen.getByRole("tab", { name: "Account" })).toHaveAttribute("aria-selected", "true");
+      const section = await screen.findByRole("region", { name: "Account" });
+      await waitFor(() => expect(section).toHaveFocus());
+      expect(screen.getByText(/Signed in as/)).toBeInTheDocument();
+    });
+
+    it("keeps the version in builds without accounts", async () => {
+      mockAccount({ ...signedOut, available: false });
+      render(<App />);
+      expect(await (await sidebar()).findByText(`v${browserState.version}`)).toBeInTheDocument();
+      expect((await sidebar()).queryByRole("button", { name: /account/i })).not.toBeInTheDocument();
+    });
+  });
+
   it("refreshes Switch Forwarding profiles when settings sync changes them", async () => {
     let changed: () => void = () => undefined;
     vi.spyOn(api, "onProfilesChanged").mockImplementation(async (handler) => { changed = handler; return () => undefined; });
diff --git a/src/App.tsx b/src/App.tsx
index df242f55..e6753b9b 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,12 +2,12 @@ import { Button, Input, Select } from "./ui/controls";
 import { Demonstration, DemonstrationProvider } from "./help/Demonstration";
 import { useEffect, useId, useMemo, useRef, useState, type ReactNode } from "react";
 import {
-  Accessibility, Bluetooth, ChevronRight, CircleHelp, Download,
+  Accessibility, Bluetooth, ChevronRight, CircleHelp, CircleUserRound, Download,
   Copy, Home, Keyboard, MousePointer2, Plus, Power, RefreshCw, Save, Settings,
   SlidersHorizontal, Smartphone, Trash2, Wrench, X,
 } from "lucide-react";
 import { api, type ProfileExitAction } from "./api";
-import type { AppSettings, AppState, PendingPairing, SwitchProfile, UpdateState } from "./types";
+import type { AccountView, AppSettings, AppState, PendingPairing, SwitchProfile, UpdateState } from "./types";
 import { applyLocalSettings, changedSettingKeys } from "./settings/diff";
 import { SettingsView } from "./settings/SettingsView";
 import { MouseSettingsView } from "./settings/MouseSettingsView";
@@ -45,6 +45,20 @@ const bluetoothDescriptions: Record<AppState["bluetooth"], string> = {
   error: "Bluetooth could not start. Try restarting Switchify PC.",
 };
 
+// Replaces the version label: who is signed in, one press from managing it.
+// Builds without accounts keep the version, which Settings → Updates also shows.
+function SidebarAccount({ account, version, onOpen }: { account: AccountView | null; version: string; onOpen: () => void }) {
+  if (!account?.available) return <span>v{version}</span>;
+  const label = account.signedIn && account.email ? `Account, signed in as ${account.email}` : "Sign in to your account";
+  return <Button className="nav-button sidebar-account" aria-label={label} onClick={onOpen}>
+    <CircleUserRound size={19} aria-hidden="true" />
+    <span className="sidebar-account-text">
+      <span>{account.signedIn ? "Account" : "Sign in"}</span>
+      {account.signedIn && account.email && <small title={account.email}>{account.email}</small>}
+    </span>
+  </Button>;
+}
+
 function NavButton({ active, icon, children, onClick }: { active: boolean; icon: ReactNode; children: ReactNode; onClick: () => void }) {
   return <Button className="nav-button" data-active={active} aria-current={active ? "page" : undefined} onClick={onClick}>{icon}<span>{children}</span></Button>;
 }
@@ -508,6 +522,8 @@ export function App() {
   const [settings, setSettings] = useState<AppSettings | null>(null);
   const [busy, setBusy] = useState(false);
   const [focusUpdates, setFocusUpdates] = useState(false);
+  const [focusAccount, setFocusAccount] = useState(false);
+  const [account, setAccount] = useState<AccountView | null>(null);
   // --- Update failures away from the Updates tab ------------------------------
   // Failed and cancelled are the updater states with something to act on that
   // the global banner deliberately leaves out: the scheduled check fails for
@@ -695,6 +711,13 @@ export function App() {
     return () => unlisten();
   }, []);
 
+  useEffect(() => {
+    let active = true;
+    void api.account().then((view) => { if (active) setAccount(view); }).catch(() => undefined);
+    const stop = api.onAccount((view) => setAccount(view));
+    return () => { active = false; void stop.then((unlisten) => unlisten()); };
+  }, []);
+
   useEffect(() => {
     let unlisten: () => void = () => {};
     let disposed = false;
@@ -765,6 +788,16 @@ export function App() {
     setFocusUpdates(true);
   };
 
+  const openAccount = () => {
+    if (viewRef.current !== "settings") {
+      if (profileEditorDirty.current && !window.confirm("Discard unsaved profile changes?")) return;
+      profileEditorDirty.current = false;
+      viewRef.current = "settings";
+      setView("settings");
+    }
+    setFocusAccount(true);
+  };
+
   const saveProfile = async (profile: SwitchProfile) => {
     setBusy(true); setError(null);
     try { setProfiles(await api.saveProfile(profile)); }
@@ -792,7 +825,7 @@ export function App() {
 
   if (!state || !settings) return <div className="loading"><RefreshCw className="spin" size={24} /><span>Starting Switchify PC...</span></div>;
   return <DemonstrationProvider platform={state.capabilities.platform} suspended={state.pendingPairings.length > 0 || switches.capturing || !!switches.state?.capture.active}><div className="app-shell">
-    <aside inert={setupOpen || state.pendingPairings.length > 0}><div className="brand"><img className="brand-mark" src={brandIconUrl} alt="" aria-hidden="true" /><div><strong>Switchify</strong><small>PC</small></div></div><nav>{nav.map(([id, label, icon]) => <NavButton key={id} active={view === id || (id === "mobile" && (view === "devices" || view === "profiles"))} icon={icon} onClick={() => selectView(id)}>{label}</NavButton>)}</nav><div className="sidebar-footer"><span>v{state.version}</span></div></aside>
+    <aside inert={setupOpen || state.pendingPairings.length > 0}><div className="brand"><img className="brand-mark" src={brandIconUrl} alt="" aria-hidden="true" /><div><strong>Switchify</strong><small>PC</small></div></div><nav>{nav.map(([id, label, icon]) => <NavButton key={id} active={view === id || (id === "mobile" && (view === "devices" || view === "profiles"))} icon={icon} onClick={() => selectView(id)}>{label}</NavButton>)}</nav><div className="sidebar-footer"><SidebarAccount account={account} version={state.version} onOpen={openAccount} /></div></aside>
     <DemonstrationProvider platform={state.capabilities.platform} suspended={setupOpen || state.pendingPairings.length > 0 || switches.capturing || !!switches.state?.capture.active}><main inert={setupOpen || state.pendingPairings.length > 0}>
       {error && <div className="error-banner" role="alert">{error}<Button onClick={() => setError(null)}>Dismiss</Button></div>}
       <UpdateBanner update={state.updater} openUpdates={openUpdates} />
@@ -806,7 +839,7 @@ export function App() {
       {view === "devices" && <DevicesView state={state} forget={(id) => void perform(() => api.forgetDevice(id))} />}
       {view === "profiles" && <ProfilesView profiles={profiles} platform={state.capabilities.platform} busy={busy} saveProfile={saveProfile} deleteProfile={deleteProfile} onDirtyChange={(dirty) => { profileEditorDirty.current = dirty; }} nativeExitRequest={profileExitRequest} onConfirmNativeExit={confirmProfileExit} onCancelNativeExit={cancelProfileExit} />}
       </TabPanel></div>}
-      {view === "settings" && <SettingsView state={state} settings={settings} onChange={changeSettings} chooseTelemetry={(enabled) => void perform(() => api.setTelemetryConsent(enabled))} updateAction={(action) => void runUpdate(action)} cancelUpdate={() => void cancelUpdate()} busy={busy} focusUpdates={focusUpdates} onUpdatesFocused={() => setFocusUpdates(false)} updateAttention={updateFailure?.text ?? null} onUpdatesShown={setUpdatesShown} />}
+      {view === "settings" && <SettingsView state={state} settings={settings} onChange={changeSettings} chooseTelemetry={(enabled) => void perform(() => api.setTelemetryConsent(enabled))} updateAction={(action) => void runUpdate(action)} cancelUpdate={() => void cancelUpdate()} busy={busy} focusUpdates={focusUpdates} onUpdatesFocused={() => setFocusUpdates(false)} focusAccount={focusAccount} onAccountFocused={() => setFocusAccount(false)} updateAttention={updateFailure?.text ?? null} onUpdatesShown={setUpdatesShown} />}
       {view === "support" && <SupportView state={state} switches={switches} busy={busy} perform={(operation) => void perform(operation)} openSetup={openSetup} openUpdates={openUpdates} />}
     </main></DemonstrationProvider>
     {setupOpen && <SetupGuide state={state} switches={switches} suspended={state.pendingPairings.length > 0} busy={busy} error={error} skip={skipSetup} finish={finishSetup} accessibility={() => perform(() => api.checkAccessibility(true))} />}
diff --git a/src/settings/AccountSection.tsx b/src/settings/AccountSection.tsx
index a34a1a0c..75f25032 100644
--- a/src/settings/AccountSection.tsx
+++ b/src/settings/AccountSection.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState, type FormEvent } from "react";
+import { useEffect, useRef, useState, type FormEvent, type Ref } from "react";
 import { api } from "../api";
 import { Button, Input } from "../ui/controls";
 import type { AccountView, SyncView } from "../types";
@@ -17,7 +17,7 @@ function screenOf(account: AccountView | null): Screen {
   return account.pendingEmail ? "pending" : "signedOut";
 }
 
-export function AccountSection() {
+export function AccountSection({ sectionRef }: { sectionRef?: Ref<HTMLElement> } = {}) {
   const [account, setAccount] = useState<AccountView | null>(null);
   const [email, setEmail] = useState("");
   const [code, setCode] = useState("");
@@ -108,22 +108,22 @@ export function AccountSection() {
     void run(() => api.verifySignInCode(code), () => "signOut").then((ok) => { if (ok) setCode(""); });
   };
 
-  if (!account) return <SettingGroup title="Account" description={description}><p className="setting-note">Loading…</p></SettingGroup>;
+  if (!account) return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}><p className="setting-note">Loading…</p></SettingGroup>;
 
   // Keyed by occurrence so the same message is announced again.
   const errorText = error && <span key={error.id} className="field-error" id="account-error" role="alert">{error.text}</span>;
   const errorProps = { "aria-invalid": Boolean(error), "aria-describedby": error ? "account-error" : undefined };
 
   if (!account.available) {
-    return <SettingGroup title="Account" description={description}><p className="setting-note">Accounts are unavailable in this build.</p></SettingGroup>;
+    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}><p className="setting-note">Accounts are unavailable in this build.</p></SettingGroup>;
   }
 
   if (account.keychainUnavailable) {
-    return <SettingGroup title="Account" description={description}><p ref={keychainRef} tabIndex={-1} className="setting-note" role="status">Your saved sign-in can't be read because this computer's keychain is locked or unavailable. Unlock it, then reopen this tab.</p></SettingGroup>;
+    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}><p ref={keychainRef} tabIndex={-1} className="setting-note" role="status">Your saved sign-in can't be read because this computer's keychain is locked or unavailable. Unlock it, then reopen this tab.</p></SettingGroup>;
   }
 
   if (account.signedIn) {
-    return <SettingGroup title="Account" description={description}>
+    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}>
       <p className="setting-note" role="status">Signed in as <strong>{account.email}</strong>.</p>
       {!confirmDelete && <SyncPanel />}
       {confirmDelete
@@ -143,7 +143,7 @@ export function AccountSection() {
   }
 
   if (account.pendingEmail) {
-    return <SettingGroup title="Account" description={description}>
+    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}>
       <form onSubmit={verifyCode} aria-busy={busy}>
         <p className="setting-note" role="status">We sent a code to <strong>{account.pendingEmail}</strong>. It can take a minute to arrive.</p>
         <label className="field"><span>Code from the email</span>
@@ -159,7 +159,7 @@ export function AccountSection() {
     </SettingGroup>;
   }
 
-  return <SettingGroup title="Account" description={description}>
+  return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}>
     <form onSubmit={requestCode} aria-busy={busy}>
       <label className="field"><span>Email</span>
         <Input ref={emailRef} type="email" value={email} autoComplete="email" maxLength={254} readOnly={busy}
diff --git a/src/settings/SettingsView.tsx b/src/settings/SettingsView.tsx
index 5a064121..cb2b1a9a 100644
--- a/src/settings/SettingsView.tsx
+++ b/src/settings/SettingsView.tsx
@@ -11,12 +11,13 @@ import { UpdatesSection, type UpdateAction } from "./UpdatesSection";
 
 type SettingsTabId = "general" | "input" | "cursor" | "account" | "privacy" | "updates";
 
-export function SettingsView({ state, settings, onChange, chooseTelemetry, updateAction, cancelUpdate, busy, focusUpdates, onUpdatesFocused, updateAttention, onUpdatesShown }: { state: AppState; settings: AppSettings; onChange: (next: AppSettings) => void; chooseTelemetry: (enabled: boolean) => void; updateAction: (action: UpdateAction) => void; cancelUpdate: () => void; busy: boolean; focusUpdates: boolean; onUpdatesFocused: () => void; updateAttention: string | null; onUpdatesShown: (shown: boolean) => void }) {
+export function SettingsView({ state, settings, onChange, chooseTelemetry, updateAction, cancelUpdate, busy, focusUpdates, onUpdatesFocused, focusAccount = false, onAccountFocused = () => undefined, updateAttention, onUpdatesShown }: { state: AppState; settings: AppSettings; onChange: (next: AppSettings) => void; chooseTelemetry: (enabled: boolean) => void; updateAction: (action: UpdateAction) => void; cancelUpdate: () => void; busy: boolean; focusUpdates: boolean; onUpdatesFocused: () => void; focusAccount?: boolean; onAccountFocused?: () => void; updateAttention: string | null; onUpdatesShown: (shown: boolean) => void }) {
   const updatesRef = useRef<HTMLElement>(null);
+  const accountRef = useRef<HTMLElement>(null);
   // Opening straight to Updates starts there, rather than committing General
   // for one frame and letting App announce a failure for a tab already being
   // opened.
-  const [active, setActive] = useState<SettingsTabId>(focusUpdates ? "updates" : "general");
+  const [active, setActive] = useState<SettingsTabId>(focusUpdates ? "updates" : focusAccount ? "account" : "general");
 
   // App owns the standing update failure and what has been said about it; this
   // view only reports whether the Updates panel, which shows it, is on screen.
@@ -43,6 +44,21 @@ export function SettingsView({ state, settings, onChange, chooseTelemetry, updat
     if (focusUpdates) setActive("updates");
   }, [focusUpdates]);
 
+  useEffect(() => {
+    if (focusAccount) setActive("account");
+  }, [focusAccount]);
+
+  // Opened from the sidebar account entry: land on the account section.
+  // It renders after loading, so wait for it before handing focus over.
+  useEffect(() => {
+    if (!focusAccount || active !== "account") return;
+    const section = accountRef.current;
+    if (!section) return;
+    section.scrollIntoView?.({ block: "start" });
+    section.focus({ preventScroll: true });
+    onAccountFocused();
+  });
+
   useEffect(() => {
     if (!focusUpdates || active !== "updates") return;
     updatesRef.current?.scrollIntoView?.({ block: "start" });
@@ -58,7 +74,7 @@ export function SettingsView({ state, settings, onChange, chooseTelemetry, updat
       {active === "general" && <GeneralSection settings={settings} update={update} />}
       {active === "input" && <InputSection settings={settings} update={update} />}
       {active === "cursor" && <CursorSection settings={settings} update={update} />}
-      {active === "account" && <AccountSection />}
+      {active === "account" && <AccountSection sectionRef={accountRef} />}
       {active === "privacy" && <PrivacySection state={state} settings={settings} update={update} chooseTelemetry={chooseTelemetry} busy={busy} />}
       {active === "updates" && <UpdatesSection state={state} run={updateAction} cancel={cancelUpdate} sectionRef={updatesRef} />}
     </TabPanel>
diff --git a/src/ui/app.css b/src/ui/app.css
index 99daa132..15f41e2d 100644
--- a/src/ui/app.css
+++ b/src/ui/app.css
@@ -676,3 +676,9 @@ fieldset:disabled :is(.color-options, .scanner-colours) label:not(:has(input:che
    as disabled ones. */
 .btn[aria-disabled="true"] { cursor: default; }
 .btn[aria-disabled="true"]:not(fieldset:disabled *) { border-color: var(--border); color: var(--ink-disabled); background: var(--surface-disabled); }
+
+/* The sidebar account entry replaces the version label: a full-size control
+   whose email shortens with an ellipsis rather than widening the sidebar. */
+.sidebar-footer .sidebar-account { width: 100%; }
+.sidebar-account-text { display: flex; flex-direction: column; min-width: 0; text-align: start; }
+.sidebar-account-text small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }

From e79ec08cbd8d78870cbeb2a60fec9adaf7cadbf1 Mon Sep 17 00:00:00 2001
From: Owen McGirr <o.a.mcgirr@gmail.com>
Date: Tue, 6 Oct 2026 19:42:46 +0100
Subject: [PATCH 2/5] Keep the sidebar account accurate without keychain
 prompts

Address review on the sidebar account entry:
- The sidebar reads the account with a new read-only get_account_status
  command, so loading it never re-reads (and never prompts for) the
  keychain; only opening the Account tab does.
- Opening the Account tab broadcasts the account, so a sign-in recovered
  from a locked keychain reaches the sidebar too.
- While the keychain is locked the entry says Account, not Sign in.
- The entry lines up with the nav buttons and stays visible in the compact
  layout, where the footer was hidden.
- Tests cover the read-only status, the locked keychain, opening from
  another Settings tab, and a cancelled discard of a profile edit.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 src-tauri/build.rs                            |  1 +
 src-tauri/capabilities/main.json              |  1 +
 .../autogenerated/get_account_status.toml     | 11 +++++
 src-tauri/src/lib.rs                          | 14 +++++-
 src/App.test.tsx                              | 44 +++++++++++++++++++
 src/App.tsx                                   |  9 ++--
 src/api.ts                                    |  2 +
 src/settings/SettingsView.tsx                 |  4 +-
 src/ui/app.css                                |  6 +++
 9 files changed, 86 insertions(+), 6 deletions(-)
 create mode 100644 src-tauri/permissions/autogenerated/get_account_status.toml

diff --git a/src-tauri/build.rs b/src-tauri/build.rs
index 390b04be..876a13e4 100644
--- a/src-tauri/build.rs
+++ b/src-tauri/build.rs
@@ -41,6 +41,7 @@ fn main() {
         "install_update",
         "export_diagnostics",
         "get_account",
+        "get_account_status",
         "request_sign_in_code",
         "verify_sign_in_code",
         "cancel_sign_in",
diff --git a/src-tauri/capabilities/main.json b/src-tauri/capabilities/main.json
index 79b678ce..47fca436 100644
--- a/src-tauri/capabilities/main.json
+++ b/src-tauri/capabilities/main.json
@@ -41,6 +41,7 @@
     "allow-install-update",
     "allow-export-diagnostics",
     "allow-get-account",
+    "allow-get-account-status",
     "allow-request-sign-in-code",
     "allow-verify-sign-in-code",
     "allow-cancel-sign-in",
diff --git a/src-tauri/permissions/autogenerated/get_account_status.toml b/src-tauri/permissions/autogenerated/get_account_status.toml
new file mode 100644
index 00000000..ac2dba83
--- /dev/null
+++ b/src-tauri/permissions/autogenerated/get_account_status.toml
@@ -0,0 +1,11 @@
+# Automatically generated - DO NOT EDIT!
+
+[[permission]]
+identifier = "allow-get-account-status"
+description = "Enables the get_account_status command without any pre-configured scope."
+commands.allow = ["get_account_status"]
+
+[[permission]]
+identifier = "deny-get-account-status"
+description = "Denies the get_account_status command without any pre-configured scope."
+commands.deny = ["get_account_status"]
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index e6fe8195..121347bb 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -832,7 +832,9 @@ async fn get_account(
     account: State<'_, account::Account>,
 ) -> Result<account::AccountView, String> {
     let view = account.view().await;
-    // Opening the tab can find a session a locked keychain hid at startup.
+    // Opening the tab can recover a session a locked keychain hid at startup;
+    // tell the rest of the UI (e.g. the sidebar) too.
+    account::emit(&app, &view);
     if view.signed_in {
         if let Some(sync) = sync_engine(&app) {
             if sync.view().status == settings_sync::Status::Off {
@@ -843,6 +845,15 @@ async fn get_account(
     Ok(view)
 }
 
+/// The account as currently known, without re-reading the keychain, for
+/// views that load without the user asking (such as the sidebar).
+#[tauri::command]
+async fn get_account_status(
+    account: State<'_, account::Account>,
+) -> Result<account::AccountView, String> {
+    Ok(account.current_view().await)
+}
+
 #[tauri::command]
 async fn request_sign_in_code(
     app: AppHandle,
@@ -1767,6 +1778,7 @@ pub fn run() {
             install_update,
             export_diagnostics,
             get_account,
+            get_account_status,
             request_sign_in_code,
             verify_sign_in_code,
             cancel_sign_in,
diff --git a/src/App.test.tsx b/src/App.test.tsx
index 690f454e..f15c8885 100644
--- a/src/App.test.tsx
+++ b/src/App.test.tsx
@@ -587,10 +587,13 @@ describe("Switchify PC shell", () => {
       await screen.findByRole("navigation");
       return within(document.querySelector("aside") as HTMLElement);
     };
+    let lastStatus: ReturnType<typeof vi.spyOn> | undefined;
     const mockAccount = (view: AccountView) => {
       let receive: (next: AccountView) => void = () => undefined;
+      const status = vi.spyOn(api, "accountStatus").mockResolvedValue(view);
       vi.spyOn(api, "account").mockResolvedValue(view);
       vi.spyOn(api, "onAccount").mockImplementation(async (handler) => { receive = handler; return () => undefined; });
+      lastStatus = status;
       vi.spyOn(api, "settingsSync").mockResolvedValue({ status: "upToDate", lastSyncedAt: null, message: null });
       vi.spyOn(api, "onSettingsSync").mockResolvedValue(() => undefined);
       return (next: AccountView) => receive(next);
@@ -622,6 +625,47 @@ describe("Switchify PC shell", () => {
       expect(screen.getByText(/Signed in as/)).toBeInTheDocument();
     });
 
+    it("reads the account without the keychain-retrying command", async () => {
+      mockAccount(signedIn);
+      const retrying = vi.mocked(api.account);
+      render(<App />);
+      await (await sidebar()).findByRole("button", { name: /^Account, signed in/ });
+      expect(lastStatus).toHaveBeenCalled();
+      expect(retrying).not.toHaveBeenCalled();
+    });
+
+    it("stays neutral while the keychain is locked", async () => {
+      mockAccount({ ...signedOut, keychainUnavailable: true });
+      render(<App />);
+      const entry = await (await sidebar()).findByRole("button", { name: "Account" });
+      expect(entry).toHaveTextContent("Account");
+      expect(entry).not.toHaveTextContent("Sign in");
+    });
+
+    it("switches to the Account tab when Settings is already open", async () => {
+      mockAccount(signedIn);
+      render(<App />);
+      fireEvent.click(await screen.findByRole("button", { name: "Settings" }));
+      fireEvent.click(screen.getByRole("tab", { name: "Privacy" }));
+      fireEvent.click(await (await sidebar()).findByRole("button", { name: /^Account, signed in/ }));
+      expect(screen.getByRole("tab", { name: "Account" })).toHaveAttribute("aria-selected", "true");
+      await waitFor(() => expect(screen.getByRole("region", { name: "Account" })).toHaveFocus());
+    });
+
+    it("keeps an unsaved profile edit when navigation is cancelled", async () => {
+      mockAccount(signedIn);
+      vi.spyOn(window, "confirm").mockReturnValue(false);
+      render(<App />);
+      fireEvent.click(await screen.findByRole("button", { name: "Mobile" }));
+      fireEvent.click(screen.getByRole("tab", { name: "Switch Forwarding" }));
+      fireEvent.click(await screen.findByRole("button", { name: "New profile" }));
+      fireEvent.change(screen.getByLabelText("Profile name"), { target: { value: "Unsaved" } });
+      fireEvent.click(await (await sidebar()).findByRole("button", { name: /^Account, signed in/ }));
+      expect(window.confirm).toHaveBeenCalledWith("Discard unsaved profile changes?");
+      expect(screen.getByLabelText("Profile name")).toHaveValue("Unsaved");
+      expect(screen.queryByRole("tab", { name: "Account" })).not.toBeInTheDocument();
+    });
+
     it("keeps the version in builds without accounts", async () => {
       mockAccount({ ...signedOut, available: false });
       render(<App />);
diff --git a/src/App.tsx b/src/App.tsx
index e6753b9b..0f49bfab 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -49,11 +49,13 @@ const bluetoothDescriptions: Record<AppState["bluetooth"], string> = {
 // Builds without accounts keep the version, which Settings → Updates also shows.
 function SidebarAccount({ account, version, onOpen }: { account: AccountView | null; version: string; onOpen: () => void }) {
   if (!account?.available) return <span>v{version}</span>;
-  const label = account.signedIn && account.email ? `Account, signed in as ${account.email}` : "Sign in to your account";
+  // A locked keychain may hide a saved sign-in, so stay neutral then.
+  const signedOut = !account.signedIn && !account.keychainUnavailable;
+  const label = account.signedIn && account.email ? `Account, signed in as ${account.email}` : signedOut ? "Sign in to your account" : "Account";
   return <Button className="nav-button sidebar-account" aria-label={label} onClick={onOpen}>
     <CircleUserRound size={19} aria-hidden="true" />
     <span className="sidebar-account-text">
-      <span>{account.signedIn ? "Account" : "Sign in"}</span>
+      <span>{signedOut ? "Sign in" : "Account"}</span>
       {account.signedIn && account.email && <small title={account.email}>{account.email}</small>}
     </span>
   </Button>;
@@ -713,7 +715,8 @@ export function App() {
 
   useEffect(() => {
     let active = true;
-    void api.account().then((view) => { if (active) setAccount(view); }).catch(() => undefined);
+    // Read-only: loading the sidebar must never prompt for the keychain.
+    void api.accountStatus().then((view) => { if (active) setAccount(view); }).catch(() => undefined);
     const stop = api.onAccount((view) => setAccount(view));
     return () => { active = false; void stop.then((unlisten) => unlisten()); };
   }, []);
diff --git a/src/api.ts b/src/api.ts
index f2614c29..9cb927a9 100644
--- a/src/api.ts
+++ b/src/api.ts
@@ -115,6 +115,8 @@ export const api = {
   installUpdate: () => call<AppState>("install_update"),
   exportDiagnostics: () => call<AppState>("export_diagnostics"),
   account: () => accountCall("get_account"),
+  /** The account without re-reading the keychain, for background views. */
+  accountStatus: () => accountCall("get_account_status"),
   requestSignInCode: (email: string) => accountCall("request_sign_in_code", { email }),
   verifySignInCode: (code: string) => accountCall("verify_sign_in_code", { code }),
   cancelSignIn: () => accountCall("cancel_sign_in"),
diff --git a/src/settings/SettingsView.tsx b/src/settings/SettingsView.tsx
index cb2b1a9a..31e9da8d 100644
--- a/src/settings/SettingsView.tsx
+++ b/src/settings/SettingsView.tsx
@@ -48,8 +48,8 @@ export function SettingsView({ state, settings, onChange, chooseTelemetry, updat
     if (focusAccount) setActive("account");
   }, [focusAccount]);
 
-  // Opened from the sidebar account entry: land on the account section.
-  // It renders after loading, so wait for it before handing focus over.
+  // Opened from the sidebar account entry: land on the account section once
+  // the Account tab has rendered it.
   useEffect(() => {
     if (!focusAccount || active !== "account") return;
     const section = accountRef.current;
diff --git a/src/ui/app.css b/src/ui/app.css
index 15f41e2d..283cd4e3 100644
--- a/src/ui/app.css
+++ b/src/ui/app.css
@@ -680,5 +680,11 @@ fieldset:disabled :is(.color-options, .scanner-colours) label:not(:has(input:che
 /* The sidebar account entry replaces the version label: a full-size control
    whose email shortens with an ellipsis rather than widening the sidebar. */
 .sidebar-footer .sidebar-account { width: 100%; }
+/* Holding the account entry, the footer lines up with the nav buttons. */
+.sidebar-footer:has(.sidebar-account) { padding: 12px 0 0; }
+/* Compact layout hides the footer; the account entry stays reachable. */
+@media (max-width: 800px) {
+  .app-shell .sidebar-footer:has(.sidebar-account) { display: block; }
+}
 .sidebar-account-text { display: flex; flex-direction: column; min-width: 0; text-align: start; }
 .sidebar-account-text small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }

From 0267dfb11d427f8682556fca5d6a4fdbdfe0e776 Mon Sep 17 00:00:00 2001
From: Owen McGirr <o.a.mcgirr@gmail.com>
Date: Tue, 6 Oct 2026 20:47:36 +0100
Subject: [PATCH 3/5] Give the account its own page instead of a Settings tab

The sidebar account entry now opens an Account page, highlighted like the
other sidebar destinations while it is open, and Settings no longer has an
Account tab. The section is titled Switchify account and no longer repeats
the page's subtitle.

Refs #992

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 src/App.test.tsx                     | 28 +++++++++++++++-------------
 src/App.tsx                          | 28 ++++++++++------------------
 src/settings/AccountSection.test.tsx |  5 ++---
 src/settings/AccountSection.tsx      | 18 +++++++++---------
 src/settings/SettingsView.tsx        | 24 +++---------------------
 src/settings/settings.test.tsx       |  6 +++---
 6 files changed, 42 insertions(+), 67 deletions(-)

diff --git a/src/App.test.tsx b/src/App.test.tsx
index f15c8885..32587cea 100644
--- a/src/App.test.tsx
+++ b/src/App.test.tsx
@@ -615,14 +615,15 @@ describe("Switchify PC shell", () => {
       expect(await (await sidebar()).findByRole("button", { name: "Account, signed in as me@example.com" })).toBeInTheDocument();
     });
 
-    it("opens Settings on the Account section", async () => {
+    it("opens the Account page and marks the entry current", async () => {
       mockAccount(signedIn);
       render(<App />);
-      fireEvent.click(await (await sidebar()).findByRole("button", { name: /^Account, signed in/ }));
-      expect(screen.getByRole("tab", { name: "Account" })).toHaveAttribute("aria-selected", "true");
-      const section = await screen.findByRole("region", { name: "Account" });
-      await waitFor(() => expect(section).toHaveFocus());
-      expect(screen.getByText(/Signed in as/)).toBeInTheDocument();
+      const entry = await (await sidebar()).findByRole("button", { name: /^Account, signed in/ });
+      fireEvent.click(entry);
+      expect(await screen.findByRole("heading", { name: "Account", level: 1 })).toBeInTheDocument();
+      expect(await screen.findByText(/Signed in as/)).toBeInTheDocument();
+      expect(entry).toHaveAttribute("aria-current", "page");
+      expect(screen.queryByRole("tablist", { name: "Settings sections" })).not.toBeInTheDocument();
     });
 
     it("reads the account without the keychain-retrying command", async () => {
@@ -642,14 +643,15 @@ describe("Switchify PC shell", () => {
       expect(entry).not.toHaveTextContent("Sign in");
     });
 
-    it("switches to the Account tab when Settings is already open", async () => {
+    it("leaves the Account page from the sidebar like any other page", async () => {
       mockAccount(signedIn);
       render(<App />);
-      fireEvent.click(await screen.findByRole("button", { name: "Settings" }));
-      fireEvent.click(screen.getByRole("tab", { name: "Privacy" }));
-      fireEvent.click(await (await sidebar()).findByRole("button", { name: /^Account, signed in/ }));
-      expect(screen.getByRole("tab", { name: "Account" })).toHaveAttribute("aria-selected", "true");
-      await waitFor(() => expect(screen.getByRole("region", { name: "Account" })).toHaveFocus());
+      const entry = await (await sidebar()).findByRole("button", { name: /^Account, signed in/ });
+      fireEvent.click(entry);
+      await screen.findByRole("heading", { name: "Account", level: 1 });
+      fireEvent.click(screen.getByRole("button", { name: "Settings" }));
+      expect(await screen.findByRole("heading", { name: "Settings", level: 1 })).toBeInTheDocument();
+      expect(entry).not.toHaveAttribute("aria-current");
     });
 
     it("keeps an unsaved profile edit when navigation is cancelled", async () => {
@@ -663,7 +665,7 @@ describe("Switchify PC shell", () => {
       fireEvent.click(await (await sidebar()).findByRole("button", { name: /^Account, signed in/ }));
       expect(window.confirm).toHaveBeenCalledWith("Discard unsaved profile changes?");
       expect(screen.getByLabelText("Profile name")).toHaveValue("Unsaved");
-      expect(screen.queryByRole("tab", { name: "Account" })).not.toBeInTheDocument();
+      expect(screen.queryByRole("heading", { name: "Account", level: 1 })).not.toBeInTheDocument();
     });
 
     it("keeps the version in builds without accounts", async () => {
diff --git a/src/App.tsx b/src/App.tsx
index 0f49bfab..f2856859 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -7,6 +7,7 @@ import {
   SlidersHorizontal, Smartphone, Trash2, Wrench, X,
 } from "lucide-react";
 import { api, type ProfileExitAction } from "./api";
+import { AccountSection } from "./settings/AccountSection";
 import type { AccountView, AppSettings, AppState, PendingPairing, SwitchProfile, UpdateState } from "./types";
 import { applyLocalSettings, changedSettingKeys } from "./settings/diff";
 import { SettingsView } from "./settings/SettingsView";
@@ -22,7 +23,7 @@ import { interfaceModeAdvice, reservedKeyAdvice } from "./help/keyAvailability";
 import { SwitchesSection } from "./settings/SwitchesSection";
 import { ScanningSection } from "./settings/ScanningSection";
 
-type View = "switches" | "scanning" | "mouse" | "mobile" | "home" | "devices" | "profiles" | "settings" | "support";
+type View = "switches" | "scanning" | "mouse" | "mobile" | "home" | "devices" | "profiles" | "settings" | "support" | "account";
 
 const brandIconUrl = new URL("../src-tauri/icons/icon.png", import.meta.url).href;
 const mobileQrUrl = new URL("./assets/mobile-download-qr.png", import.meta.url).href;
@@ -45,14 +46,15 @@ const bluetoothDescriptions: Record<AppState["bluetooth"], string> = {
   error: "Bluetooth could not start. Try restarting Switchify PC.",
 };
 
-// Replaces the version label: who is signed in, one press from managing it.
-// Builds without accounts keep the version, which Settings → Updates also shows.
-function SidebarAccount({ account, version, onOpen }: { account: AccountView | null; version: string; onOpen: () => void }) {
+// Replaces the version label: who is signed in, and the way to the Account
+// page. Builds without accounts keep the version, which Settings → Updates
+// also shows.
+function SidebarAccount({ account, version, active, onOpen }: { account: AccountView | null; version: string; active: boolean; onOpen: () => void }) {
   if (!account?.available) return <span>v{version}</span>;
   // A locked keychain may hide a saved sign-in, so stay neutral then.
   const signedOut = !account.signedIn && !account.keychainUnavailable;
   const label = account.signedIn && account.email ? `Account, signed in as ${account.email}` : signedOut ? "Sign in to your account" : "Account";
-  return <Button className="nav-button sidebar-account" aria-label={label} onClick={onOpen}>
+  return <Button className="nav-button sidebar-account" data-active={active} aria-current={active ? "page" : undefined} aria-label={label} onClick={onOpen}>
     <CircleUserRound size={19} aria-hidden="true" />
     <span className="sidebar-account-text">
       <span>{signedOut ? "Sign in" : "Account"}</span>
@@ -524,7 +526,6 @@ export function App() {
   const [settings, setSettings] = useState<AppSettings | null>(null);
   const [busy, setBusy] = useState(false);
   const [focusUpdates, setFocusUpdates] = useState(false);
-  const [focusAccount, setFocusAccount] = useState(false);
   const [account, setAccount] = useState<AccountView | null>(null);
   // --- Update failures away from the Updates tab ------------------------------
   // Failed and cancelled are the updater states with something to act on that
@@ -791,16 +792,6 @@ export function App() {
     setFocusUpdates(true);
   };
 
-  const openAccount = () => {
-    if (viewRef.current !== "settings") {
-      if (profileEditorDirty.current && !window.confirm("Discard unsaved profile changes?")) return;
-      profileEditorDirty.current = false;
-      viewRef.current = "settings";
-      setView("settings");
-    }
-    setFocusAccount(true);
-  };
-
   const saveProfile = async (profile: SwitchProfile) => {
     setBusy(true); setError(null);
     try { setProfiles(await api.saveProfile(profile)); }
@@ -828,7 +819,7 @@ export function App() {
 
   if (!state || !settings) return <div className="loading"><RefreshCw className="spin" size={24} /><span>Starting Switchify PC...</span></div>;
   return <DemonstrationProvider platform={state.capabilities.platform} suspended={state.pendingPairings.length > 0 || switches.capturing || !!switches.state?.capture.active}><div className="app-shell">
-    <aside inert={setupOpen || state.pendingPairings.length > 0}><div className="brand"><img className="brand-mark" src={brandIconUrl} alt="" aria-hidden="true" /><div><strong>Switchify</strong><small>PC</small></div></div><nav>{nav.map(([id, label, icon]) => <NavButton key={id} active={view === id || (id === "mobile" && (view === "devices" || view === "profiles"))} icon={icon} onClick={() => selectView(id)}>{label}</NavButton>)}</nav><div className="sidebar-footer"><SidebarAccount account={account} version={state.version} onOpen={openAccount} /></div></aside>
+    <aside inert={setupOpen || state.pendingPairings.length > 0}><div className="brand"><img className="brand-mark" src={brandIconUrl} alt="" aria-hidden="true" /><div><strong>Switchify</strong><small>PC</small></div></div><nav>{nav.map(([id, label, icon]) => <NavButton key={id} active={view === id || (id === "mobile" && (view === "devices" || view === "profiles"))} icon={icon} onClick={() => selectView(id)}>{label}</NavButton>)}</nav><div className="sidebar-footer"><SidebarAccount account={account} version={state.version} active={view === "account"} onOpen={() => selectView("account")} /></div></aside>
     <DemonstrationProvider platform={state.capabilities.platform} suspended={setupOpen || state.pendingPairings.length > 0 || switches.capturing || !!switches.state?.capture.active}><main inert={setupOpen || state.pendingPairings.length > 0}>
       {error && <div className="error-banner" role="alert">{error}<Button onClick={() => setError(null)}>Dismiss</Button></div>}
       <UpdateBanner update={state.updater} openUpdates={openUpdates} />
@@ -842,7 +833,8 @@ export function App() {
       {view === "devices" && <DevicesView state={state} forget={(id) => void perform(() => api.forgetDevice(id))} />}
       {view === "profiles" && <ProfilesView profiles={profiles} platform={state.capabilities.platform} busy={busy} saveProfile={saveProfile} deleteProfile={deleteProfile} onDirtyChange={(dirty) => { profileEditorDirty.current = dirty; }} nativeExitRequest={profileExitRequest} onConfirmNativeExit={confirmProfileExit} onCancelNativeExit={cancelProfileExit} />}
       </TabPanel></div>}
-      {view === "settings" && <SettingsView state={state} settings={settings} onChange={changeSettings} chooseTelemetry={(enabled) => void perform(() => api.setTelemetryConsent(enabled))} updateAction={(action) => void runUpdate(action)} cancelUpdate={() => void cancelUpdate()} busy={busy} focusUpdates={focusUpdates} onUpdatesFocused={() => setFocusUpdates(false)} focusAccount={focusAccount} onAccountFocused={() => setFocusAccount(false)} updateAttention={updateFailure?.text ?? null} onUpdatesShown={setUpdatesShown} />}
+      {view === "settings" && <SettingsView state={state} settings={settings} onChange={changeSettings} chooseTelemetry={(enabled) => void perform(() => api.setTelemetryConsent(enabled))} updateAction={(action) => void runUpdate(action)} cancelUpdate={() => void cancelUpdate()} busy={busy} focusUpdates={focusUpdates} onUpdatesFocused={() => setFocusUpdates(false)} updateAttention={updateFailure?.text ?? null} onUpdatesShown={setUpdatesShown} />}
+      {view === "account" && <div className="view"><header className="page-header"><div><h1>Account</h1><p>Bring your settings to your other computers.</p></div></header><AccountSection /></div>}
       {view === "support" && <SupportView state={state} switches={switches} busy={busy} perform={(operation) => void perform(operation)} openSetup={openSetup} openUpdates={openUpdates} />}
     </main></DemonstrationProvider>
     {setupOpen && <SetupGuide state={state} switches={switches} suspended={state.pendingPairings.length > 0} busy={busy} error={error} skip={skipSetup} finish={finishSetup} accessibility={() => perform(() => api.checkAccessibility(true))} />}
diff --git a/src/settings/AccountSection.test.tsx b/src/settings/AccountSection.test.tsx
index 689fb958..a6016f93 100644
--- a/src/settings/AccountSection.test.tsx
+++ b/src/settings/AccountSection.test.tsx
@@ -253,11 +253,10 @@ describe("AccountSection", () => {
     expect(await screen.findByRole("button", { name: "Sign out" })).toBeInTheDocument();
   });
 
-  it("is reachable from the Settings tabs", async () => {
+  it("is not a Settings tab", async () => {
     const { App } = await import("../App");
     render(<App />);
     fireEvent.click(await screen.findByRole("button", { name: "Settings" }));
-    fireEvent.click(screen.getByRole("tab", { name: "Account" }));
-    expect(await screen.findByRole("heading", { name: "Account" })).toBeInTheDocument();
+    expect(screen.queryByRole("tab", { name: "Account" })).not.toBeInTheDocument();
   });
 });
diff --git a/src/settings/AccountSection.tsx b/src/settings/AccountSection.tsx
index 75f25032..1b7d9a22 100644
--- a/src/settings/AccountSection.tsx
+++ b/src/settings/AccountSection.tsx
@@ -1,10 +1,10 @@
-import { useEffect, useRef, useState, type FormEvent, type Ref } from "react";
+import { useEffect, useRef, useState, type FormEvent } from "react";
 import { api } from "../api";
 import { Button, Input } from "../ui/controls";
 import type { AccountView, SyncView } from "../types";
 import { SettingGroup } from "./controls";
 
-const description = "Sign in to bring your settings to your other computers. It is the same account as Switchify on Android. We email you a code; there is no password.";
+const description = "The same account as Switchify on Android. We email you a code to sign in; there is no password.";
 
 type FocusTarget = "email" | "code" | "signOut" | "deleteAccount" | "keepAccount";
 type Screen = "loading" | "unavailable" | "keychain" | "signedIn" | "pending" | "signedOut";
@@ -17,7 +17,7 @@ function screenOf(account: AccountView | null): Screen {
   return account.pendingEmail ? "pending" : "signedOut";
 }
 
-export function AccountSection({ sectionRef }: { sectionRef?: Ref<HTMLElement> } = {}) {
+export function AccountSection() {
   const [account, setAccount] = useState<AccountView | null>(null);
   const [email, setEmail] = useState("");
   const [code, setCode] = useState("");
@@ -108,22 +108,22 @@ export function AccountSection({ sectionRef }: { sectionRef?: Ref<HTMLElement> }
     void run(() => api.verifySignInCode(code), () => "signOut").then((ok) => { if (ok) setCode(""); });
   };
 
-  if (!account) return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}><p className="setting-note">Loading…</p></SettingGroup>;
+  if (!account) return <SettingGroup id="account" title="Switchify account" description={description}><p className="setting-note">Loading…</p></SettingGroup>;
 
   // Keyed by occurrence so the same message is announced again.
   const errorText = error && <span key={error.id} className="field-error" id="account-error" role="alert">{error.text}</span>;
   const errorProps = { "aria-invalid": Boolean(error), "aria-describedby": error ? "account-error" : undefined };
 
   if (!account.available) {
-    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}><p className="setting-note">Accounts are unavailable in this build.</p></SettingGroup>;
+    return <SettingGroup id="account" title="Switchify account" description={description}><p className="setting-note">Accounts are unavailable in this build.</p></SettingGroup>;
   }
 
   if (account.keychainUnavailable) {
-    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}><p ref={keychainRef} tabIndex={-1} className="setting-note" role="status">Your saved sign-in can't be read because this computer's keychain is locked or unavailable. Unlock it, then reopen this tab.</p></SettingGroup>;
+    return <SettingGroup id="account" title="Switchify account" description={description}><p ref={keychainRef} tabIndex={-1} className="setting-note" role="status">Your saved sign-in can't be read because this computer's keychain is locked or unavailable. Unlock it, then reopen this tab.</p></SettingGroup>;
   }
 
   if (account.signedIn) {
-    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}>
+    return <SettingGroup id="account" title="Switchify account" description={description}>
       <p className="setting-note" role="status">Signed in as <strong>{account.email}</strong>.</p>
       {!confirmDelete && <SyncPanel />}
       {confirmDelete
@@ -143,7 +143,7 @@ export function AccountSection({ sectionRef }: { sectionRef?: Ref<HTMLElement> }
   }
 
   if (account.pendingEmail) {
-    return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}>
+    return <SettingGroup id="account" title="Switchify account" description={description}>
       <form onSubmit={verifyCode} aria-busy={busy}>
         <p className="setting-note" role="status">We sent a code to <strong>{account.pendingEmail}</strong>. It can take a minute to arrive.</p>
         <label className="field"><span>Code from the email</span>
@@ -159,7 +159,7 @@ export function AccountSection({ sectionRef }: { sectionRef?: Ref<HTMLElement> }
     </SettingGroup>;
   }
 
-  return <SettingGroup id="settings-account" sectionRef={sectionRef} focusable title="Account" description={description}>
+  return <SettingGroup id="account" title="Switchify account" description={description}>
     <form onSubmit={requestCode} aria-busy={busy}>
       <label className="field"><span>Email</span>
         <Input ref={emailRef} type="email" value={email} autoComplete="email" maxLength={254} readOnly={busy}
diff --git a/src/settings/SettingsView.tsx b/src/settings/SettingsView.tsx
index 31e9da8d..d962a558 100644
--- a/src/settings/SettingsView.tsx
+++ b/src/settings/SettingsView.tsx
@@ -5,19 +5,17 @@ import { GeneralSection } from "./GeneralSection";
 import { InputSection } from "./InputSection";
 import { CursorSection } from "./CursorSection";
 import { PrivacySection } from "./PrivacySection";
-import { AccountSection } from "./AccountSection";
 import { UpdatesSection, type UpdateAction } from "./UpdatesSection";
 
 
-type SettingsTabId = "general" | "input" | "cursor" | "account" | "privacy" | "updates";
+type SettingsTabId = "general" | "input" | "cursor" | "privacy" | "updates";
 
-export function SettingsView({ state, settings, onChange, chooseTelemetry, updateAction, cancelUpdate, busy, focusUpdates, onUpdatesFocused, focusAccount = false, onAccountFocused = () => undefined, updateAttention, onUpdatesShown }: { state: AppState; settings: AppSettings; onChange: (next: AppSettings) => void; chooseTelemetry: (enabled: boolean) => void; updateAction: (action: UpdateAction) => void; cancelUpdate: () => void; busy: boolean; focusUpdates: boolean; onUpdatesFocused: () => void; focusAccount?: boolean; onAccountFocused?: () => void; updateAttention: string | null; onUpdatesShown: (shown: boolean) => void }) {
+export function SettingsView({ state, settings, onChange, chooseTelemetry, updateAction, cancelUpdate, busy, focusUpdates, onUpdatesFocused, updateAttention, onUpdatesShown }: { state: AppState; settings: AppSettings; onChange: (next: AppSettings) => void; chooseTelemetry: (enabled: boolean) => void; updateAction: (action: UpdateAction) => void; cancelUpdate: () => void; busy: boolean; focusUpdates: boolean; onUpdatesFocused: () => void; updateAttention: string | null; onUpdatesShown: (shown: boolean) => void }) {
   const updatesRef = useRef<HTMLElement>(null);
-  const accountRef = useRef<HTMLElement>(null);
   // Opening straight to Updates starts there, rather than committing General
   // for one frame and letting App announce a failure for a tab already being
   // opened.
-  const [active, setActive] = useState<SettingsTabId>(focusUpdates ? "updates" : focusAccount ? "account" : "general");
+  const [active, setActive] = useState<SettingsTabId>(focusUpdates ? "updates" : "general");
 
   // App owns the standing update failure and what has been said about it; this
   // view only reports whether the Updates panel, which shows it, is on screen.
@@ -30,7 +28,6 @@ export function SettingsView({ state, settings, onChange, chooseTelemetry, updat
     { id: "general" as const, label: "General" },
     { id: "input" as const, label: "Input" },
     ...(state.capabilities.cursorOverlay ? [{ id: "cursor" as const, label: "Cursor appearance" }] : []),
-    { id: "account" as const, label: "Account" },
     { id: "privacy" as const, label: "Privacy" },
     // On the Updates tab the panel itself shows the reason, so no marker there.
     { id: "updates" as const, label: "Updates", attention: updateAttention && active !== "updates" ? updateAttention : undefined },
@@ -44,20 +41,6 @@ export function SettingsView({ state, settings, onChange, chooseTelemetry, updat
     if (focusUpdates) setActive("updates");
   }, [focusUpdates]);
 
-  useEffect(() => {
-    if (focusAccount) setActive("account");
-  }, [focusAccount]);
-
-  // Opened from the sidebar account entry: land on the account section once
-  // the Account tab has rendered it.
-  useEffect(() => {
-    if (!focusAccount || active !== "account") return;
-    const section = accountRef.current;
-    if (!section) return;
-    section.scrollIntoView?.({ block: "start" });
-    section.focus({ preventScroll: true });
-    onAccountFocused();
-  });
 
   useEffect(() => {
     if (!focusUpdates || active !== "updates") return;
@@ -74,7 +57,6 @@ export function SettingsView({ state, settings, onChange, chooseTelemetry, updat
       {active === "general" && <GeneralSection settings={settings} update={update} />}
       {active === "input" && <InputSection settings={settings} update={update} />}
       {active === "cursor" && <CursorSection settings={settings} update={update} />}
-      {active === "account" && <AccountSection sectionRef={accountRef} />}
       {active === "privacy" && <PrivacySection state={state} settings={settings} update={update} chooseTelemetry={chooseTelemetry} busy={busy} />}
       {active === "updates" && <UpdatesSection state={state} run={updateAction} cancel={cancelUpdate} sectionRef={updatesRef} />}
     </TabPanel>
diff --git a/src/settings/settings.test.tsx b/src/settings/settings.test.tsx
index e8cdb682..06b3e16a 100644
--- a/src/settings/settings.test.tsx
+++ b/src/settings/settings.test.tsx
@@ -440,7 +440,7 @@ describe("Switchify PC settings", () => {
 
     const tablist = screen.getByRole("tablist", { name: "Settings sections" });
     expect(within(tablist).getAllByRole("tab").map((tab) => tab.textContent))
-      .toEqual(["General", "Input", "Cursor appearance", "Account", "Privacy", "Updates"]);
+      .toEqual(["General", "Input", "Cursor appearance", "Privacy", "Updates"]);
     expect(screen.getByRole("tab", { name: "General" })).toHaveAttribute("aria-selected", "true");
     expect(screen.getByRole("tabpanel")).toHaveAccessibleName("General");
   });
@@ -489,7 +489,7 @@ describe("Switchify PC settings", () => {
 
     expect(screen.queryByRole("tab", { name: "Cursor appearance" })).not.toBeInTheDocument();
     expect(screen.getAllByRole("tab").map((tab) => tab.textContent))
-      .toEqual(["General", "Input", "Account", "Privacy", "Updates"]);
+      .toEqual(["General", "Input", "Privacy", "Updates"]);
     selectTab("Input");
     expect(screen.queryByRole("checkbox", { name: "Show cursor overlay" })).not.toBeInTheDocument();
   });
@@ -558,7 +558,7 @@ describe("Switchify PC settings", () => {
     const general = screen.getByRole("tab", { name: "General" });
     expect(general).toHaveAttribute("aria-controls", "settings-panel-general");
     expect(document.getElementById("settings-panel-general")).toBeInTheDocument();
-    for (const name of ["Input", "Cursor appearance", "Account", "Privacy", "Updates"]) {
+    for (const name of ["Input", "Cursor appearance", "Privacy", "Updates"]) {
       expect(screen.getByRole("tab", { name })).not.toHaveAttribute("aria-controls");
     }
     // The panel is not a tab stop of its own; its controls are.

From 212098740d0e4b40a360b83fbef199fa9f353e95 Mon Sep 17 00:00:00 2001
From: Owen McGirr <o.a.mcgirr@gmail.com>
Date: Tue, 6 Oct 2026 20:50:58 +0100
Subject: [PATCH 4/5] Say page, not tab, in the locked keychain message

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 src-tauri/src/account.rs        | 2 +-
 src/settings/AccountSection.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src-tauri/src/account.rs b/src-tauri/src/account.rs
index 19178599..6f817de8 100644
--- a/src-tauri/src/account.rs
+++ b/src-tauri/src/account.rs
@@ -881,7 +881,7 @@ mod tests {
         // Background calls never re-read the keychain (no prompts)...
         assert!(account.authorize().await.is_err());
         assert!(transport.requests().is_empty());
-        // ...but opening the Account tab does.
+        // ...but opening the Account page does.
         let view = account.view().await;
         assert!(view.signed_in && !view.keychain_unavailable);
     }
diff --git a/src/settings/AccountSection.tsx b/src/settings/AccountSection.tsx
index 1b7d9a22..29e5ff01 100644
--- a/src/settings/AccountSection.tsx
+++ b/src/settings/AccountSection.tsx
@@ -119,7 +119,7 @@ export function AccountSection() {
   }
 
   if (account.keychainUnavailable) {
-    return <SettingGroup id="account" title="Switchify account" description={description}><p ref={keychainRef} tabIndex={-1} className="setting-note" role="status">Your saved sign-in can't be read because this computer's keychain is locked or unavailable. Unlock it, then reopen this tab.</p></SettingGroup>;
+    return <SettingGroup id="account" title="Switchify account" description={description}><p ref={keychainRef} tabIndex={-1} className="setting-note" role="status">Your saved sign-in can't be read because this computer's keychain is locked or unavailable. Unlock it, then open this page again.</p></SettingGroup>;
   }
 
   if (account.signedIn) {

From b65c363636f3aca93ddc6b1e4e4a808eadf4b1cb Mon Sep 17 00:00:00 2001
From: Owen McGirr <o.a.mcgirr@gmail.com>
Date: Tue, 6 Oct 2026 20:51:52 +0100
Subject: [PATCH 5/5] Say page, not tab, in account comments and a test name

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 src/settings/AccountSection.test.tsx | 2 +-
 src/settings/AccountSection.tsx      | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/settings/AccountSection.test.tsx b/src/settings/AccountSection.test.tsx
index a6016f93..3326417a 100644
--- a/src/settings/AccountSection.test.tsx
+++ b/src/settings/AccountSection.test.tsx
@@ -229,7 +229,7 @@ describe("AccountSection", () => {
     expect(elsewhere).toHaveFocus();
   });
 
-  it("does not move focus when the tab opens with a pending code", async () => {
+  it("does not move focus when the page opens with a pending code", async () => {
     start(pending);
     const field = await screen.findByLabelText("Code from the email");
     expect(field).not.toHaveFocus();
diff --git a/src/settings/AccountSection.tsx b/src/settings/AccountSection.tsx
index 29e5ff01..648e058b 100644
--- a/src/settings/AccountSection.tsx
+++ b/src/settings/AccountSection.tsx
@@ -24,7 +24,7 @@ export function AccountSection() {
   const [error, setError] = useState<{ text: string; id: number } | null>(null);
   const [busy, setBusy] = useState(false);
   const [confirmDelete, setConfirmDelete] = useState(false);
-  // Set only by the user's own actions, so opening the tab never moves focus.
+  // Set only by the user's own actions, so opening the page never moves focus.
   const [focusNext, setFocusNext] = useState<FocusTarget | null>(null);
   const emailRef = useRef<HTMLInputElement>(null);
   const codeRef = useRef<HTMLInputElement>(null);
@@ -50,7 +50,7 @@ export function AccountSection() {
   // middle of an action. Never carry a delete confirmation or a code into
   // another screen, and if the focused control vanished, focus the new
   // screen instead of leaving focus on the page. Focus that is still on a
-  // control (such as the tabs) is left alone.
+  // control (such as the sidebar) is left alone.
   const keychainRef = useRef<HTMLParagraphElement>(null);
   const screen = screenOf(account);
   const previousScreen = useRef<Screen>(screen);