feat(status-ui): improve bridge recovery and desktop controls

test/tauri-ui.test.js

@@ -37,6 +37,20 @@ test("renders every Pi RPC extension UI method without replying to fire-and-forg
 	assert.match(source, /transcript\.scrollTop = transcript\.scrollHeight/);
 	assert.match(source, /requestAnimationFrame\(scrollToLatest\)/);
 	assert.match(source, /const loadGeneration = useRef\(0\)/);
+	assert.match(
+		source,
+		/const bridgeRetryTimer = useRef<number \| undefined>\(undefined\)/,
+	);
+	assert.match(source, /const bridgeRetryAttempt = useRef\(0\)/);
+	assert.match(source, /function scheduleBridgeReconnect/);
+	assert.match(source, /Bridge unavailable; retrying in/);
+	assert.match(
+		source,
+		/setStatus\(String\(error\)\);\s*scheduleBridgeReconnect\(\);/,
+	);
+	assert.match(source, /bridgeRetryTimer\.current = window\.setTimeout/);
+	assert.match(source, /void refreshAgents\(preferredPath\)/);
+	assert.match(source, /bridgeRetryAttempt\.current = 0/);
 	assert.match(
 		source,
 		/const lastEventSequence = useRef<Record<string, number>>/,
@@ -62,6 +76,52 @@ test("renders every Pi RPC extension UI method without replying to fire-and-forg
 	);
 });
 
+test("exposes accessible directory, session, notification, and extension controls", async () => {
+	const [component, styles] = await Promise.all([
+		readFile("ui/src/App.tsx", "utf8"),
+		readFile("ui/src/App.css", "utf8"),
+	]);
+	assert.match(component, /aria-expanded=\{view === "settings"\}/);
+	assert.match(
+		component,
+		/aria-label="Managed directories"\s+className="directory-tab-list"\s+role="tablist"/,
+	);
+	assert.match(component, /role="tab"/);
+	assert.match(
+		component,
+		/aria-selected=\{directory\.agentId === selectedId\}/,
+	);
+	assert.match(component, /aria-controls="directory-workspace"/);
+	assert.match(component, /onKeyDown=\{\(event\) => handleDirectoryTabKeyDown/);
+	assert.match(
+		component,
+		/aria-current=\{session\.isCurrent \? "page" : undefined\}/,
+	);
+	assert.match(component, /role="status" aria-atomic="true"/);
+	assert.match(component, /aria-hidden="true"/);
+	assert.match(
+		component,
+		/role=\{notice\.notifyType === "error" \? "alert" : "status"\}/,
+	);
+	assert.match(component, /role="dialog"/);
+	assert.match(component, /aria-modal="true"/);
+	assert.match(component, /aria-labelledby="extension-title"/);
+	assert.match(component, /const extensionRef = useRef<HTMLElement>\(null\)/);
+	assert.match(component, /function focusableExtensionControls/);
+	assert.match(component, /event\.key !== "Tab"/);
+	assert.match(component, /data-initial-focus/);
+	assert.match(component, /className="extension-backdrop"/);
+	assert.match(component, /htmlFor="extension-value"/);
+	assert.match(component, /Close current session and start a new session/);
+	assert.match(component, /Restart Pi for the selected directory/);
+	assert.match(component, /window\.confirm\(/);
+	assert.match(styles, /button:focus-visible/);
+	assert.match(styles, /\*::before,\n\*::after/);
+	assert.match(styles, /\.sr-only/);
+	assert.match(styles, /\.extension-backdrop \{/);
+	assert.match(styles, /animation-duration: 0\.01ms/);
+});
+
 test("makes the window draggable from the non-interactive header", async () => {
 	const [component, styles, capability] = await Promise.all([
 		readFile("ui/src/App.tsx", "utf8"),
@@ -110,11 +170,31 @@ test("shows bridge-managed directory status and sessions for the opened director
 		/invoke<\{ sessions: Session\[\] \}>\("list_sessions"/,
 	);
 	assert.match(component, /function chooseDirectory/);
+	assert.match(component, /function handleDirectoryTabKeyDown/);
+	assert.match(component, /function forgetDirectory/);
+	assert.match(component, /window\.confirm/);
+	assert.match(component, /"forget_directory"/);
+	assert.match(component, /bridgeEvent\.type === "agent_state"/);
+	assert.match(component, /setDirectories\(\(current\) =>/);
+	assert.match(
+		component,
+		/state: loadedState\.isStreaming \? "streaming" : "idle"/,
+	);
+	assert.match(component, /className="directory-add"/);
+	assert.match(component, /Add directory/);
+	assert.doesNotMatch(component, /className="folder-form"/);
+	assert.doesNotMatch(component, /Remembered folders/);
 	assert.match(component, /function startNewSession/);
+	assert.match(component, /function closeCurrentSession/);
+	assert.match(component, /Use \/resume to reopen it/);
 	assert.match(component, /function switchSession/);
 	assert.match(component, /className="session-panel"/);
 	assert.match(component, /New session/);
 	assert.match(component, /state\.isStreaming/);
+	assert.match(styles, /\.directory-add \{/);
+	assert.match(styles, /\.directory-tab \{/);
+	assert.match(styles, /\.directory-tab-button \{/);
+	assert.match(styles, /\.directory-close \{/);
 	assert.match(styles, /\.session-panel \{/);
 	assert.match(styles, /\.session-list \{/);
 });
@@ -163,11 +243,18 @@ test("distinguishes user and assistant messages", async () => {
 	assert.match(styles, /background: #1a241a/);
 });
 
-test("uses a subtle focus treatment for the prompt editor", async () => {
+test("keeps an accessible focus treatment for the prompt editor", async () => {
 	const styles = await readFile("ui/src/App.css", "utf8");
 	assert.match(styles, /\.composer textarea:focus \{/);
-	assert.match(styles, /outline: none/);
+	assert.doesNotMatch(styles, /outline: none/);
 	assert.match(styles, /border-color: #6f8b56/);
+	assert.match(
+		styles,
+		/\.composer textarea:focus \{[^}]*outline: 2px solid #c4ed8b/,
+	);
+	assert.match(styles, /\.composer textarea:focus \{[^}]*outline-offset: -2px/);
+	assert.doesNotMatch(styles, /\.composer textarea:focus \{[^}]*box-shadow:/);
+	assert.match(styles, /textarea:focus-visible/);
 });
 
 test("submits the composer with Enter and preserves Shift+Enter for newlines", async () => {