Merge branch 'dev' into fix/stale-running-session-ui

2026-03-19 22:20:12 -05:00 · 2026-03-19 22:20:12 -05:00 · 2ef6c88a0b
commit 2ef6c88a0b
parent c19cbccf06 e71a21e0a8
303 changed files with 8895 additions and 5628 deletions
--- a/packages/app/e2e/AGENTS.md
+++ b/packages/app/e2e/AGENTS.md
@ -174,6 +174,8 @@ await page.keyboard.press(`${modKey}+Comma`) // Open settings
 - In terminal tests, type through the browser. Do not write to the PTY through the SDK.
 - Use `waitTerminalReady(page, { term? })` and `runTerminal(page, { cmd, token, term?, timeout? })` from `actions.ts`.
 - These helpers use the fixture-enabled test-only terminal driver and wait for output after the terminal writer settles.
+- After opening the terminal, use `waitTerminalFocusIdle(...)` before the next keyboard action when prompt focus or keyboard routing matters.
+- This avoids racing terminal mount, focus handoff, and prompt readiness when the next step types or sends shortcuts.
 - Avoid `waitForTimeout` and custom DOM or `data-*` readiness checks.

 ### Wait on state
@ -182,6 +184,9 @@ await page.keyboard.press(`${modKey}+Comma`) // Open settings
 - Avoid race-prone flows that assume work is finished after an action
 - Wait or poll on observable state with `expect(...)`, `expect.poll(...)`, or existing helpers
 - Prefer locator assertions like `toBeVisible()`, `toHaveCount(0)`, and `toHaveAttribute(...)` for normal UI state, and reserve `expect.poll(...)` for probe, mock, or backend state
+- Prefer semantic app state over transient DOM visibility when behavior depends on active selection, focus ownership, or async retry loops
+- Do not treat a visible element as proof that the app will route the next action to it
+- When fixing a flake, validate with `--repeat-each` and multiple workers when practical

 ### Add hooks

@ -189,11 +194,16 @@ await page.keyboard.press(`${modKey}+Comma`) // Open settings
 - Keep these hooks minimal and purpose-built, following the style of `packages/app/src/testing/terminal.ts`
 - Test-only hooks must be inert unless explicitly enabled; do not add normal-runtime listeners, reactive subscriptions, or per-update allocations for e2e ceremony
 - When mocking routes or APIs, expose explicit mock state and wait on that before asserting post-action UI
+- Add minimal test-only probes for semantic state like the active list item or selected command when DOM intermediates are unstable
+- Prefer probing committed app state over asserting on transient highlight, visibility, or animation states

 ### Prefer helpers

 - Prefer fluent helpers and drivers when they make intent obvious and reduce locator-heavy noise
 - Use direct locators when the interaction is simple and a helper would not add clarity
+- Prefer helpers that both perform an action and verify the app consumed it
+- Avoid composing helpers redundantly when one already includes the other or already waits for the resulting state
+- If a helper already covers the required wait or verification, use it directly instead of layering extra clicks, keypresses, or assertions

 ## Writing New Tests

--- a/packages/app/e2e/actions.ts
+++ b/packages/app/e2e/actions.ts
@ -1,3 +1,4 @@
+import { base64Decode, base64Encode } from "@opencode-ai/util/encode"
 import { expect, type Locator, type Page } from "@playwright/test"
 import fs from "node:fs/promises"
 import os from "node:os"
@ -16,6 +17,7 @@ import {
  listItemSelector,
  listItemKeySelector,
  listItemKeyStartsWithSelector,
+  promptSelector,
  terminalSelector,
  workspaceItemSelector,
  workspaceMenuTriggerSelector,
@ -61,6 +63,15 @@ async function terminalReady(page: Page, term?: Locator) {
  }, id)
 }

+async function terminalFocusIdle(page: Page, term?: Locator) {
+  const next = term ?? page.locator(terminalSelector).first()
+  const id = await terminalID(next)
+  return page.evaluate((id) => {
+    const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id]
+    return (state?.focusing ?? 0) === 0
+  }, id)
+}
+
 async function terminalHas(page: Page, input: { term?: Locator; token: string }) {
  const next = input.term ?? page.locator(terminalSelector).first()
  const id = await terminalID(next)
@ -73,6 +84,29 @@ async function terminalHas(page: Page, input: { term?: Locator; token: string })
  )
 }

+async function promptSlashActive(page: Page, id: string) {
+  return page.evaluate((id) => {
+    const state = (window as E2EWindow).__opencode_e2e?.prompt?.current
+    if (state?.popover !== "slash") return false
+    if (!state.slash.ids.includes(id)) return false
+    return state.slash.active === id
+  }, id)
+}
+
+async function promptSlashSelects(page: Page) {
+  return page.evaluate(() => {
+    return (window as E2EWindow).__opencode_e2e?.prompt?.current?.selects ?? 0
+  })
+}
+
+async function promptSlashSelected(page: Page, input: { id: string; count: number }) {
+  return page.evaluate((input) => {
+    const state = (window as E2EWindow).__opencode_e2e?.prompt?.current
+    if (!state) return false
+    return state.selected === input.id && state.selects >= input.count
+  }, input)
+}
+
 export async function waitTerminalReady(page: Page, input?: { term?: Locator; timeout?: number }) {
  const term = input?.term ?? page.locator(terminalSelector).first()
  const timeout = input?.timeout ?? 10_000
@ -81,6 +115,43 @@ export async function waitTerminalReady(page: Page, input?: { term?: Locator; ti
  await expect.poll(() => terminalReady(page, term), { timeout }).toBe(true)
 }

+export async function waitTerminalFocusIdle(page: Page, input?: { term?: Locator; timeout?: number }) {
+  const term = input?.term ?? page.locator(terminalSelector).first()
+  const timeout = input?.timeout ?? 10_000
+  await waitTerminalReady(page, { term, timeout })
+  await expect.poll(() => terminalFocusIdle(page, term), { timeout }).toBe(true)
+}
+
+export async function showPromptSlash(
+  page: Page,
+  input: { id: string; text: string; prompt?: Locator; timeout?: number },
+) {
+  const prompt = input.prompt ?? page.locator(promptSelector)
+  const timeout = input.timeout ?? 10_000
+  await expect
+    .poll(
+      async () => {
+        await prompt.click().catch(() => false)
+        await prompt.fill(input.text).catch(() => false)
+        return promptSlashActive(page, input.id).catch(() => false)
+      },
+      { timeout },
+    )
+    .toBe(true)
+}
+
+export async function runPromptSlash(
+  page: Page,
+  input: { id: string; text: string; prompt?: Locator; timeout?: number },
+) {
+  const prompt = input.prompt ?? page.locator(promptSelector)
+  const timeout = input.timeout ?? 10_000
+  const count = await promptSlashSelects(page)
+  await showPromptSlash(page, input)
+  await prompt.press("Enter")
+  await expect.poll(() => promptSlashSelected(page, { id: input.id, count: count + 1 }), { timeout }).toBe(true)
+}
+
 export async function runTerminal(page: Page, input: { cmd: string; token: string; term?: Locator; timeout?: number }) {
  const term = input.term ?? page.locator(terminalSelector).first()
  const timeout = input.timeout ?? 10_000
@ -291,6 +362,30 @@ export async function waitSlug(page: Page, skip: string[] = []) {
  return next
 }

+export async function resolveSlug(slug: string) {
+  const directory = base64Decode(slug)
+  if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`)
+  const resolved = await resolveDirectory(directory)
+  return { directory: resolved, slug: base64Encode(resolved), raw: slug }
+}
+
+export async function waitDir(page: Page, directory: string) {
+  const target = await resolveDirectory(directory)
+  await expect
+    .poll(
+      async () => {
+        const slug = slugFromUrl(page.url())
+        if (!slug) return ""
+        return resolveSlug(slug)
+          .then((item) => item.directory)
+          .catch(() => "")
+      },
+      { timeout: 45_000 },
+    )
+    .toBe(target)
+  return { directory: target, slug: base64Encode(target) }
+}
+
 export function sessionIDFromUrl(url: string) {
  const match = /\/session\/([^/?#]+)/.exec(url)
  return match?.[1]
--- a/packages/app/e2e/app/home.spec.ts
+++ b/packages/app/e2e/app/home.spec.ts
@ -3,8 +3,11 @@ import { serverNamePattern } from "../utils"

 test("home renders and shows core entrypoints", async ({ page }) => {
  await page.goto("/")
+  const nav = page.locator('[data-component="sidebar-nav-desktop"]')

  await expect(page.getByRole("button", { name: "Open project" }).first()).toBeVisible()
+  await expect(nav.getByText("No projects open")).toBeVisible()
+  await expect(nav.getByText("Open a project to get started")).toBeVisible()
  await expect(page.getByRole("button", { name: serverNamePattern })).toBeVisible()
 })

--- a/packages/app/e2e/fixtures.ts
+++ b/packages/app/e2e/fixtures.ts
@ -98,6 +98,9 @@ async function seedStorage(page: Page, input: { directory: string; extra?: strin
      model: {
        enabled: true,
      },
+      prompt: {
+        enabled: true,
+      },
      terminal: {
        enabled: true,
        terminals: {},
--- a/packages/app/e2e/projects/projects-switch.spec.ts
+++ b/packages/app/e2e/projects/projects-switch.spec.ts
@ -1,7 +1,15 @@
 import { base64Decode } from "@opencode-ai/util/encode"
 import type { Page } from "@playwright/test"
 import { test, expect } from "../fixtures"
-import { defocus, createTestProject, cleanupTestProject, openSidebar, sessionIDFromUrl, waitSlug } from "../actions"
+import {
+  defocus,
+  createTestProject,
+  cleanupTestProject,
+  openSidebar,
+  sessionIDFromUrl,
+  waitDir,
+  waitSlug,
+} from "../actions"
 import { projectSwitchSelector, promptSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors"
 import { dirSlug, resolveDirectory } from "../utils"

@ -100,11 +108,8 @@ test("switching back to a project opens the latest workspace session", async ({
        await expect(btn).toBeVisible()
        await btn.click({ force: true })

-        // A new workspace can be discovered via a transient slug before the route and sidebar
-        // settle to the canonical workspace path on Windows, so interact with either and assert
-        // against the resolved workspace slug.
        await waitSlug(page)
-        await expect(page).toHaveURL(new RegExp(`/${next}/session(?:[/?#]|$)`))
+        await waitDir(page, space)

        // Create a session by sending a prompt
        const prompt = page.locator(promptSelector)
@ -132,6 +137,7 @@ test("switching back to a project opens the latest workspace session", async ({
        await expect(rootButton).toBeVisible()
        await rootButton.click()

+        await waitDir(page, space)
        await expect.poll(() => sessionIDFromUrl(page.url()) ?? "").toBe(created)
        await expect(page).toHaveURL(new RegExp(`/session/${created}(?:[/?#]|$)`))
      },
--- a/packages/app/e2e/projects/workspace-new-session.spec.ts
+++ b/packages/app/e2e/projects/workspace-new-session.spec.ts
@ -1,18 +1,25 @@
-import { base64Decode } from "@opencode-ai/util/encode"
 import type { Page } from "@playwright/test"
 import { test, expect } from "../fixtures"
-import { openSidebar, sessionIDFromUrl, setWorkspacesEnabled, slugFromUrl, waitSlug } from "../actions"
+import { openSidebar, resolveSlug, sessionIDFromUrl, setWorkspacesEnabled, waitDir, waitSlug } from "../actions"
 import { promptSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors"
 import { createSdk } from "../utils"

-async function waitWorkspaceReady(page: Page, slug: string) {
+function item(space: { slug: string; raw: string }) {
+  return `${workspaceItemSelector(space.slug)}, ${workspaceItemSelector(space.raw)}`
+}
+
+function button(space: { slug: string; raw: string }) {
+  return `${workspaceNewSessionSelector(space.slug)}, ${workspaceNewSessionSelector(space.raw)}`
+}
+
+async function waitWorkspaceReady(page: Page, space: { slug: string; raw: string }) {
  await openSidebar(page)
  await expect
    .poll(
      async () => {
-        const item = page.locator(workspaceItemSelector(slug)).first()
+        const row = page.locator(item(space)).first()
        try {
-          await item.hover({ timeout: 500 })
+          await row.hover({ timeout: 500 })
          return true
        } catch {
          return false
@ -27,29 +34,30 @@ async function createWorkspace(page: Page, root: string, seen: string[]) {
  await openSidebar(page)
  await page.getByRole("button", { name: "New workspace" }).first().click()

-  const slug = await waitSlug(page, [root, ...seen])
-  const directory = base64Decode(slug)
-  if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`)
-  return { slug, directory }
-}
-
-async function openWorkspaceNewSession(page: Page, slug: string) {
-  await waitWorkspaceReady(page, slug)
-
-  const item = page.locator(workspaceItemSelector(slug)).first()
-  await item.hover()
-
-  const button = page.locator(workspaceNewSessionSelector(slug)).first()
-  await expect(button).toBeVisible()
-  await button.click({ force: true })
-
-  const next = await waitSlug(page)
-  await expect(page).toHaveURL(new RegExp(`/${next}/session(?:[/?#]|$)`))
+  const next = await resolveSlug(await waitSlug(page, [root, ...seen]))
+  await waitDir(page, next.directory)
  return next
 }

-async function createSessionFromWorkspace(page: Page, slug: string, text: string) {
-  const next = await openWorkspaceNewSession(page, slug)
+async function openWorkspaceNewSession(page: Page, space: { slug: string; raw: string; directory: string }) {
+  await waitWorkspaceReady(page, space)
+
+  const row = page.locator(item(space)).first()
+  await row.hover()
+
+  const next = page.locator(button(space)).first()
+  await expect(next).toBeVisible()
+  await next.click({ force: true })
+
+  return waitDir(page, space.directory)
+}
+
+async function createSessionFromWorkspace(
+  page: Page,
+  space: { slug: string; raw: string; directory: string },
+  text: string,
+) {
+  const next = await openWorkspaceNewSession(page, space)

  const prompt = page.locator(promptSelector)
  await expect(prompt).toBeVisible()
@ -60,13 +68,13 @@ async function createSessionFromWorkspace(page: Page, slug: string, text: string
  await expect.poll(async () => ((await prompt.textContent()) ?? "").trim()).toContain(text)
  await prompt.press("Enter")

-  await expect.poll(() => slugFromUrl(page.url())).toBe(next)
+  await waitDir(page, next.directory)
  await expect.poll(() => sessionIDFromUrl(page.url()) ?? "", { timeout: 30_000 }).not.toBe("")

  const sessionID = sessionIDFromUrl(page.url())
  if (!sessionID) throw new Error(`Failed to parse session id from url: ${page.url()}`)
-  await expect(page).toHaveURL(new RegExp(`/${next}/session/${sessionID}(?:[/?#]|$)`))
-  return { sessionID, slug: next }
+  await expect(page).toHaveURL(new RegExp(`/session/${sessionID}(?:[/?#]|$)`))
+  return { sessionID, slug: next.slug }
 }

 async function sessionDirectory(directory: string, sessionID: string) {
@ -87,11 +95,11 @@ test("new sessions from sidebar workspace actions stay in selected workspace", a

    const first = await createWorkspace(page, root, [])
    trackDirectory(first.directory)
-    await waitWorkspaceReady(page, first.slug)
+    await waitWorkspaceReady(page, first)

    const second = await createWorkspace(page, root, [first.slug])
    trackDirectory(second.directory)
-    await waitWorkspaceReady(page, second.slug)
+    await waitWorkspaceReady(page, second)

    const firstSession = await createSessionFromWorkspace(page, first.slug, `workspace one ${Date.now()}`)
    trackSession(firstSession.sessionID, first.directory)
--- a/packages/app/e2e/projects/workspaces.spec.ts
+++ b/packages/app/e2e/projects/workspaces.spec.ts
@ -1,7 +1,7 @@
-import { base64Decode } from "@opencode-ai/util/encode"
 import fs from "node:fs/promises"
 import os from "node:os"
 import path from "node:path"
+import { base64Decode } from "@opencode-ai/util/encode"
 import type { Page } from "@playwright/test"

 import { test, expect } from "../fixtures"
@ -13,8 +13,10 @@ import {
  confirmDialog,
  openSidebar,
  openWorkspaceMenu,
+  resolveSlug,
  setWorkspacesEnabled,
  slugFromUrl,
+  waitDir,
  waitSlug,
 } from "../actions"
 import { dropdownMenuContentSelector, inlineInputSelector, workspaceItemSelector } from "../selectors"
@ -27,15 +29,15 @@ async function setupWorkspaceTest(page: Page, project: { slug: string }) {
  await setWorkspacesEnabled(page, rootSlug, true)

  await page.getByRole("button", { name: "New workspace" }).first().click()
-  const slug = await waitSlug(page, [rootSlug])
-  const dir = base64Decode(slug)
+  const next = await resolveSlug(await waitSlug(page, [rootSlug]))
+  await waitDir(page, next.directory)

  await openSidebar(page)

  await expect
    .poll(
      async () => {
-        const item = page.locator(workspaceItemSelector(slug)).first()
+        const item = page.locator(workspaceItemSelector(next.slug)).first()
        try {
          await item.hover({ timeout: 500 })
          return true
@ -47,7 +49,7 @@ async function setupWorkspaceTest(page: Page, project: { slug: string }) {
    )
    .toBe(true)

-  return { rootSlug, slug, directory: dir }
+  return { rootSlug, slug: next.slug, directory: next.directory }
 }

 test("can enable and disable workspaces from project menu", async ({ page, withProject }) => {
@ -79,15 +81,15 @@ test("can create a workspace", async ({ page, withProject }) => {
    await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()

    await page.getByRole("button", { name: "New workspace" }).first().click()
-    const workspaceSlug = await waitSlug(page, [slug])
-    const workspaceDir = base64Decode(workspaceSlug)
+    const next = await resolveSlug(await waitSlug(page, [slug]))
+    await waitDir(page, next.directory)

    await openSidebar(page)

    await expect
      .poll(
        async () => {
-          const item = page.locator(workspaceItemSelector(workspaceSlug)).first()
+          const item = page.locator(workspaceItemSelector(next.slug)).first()
          try {
            await item.hover({ timeout: 500 })
            return true
@ -99,9 +101,9 @@ test("can create a workspace", async ({ page, withProject }) => {
      )
      .toBe(true)

-    await expect(page.locator(workspaceItemSelector(workspaceSlug)).first()).toBeVisible()
+    await expect(page.locator(workspaceItemSelector(next.slug)).first()).toBeVisible()

-    await cleanupTestProject(workspaceDir)
+    await cleanupTestProject(next.directory)
  })
 })

@ -119,7 +121,7 @@ test("non-git projects keep workspace mode disabled", async ({ page, withProject

      await expect.poll(() => slugFromUrl(page.url()), { timeout: 30_000 }).not.toBe("")

-      const activeDir = base64Decode(slugFromUrl(page.url()))
+      const activeDir = await resolveSlug(slugFromUrl(page.url())).then((item) => item.directory)
      expect(path.basename(activeDir)).toContain("opencode-e2e-project-nongit-")

      await openSidebar(page)
@ -331,9 +333,9 @@ test("can reorder workspaces by drag and drop", async ({ page, withProject }) =>
      for (const _ of [0, 1]) {
        const prev = slugFromUrl(page.url())
        await page.getByRole("button", { name: "New workspace" }).first().click()
-        const slug = await waitSlug(page, [rootSlug, prev])
-        const dir = base64Decode(slug)
-        workspaces.push({ slug, directory: dir })
+        const next = await resolveSlug(await waitSlug(page, [rootSlug, prev]))
+        await waitDir(page, next.directory)
+        workspaces.push(next)

        await openSidebar(page)
      }
--- a/packages/app/e2e/prompt/prompt-multiline.spec.ts
+++ b/packages/app/e2e/prompt/prompt-multiline.spec.ts
@ -7,12 +7,18 @@ test("shift+enter inserts a newline without submitting", async ({ page, gotoSess
  await expect(page).toHaveURL(/\/session\/?$/)

  const prompt = page.locator(promptSelector)
-  await prompt.click()
-  await page.keyboard.type("line one")
-  await page.keyboard.press("Shift+Enter")
-  await page.keyboard.type("line two")
+  await prompt.focus()
+  await expect(prompt).toBeFocused()
+
+  await prompt.pressSequentially("line one")
+  await expect(prompt).toBeFocused()
+
+  await prompt.press("Shift+Enter")
+  await expect(page).toHaveURL(/\/session\/?$/)
+  await expect(prompt).toBeFocused()
+
+  await prompt.pressSequentially("line two")

  await expect(page).toHaveURL(/\/session\/?$/)
-  await expect(prompt).toContainText("line one")
-  await expect(prompt).toContainText("line two")
+  await expect.poll(() => prompt.evaluate((el) => el.innerText)).toBe("line one\nline two")
 })
--- a/packages/app/e2e/prompt/prompt-slash-terminal.spec.ts
+++ b/packages/app/e2e/prompt/prompt-slash-terminal.spec.ts
@ -1,5 +1,5 @@
 import { test, expect } from "../fixtures"
-import { waitTerminalReady } from "../actions"
+import { runPromptSlash, waitTerminalFocusIdle } from "../actions"
 import { promptSelector, terminalSelector } from "../selectors"

 test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => {
@ -7,29 +7,12 @@ test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => {

  const prompt = page.locator(promptSelector)
  const terminal = page.locator(terminalSelector)
-  const slash = page.locator('[data-slash-id="terminal.toggle"]').first()

  await expect(terminal).not.toBeVisible()

-  await prompt.fill("/terminal")
-  await expect(slash).toBeVisible()
-  await page.keyboard.press("Enter")
-  await waitTerminalReady(page, { term: terminal })
+  await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" })
+  await waitTerminalFocusIdle(page, { term: terminal })

-  // Terminal panel retries focus (immediate, RAF, 120ms, 240ms) after opening,
-  // which can steal focus from the prompt and prevent fill() from triggering
-  // the slash popover. Re-attempt click+fill until all retries are exhausted
-  // and the popover appears.
-  await expect
-    .poll(
-      async () => {
-        await prompt.click().catch(() => false)
-        await prompt.fill("/terminal").catch(() => false)
-        return slash.isVisible().catch(() => false)
-      },
-      { timeout: 10_000 },
-    )
-    .toBe(true)
-  await page.keyboard.press("Enter")
+  await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" })
  await expect(terminal).not.toBeVisible()
 })
--- a/packages/app/e2e/session/session-model-persistence.spec.ts
+++ b/packages/app/e2e/session/session-model-persistence.spec.ts
@ -1,7 +1,6 @@
-import { base64Decode } from "@opencode-ai/util/encode"
 import type { Locator, Page } from "@playwright/test"
 import { test, expect } from "../fixtures"
-import { openSidebar, sessionIDFromUrl, setWorkspacesEnabled, waitSessionIdle, waitSlug } from "../actions"
+import { openSidebar, resolveSlug, sessionIDFromUrl, setWorkspacesEnabled, waitSessionIdle, waitSlug } from "../actions"
 import {
  promptAgentSelector,
  promptModelSelector,
@ -224,10 +223,9 @@ async function createWorkspace(page: Page, root: string, seen: string[]) {
  await openSidebar(page)
  await page.getByRole("button", { name: "New workspace" }).first().click()

-  const slug = await waitSlug(page, [root, ...seen])
-  const directory = base64Decode(slug)
-  if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`)
-  return { slug, directory }
+  const next = await resolveSlug(await waitSlug(page, [root, ...seen]))
+  await expect(page).toHaveURL(new RegExp(`/${next.slug}/session(?:[/?#]|$)`))
+  return next
 }

 async function waitWorkspace(page: Page, slug: string) {
@ -257,8 +255,8 @@ async function newWorkspaceSession(page: Page, slug: string) {
  await expect(button).toBeVisible()
  await button.click({ force: true })

-  const next = await waitSlug(page)
-  await expect(page).toHaveURL(new RegExp(`/${next}/session(?:[/?#]|$)`))
+  const next = await resolveSlug(await waitSlug(page))
+  await expect(page).toHaveURL(new RegExp(`/${next.slug}/session(?:[/?#]|$)`))
  await expect(page.locator(promptSelector)).toBeVisible()
  return currentDir(page)
 }
--- a/packages/app/e2e/session/session-review.spec.ts
+++ b/packages/app/e2e/session/session-review.spec.ts
@ -123,6 +123,101 @@ async function spot(page: Parameters<typeof test>[0]["page"], file: string) {
  }, file)
 }

+async function comment(page: Parameters<typeof test>[0]["page"], file: string, note: string) {
+  const row = page.locator(`[data-file="${file}"]`).first()
+  await expect(row).toBeVisible()
+
+  const line = row.locator('diffs-container [data-line="2"]').first()
+  await expect(line).toBeVisible()
+  await line.hover()
+
+  const add = row.getByRole("button", { name: /^Comment$/ }).first()
+  await expect(add).toBeVisible()
+  await add.click()
+
+  const area = row.locator('[data-slot="line-comment-textarea"]').first()
+  await expect(area).toBeVisible()
+  await area.fill(note)
+
+  const submit = row.locator('[data-slot="line-comment-action"][data-variant="primary"]').first()
+  await expect(submit).toBeEnabled()
+  await submit.click()
+
+  await expect(row.locator('[data-slot="line-comment-content"]').filter({ hasText: note }).first()).toBeVisible()
+  await expect(row.locator('[data-slot="line-comment-tools"]').first()).toBeVisible()
+}
+
+async function overflow(page: Parameters<typeof test>[0]["page"], file: string) {
+  const row = page.locator(`[data-file="${file}"]`).first()
+  const view = page.locator('[data-slot="session-review-scroll"] .scroll-view__viewport').first()
+  const pop = row.locator('[data-slot="line-comment-popover"][data-inline-body]').first()
+  const tools = row.locator('[data-slot="line-comment-tools"]').first()
+
+  const [width, viewBox, popBox, toolsBox] = await Promise.all([
+    view.evaluate((el) => el.scrollWidth - el.clientWidth),
+    view.boundingBox(),
+    pop.boundingBox(),
+    tools.boundingBox(),
+  ])
+
+  if (!viewBox || !popBox || !toolsBox) return null
+
+  return {
+    width,
+    pop: popBox.x + popBox.width - (viewBox.x + viewBox.width),
+    tools: toolsBox.x + toolsBox.width - (viewBox.x + viewBox.width),
+  }
+}
+
+test("review applies inline comment clicks without horizontal overflow", async ({ page, withProject }) => {
+  test.setTimeout(180_000)
+
+  const tag = `review-comment-${Date.now()}`
+  const file = `review-comment-${tag}.txt`
+  const note = `comment ${tag}`
+
+  await page.setViewportSize({ width: 1280, height: 900 })
+
+  await withProject(async (project) => {
+    const sdk = createSdk(project.directory)
+
+    await withSession(sdk, `e2e review comment ${tag}`, async (session) => {
+      await patch(sdk, session.id, seed([{ file, mark: tag }]))
+
+      await expect
+        .poll(
+          async () => {
+            const diff = await sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? [])
+            return diff.length
+          },
+          { timeout: 60_000 },
+        )
+        .toBe(1)
+
+      await project.gotoSession(session.id)
+      await show(page)
+
+      const tab = page.getByRole("tab", { name: /Review/i }).first()
+      await expect(tab).toBeVisible()
+      await tab.click()
+
+      await expand(page)
+      await waitMark(page, file, tag)
+      await comment(page, file, note)
+
+      await expect
+        .poll(async () => (await overflow(page, file))?.width ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+      await expect
+        .poll(async () => (await overflow(page, file))?.pop ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+      await expect
+        .poll(async () => (await overflow(page, file))?.tools ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+    })
+  })
+})
+
 test("review keeps scroll position after a live diff update", async ({ page, withProject }) => {
  test.skip(Boolean(process.env.CI), "Flaky in CI for now.")
  test.setTimeout(180_000)
--- a/packages/app/e2e/settings/settings-keybinds.spec.ts
+++ b/packages/app/e2e/settings/settings-keybinds.spec.ts
@ -1,5 +1,5 @@
 import { test, expect } from "../fixtures"
-import { openSettings, closeDialog, waitTerminalReady, withSession } from "../actions"
+import { openSettings, closeDialog, waitTerminalFocusIdle, withSession } from "../actions"
 import { keybindButtonSelector, terminalSelector } from "../selectors"
 import { modKey } from "../utils"

@ -302,7 +302,7 @@ test("changing terminal toggle keybind works", async ({ page, gotoSession }) =>
  await expect(terminal).not.toBeVisible()

  await page.keyboard.press(`${modKey}+Y`)
-  await waitTerminalReady(page, { term: terminal })
+  await waitTerminalFocusIdle(page, { term: terminal })

  await page.keyboard.press(`${modKey}+Y`)
  await expect(terminal).not.toBeVisible()
--- a/packages/app/e2e/terminal/terminal-init.spec.ts
+++ b/packages/app/e2e/terminal/terminal-init.spec.ts
@ -1,5 +1,5 @@
 import { test, expect } from "../fixtures"
-import { waitTerminalReady } from "../actions"
+import { waitTerminalFocusIdle, waitTerminalReady } from "../actions"
 import { promptSelector, terminalSelector } from "../selectors"
 import { terminalToggleKey } from "../utils"

@ -14,7 +14,7 @@ test("smoke terminal mounts and can create a second tab", async ({ page, gotoSes
    await page.keyboard.press(terminalToggleKey)
  }

-  await waitTerminalReady(page, { term: terminals.first() })
+  await waitTerminalFocusIdle(page, { term: terminals.first() })
  await expect(terminals).toHaveCount(1)

  // Ghostty captures a lot of keybinds when focused; move focus back
--- a/packages/app/package.json
+++ b/packages/app/package.json
@ -56,7 +56,7 @@
    "@solidjs/router": "catalog:",
    "@thisbeyond/solid-dnd": "0.7.5",
    "diff": "catalog:",
-    "effect": "4.0.0-beta.31",
+    "effect": "catalog:",
    "fuzzysort": "catalog:",
    "ghostty-web": "github:anomalyco/ghostty-web#main",
    "luxon": "catalog:",
--- a/packages/app/src/app.tsx
+++ b/packages/app/src/app.tsx
@ -46,21 +46,13 @@ import Layout from "@/pages/layout"
 import { ErrorPage } from "./pages/error"
 import { useCheckServerHealth } from "./utils/server-health"

-const Home = lazy(() => import("@/pages/home"))
+const HomeRoute = lazy(() => import("@/pages/home"))
 const Session = lazy(() => import("@/pages/session"))
 const Loading = () => <div class="size-full" />

-const HomeRoute = () => (
-  <Suspense fallback={<Loading />}>
-    <Home />
-  </Suspense>
-)
-
 const SessionRoute = () => (
  <SessionProviders>
-    <Suspense fallback={<Loading />}>
-      <Session />
-    </Suspense>
+    <Session />
  </SessionProviders>
 )

@ -124,8 +116,10 @@ function SessionProviders(props: ParentProps) {
 function RouterRoot(props: ParentProps<{ appChildren?: JSX.Element }>) {
  return (
    <AppShellProviders>
-      {props.appChildren}
-      {props.children}
+      <Suspense fallback={<Loading />}>
+        {props.appChildren}
+        {props.children}
+      </Suspense>
    </AppShellProviders>
  )
 }
@ -265,6 +259,15 @@ function ConnectionError(props: { onRetry?: () => void; onServerSelected?: (key:
  )
 }

+function ServerKey(props: ParentProps) {
+  const server = useServer()
+  return (
+    <Show when={server.key} keyed>
+      {props.children}
+    </Show>
+  )
+}
+
 export function AppInterface(props: {
  children?: JSX.Element
  defaultServer: ServerConnection.Key
@ -275,20 +278,22 @@ export function AppInterface(props: {
  return (
    <ServerProvider defaultServer={props.defaultServer} servers={props.servers}>
      <ConnectionGate disableHealthCheck={props.disableHealthCheck}>
-        <GlobalSDKProvider>
-          <GlobalSyncProvider>
-            <Dynamic
-              component={props.router ?? Router}
-              root={(routerProps) => <RouterRoot appChildren={props.children}>{routerProps.children}</RouterRoot>}
-            >
-              <Route path="/" component={HomeRoute} />
-              <Route path="/:dir" component={DirectoryLayout}>
-                <Route path="/" component={SessionIndexRoute} />
-                <Route path="/session/:id?" component={SessionRoute} />
-              </Route>
-            </Dynamic>
-          </GlobalSyncProvider>
-        </GlobalSDKProvider>
+        <ServerKey>
+          <GlobalSDKProvider>
+            <GlobalSyncProvider>
+              <Dynamic
+                component={props.router ?? Router}
+                root={(routerProps) => <RouterRoot appChildren={props.children}>{routerProps.children}</RouterRoot>}
+              >
+                <Route path="/" component={HomeRoute} />
+                <Route path="/:dir" component={DirectoryLayout}>
+                  <Route path="/" component={SessionIndexRoute} />
+                  <Route path="/session/:id?" component={SessionRoute} />
+                </Route>
+              </Dynamic>
+            </GlobalSyncProvider>
+          </GlobalSDKProvider>
+        </ServerKey>
      </ConnectionGate>
    </ServerProvider>
  )
--- a/packages/app/src/components/dialog-connect-provider.tsx
+++ b/packages/app/src/components/dialog-connect-provider.tsx
@ -15,7 +15,6 @@ import { Link } from "@/components/link"
 import { useLanguage } from "@/context/language"
 import { useGlobalSDK } from "@/context/global-sdk"
 import { useGlobalSync } from "@/context/global-sync"
-import { usePlatform } from "@/context/platform"
 import { DialogSelectModel } from "./dialog-select-model"
 import { DialogSelectProvider } from "./dialog-select-provider"

@ -23,7 +22,6 @@ export function DialogConnectProvider(props: { provider: string }) {
  const dialog = useDialog()
  const globalSync = useGlobalSync()
  const globalSDK = useGlobalSDK()
-  const platform = usePlatform()
  const language = useLanguage()

  const alive = { value: true }
@ -49,13 +47,14 @@ export function DialogConnectProvider(props: { provider: string }) {
  const [store, setStore] = createStore({
    methodIndex: undefined as undefined | number,
    authorization: undefined as undefined | ProviderAuthAuthorization,
-    state: "pending" as undefined | "pending" | "complete" | "error",
+    state: "pending" as undefined | "pending" | "complete" | "error" | "prompt",
    error: undefined as string | undefined,
  })

  type Action =
    | { type: "method.select"; index: number }
    | { type: "method.reset" }
+    | { type: "auth.prompt" }
    | { type: "auth.pending" }
    | { type: "auth.complete"; authorization: ProviderAuthAuthorization }
    | { type: "auth.error"; error: string }
@ -77,6 +76,11 @@ export function DialogConnectProvider(props: { provider: string }) {
          draft.error = undefined
          return
        }
+        if (action.type === "auth.prompt") {
+          draft.state = "prompt"
+          draft.error = undefined
+          return
+        }
        if (action.type === "auth.pending") {
          draft.state = "pending"
          draft.error = undefined
@ -120,7 +124,7 @@ export function DialogConnectProvider(props: { provider: string }) {
    return fallback
  }

-  async function selectMethod(index: number) {
+  async function selectMethod(index: number, inputs?: Record<string, string>) {
    if (timer.current !== undefined) {
      clearTimeout(timer.current)
      timer.current = undefined
@ -130,6 +134,10 @@ export function DialogConnectProvider(props: { provider: string }) {
    dispatch({ type: "method.select", index })

    if (method.type === "oauth") {
+      if (method.prompts?.length && !inputs) {
+        dispatch({ type: "auth.prompt" })
+        return
+      }
      dispatch({ type: "auth.pending" })
      const start = Date.now()
      await globalSDK.client.provider.oauth
@ -137,6 +145,7 @@ export function DialogConnectProvider(props: { provider: string }) {
          {
            providerID: props.provider,
            method: index,
+            inputs,
          },
          { throwOnError: true },
        )
@ -163,6 +172,122 @@ export function DialogConnectProvider(props: { provider: string }) {
    }
  }

+  function OAuthPromptsView() {
+    const [formStore, setFormStore] = createStore({
+      value: {} as Record<string, string>,
+      index: 0,
+    })
+
+    const prompts = createMemo(() => method()?.prompts ?? [])
+    const matches = (prompt: NonNullable<ReturnType<typeof prompts>[number]>, value: Record<string, string>) => {
+      if (!prompt.when) return true
+      const actual = value[prompt.when.key]
+      if (actual === undefined) return false
+      return prompt.when.op === "eq" ? actual === prompt.when.value : actual !== prompt.when.value
+    }
+    const current = createMemo(() => {
+      const all = prompts()
+      const index = all.findIndex((prompt, index) => index >= formStore.index && matches(prompt, formStore.value))
+      if (index === -1) return
+      return {
+        index,
+        prompt: all[index],
+      }
+    })
+    const valid = createMemo(() => {
+      const item = current()
+      if (!item || item.prompt.type !== "text") return false
+      const value = formStore.value[item.prompt.key] ?? ""
+      return value.trim().length > 0
+    })
+
+    async function next(index: number, value: Record<string, string>) {
+      if (store.methodIndex === undefined) return
+      const next = prompts().findIndex((prompt, i) => i > index && matches(prompt, value))
+      if (next !== -1) {
+        setFormStore("index", next)
+        return
+      }
+      await selectMethod(store.methodIndex, value)
+    }
+
+    async function handleSubmit(e: SubmitEvent) {
+      e.preventDefault()
+      const item = current()
+      if (!item || item.prompt.type !== "text") return
+      if (!valid()) return
+      await next(item.index, formStore.value)
+    }
+
+    const item = () => current()
+    const text = createMemo(() => {
+      const prompt = item()?.prompt
+      if (!prompt || prompt.type !== "text") return
+      return prompt
+    })
+    const select = createMemo(() => {
+      const prompt = item()?.prompt
+      if (!prompt || prompt.type !== "select") return
+      return prompt
+    })
+
+    return (
+      <form onSubmit={handleSubmit} class="flex flex-col items-start gap-4">
+        <Switch>
+          <Match when={item()?.prompt.type === "text"}>
+            <TextField
+              type="text"
+              label={text()?.message ?? ""}
+              placeholder={text()?.placeholder}
+              value={text() ? (formStore.value[text()!.key] ?? "") : ""}
+              onChange={(value) => {
+                const prompt = text()
+                if (!prompt) return
+                setFormStore("value", prompt.key, value)
+              }}
+            />
+            <Button class="w-auto" type="submit" size="large" variant="primary" disabled={!valid()}>
+              {language.t("common.continue")}
+            </Button>
+          </Match>
+          <Match when={item()?.prompt.type === "select"}>
+            <div class="w-full flex flex-col gap-1.5">
+              <div class="text-14-regular text-text-base">{select()?.message}</div>
+              <div>
+                <List
+                  items={select()?.options ?? []}
+                  key={(x) => x.value}
+                  current={select()?.options.find((x) => x.value === formStore.value[select()!.key])}
+                  onSelect={(value) => {
+                    if (!value) return
+                    const prompt = select()
+                    if (!prompt) return
+                    const nextValue = {
+                      ...formStore.value,
+                      [prompt.key]: value.value,
+                    }
+                    setFormStore("value", prompt.key, value.value)
+                    void next(item()!.index, nextValue)
+                  }}
+                >
+                  {(option) => (
+                    <div class="w-full flex items-center gap-x-2">
+                      <div class="w-4 h-2 rounded-[1px] bg-input-base shadow-xs-border-base flex items-center justify-center">
+                        <div class="w-2.5 h-0.5 ml-0 bg-icon-strong-base hidden" data-slot="list-item-extra-icon" />
+                      </div>
+                      <span>{option.label}</span>
+                      <span class="text-14-regular text-text-weak">{option.hint}</span>
+                    </div>
+                  )}
+                </List>
+              </div>
+            </div>
+          </Match>
+        </Switch>
+      </form>
+    )
+  }
+
  let listRef: ListRef | undefined
  function handleKey(e: KeyboardEvent) {
    if (e.key === "Enter" && e.target instanceof HTMLInputElement) {
@ -301,7 +426,7 @@ export function DialogConnectProvider(props: { provider: string }) {
            error={formStore.error}
          />
          <Button class="w-auto" type="submit" size="large" variant="primary">
-            {language.t("common.submit")}
+            {language.t("common.continue")}
          </Button>
        </form>
      </div>
@ -314,12 +439,6 @@ export function DialogConnectProvider(props: { provider: string }) {
      error: undefined as string | undefined,
    })

-    onMount(() => {
-      if (store.authorization?.method === "code" && store.authorization?.url) {
-        platform.openLink(store.authorization.url)
-      }
-    })
-
    async function handleSubmit(e: SubmitEvent) {
      e.preventDefault()

@ -368,7 +487,7 @@ export function DialogConnectProvider(props: { provider: string }) {
            error={formStore.error}
          />
          <Button class="w-auto" type="submit" size="large" variant="primary">
-            {language.t("common.submit")}
+            {language.t("common.continue")}
          </Button>
        </form>
      </div>
@ -386,10 +505,6 @@ export function DialogConnectProvider(props: { provider: string }) {

    onMount(() => {
      void (async () => {
-        if (store.authorization?.url) {
-          platform.openLink(store.authorization.url)
-        }
-
        const result = await globalSDK.client.provider.oauth
          .callback({
            providerID: props.provider,
@ -470,6 +585,9 @@ export function DialogConnectProvider(props: { provider: string }) {
                  </div>
                </div>
              </Match>
+              <Match when={store.state === "prompt"}>
+                <OAuthPromptsView />
+              </Match>
              <Match when={store.state === "error"}>
                <div class="text-14-regular text-text-base">
                  <div class="flex items-center gap-x-2">
--- a/packages/app/src/components/dialog-select-server.tsx
+++ b/packages/app/src/components/dialog-select-server.tsx
@ -291,8 +291,8 @@ export function DialogSelectServer() {
      navigate("/")
      return
    }
-    server.setActive(ServerConnection.key(conn))
    navigate("/")
+    queueMicrotask(() => server.setActive(ServerConnection.key(conn)))
  }

  const handleAddChange = (value: string) => {
--- a/packages/app/src/components/prompt-input.tsx
+++ b/packages/app/src/components/prompt-input.tsx
@ -1,6 +1,6 @@
 import { useFilteredList } from "@opencode-ai/ui/hooks"
 import { useSpring } from "@opencode-ai/ui/motion-spring"
-import { createEffect, on, Component, Show, onCleanup, Switch, Match, createMemo, createSignal } from "solid-js"
+import { createEffect, on, Component, Show, onCleanup, createMemo, createSignal } from "solid-js"
 import { createStore } from "solid-js/store"
 import { useLocal } from "@/context/local"
 import { selectionFromLines, type SelectedLineRange, useFile } from "@/context/file"
@ -36,6 +36,7 @@ import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
 import { useSessionLayout } from "@/pages/session/session-layout"
 import { createSessionTabs } from "@/pages/session/helpers"
+import { promptEnabled, promptProbe } from "@/testing/prompt"
 import { createTextFragment, getCursorPosition, setCursorPosition, setRangeEdge } from "./prompt-input/editor-dom"
 import { createPromptAttachments } from "./prompt-input/attachments"
 import { ACCEPTED_FILE_TYPES } from "./prompt-input/files"
@ -243,6 +244,23 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
      },
  )
  const working = createMemo(() => status()?.type !== "idle")
+  const tip = () => {
+    if (working()) {
+      return (
+        <div class="flex items-center gap-2">
+          <span>{language.t("prompt.action.stop")}</span>
+          <span class="text-icon-base text-12-medium text-[10px]!">{language.t("common.key.esc")}</span>
+        </div>
+      )
+    }
+
+    return (
+      <div class="flex items-center gap-2">
+        <span>{language.t("prompt.action.send")}</span>
+        <Icon name="enter" size="small" class="text-icon-base" />
+      </div>
+    )
+  }
  const imageAttachments = createMemo(() =>
    prompt.current().filter((part): part is ImageAttachmentPart => part.type === "image"),
  )
@ -604,6 +622,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {

  const handleSlashSelect = (cmd: SlashCommand | undefined) => {
    if (!cmd) return
+    promptProbe.select(cmd.id)
    closePopover()

    if (cmd.type === "custom") {
@ -692,6 +711,20 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
    })
  })

+  if (promptEnabled()) {
+    createEffect(() => {
+      promptProbe.set({
+        popover: store.popover,
+        slash: {
+          active: slashActive() ?? null,
+          ids: slashFlat().map((cmd) => cmd.id),
+        },
+      })
+    })
+
+    onCleanup(() => promptProbe.clear())
+  }
+
  const selectPopoverActive = () => {
    if (store.popover === "at") {
      const items = atFlat()
@ -1208,6 +1241,20 @@ export const PromptInput: Component<PromptInputProps> = (props) => {

    // Note: Shift+Enter is handled earlier, before IME check
    if (event.key === "Enter" && !event.shiftKey) {
+      event.preventDefault()
+      if (event.repeat) return
+      if (
+        working() &&
+        prompt
+          .current()
+          .map((part) => ("content" in part ? part.content : ""))
+          .join("")
+          .trim().length === 0 &&
+        imageAttachments().length === 0 &&
+        commentCount() === 0
+      ) {
+        return
+      }
      handleSubmit(event)
    }
  }
@ -1346,26 +1393,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
            />

            <div class="flex items-center gap-1 pointer-events-auto">
-              <Tooltip
-                placement="top"
-                inactive={!prompt.dirty() && !working()}
-                value={
-                  <Switch>
-                    <Match when={working()}>
-                      <div class="flex items-center gap-2">
-                        <span>{language.t("prompt.action.stop")}</span>
-                        <span class="text-icon-base text-12-medium text-[10px]!">{language.t("common.key.esc")}</span>
-                      </div>
-                    </Match>
-                    <Match when={true}>
-                      <div class="flex items-center gap-2">
-                        <span>{language.t("prompt.action.send")}</span>
-                        <Icon name="enter" size="small" class="text-icon-base" />
-                      </div>
-                    </Match>
-                  </Switch>
-                }
-              >
+              <Tooltip placement="top" inactive={!prompt.dirty() && !working()} value={tip()}>
                <IconButton
                  data-action="prompt-submit"
                  type="submit"
--- a/packages/app/src/components/session/session-header.tsx
+++ b/packages/app/src/components/session/session-header.tsx
@ -274,12 +274,11 @@ export function SessionHeader() {
              type="button"
              variant="ghost"
              size="small"
-              class="hidden md:flex w-[240px] max-w-full min-w-0 pl-0.5 pr-2 items-center gap-2 justify-between rounded-md border border-border-weak-base bg-surface-panel shadow-none cursor-default"
+              class="hidden md:flex w-[240px] max-w-full min-w-0 items-center gap-2 justify-between rounded-md border border-border-weak-base bg-surface-panel shadow-none cursor-default"
              onClick={() => command.trigger("file.open")}
              aria-label={language.t("session.header.searchFiles")}
            >
-              <div class="flex min-w-0 flex-1 items-center gap-1.5 overflow-visible">
-                <Icon name="magnifying-glass" size="small" class="icon-base shrink-0 size-4" />
+              <div class="flex min-w-0 flex-1 items-center overflow-visible">
                <span class="flex-1 min-w-0 text-12-regular text-text-weak truncate text-left">
                  {language.t("session.header.search.placeholder", {
                    project: name(),
--- a/packages/app/src/components/status-popover.tsx
+++ b/packages/app/src/components/status-popover.tsx
@ -277,8 +277,8 @@ export function StatusPopover() {
                        aria-disabled={isBlocked()}
                        onClick={() => {
                          if (isBlocked()) return
-                          server.setActive(key)
                          navigate("/")
+                          queueMicrotask(() => server.setActive(key))
                        }}
                      >
                        <ServerHealthIndicator health={health[key]} />
--- a/packages/app/src/components/terminal.tsx
+++ b/packages/app/src/components/terminal.tsx
@ -65,14 +65,11 @@ const debugTerminal = (...values: unknown[]) => {
  console.debug("[terminal]", ...values)
 }

-const errorStatus = (err: unknown) => {
+const errorName = (err: unknown) => {
  if (!err || typeof err !== "object") return
-  if (!("data" in err)) return
-  const data = err.data
-  if (!data || typeof data !== "object") return
-  if (!("statusCode" in data)) return
-  const status = data.statusCode
-  return typeof status === "number" ? status : undefined
+  if (!("name" in err)) return
+  const errorName = err.name
+  return typeof errorName === "string" ? errorName : undefined
 }

 const useTerminalUiBindings = (input: {
@ -168,6 +165,12 @@ export const Terminal = (props: TerminalProps) => {
  const theme = useTheme()
  const language = useLanguage()
  const server = useServer()
+  const directory = sdk.directory
+  const client = sdk.client
+  const url = sdk.url
+  const auth = server.current?.http
+  const username = auth?.username ?? "opencode"
+  const password = auth?.password ?? ""
  let container!: HTMLDivElement
  const [local, others] = splitProps(props, ["pty", "class", "classList", "autoFocus", "onConnect", "onConnectError"])
  const id = local.pty.id
@ -218,7 +221,7 @@ export const Terminal = (props: TerminalProps) => {
  }

  const pushSize = (cols: number, rows: number) => {
-    return sdk.client.pty
+    return client.pty
      .update({
        ptyID: id,
        size: { cols, rows },
@ -477,11 +480,11 @@ export const Terminal = (props: TerminalProps) => {
      }

      const gone = () =>
-        sdk.client.pty
+        client.pty
          .get({ ptyID: id })
          .then(() => false)
          .catch((err) => {
-            if (errorStatus(err) === 404) return true
+            if (errorName(err) === "NotFoundError") return true
            debugTerminal("failed to inspect terminal session", err)
            return false
          })
@ -509,14 +512,14 @@ export const Terminal = (props: TerminalProps) => {
        if (disposed) return
        drop?.()

-        const url = new URL(sdk.url + `/pty/${id}/connect`)
-        url.searchParams.set("directory", sdk.directory)
-        url.searchParams.set("cursor", String(seek))
-        url.protocol = url.protocol === "https:" ? "wss:" : "ws:"
-        url.username = server.current?.http.username ?? "opencode"
-        url.password = server.current?.http.password ?? ""
+        const next = new URL(url + `/pty/${id}/connect`)
+        next.searchParams.set("directory", directory)
+        next.searchParams.set("cursor", String(seek))
+        next.protocol = next.protocol === "https:" ? "wss:" : "ws:"
+        next.username = username
+        next.password = password

-        const socket = new WebSocket(url)
+        const socket = new WebSocket(next)
        socket.binaryType = "arraybuffer"
        ws = socket

--- a/packages/app/src/components/titlebar.tsx
+++ b/packages/app/src/components/titlebar.tsx
@ -77,6 +77,7 @@ export function Titlebar() {

  const canBack = createMemo(() => history.index > 0)
  const canForward = createMemo(() => history.index < history.stack.length - 1)
+  const hasProjects = createMemo(() => layout.projects.list().length > 0)

  const back = () => {
    const next = backPath(history)
@ -251,36 +252,38 @@ export function Titlebar() {
                </div>
              </div>
            </Show>
-            <div
-              class="flex items-center gap-0 transition-transform"
-              classList={{
-                "translate-x-0": !layout.sidebar.opened(),
-                "-translate-x-[36px]": layout.sidebar.opened(),
-                "duration-180 ease-out": !layout.sidebar.opened(),
-                "duration-180 ease-in": layout.sidebar.opened(),
-              }}
-            >
-              <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}>
-                <Button
-                  variant="ghost"
-                  icon="chevron-left"
-                  class="titlebar-icon w-6 h-6 p-0 box-border"
-                  disabled={!canBack()}
-                  onClick={back}
-                  aria-label={language.t("common.goBack")}
-                />
-              </Tooltip>
-              <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={2000}>
-                <Button
-                  variant="ghost"
-                  icon="chevron-right"
-                  class="titlebar-icon w-6 h-6 p-0 box-border"
-                  disabled={!canForward()}
-                  onClick={forward}
-                  aria-label={language.t("common.goForward")}
-                />
-              </Tooltip>
-            </div>
+            <Show when={hasProjects()}>
+              <div
+                class="flex items-center gap-0 transition-transform"
+                classList={{
+                  "translate-x-0": !layout.sidebar.opened(),
+                  "-translate-x-[36px]": layout.sidebar.opened(),
+                  "duration-180 ease-out": !layout.sidebar.opened(),
+                  "duration-180 ease-in": layout.sidebar.opened(),
+                }}
+              >
+                <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}>
+                  <Button
+                    variant="ghost"
+                    icon="chevron-left"
+                    class="titlebar-icon w-6 h-6 p-0 box-border"
+                    disabled={!canBack()}
+                    onClick={back}
+                    aria-label={language.t("common.goBack")}
+                  />
+                </Tooltip>
+                <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={2000}>
+                  <Button
+                    variant="ghost"
+                    icon="chevron-right"
+                    class="titlebar-icon w-6 h-6 p-0 box-border"
+                    disabled={!canForward()}
+                    onClick={forward}
+                    aria-label={language.t("common.goForward")}
+                  />
+                </Tooltip>
+              </div>
+            </Show>
          </div>
        </div>
        <div id="opencode-titlebar-left" class="flex items-center gap-3 min-w-0 px-2" />
--- a/packages/app/src/context/command.tsx
+++ b/packages/app/src/context/command.tsx
@ -1,10 +1,10 @@
-import { createEffect, createMemo, onCleanup, onMount, type Accessor } from "solid-js"
-import { createStore } from "solid-js/store"
 import { createSimpleContext } from "@opencode-ai/ui/context"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
-import { dict as en } from "@/i18n/en"
+import { type Accessor, createEffect, createMemo, onCleanup, onMount } from "solid-js"
+import { createStore } from "solid-js/store"
 import { useLanguage } from "@/context/language"
 import { useSettings } from "@/context/settings"
+import { dict as en } from "@/i18n/en"
 import { Persist, persisted } from "@/utils/persist"

 const IS_MAC = typeof navigator === "object" && /(Mac|iPod|iPhone|iPad)/.test(navigator.platform)
@ -238,9 +238,10 @@ export const { use: useCommand, provider: CommandProvider } = createSimpleContex
    })
    const warnedDuplicates = new Set<string>()

+    type CommandCatalog = Record<string, CommandCatalogItem>
    const [catalog, setCatalog, _, catalogReady] = persisted(
      Persist.global("command.catalog.v1"),
-      createStore<Record<string, CommandCatalogItem>>({}),
+      createStore<CommandCatalog>({}),
    )

    const bind = (id: string, def: KeybindConfig | undefined) => {
@ -259,7 +260,7 @@ export const { use: useCommand, provider: CommandProvider } = createSimpleContex
          if (seen.has(opt.id)) {
            if (import.meta.env.DEV && !warnedDuplicates.has(opt.id)) {
              warnedDuplicates.add(opt.id)
-              console.warn(`[command] duplicate command id \"${opt.id}\" registered; keeping first entry`)
+              console.warn(`[command] duplicate command id "${opt.id}" registered; keeping first entry`)
            }
            continue
          }
@ -274,16 +275,19 @@ export const { use: useCommand, provider: CommandProvider } = createSimpleContex
    createEffect(() => {
      if (!catalogReady()) return

-      for (const opt of registered()) {
-        const id = actionId(opt.id)
-        setCatalog(id, {
-          title: opt.title,
-          description: opt.description,
-          category: opt.category,
-          keybind: opt.keybind,
-          slash: opt.slash,
-        })
-      }
+      setCatalog(
+        registered().reduce((acc, opt) => {
+          const id = actionId(opt.id)
+          acc[id] = {
+            title: opt.title,
+            description: opt.description,
+            category: opt.category,
+            keybind: opt.keybind,
+            slash: opt.slash,
+          }
+          return acc
+        }, {} as CommandCatalog),
+      )
    })

    const catalogOptions = createMemo(() => Object.entries(catalog).map(([id, meta]) => ({ id, ...meta })))
--- a/packages/app/src/context/prompt.tsx
+++ b/packages/app/src/context/prompt.tsx
@ -1,10 +1,10 @@
-import { createStore, type SetStoreFunction } from "solid-js/store"
 import { createSimpleContext } from "@opencode-ai/ui/context"
-import { batch, createMemo, createRoot, onCleanup } from "solid-js"
+import { checksum } from "@opencode-ai/util/encode"
 import { useParams } from "@solidjs/router"
+import { batch, createMemo, createRoot, getOwner, onCleanup } from "solid-js"
+import { createStore, type SetStoreFunction } from "solid-js/store"
 import type { FileSelection } from "@/context/file"
 import { Persist, persisted } from "@/utils/persist"
-import { checksum } from "@opencode-ai/util/encode"

 interface PartBase {
  content: string
@ -250,6 +250,7 @@ export const { use: usePrompt, provider: PromptProvider } = createSimpleContext(
      }
    }

+    const owner = getOwner()
    const load = (dir: string, id: string | undefined) => {
      const key = `${dir}:${id ?? WORKSPACE_KEY}`
      const existing = cache.get(key)
@ -259,10 +260,13 @@ export const { use: usePrompt, provider: PromptProvider } = createSimpleContext(
        return existing.value
      }

-      const entry = createRoot((dispose) => ({
-        value: createPromptSession(dir, id),
-        dispose,
-      }))
+      const entry = createRoot(
+        (dispose) => ({
+          value: createPromptSession(dir, id),
+          dispose,
+        }),
+        owner,
+      )

      cache.set(key, entry)
      prune()
--- a/packages/app/src/context/terminal.tsx
+++ b/packages/app/src/context/terminal.tsx
@ -185,6 +185,60 @@ function createWorkspaceTerminalSession(sdk: ReturnType<typeof useSDK>, dir: str
  })
  onCleanup(unsub)

+  const update = (client: ReturnType<typeof useSDK>["client"], pty: Partial<LocalPTY> & { id: string }) => {
+    const index = store.all.findIndex((x) => x.id === pty.id)
+    const previous = index >= 0 ? store.all[index] : undefined
+    if (index >= 0) {
+      setStore("all", index, (item) => ({ ...item, ...pty }))
+    }
+    client.pty
+      .update({
+        ptyID: pty.id,
+        title: pty.title,
+        size: pty.cols && pty.rows ? { rows: pty.rows, cols: pty.cols } : undefined,
+      })
+      .catch((error: unknown) => {
+        if (previous) {
+          const currentIndex = store.all.findIndex((item) => item.id === pty.id)
+          if (currentIndex >= 0) setStore("all", currentIndex, previous)
+        }
+        console.error("Failed to update terminal", error)
+      })
+  }
+
+  const clone = async (client: ReturnType<typeof useSDK>["client"], id: string) => {
+    const index = store.all.findIndex((x) => x.id === id)
+    const pty = store.all[index]
+    if (!pty) return
+    const next = await client.pty
+      .create({
+        title: pty.title,
+      })
+      .catch((error: unknown) => {
+        console.error("Failed to clone terminal", error)
+        return undefined
+      })
+    if (!next?.data) return
+
+    const active = store.active === pty.id
+
+    batch(() => {
+      setStore("all", index, {
+        id: next.data.id,
+        title: next.data.title ?? pty.title,
+        titleNumber: pty.titleNumber,
+        buffer: undefined,
+        cursor: undefined,
+        scrollY: undefined,
+        rows: undefined,
+        cols: undefined,
+      })
+      if (active) {
+        setStore("active", next.data.id)
+      }
+    })
+  }
+
  return {
    ready,
    all: createMemo(() => store.all),
@ -216,24 +270,7 @@ function createWorkspaceTerminalSession(sdk: ReturnType<typeof useSDK>, dir: str
        })
    },
    update(pty: Partial<LocalPTY> & { id: string }) {
-      const index = store.all.findIndex((x) => x.id === pty.id)
-      const previous = index >= 0 ? store.all[index] : undefined
-      if (index >= 0) {
-        setStore("all", index, (item) => ({ ...item, ...pty }))
-      }
-      sdk.client.pty
-        .update({
-          ptyID: pty.id,
-          title: pty.title,
-          size: pty.cols && pty.rows ? { rows: pty.rows, cols: pty.cols } : undefined,
-        })
-        .catch((error: unknown) => {
-          if (previous) {
-            const currentIndex = store.all.findIndex((item) => item.id === pty.id)
-            if (currentIndex >= 0) setStore("all", currentIndex, previous)
-          }
-          console.error("Failed to update terminal", error)
-        })
+      update(sdk.client, pty)
    },
    trim(id: string) {
      const index = store.all.findIndex((x) => x.id === id)
@ -248,37 +285,23 @@ function createWorkspaceTerminalSession(sdk: ReturnType<typeof useSDK>, dir: str
      })
    },
    async clone(id: string) {
-      const index = store.all.findIndex((x) => x.id === id)
-      const pty = store.all[index]
-      if (!pty) return
-      const clone = await sdk.client.pty
-        .create({
-          title: pty.title,
-        })
-        .catch((error: unknown) => {
-          console.error("Failed to clone terminal", error)
-          return undefined
-        })
-      if (!clone?.data) return
-
-      const active = store.active === pty.id
-
-      batch(() => {
-        setStore("all", index, {
-          id: clone.data.id,
-          title: clone.data.title ?? pty.title,
-          titleNumber: pty.titleNumber,
-          // New PTY process, so start clean.
-          buffer: undefined,
-          cursor: undefined,
-          scrollY: undefined,
-          rows: undefined,
-          cols: undefined,
-        })
-        if (active) {
-          setStore("active", clone.data.id)
-        }
-      })
+      await clone(sdk.client, id)
+    },
+    bind() {
+      const client = sdk.client
+      return {
+        trim(id: string) {
+          const index = store.all.findIndex((x) => x.id === id)
+          if (index === -1) return
+          setStore("all", index, (pty) => trimTerminal(pty))
+        },
+        update(pty: Partial<LocalPTY> & { id: string }) {
+          update(client, pty)
+        },
+        async clone(id: string) {
+          await clone(client, id)
+        },
+      }
    },
    open(id: string) {
      setStore("active", id)
@ -403,6 +426,7 @@ export const { use: useTerminal, provider: TerminalProvider } = createSimpleCont
      trim: (id: string) => workspace().trim(id),
      trimAll: () => workspace().trimAll(),
      clone: (id: string) => workspace().clone(id),
+      bind: () => workspace(),
      open: (id: string) => workspace().open(id),
      close: (id: string) => workspace().close(id),
      move: (id: string, to: number) => workspace().move(id, to),
--- a/packages/app/src/i18n/ar.ts
+++ b/packages/app/src/i18n/ar.ts
@ -204,6 +204,7 @@ export const dict = {
  "common.cancel": "إلغاء",
  "common.connect": "اتصال",
  "common.disconnect": "قطع الاتصال",
+  "common.continue": "إرسال",
  "common.submit": "إرسال",
  "common.save": "حفظ",
  "common.saving": "جارٍ الحفظ...",
--- a/packages/app/src/i18n/br.ts
+++ b/packages/app/src/i18n/br.ts
@ -204,6 +204,7 @@ export const dict = {
  "common.cancel": "Cancelar",
  "common.connect": "Conectar",
  "common.disconnect": "Desconectar",
+  "common.continue": "Enviar",
  "common.submit": "Enviar",
  "common.save": "Salvar",
  "common.saving": "Salvando...",
--- a/packages/app/src/i18n/bs.ts
+++ b/packages/app/src/i18n/bs.ts
@ -221,6 +221,7 @@ export const dict = {
  "common.cancel": "Otkaži",
  "common.connect": "Poveži",
  "common.disconnect": "Prekini vezu",
+  "common.continue": "Pošalji",
  "common.submit": "Pošalji",
  "common.save": "Sačuvaj",
  "common.saving": "Čuvanje...",
--- a/packages/app/src/i18n/da.ts
+++ b/packages/app/src/i18n/da.ts
@ -219,6 +219,7 @@ export const dict = {
  "common.cancel": "Annuller",
  "common.connect": "Forbind",
  "common.disconnect": "Frakobl",
+  "common.continue": "Indsend",
  "common.submit": "Indsend",
  "common.save": "Gem",
  "common.saving": "Gemmer...",
--- a/packages/app/src/i18n/de.ts
+++ b/packages/app/src/i18n/de.ts
@ -209,6 +209,7 @@ export const dict = {
  "common.cancel": "Abbrechen",
  "common.connect": "Verbinden",
  "common.disconnect": "Trennen",
+  "common.continue": "Absenden",
  "common.submit": "Absenden",
  "common.save": "Speichern",
  "common.saving": "Speichert...",
--- a/packages/app/src/i18n/en.ts
+++ b/packages/app/src/i18n/en.ts
@ -221,6 +221,7 @@ export const dict = {
  "common.open": "Open",
  "common.connect": "Connect",
  "common.disconnect": "Disconnect",
+  "common.continue": "Continue",
  "common.submit": "Submit",
  "common.save": "Save",
  "common.saving": "Saving...",
@ -674,6 +675,8 @@ export const dict = {
  "sidebar.project.recentSessions": "Recent sessions",
  "sidebar.project.viewAllSessions": "View all sessions",
  "sidebar.project.clearNotifications": "Clear notifications",
+  "sidebar.empty.title": "No projects open",
+  "sidebar.empty.description": "Open a project to get started",

  "debugBar.ariaLabel": "Development performance diagnostics",
  "debugBar.na": "n/a",
--- a/packages/app/src/i18n/es.ts
+++ b/packages/app/src/i18n/es.ts
@ -220,6 +220,7 @@ export const dict = {
  "common.cancel": "Cancelar",
  "common.connect": "Conectar",
  "common.disconnect": "Desconectar",
+  "common.continue": "Enviar",
  "common.submit": "Enviar",
  "common.save": "Guardar",
  "common.saving": "Guardando...",
--- a/packages/app/src/i18n/fr.ts
+++ b/packages/app/src/i18n/fr.ts
@ -204,6 +204,7 @@ export const dict = {
  "common.cancel": "Annuler",
  "common.connect": "Connecter",
  "common.disconnect": "Déconnecter",
+  "common.continue": "Soumettre",
  "common.submit": "Soumettre",
  "common.save": "Enregistrer",
  "common.saving": "Enregistrement...",
--- a/packages/app/src/i18n/ja.ts
+++ b/packages/app/src/i18n/ja.ts
@ -203,6 +203,7 @@ export const dict = {
  "common.cancel": "キャンセル",
  "common.connect": "接続",
  "common.disconnect": "切断",
+  "common.continue": "送信",
  "common.submit": "送信",
  "common.save": "保存",
  "common.saving": "保存中...",
--- a/packages/app/src/i18n/ko.ts
+++ b/packages/app/src/i18n/ko.ts
@ -207,6 +207,7 @@ export const dict = {
  "common.cancel": "취소",
  "common.connect": "연결",
  "common.disconnect": "연결 해제",
+  "common.continue": "제출",
  "common.submit": "제출",
  "common.save": "저장",
  "common.saving": "저장 중...",
--- a/packages/app/src/i18n/no.ts
+++ b/packages/app/src/i18n/no.ts
@ -223,6 +223,7 @@ export const dict = {
  "common.cancel": "Avbryt",
  "common.connect": "Koble til",
  "common.disconnect": "Koble fra",
+  "common.continue": "Send inn",
  "common.submit": "Send inn",
  "common.save": "Lagre",
  "common.saving": "Lagrer...",
--- a/packages/app/src/i18n/pl.ts
+++ b/packages/app/src/i18n/pl.ts
@ -205,6 +205,7 @@ export const dict = {
  "common.cancel": "Anuluj",
  "common.connect": "Połącz",
  "common.disconnect": "Rozłącz",
+  "common.continue": "Prześlij",
  "common.submit": "Prześlij",
  "common.save": "Zapisz",
  "common.saving": "Zapisywanie...",
--- a/packages/app/src/i18n/ru.ts
+++ b/packages/app/src/i18n/ru.ts
@ -220,6 +220,7 @@ export const dict = {
  "common.cancel": "Отмена",
  "common.connect": "Подключить",
  "common.disconnect": "Отключить",
+  "common.continue": "Отправить",
  "common.submit": "Отправить",
  "common.save": "Сохранить",
  "common.saving": "Сохранение...",
--- a/packages/app/src/i18n/th.ts
+++ b/packages/app/src/i18n/th.ts
@ -220,6 +220,7 @@ export const dict = {
  "common.cancel": "ยกเลิก",
  "common.connect": "เชื่อมต่อ",
  "common.disconnect": "ยกเลิกการเชื่อมต่อ",
+  "common.continue": "ส่ง",
  "common.submit": "ส่ง",
  "common.save": "บันทึก",
  "common.saving": "กำลังบันทึก...",
--- a/packages/app/src/i18n/tr.ts
+++ b/packages/app/src/i18n/tr.ts
@ -225,6 +225,7 @@ export const dict = {
  "common.cancel": "İptal",
  "common.connect": "Bağlan",
  "common.disconnect": "Bağlantı Kes",
+  "common.continue": "Gönder",
  "common.submit": "Gönder",
  "common.save": "Kaydet",
  "common.saving": "Kaydediliyor...",
--- a/packages/app/src/i18n/zh.ts
+++ b/packages/app/src/i18n/zh.ts
@ -242,6 +242,7 @@ export const dict = {
  "common.cancel": "取消",
  "common.connect": "连接",
  "common.disconnect": "断开连接",
+  "common.continue": "提交",
  "common.submit": "提交",
  "common.save": "保存",
  "common.saving": "保存中...",
--- a/packages/app/src/i18n/zht.ts
+++ b/packages/app/src/i18n/zht.ts
@ -220,6 +220,7 @@ export const dict = {
  "common.cancel": "取消",
  "common.connect": "連線",
  "common.disconnect": "中斷連線",
+  "common.continue": "提交",
  "common.submit": "提交",
  "common.save": "儲存",
  "common.saving": "儲存中...",
--- a/packages/app/src/pages/directory-layout.tsx
+++ b/packages/app/src/pages/directory-layout.tsx
@ -1,16 +1,15 @@
-import { batch, createEffect, createMemo, Show, type ParentProps } from "solid-js"
-import { createStore } from "solid-js/store"
+import { DataProvider } from "@opencode-ai/ui/context"
+import { showToast } from "@opencode-ai/ui/toast"
+import { base64Encode } from "@opencode-ai/util/encode"
 import { useLocation, useNavigate, useParams } from "@solidjs/router"
+import { createMemo, createResource, type ParentProps, Show } from "solid-js"
+import { useGlobalSDK } from "@/context/global-sdk"
+import { useLanguage } from "@/context/language"
+import { LocalProvider } from "@/context/local"
 import { SDKProvider } from "@/context/sdk"
 import { SyncProvider, useSync } from "@/context/sync"
-import { LocalProvider } from "@/context/local"
-import { useGlobalSDK } from "@/context/global-sdk"
-
-import { DataProvider } from "@opencode-ai/ui/context"
-import { base64Encode } from "@opencode-ai/util/encode"
 import { decode64 } from "@/utils/base64"
-import { showToast } from "@opencode-ai/ui/toast"
-import { useLanguage } from "@/context/language"
+
 function DirectoryDataProvider(props: ParentProps<{ directory: string }>) {
  const navigate = useNavigate()
  const sync = useSync()
@ -30,57 +29,53 @@ function DirectoryDataProvider(props: ParentProps<{ directory: string }>) {

 export default function Layout(props: ParentProps) {
  const params = useParams()
-  const navigate = useNavigate()
  const location = useLocation()
  const language = useLanguage()
  const globalSDK = useGlobalSDK()
-  const directory = createMemo(() => decode64(params.dir) ?? "")
-  const [state, setState] = createStore({ invalid: "", resolved: "" })
+  const navigate = useNavigate()
+  let invalid = ""

-  createEffect(() => {
-    if (!params.dir) return
-    const raw = directory()
-    if (!raw) {
-      if (state.invalid === params.dir) return
-      setState("invalid", params.dir)
-      showToast({
-        variant: "error",
-        title: language.t("common.requestFailed"),
-        description: language.t("directory.error.invalidUrl"),
-      })
-      navigate("/", { replace: true })
-      return
-    }
+  const [resolved] = createResource(
+    () => {
+      if (params.dir) return [location.pathname, params.dir] as const
+    },
+    async ([pathname, b64Dir]) => {
+      const directory = decode64(b64Dir)

-    const current = params.dir
-    globalSDK
-      .createClient({
-        directory: raw,
-        throwOnError: true,
-      })
-      .path.get()
-      .then((x) => {
-        if (params.dir !== current) return
-        const next = x.data?.directory ?? raw
-        batch(() => {
-          setState("invalid", "")
-          setState("resolved", next)
+      if (!directory) {
+        if (invalid === params.dir) return
+        invalid = b64Dir
+        showToast({
+          variant: "error",
+          title: language.t("common.requestFailed"),
+          description: language.t("directory.error.invalidUrl"),
        })
-        if (next === raw) return
-        const path = location.pathname.slice(current.length + 1)
-        navigate(`/${base64Encode(next)}${path}${location.search}${location.hash}`, { replace: true })
-      })
-      .catch(() => {
-        if (params.dir !== current) return
-        batch(() => {
-          setState("invalid", "")
-          setState("resolved", raw)
+        navigate("/", { replace: true })
+        return
+      }
+
+      return await globalSDK
+        .createClient({
+          directory,
+          throwOnError: true,
        })
-      })
-  })
+        .path.get()
+        .then((x) => {
+          const next = x.data?.directory ?? directory
+          invalid = ""
+          if (next === directory) return next
+          const path = pathname.slice(b64Dir.length + 1)
+          navigate(`/${base64Encode(next)}${path}${location.search}${location.hash}`, { replace: true })
+        })
+        .catch(() => {
+          invalid = ""
+          return directory
+        })
+    },
+  )

  return (
-    <Show when={state.resolved} keyed>
+    <Show when={resolved()} keyed>
      {(resolved) => (
        <SDKProvider directory={() => resolved}>
          <SyncProvider>
--- a/packages/app/src/pages/layout.tsx
+++ b/packages/app/src/pages/layout.tsx
@ -2,6 +2,7 @@ import {
  batch,
  createEffect,
  createMemo,
+  createResource,
  For,
  on,
  onCleanup,
@ -277,16 +278,6 @@ export default function Layout(props: ParentProps) {
    setHoverProject(undefined)
  })

-  const autoselecting = createMemo(() => {
-    if (params.dir) return false
-    if (!state.autoselect) return false
-    if (!pageReady()) return true
-    if (!layoutReady()) return true
-    const list = layout.projects.list()
-    if (list.length > 0) return true
-    return !!server.projects.last()
-  })
-
  createEffect(() => {
    if (!state.autoselect) return
    const dir = params.dir
@ -552,13 +543,14 @@ export default function Layout(props: ParentProps) {
  const currentProject = createMemo(() => {
    const directory = currentDir()
    if (!directory) return
+    const key = workspaceKey(directory)

    const projects = layout.projects.list()

-    const sandbox = projects.find((p) => p.sandboxes?.includes(directory))
+    const sandbox = projects.find((p) => p.sandboxes?.some((item) => workspaceKey(item) === key))
    if (sandbox) return sandbox

-    const direct = projects.find((p) => p.worktree === directory)
+    const direct = projects.find((p) => workspaceKey(p.worktree) === key)
    if (direct) return direct

    const [child] = globalSync.child(directory, { bootstrap: false })
@ -572,33 +564,23 @@ export default function Layout(props: ParentProps) {
    return projects.find((p) => p.worktree === root)
  })

-  createEffect(
-    on(
-      () => ({ ready: pageReady(), layoutReady: layoutReady(), dir: params.dir, list: layout.projects.list() }),
-      (value) => {
-        if (!value.ready) return
-        if (!value.layoutReady) return
-        if (!state.autoselect) return
-        if (value.dir) return
+  const [autoselecting] = createResource(async () => {
+    await ready.promise
+    await layout.ready.promise
+    if (!untrack(() => state.autoselect)) return

-        const last = server.projects.last()
+    const list = layout.projects.list()
+    const last = server.projects.last()

-        if (value.list.length === 0) {
-          if (!last) return
-          setState("autoselect", false)
-          openProject(last, false)
-          navigateToProject(last)
-          return
-        }
-
-        const next = value.list.find((project) => project.worktree === last) ?? value.list[0]
-        if (!next) return
-        setState("autoselect", false)
-        openProject(next.worktree, false)
-        navigateToProject(next.worktree)
-      },
-    ),
-  )
+    if (list.length === 0) {
+      if (!last) return
+      await openProject(last, true)
+    } else {
+      const next = list.find((project) => project.worktree === last) ?? list[0]
+      if (!next) return
+      await openProject(next.worktree, true)
+    }
+  })

  const workspaceName = (directory: string, projectId?: string, branch?: string) => {
    const key = workspaceKey(directory)
@ -649,7 +631,11 @@ export default function Layout(props: ParentProps) {
    const projects = layout.projects.list()
    for (const [directory, expanded] of Object.entries(store.workspaceExpanded)) {
      if (!expanded) continue
-      const project = projects.find((item) => item.worktree === directory || item.sandboxes?.includes(directory))
+      const key = workspaceKey(directory)
+      const project = projects.find(
+        (item) =>
+          workspaceKey(item.worktree) === key || item.sandboxes?.some((sandbox) => workspaceKey(sandbox) === key),
+      )
      if (!project) continue
      if (project.vcs === "git" && layout.sidebar.workspaces(project.worktree)()) continue
      setStore("workspaceExpanded", directory, false)
@ -1174,13 +1160,17 @@ export default function Layout(props: ParentProps) {
  }

  function projectRoot(directory: string) {
+    const key = workspaceKey(directory)
    const project = layout.projects
      .list()
-      .find((item) => item.worktree === directory || item.sandboxes?.includes(directory))
+      .find(
+        (item) =>
+          workspaceKey(item.worktree) === key || item.sandboxes?.some((sandbox) => workspaceKey(sandbox) === key),
+      )
    if (project) return project.worktree

    const known = Object.entries(store.workspaceOrder).find(
-      ([root, dirs]) => root === directory || dirs.includes(directory),
+      ([root, dirs]) => workspaceKey(root) === key || dirs.some((item) => workspaceKey(item) === key),
    )
    if (known) return known[0]

@ -1196,13 +1186,6 @@ export default function Layout(props: ParentProps) {
    return currentProject()?.worktree ?? projectRoot(directory)
  }

-  function touchProjectRoute() {
-    const root = currentProject()?.worktree
-    if (!root) return
-    if (server.projects.last() !== root) server.projects.touch(root)
-    return root
-  }
-
  function rememberSessionRoute(directory: string, id: string, root = activeProjectRoot(directory)) {
    setStore("lastProjectSession", root, { directory, id, at: Date.now() })
    return root
@ -1311,7 +1294,7 @@ export default function Layout(props: ParentProps) {

  function openProject(directory: string, navigate = true) {
    layout.projects.open(directory)
-    if (navigate) navigateToProject(directory)
+    if (navigate) return navigateToProject(directory)
  }

  const handleDeepLinks = (urls: string[]) => {
@ -1366,8 +1349,9 @@ export default function Layout(props: ParentProps) {

  function closeProject(directory: string) {
    const list = layout.projects.list()
-    const index = list.findIndex((x) => x.worktree === directory)
-    const active = currentProject()?.worktree === directory
+    const key = workspaceKey(directory)
+    const index = list.findIndex((x) => workspaceKey(x.worktree) === key)
+    const active = workspaceKey(currentProject()?.worktree ?? "") === key
    if (index === -1) return
    const next = list[index + 1]

@ -1702,38 +1686,55 @@ export default function Layout(props: ParentProps) {
  const activeRoute = {
    session: "",
    sessionProject: "",
+    directory: "",
  }

  createEffect(
    on(
-      () => [pageReady(), params.dir, params.id, currentProject()?.worktree] as const,
-      ([ready, dir, id]) => {
-        if (!ready || !dir) {
+      () => {
+        const dir = params.dir
+        const directory = dir ? decode64(dir) : undefined
+        const resolved = directory ? globalSync.child(directory, { bootstrap: false })[0].path.directory : ""
+        return [pageReady(), dir, params.id, currentProject()?.worktree, directory, resolved] as const
+      },
+      ([ready, dir, id, root, directory, resolved]) => {
+        if (!ready || !dir || !directory) {
          activeRoute.session = ""
          activeRoute.sessionProject = ""
+          activeRoute.directory = ""
          return
        }

-        const directory = decode64(dir)
-        if (!directory) return
-
-        const root = touchProjectRoute() ?? activeProjectRoot(directory)
-
        if (!id) {
          activeRoute.session = ""
          activeRoute.sessionProject = ""
+          activeRoute.directory = ""
          return
        }

+        const next = resolved || directory
        const session = `${dir}/${id}`
-        if (session !== activeRoute.session) {
+
+        if (!root) {
          activeRoute.session = session
-          activeRoute.sessionProject = syncSessionRoute(directory, id, root)
+          activeRoute.directory = next
+          activeRoute.sessionProject = ""
+          return
+        }
+
+        if (server.projects.last() !== root) server.projects.touch(root)
+
+        const changed = session !== activeRoute.session || next !== activeRoute.directory
+        if (changed) {
+          activeRoute.session = session
+          activeRoute.directory = next
+          activeRoute.sessionProject = syncSessionRoute(next, id, root)
          return
        }

        if (root === activeRoute.sessionProject) return
-        activeRoute.sessionProject = rememberSessionRoute(directory, id, root)
+        activeRoute.directory = next
+        activeRoute.sessionProject = rememberSessionRoute(next, id, root)
      },
    ),
  )
@ -1797,8 +1798,13 @@ export default function Layout(props: ParentProps) {
    const local = project.worktree
    const dirs = [local, ...(project.sandboxes ?? [])]
    const active = currentProject()
-    const directory = active?.worktree === project.worktree ? currentDir() : undefined
-    const extra = directory && directory !== local && !dirs.includes(directory) ? directory : undefined
+    const directory = workspaceKey(active?.worktree ?? "") === workspaceKey(project.worktree) ? currentDir() : undefined
+    const extra =
+      directory &&
+      workspaceKey(directory) !== workspaceKey(local) &&
+      !dirs.some((item) => workspaceKey(item) === workspaceKey(directory))
+        ? directory
+        : undefined
    const pending = extra ? WorktreeState.get(extra)?.status === "pending" : false

    const ordered = effectiveWorkspaceOrder(local, dirs, store.workspaceOrder[project.worktree])
@ -1959,6 +1965,7 @@ export default function Layout(props: ParentProps) {
    const merged = createMemo(() => panelProps.mobile || (panelProps.merged ?? layout.sidebar.opened()))
    const hover = createMemo(() => !panelProps.mobile && panelProps.merged === false && !layout.sidebar.opened())
    const popover = createMemo(() => !!panelProps.mobile || panelProps.merged === false || layout.sidebar.opened())
+    const empty = createMemo(() => !params.dir && layout.projects.list().length === 0)
    const projectName = createMemo(() => {
      const item = project()
      if (!item) return ""
@ -2011,7 +2018,26 @@ export default function Layout(props: ParentProps) {
          width: panelProps.mobile ? undefined : `${Math.max(Math.max(layout.sidebar.width(), 244) - 64, 0)}px`,
        }}
      >
-        <Show when={project()}>
+        <Show
+          when={project()}
+          fallback={
+            <Show when={empty()}>
+              <div class="flex-1 min-h-0 -mt-4 flex items-center justify-center px-6 pb-64 text-center">
+                <div class="mt-8 flex max-w-60 flex-col items-center gap-6 text-center">
+                  <div class="flex flex-col gap-3">
+                    <div class="text-14-medium text-text-strong">{language.t("sidebar.empty.title")}</div>
+                    <div class="text-14-regular text-text-base" style={{ "line-height": "var(--line-height-normal)" }}>
+                      {language.t("sidebar.empty.description")}
+                    </div>
+                  </div>
+                  <Button size="large" icon="folder-add-left" onClick={chooseProject}>
+                    {language.t("command.project.open")}
+                  </Button>
+                </div>
+              </div>
+            </Show>
+          }
+        >
          <>
            <div class="shrink-0 pl-1 py-1">
              <div class="group/project flex items-start justify-between gap-2 py-2 pl-2 pr-0">
@ -2260,13 +2286,7 @@ export default function Layout(props: ParentProps) {
      helpLabel={() => language.t("sidebar.help")}
      onOpenHelp={() => platform.openLink("https://opencode.ai/desktop-feedback")}
      renderPanel={() =>
-        mobile ? (
-          <SidebarPanel project={currentProject} mobile />
-        ) : (
-          <Show when={currentProject()}>
-            <SidebarPanel project={currentProject} merged />
-          </Show>
-        )
+        mobile ? <SidebarPanel project={currentProject} mobile /> : <SidebarPanel project={currentProject} merged />
      }
    />
  )
@ -2367,7 +2387,7 @@ export default function Layout(props: ParentProps) {
                  "size-full overflow-x-hidden flex flex-col items-start contain-strict border-t border-border-weak-base bg-background-base xl:border-l xl:rounded-tl-[12px]": true,
                }}
              >
-                <Show when={!autoselecting()} fallback={<div class="size-full" />}>
+                <Show when={!autoselecting.loading} fallback={<div class="size-full" />}>
                  {props.children}
                </Show>
              </main>
--- a/packages/app/src/pages/layout/helpers.test.ts
+++ b/packages/app/src/pages/layout/helpers.test.ts
@ -104,14 +104,14 @@ describe("layout deep links", () => {
 describe("layout workspace helpers", () => {
  test("normalizes trailing slash in workspace key", () => {
    expect(workspaceKey("/tmp/demo///")).toBe("/tmp/demo")
-    expect(workspaceKey("C:\\tmp\\demo\\\\")).toBe("C:\\tmp\\demo")
+    expect(workspaceKey("C:\\tmp\\demo\\\\")).toBe("C:/tmp/demo")
  })

  test("preserves posix and drive roots in workspace key", () => {
    expect(workspaceKey("/")).toBe("/")
    expect(workspaceKey("///")).toBe("/")
-    expect(workspaceKey("C:\\")).toBe("C:\\")
-    expect(workspaceKey("C:\\\\\\")).toBe("C:\\")
+    expect(workspaceKey("C:\\")).toBe("C:/")
+    expect(workspaceKey("C://")).toBe("C:/")
    expect(workspaceKey("C:///")).toBe("C:/")
  })

--- a/packages/app/src/pages/layout/helpers.ts
+++ b/packages/app/src/pages/layout/helpers.ts
@ -1,11 +1,17 @@
 import { getFilename } from "@opencode-ai/util/path"
 import { type Session } from "@opencode-ai/sdk/v2/client"

+type SessionStore = {
+  session?: Session[]
+  path: { directory: string }
+}
+
 export const workspaceKey = (directory: string) => {
-  const drive = directory.match(/^([A-Za-z]:)[\\/]+$/)
-  if (drive) return `${drive[1]}${directory.includes("\\") ? "\\" : "/"}`
-  if (/^[\\/]+$/.test(directory)) return directory.includes("\\") ? "\\" : "/"
-  return directory.replace(/[\\/]+$/, "")
+  const value = directory.replaceAll("\\", "/")
+  const drive = value.match(/^([A-Za-z]:)\/+$/)
+  if (drive) return `${drive[1]}/`
+  if (/^\/+$/i.test(value)) return "/"
+  return value.replace(/\/+$/, "")
 }

 function sortSessions(now: number) {
@ -25,13 +31,13 @@ function sortSessions(now: number) {
 const isRootVisibleSession = (session: Session, directory: string) =>
  workspaceKey(session.directory) === workspaceKey(directory) && !session.parentID && !session.time?.archived

-export const sortedRootSessions = (store: { session: Session[]; path: { directory: string } }, now: number) =>
-  store.session.filter((session) => isRootVisibleSession(session, store.path.directory)).sort(sortSessions(now))
+const roots = (store: SessionStore) =>
+  (store.session ?? []).filter((session) => isRootVisibleSession(session, store.path.directory))

-export const latestRootSession = (stores: { session: Session[]; path: { directory: string } }[], now: number) =>
-  stores
-    .flatMap((store) => store.session.filter((session) => isRootVisibleSession(session, store.path.directory)))
-    .sort(sortSessions(now))[0]
+export const sortedRootSessions = (store: SessionStore, now: number) => roots(store).sort(sortSessions(now))
+
+export const latestRootSession = (stores: SessionStore[], now: number) =>
+  stores.flatMap(roots).sort(sortSessions(now))[0]

 export function hasProjectPermissions<T>(
  request: Record<string, T[] | undefined>,
@ -40,9 +46,9 @@ export function hasProjectPermissions<T>(
  return Object.values(request).some((list) => list?.some(include))
 }

-export const childMapByParent = (sessions: Session[]) => {
+export const childMapByParent = (sessions: Session[] | undefined) => {
  const map = new Map<string, string[]>()
-  for (const session of sessions) {
+  for (const session of sessions ?? []) {
    if (!session.parentID) continue
    const existing = map.get(session.parentID)
    if (existing) {
--- a/packages/app/src/pages/layout/sidebar-workspace.tsx
+++ b/packages/app/src/pages/layout/sidebar-workspace.tsx
@ -332,12 +332,13 @@ export const SortableWorkspace = (props: {
  const open = createMemo(() => props.ctx.workspaceExpanded(props.directory, local()))
  const boot = createMemo(() => open() || active())
  const booted = createMemo((prev) => prev || workspaceStore.status === "complete", false)
-  const hasMore = createMemo(() => workspaceStore.sessionTotal > sessions().length)
+  const count = createMemo(() => sessions()?.length ?? 0)
+  const hasMore = createMemo(() => workspaceStore.sessionTotal > count())
  const busy = createMemo(() => props.ctx.isBusy(props.directory))
  const wasBusy = createMemo((prev) => prev || busy(), false)
-  const loading = createMemo(() => open() && !booted() && sessions().length === 0 && !wasBusy())
+  const loading = createMemo(() => open() && !booted() && count() === 0 && !wasBusy())
  const touch = createMediaQuery("(hover: none)")
-  const showNew = createMemo(() => !loading() && (touch() || sessions().length === 0 || (active() && !params.id)))
+  const showNew = createMemo(() => !loading() && (touch() || count() === 0 || (active() && !params.id)))
  const loadMore = async () => {
    setWorkspaceStore("limit", (limit) => (limit ?? 0) + 5)
    await globalSync.project.loadSessions(props.directory)
@ -472,8 +473,9 @@ export const LocalWorkspace = (props: {
  const sessions = createMemo(() => sortedRootSessions(workspace().store, props.sortNow()))
  const children = createMemo(() => childMapByParent(workspace().store.session))
  const booted = createMemo((prev) => prev || workspace().store.status === "complete", false)
-  const loading = createMemo(() => !booted() && sessions().length === 0)
-  const hasMore = createMemo(() => workspace().store.sessionTotal > sessions().length)
+  const count = createMemo(() => sessions()?.length ?? 0)
+  const loading = createMemo(() => !booted() && count() === 0)
+  const hasMore = createMemo(() => workspace().store.sessionTotal > count())
  const loadMore = async () => {
    workspace().setStore("limit", (limit) => (limit ?? 0) + 5)
    await globalSync.project.loadSessions(props.project.worktree)
--- a/packages/app/src/pages/session/terminal-panel.tsx
+++ b/packages/app/src/pages/session/terminal-panel.tsx
@ -18,8 +18,10 @@ import { terminalTabLabel } from "@/pages/session/terminal-label"
 import { createSizing, focusTerminalById } from "@/pages/session/helpers"
 import { getTerminalHandoff, setTerminalHandoff } from "@/pages/session/handoff"
 import { useSessionLayout } from "@/pages/session/session-layout"
+import { terminalProbe } from "@/testing/terminal"

 export function TerminalPanel() {
+  const delays = [120, 240]
  const layout = useLayout()
  const terminal = useTerminal()
  const language = useLanguage()
@ -79,16 +81,20 @@ export function TerminalPanel() {
  )

  const focus = (id: string) => {
+    const probe = terminalProbe(id)
+    probe.focus(delays.length + 1)
    focusTerminalById(id)

    const frame = requestAnimationFrame(() => {
+      probe.step()
      if (!opened()) return
      if (terminal.active() !== id) return
      focusTerminalById(id)
    })

-    const timers = [120, 240].map((ms) =>
+    const timers = delays.map((ms) =>
      window.setTimeout(() => {
+        probe.step()
        if (!opened()) return
        if (terminal.active() !== id) return
        focusTerminalById(id)
@ -96,6 +102,7 @@ export function TerminalPanel() {
    )

    return () => {
+      probe.focus(0)
      cancelAnimationFrame(frame)
      for (const timer of timers) clearTimeout(timer)
    }
@ -273,21 +280,24 @@ export function TerminalPanel() {
              </Tabs>
              <div class="flex-1 min-h-0 relative">
                <Show when={terminal.active()} keyed>
-                  {(id) => (
-                    <Show when={all().find((pty) => pty.id === id)}>
-                      {(pty) => (
-                        <div id={`terminal-wrapper-${id}`} class="absolute inset-0">
-                          <Terminal
-                            pty={pty()}
-                            autoFocus={opened()}
-                            onConnect={() => terminal.trim(id)}
-                            onCleanup={terminal.update}
-                            onConnectError={() => terminal.clone(id)}
-                          />
-                        </div>
-                      )}
-                    </Show>
-                  )}
+                  {(id) => {
+                    const ops = terminal.bind()
+                    return (
+                      <Show when={all().find((pty) => pty.id === id)}>
+                        {(pty) => (
+                          <div id={`terminal-wrapper-${id}`} class="absolute inset-0">
+                            <Terminal
+                              pty={pty()}
+                              autoFocus={opened()}
+                              onConnect={() => ops.trim(id)}
+                              onCleanup={ops.update}
+                              onConnectError={() => ops.clone(id)}
+                            />
+                          </div>
+                        )}
+                      </Show>
+                    )
+                  }}
                </Show>
              </div>
            </div>
--- a/packages/app/src/testing/prompt.ts
+++ b/packages/app/src/testing/prompt.ts
@ -0,0 +1,56 @@
+import type { E2EWindow } from "./terminal"
+
+export type PromptProbeState = {
+  popover: "at" | "slash" | null
+  slash: {
+    active: string | null
+    ids: string[]
+  }
+  selected: string | null
+  selects: number
+}
+
+export const promptEnabled = () => {
+  if (typeof window === "undefined") return false
+  return (window as E2EWindow).__opencode_e2e?.prompt?.enabled === true
+}
+
+const root = () => {
+  if (!promptEnabled()) return
+  return (window as E2EWindow).__opencode_e2e?.prompt
+}
+
+export const promptProbe = {
+  set(input: Omit<PromptProbeState, "selected" | "selects">) {
+    const state = root()
+    if (!state) return
+    state.current = {
+      popover: input.popover,
+      slash: {
+        active: input.slash.active,
+        ids: [...input.slash.ids],
+      },
+      selected: state.current?.selected ?? null,
+      selects: state.current?.selects ?? 0,
+    }
+  },
+  select(id: string) {
+    const state = root()
+    if (!state) return
+    const prev = state.current
+    state.current = {
+      popover: prev?.popover ?? null,
+      slash: {
+        active: prev?.slash.active ?? null,
+        ids: [...(prev?.slash.ids ?? [])],
+      },
+      selected: id,
+      selects: (prev?.selects ?? 0) + 1,
+    }
+  },
+  clear() {
+    const state = root()
+    if (!state) return
+    state.current = undefined
+  },
+}
--- a/packages/app/src/testing/terminal.ts
+++ b/packages/app/src/testing/terminal.ts
@ -7,6 +7,7 @@ export type TerminalProbeState = {
  connects: number
  rendered: string
  settled: number
+  focusing: number
 }

 type TerminalProbeControl = {
@ -19,6 +20,10 @@ export type E2EWindow = Window & {
      enabled?: boolean
      current?: ModelProbeState
    }
+    prompt?: {
+      enabled?: boolean
+      current?: import("./prompt").PromptProbeState
+    }
    terminal?: {
      enabled?: boolean
      terminals?: Record<string, TerminalProbeState>
@ -32,6 +37,7 @@ const seed = (): TerminalProbeState => ({
  connects: 0,
  rendered: "",
  settled: 0,
+  focusing: 0,
 })

 const root = () => {
@ -88,6 +94,15 @@ export const terminalProbe = (id: string) => {
      const prev = state[id] ?? seed()
      state[id] = { ...prev, settled: prev.settled + 1 }
    },
+    focus(count: number) {
+      set({ focusing: Math.max(0, count) })
+    },
+    step() {
+      const state = terms()
+      if (!state) return
+      const prev = state[id] ?? seed()
+      state[id] = { ...prev, focusing: Math.max(0, prev.focusing - 1) }
+    },
    control(next: Partial<TerminalProbeControl>) {
      const state = controls()
      if (!state) return
--- a/packages/app/src/utils/persist.ts
+++ b/packages/app/src/utils/persist.ts
@ -5,7 +5,12 @@ import { createResource, type Accessor } from "solid-js"
 import type { SetStoreFunction, Store } from "solid-js/store"

 type InitType = Promise<string> | string | null
-type PersistedWithReady<T> = [Store<T>, SetStoreFunction<T>, InitType, Accessor<boolean>]
+type PersistedWithReady<T> = [
+  Store<T>,
+  SetStoreFunction<T>,
+  InitType,
+  Accessor<boolean> & { promise: undefined | Promise<any> },
+]

 type PersistTarget = {
  storage?: string
@ -460,5 +465,12 @@ export function persisted<T>(
    { initialValue: !isAsync },
  )

-  return [state, setState, init, () => ready() === true]
+  return [
+    state,
+    setState,
+    init,
+    Object.assign(() => ready() === true, {
+      promise: init instanceof Promise ? init : undefined,
+    }),
+  ]
 }