fix(app): restore directory-scoped session status for v1 servers (#38637 )

chore: generate
feat(app): migrate discovery workflows (#38465 )
2026-07-24 14:55:54 +08:00 · 2026-07-24 06:40:05 +00:00 · 2026-07-24 14:38:39 +08:00 · 2026-07-24 06:07:04 +00:00 · 2026-07-24 06:05:40 +00:00 · 2026-07-24 04:59:34 +00:00
48 changed files with 2878 additions and 2260 deletions
@@ -1,5 +1,6 @@
 import { expect, test, type Page, type Route } from "@playwright/test"
 import { base64Encode } from "@opencode-ai/core/util/encode"
+import { currentSession } from "../utils/mock-server"

 const serverA = "http://127.0.0.1:4096"
 const serverB = "http://127.0.0.1:4097"
@@ -33,7 +34,7 @@ test("closing the active server's last tab opens the remaining server tab", asyn
  await tabA.locator('[data-slot="tab-close"] button').click()

  await expect(page).toHaveURL(new RegExp(`${hrefB.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}$`))
-  await expect.poll(() => requests.some((url) => url.startsWith(`${serverB}/session/${sessionB.id}`))).toBe(true)
+  await expect.poll(() => requests.some((url) => url.startsWith(`${serverB}/api/session/${sessionB.id}`))).toBe(true)
  await expect(page.getByText(sessionB.title).first()).toBeVisible()
  const sessionBRequests = requests.filter((url) => url.includes(`/session/${sessionB.id}`))
  expect(sessionBRequests.every((url) => url.startsWith(serverB))).toBe(true)
@@ -84,17 +85,21 @@ async function mockServers(page: Page, requests: string[]) {
    const current = url.origin === serverA ? sessionA : sessionB
    const directory = url.searchParams.get("directory")
    if (directory && directory !== current.directory) return json(route, { name: "InvalidDirectory" }, 500)
-    if (url.pathname === "/global/event" || url.pathname === "/event") return sse(route)
-    if (url.pathname === "/global/health") return json(route, { healthy: true })
-    if (url.pathname === "/session") return json(route, [current])
+    if (url.pathname === "/global/event" || url.pathname === "/event" || url.pathname === "/api/event")
+      return sse(route)
+    if (url.pathname === "/global/health") return json(route, {}, 404)
+    if (url.pathname === "/api/health") return json(route, { pid: 1 })
+    if (url.pathname === "/api/session") return json(route, { data: [currentSession(current)], cursor: {} })
+    if (url.pathname === "/api/session/active") return json(route, { data: {} })
+    if (url.pathname === `/api/session/${current.id}`) return json(route, { data: currentSession(current) })
+    if (url.pathname === `/api/session/${current.id}/message`) return json(route, { data: [], cursor: {} })
    if (url.pathname === `/session/${current.id}`) return json(route, current)
    if (/^\/session\/[^/]+$/.test(url.pathname)) return json(route, { name: "NotFoundError" }, 404)
    if (url.pathname === `/session/${current.id}/message`) return json(route, [])
    if (/^\/session\/[^/]+\/(children|todo|diff)$/.test(url.pathname)) return json(route, [])
    if (["/skill", "/command", "/lsp", "/formatter", "/permission", "/question", "/vcs/diff"].includes(url.pathname))
      return json(route, [])
-    if (["/global/config", "/config", "/provider/auth", "/mcp", "/session/status"].includes(url.pathname))
-      return json(route, {})
+    if (["/global/config", "/config", "/provider/auth", "/mcp"].includes(url.pathname)) return json(route, {})
    if (url.pathname === "/provider")
      return json(route, { all: [], connected: [], default: { providerID: "", modelID: "" } })
    if (url.pathname === "/agent") return json(route, [{ name: "build", mode: "primary" }])
@@ -116,7 +121,20 @@ async function mockServers(page: Page, requests: string[]) {
        directory: current.directory,
        home: current.directory,
      })
+    if (url.pathname === "/api/path")
+      return json(route, {
+        state: current.directory,
+        config: current.directory,
+        worktree: current.directory,
+        directory: current.directory,
+        home: current.directory,
+      })
    if (url.pathname === "/vcs") return json(route, { branch: "main", default_branch: "main" })
+    if (url.pathname === "/api/vcs")
+      return json(route, {
+        location: { directory: current.directory },
+        data: { branch: "main", defaultBranch: "main" },
+      })
    return json(route, {})
  })
 }
@@ -1,5 +1,6 @@
 import { expect, test, type Page, type Route } from "@playwright/test"
 import { base64Encode } from "@opencode-ai/core/util/encode"
+import { currentSession } from "../utils/mock-server"

 const serverA = "http://127.0.0.1:4096"
 const serverB = "http://127.0.0.1:4097"
@@ -57,11 +58,15 @@ async function mockServers(page: Page) {
    const current = url.origin === serverA ? sessionA : sessionB
    const directory = url.searchParams.get("directory")
    if (directory && directory !== current.directory) return json(route, { name: "InvalidDirectory" }, 500)
-    if (url.pathname === "/global/event" || url.pathname === "/event") return sse(route)
-    if (url.pathname === "/global/health") return json(route, { healthy: true })
-    if (url.pathname === "/session/status")
-      return json(route, url.origin === serverB ? { [sessionB.id]: { type: "busy" } } : {})
-    if (url.pathname === "/session") return json(route, [current])
+    if (url.pathname === "/global/event" || url.pathname === "/event" || url.pathname === "/api/event")
+      return sse(route, url.pathname === "/api/event")
+    if (url.pathname === "/global/health") return json(route, {}, 404)
+    if (url.pathname === "/api/health") return json(route, { pid: 1 })
+    if (url.pathname === "/api/session/active")
+      return json(route, { data: url.origin === serverB ? { [sessionB.id]: { type: "running" } } : {} })
+    if (url.pathname === "/api/session") return json(route, { data: [currentSession(current)], cursor: {} })
+    if (url.pathname === `/api/session/${current.id}`) return json(route, { data: currentSession(current) })
+    if (url.pathname === `/api/session/${current.id}/message`) return json(route, { data: [], cursor: {} })
    if (url.pathname === `/session/${current.id}`) return json(route, current)
    if (/^\/session\/[^/]+$/.test(url.pathname)) return json(route, { name: "NotFoundError" }, 404)
    if (url.pathname === `/session/${current.id}/message`) return json(route, [])
@@ -90,7 +95,20 @@ async function mockServers(page: Page) {
        directory: current.directory,
        home: current.directory,
      })
+    if (url.pathname === "/api/path")
+      return json(route, {
+        state: current.directory,
+        config: current.directory,
+        worktree: current.directory,
+        directory: current.directory,
+        home: current.directory,
+      })
    if (url.pathname === "/vcs") return json(route, { branch: "main", default_branch: "main" })
+    if (url.pathname === "/api/vcs")
+      return json(route, {
+        location: { directory: current.directory },
+        data: { branch: "main", defaultBranch: "main" },
+      })
    return json(route, {})
  })
 }
@@ -104,10 +122,10 @@ function json(route: Route, body: unknown, status = 200) {
  })
 }

-function sse(route: Route) {
+function sse(route: Route, current: boolean) {
  return route.fulfill({
    status: 200,
    contentType: "text/event-stream",
-    body: `data: ${JSON.stringify({ payload: { id: "evt_mock_connected", type: "server.connected", properties: {} } })}\n\n`,
+    body: current ? 'data: {"id":"evt_connected","type":"server.connected","data":{}}\n\n' : ": ok\n\n",
  })
 }
@@ -16,8 +16,8 @@ test("shows loaded sessions before the directory path request resolves", async (
  const pathBlocked = new Promise<void>((resolve) => {
    releasePath = resolve
  })
-  await page.route("**/path?*", async (route) => {
-    if (!new URL(route.request().url()).searchParams.has("directory")) return route.fallback()
+  await page.route("**/api/path?*", async (route) => {
+    if (!new URL(route.request().url()).searchParams.has("location[directory]")) return route.fallback()
    await pathBlocked
    return route.fallback()
  })
@@ -42,7 +42,8 @@ test("shows a pending question dock", async ({ page }) => {
  const rejectRequests: string[] = []
  page.on("request", (request) => {
    if (request.method() !== "POST") return
-    if (new URL(request.url()).pathname === "/question/question-request/reject") rejectRequests.push(request.url())
+    if (new URL(request.url()).pathname === `/api/session/${sessionID}/question/question-request/reject`)
+      rejectRequests.push(request.url())
  })

  await question.locator('[data-component="icon-button"][data-icon="chevron-down"]').click()
@@ -64,7 +65,9 @@ test("shows a pending question dock", async ({ page }) => {

  await question.getByRole("radio", { name: /Minimal/ }).click()
  const reply = page.waitForRequest(
-    (request) => request.method() === "POST" && new URL(request.url()).pathname === "/question/question-request/reply",
+    (request) =>
+      request.method() === "POST" &&
+      new URL(request.url()).pathname === `/api/session/${sessionID}/question/question-request/reply`,
  )
  await question.getByRole("button", { name: "Submit" }).click()
  expect((await reply).postDataJSON()).toEqual({ answers: [["Minimal"]] })
@@ -97,8 +100,8 @@ test("shows a pending permission dock", async ({ page }) => {
  const reply = page.waitForRequest((request) => request.method() === "POST")
  await permission.getByRole("button", { name: "Allow once" }).click()
  const request = await reply
-  expect(new URL(request.url()).pathname).toBe(`/session/${sessionID}/permissions/permission-request`)
-  expect(request.postDataJSON()).toEqual({ response: "once" })
+  expect(new URL(request.url()).pathname).toBe(`/api/session/${sessionID}/permission/permission-request/reply`)
+  expect(request.postDataJSON()).toEqual({ reply: "once" })
 })

 test("restores the draft caret before typing after a request dock closes", async ({ page }) => {
@@ -170,6 +173,7 @@ async function mockServer(
  },
 ) {
  await mockOpenCodeServer(page, {
+    protocol: "v2",
    directory,
    project: {
      id: projectID,
@@ -1,6 +1,6 @@
 import { base64Encode } from "@opencode-ai/core/util/encode"
 import { expect, test, type Page } from "@playwright/test"
-import { mockOpenCodeServer } from "../utils/mock-server"
+import { currentSession, mockOpenCodeServer } from "../utils/mock-server"
 import { expectSessionTitle } from "../utils/waits"

 const directory = "C:/OpenCode/SubagentNavigation"
@@ -72,16 +72,19 @@ async function setup(page: Page, events?: () => EventPayload[]) {
    events,
    eventRetry: events ? 16 : undefined,
  })
-  // The child session resolves via /session/:id but is absent from the /session list,
+  // The child session resolves by ID but is absent from the session list,
  // matching a subagent session that has not been loaded into the list cache yet.
  await page.route(
-    (url) => url.pathname === "/session" && url.port === (process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"),
+    (url) => url.pathname === "/api/session" && url.port === (process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"),
    (route) =>
      route.fulfill({
        status: 200,
        contentType: "application/json",
        headers: { "access-control-allow-origin": "*" },
-        body: JSON.stringify([session(parentID, parentTitle, 1700000000000)]),
+        body: JSON.stringify({
+          data: [currentSession(session(parentID, parentTitle, 1700000000000))],
+          cursor: {},
+        }),
      }),
  )
  await configurePage(page)
@@ -1,5 +1,6 @@
 import { expect, test, type Page, type Route } from "@playwright/test"
 import { base64Encode } from "@opencode-ai/core/util/encode"
+import { currentSession } from "../utils/mock-server"

 const server = "http://127.0.0.1:4096"
 const sessionA = session("ses_tab_a", "Tab A session")
@@ -56,9 +57,15 @@ async function mockServer(page: Page) {
  await page.route("**/*", async (route) => {
    const url = new URL(route.request().url())
    if (url.origin !== server) return route.fallback()
-    if (url.pathname === "/global/event" || url.pathname === "/event") return sse(route)
+    if (url.pathname === "/global/event" || url.pathname === "/event" || url.pathname === "/api/event")
+      return sse(route)
    if (url.pathname === "/global/health") return json(route, { healthy: true })
-    if (url.pathname === "/session") return json(route, sessions)
+    if (url.pathname === "/api/session") return json(route, { data: sessions.map(currentSession), cursor: {} })
+    if (url.pathname === "/api/session/active") return json(route, { data: {} })
+    const currentSessionInfo = sessions.find((item) => url.pathname === `/api/session/${item.id}`)
+    if (currentSessionInfo) return json(route, { data: currentSession(currentSessionInfo) })
+    if (sessions.some((item) => url.pathname === `/api/session/${item.id}/message`))
+      return json(route, { data: [], cursor: {} })
    const byId = sessions.find((item) => url.pathname === `/session/${item.id}`)
    if (byId) return json(route, byId)
    if (/^\/session\/[^/]+$/.test(url.pathname)) return json(route, { name: "NotFoundError" }, 404)
@@ -66,8 +73,7 @@ async function mockServer(page: Page) {
    if (/^\/session\/[^/]+\/(children|todo|diff)$/.test(url.pathname)) return json(route, [])
    if (["/skill", "/command", "/lsp", "/formatter", "/permission", "/question", "/vcs/diff"].includes(url.pathname))
      return json(route, [])
-    if (["/global/config", "/config", "/provider/auth", "/mcp", "/session/status"].includes(url.pathname))
-      return json(route, {})
+    if (["/global/config", "/config", "/provider/auth", "/mcp"].includes(url.pathname)) return json(route, {})
    if (url.pathname === "/provider")
      return json(route, { all: [], connected: [], default: { providerID: "", modelID: "" } })
    if (url.pathname === "/agent") return json(route, [{ name: "build", mode: "primary" }])
@@ -89,7 +95,20 @@ async function mockServer(page: Page) {
        directory: sessionA.directory,
        home: sessionA.directory,
      })
+    if (url.pathname === "/api/path")
+      return json(route, {
+        state: sessionA.directory,
+        config: sessionA.directory,
+        worktree: sessionA.directory,
+        directory: sessionA.directory,
+        home: sessionA.directory,
+      })
    if (url.pathname === "/vcs") return json(route, { branch: "main", default_branch: "main" })
+    if (url.pathname === "/api/vcs")
+      return json(route, {
+        location: { directory: sessionA.directory },
+        data: { branch: "main", defaultBranch: "main" },
+      })
    return json(route, {})
  })
 }
@@ -205,6 +205,12 @@ export async function mockOpenCodeServer(page: Page, config: MockServerConfig) {
    if (/^\/api\/session\/[^/]+\/permission\/[^/]+\/reply$/.test(path) && route.request().method() === "POST") {
      return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
    }
+    if (/^\/question\/[^/]+\/(reply|reject)$/.test(path) && route.request().method() === "POST") {
+      return json(route, true)
+    }
+    if (/^\/session\/[^/]+\/permissions\/[^/]+$/.test(path) && route.request().method() === "POST") {
+      return json(route, true)
+    }
    if (
      /^\/api\/session\/[^/]+\/(archive|rename|interrupt|revert\/clear|revert\/commit)$/.test(path) &&
      route.request().method() === "POST"
@@ -67,7 +67,8 @@ import { legacySessionHref, legacySessionServer, requireServerKey, sessionHref }
 import { createSessionLineage } from "@/pages/session/session-lineage"

 import { SessionPage, SessionRouteErrorBoundary, TargetSessionRouteContent } from "@/pages/session"
-import { NewHome, LegacyHome } from "@/pages/home"
+import { NewHome } from "@/pages/home"
+import { LegacyHome } from "@/pages/home/legacy-home"

 const NewSession = lazy(() => import("@/pages/new-session"))

@@ -1,5 +1,6 @@
 import { getFilename } from "@opencode-ai/core/util/path"
-import type { GlobalSession, Project } from "@opencode-ai/sdk/v2/client"
+import type { Project } from "@opencode-ai/sdk/v2/client"
+import type { SessionInfo } from "@opencode-ai/client/promise"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { createMemo, onCleanup } from "solid-js"
 import { commandPaletteOptions, useCommand, type CommandOption } from "@/context/command"
@@ -13,6 +14,7 @@ import { useTabs } from "@/context/tabs"
 import { displayName, projectForSession } from "@/pages/layout/helpers"
 import { createSessionTabs } from "@/pages/session/helpers"
 import { useSessionLayout } from "@/pages/session/session-layout"
+import { normalizeSessionInfo } from "@/utils/session"

 export type CommandPaletteEntry = {
  id: string
@@ -144,8 +146,7 @@ export function createCommandPaletteModel(props: { filesOnly?: () => boolean; on
    server: ServerConnection.key(serverSDK.server),
    opened: serverCtx.projects.list,
    stored: () => serverCtx.sync.data.project,
-    load: (search, signal) =>
-      serverSDK.client.experimental.session.list({ roots: true, search, limit: 50 }, { signal }),
+    load: (search, signal) => serverSDK.api.session.list({ parentID: null, search, limit: 50 }, { signal }),
    untitled: () => language.t("command.session.new"),
    category: () => language.t("command.category.session"),
  })
@@ -219,7 +220,7 @@ export function createServerSessionEntries(props: {
  server: ServerConnection.Key
  opened: () => LocalProject[]
  stored: () => Project[]
-  load: (search: string, signal: AbortSignal) => Promise<{ data?: GlobalSession[] }>
+  load: (search: string, signal: AbortSignal) => Promise<{ data: SessionInfo[] }>
  untitled: () => string
  category: () => string
 }) {
@@ -255,7 +256,8 @@ export function createServerSessionEntries(props: {
    return props
      .load(search, current.signal)
      .then((result) =>
-        (result.data ?? [])
+        result.data
+          .map(normalizeSessionInfo)
          .filter((session) => !session.time.archived)
          .map((session) => {
            const project =
@@ -264,7 +266,7 @@ export function createServerSessionEntries(props: {
              id: `session:${props.server}:${session.id}`,
              type: "session" as const,
              title: session.title || props.untitled(),
-              description: project ? displayName(project) : session.project?.name || getFilename(session.directory),
+              description: project ? displayName(project) : getFilename(session.directory),
              category: props.category(),
              directory: session.directory,
              sessionID: session.id,
@@ -79,8 +79,7 @@ export function DialogHomeCommandPaletteV2(props: {
    server: ServerConnection.key(props.server),
    opened: serverCtx.projects.list,
    stored: () => serverCtx.sync.data.project,
-    load: (search, signal) =>
-      serverCtx.sdk.client.experimental.session.list({ roots: true, search, limit: 50 }, { signal }),
+    load: (search, signal) => serverCtx.sdk.api.session.list({ parentID: null, search, limit: 50 }, { signal }),
    untitled: () => language.t("command.session.new"),
    category: () => language.t("command.category.session"),
  })
@@ -1,4 +1,4 @@
-import type { ProviderAuthAuthorization, ProviderAuthMethod } from "@opencode-ai/sdk/v2/client"
+import type { IntegrationMethod, IntegrationOauthConnectOutput } from "@opencode-ai/client/promise"
 import { Button } from "@opencode-ai/ui/button"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { Dialog } from "@opencode-ai/ui/dialog"
@@ -28,6 +28,8 @@ import {
  Switch,
 } from "solid-js"
 import { createStore, produce } from "solid-js/store"
+import { useQueryClient } from "@tanstack/solid-query"
+import { useParams } from "@solidjs/router"
 import { Link } from "@/components/link"
 import { useServerSDK } from "@/context/server-sdk"
 import { useServerSync } from "@/context/server-sync"
@@ -35,8 +37,11 @@ import { useLanguage } from "@/context/language"
 import { useSettings } from "@/context/settings"
 import { popularProviders, useProviders } from "@/hooks/use-providers"
 import { CustomProviderForm } from "./dialog-custom-provider"
+import { decode64 } from "@/utils/base64"
+import { pathKey } from "@/utils/path-key"

 const CUSTOM_ID = "_custom"
+type ConnectMethod = Extract<IntegrationMethod, { type: "key" | "oauth" }>

 export function useProviderConnectController(options: { onBack?: () => void } = {}) {
  const [store, setStore] = createStore({ selected: undefined as string | undefined })
@@ -228,8 +233,6 @@ function ProviderPickerV2(props: {
 }) {
  const providers = useProviders(props.directory)
  const language = useLanguage()
-  const serverSync = useServerSync()
-  const serverSDK = useServerSDK()
  const [store, setStore] = createStore({
    filter: "",
    active: undefined as string | undefined,
@@ -266,19 +269,7 @@ function ProviderPickerV2(props: {

  const connect = (provider: string) => {
    props.onPrepare?.()
-    if (provider === CUSTOM_ID || serverSync().data.provider_auth[provider]) {
-      props.onSelect(provider)
-      return
-    }
-    if (store.connecting) return
-    setStore("connecting", provider)
-    void serverSDK()
-      .client.provider.auth()
-      .then((response) => {
-        serverSync().set("provider_auth", response.data ?? {})
-        props.onSelect(provider)
-      })
-      .catch(() => props.onSelect(provider))
+    props.onSelect(provider)
  }

  const move = (event: KeyboardEvent, direction: number) => {
@@ -395,10 +386,17 @@ function ProviderConnection(props: {
  const dialog = useDialog()
  const serverSync = useServerSync()
  const serverSDK = useServerSDK()
+  const queryClient = useQueryClient()
+  const params = useParams()
  const language = useLanguage()
  const settings = useSettings()
  const newLayout = settings.general.newLayoutDesigns
  const providers = useProviders(props.directory)
+  const directory = () => props.directory?.() ?? decode64(params.dir)
+  const location = () => {
+    const value = directory()
+    return value ? { directory: value } : undefined
+  }

  const alive = { value: true }
  const timer = { current: undefined as ReturnType<typeof setTimeout> | undefined }
@@ -413,38 +411,34 @@ function ProviderConnection(props: {
  const provider = createMemo(
    () => providers.all().get(props.provider) ?? serverSync().data.provider.all.get(props.provider)!,
  )
-  const fallback = createMemo<ProviderAuthMethod[]>(() => [
+  const fallback = createMemo<ConnectMethod[]>(() => [
    {
-      type: "api" as const,
+      type: "key" as const,
      label: language.t("provider.connect.method.apiKey"),
    },
  ])
-  const [auth] = createResource(
-    () => props.provider,
-    async () => {
-      const cached = serverSync().data.provider_auth[props.provider]
-      if (cached) return cached
-      const res = await serverSDK().client.provider.auth()
-      if (!alive.value) return fallback()
-      serverSync().set("provider_auth", res.data ?? {})
-      return res.data?.[props.provider] ?? fallback()
-    },
+  const [integration] = createResource(
+    () => ({ provider: props.provider, directory: directory() }),
+    (input) =>
+      serverSDK()
+        .api.integration.get({
+          integrationID: input.provider,
+          location: input.directory ? { directory: input.directory } : undefined,
+        })
+        .then((result) => result.data),
  )
-  const loading = createMemo(() => auth.loading && !serverSync().data.provider_auth[props.provider])
-  const methods = createMemo(() => auth.latest ?? serverSync().data.provider_auth[props.provider] ?? fallback())
-  const cachedMethods = serverSync().data.provider_auth[props.provider]
-  const directMethod =
-    cachedMethods?.length === 1 && cachedMethods[0].type === "api" && !cachedMethods[0].prompts?.length ? 0 : undefined
+  const loading = createMemo(() => integration.loading)
+  const methods = createMemo<ConnectMethod[]>(() => {
+    const values = integration.latest?.methods.filter(
+      (method): method is ConnectMethod => method.type === "key" || method.type === "oauth",
+    )
+    return values?.length ? values : fallback()
+  })
  const [store, setStore] = createStore({
-    methodIndex: directMethod as undefined | number,
-    authorization: undefined as undefined | ProviderAuthAuthorization,
+    methodIndex: undefined as undefined | number,
+    authorization: undefined as undefined | IntegrationOauthConnectOutput["data"],
    promptInputs: undefined as undefined | Record<string, string>,
-    state: (directMethod === undefined ? "pending" : undefined) as
-      | undefined
-      | "pending"
-      | "complete"
-      | "error"
-      | "prompt",
+    state: "pending" as undefined | "pending" | "complete" | "error" | "prompt",
    error: undefined as string | undefined,
  })

@@ -454,7 +448,7 @@ function ProviderConnection(props: {
    | { type: "auth.prompt" }
    | { type: "auth.inputs"; inputs: Record<string, string> }
    | { type: "auth.pending" }
-    | { type: "auth.complete"; authorization: ProviderAuthAuthorization }
+    | { type: "auth.complete"; authorization: IntegrationOauthConnectOutput["data"] }
    | { type: "auth.error"; error: string }

  function dispatch(action: Action) {
@@ -508,7 +502,7 @@ function ProviderConnection(props: {

  const methodLabel = (value?: { type?: string; label?: string }) => {
    if (!value) return ""
-    if (value.type === "api") return language.t("provider.connect.method.apiKey")
+    if (value.type === "key") return language.t("provider.connect.method.apiKey")
    return value.label ?? ""
  }

@@ -518,7 +512,7 @@ function ProviderConnection(props: {
    const hint = suffix?.[1]
    return {
      label: suffix ? label.slice(0, -suffix[0].length) : label,
-      hint: hint ? hint[0].toUpperCase() + hint.slice(1) : value?.type === "api" ? "Browser" : undefined,
+      hint: hint ? hint[0].toUpperCase() + hint.slice(1) : value?.type === "key" ? "Browser" : undefined,
    }
  }

@@ -549,46 +543,22 @@ function ProviderConnection(props: {
    const method = methods()[index]
    dispatch({ type: "method.select", index })

-    if (method.type === "api" && method.prompts?.length) {
-      if (!inputs) {
-        dispatch({ type: "auth.prompt" })
-        return
-      }
-      dispatch({ type: "auth.inputs", inputs })
-      return
-    }
-
    if (method.type === "oauth") {
      if (method.prompts?.length && !inputs) {
        dispatch({ type: "auth.prompt" })
        return
      }
      dispatch({ type: "auth.pending" })
-      const start = Date.now()
      await serverSDK()
-        .client.provider.oauth.authorize(
-          {
-            providerID: props.provider,
-            method: index,
-            inputs,
-          },
-          { throwOnError: true },
-        )
+        .api.integration.oauth.connect({
+          integrationID: props.provider,
+          methodID: method.id,
+          inputs: inputs ?? {},
+          location: location(),
+        })
        .then((x) => {
          if (!alive.value) return
-          const elapsed = Date.now() - start
-          const delay = 1000 - elapsed
-
-          if (delay > 0) {
-            if (timer.current !== undefined) clearTimeout(timer.current)
-            timer.current = setTimeout(() => {
-              timer.current = undefined
-              if (!alive.value) return
-              dispatch({ type: "auth.complete", authorization: x.data! })
-            }, delay)
-            return
-          }
-          dispatch({ type: "auth.complete", authorization: x.data! })
+          dispatch({ type: "auth.complete", authorization: x.data })
        })
        .catch((e) => {
          if (!alive.value) return
@@ -603,9 +573,9 @@ function ProviderConnection(props: {
      index: 0,
    })

-    const prompts = createMemo<NonNullable<ProviderAuthMethod["prompts"]>>(() => {
+    const prompts = createMemo(() => {
      const value = method()
-      return value?.prompts ?? []
+      return value?.type === "oauth" ? (value.prompts ?? []) : []
    })
    const matches = (prompt: NonNullable<ReturnType<typeof prompts>[number]>, value: Record<string, string>) => {
      if (!prompt.when) return true
@@ -636,10 +606,6 @@ function ProviderConnection(props: {
        setFormStore("index", next)
        return
      }
-      if (method()?.type === "api") {
-        dispatch({ type: "auth.inputs", inputs: value })
-        return
-      }
      await selectMethod(store.methodIndex, value)
    }

@@ -741,7 +707,10 @@ function ProviderConnection(props: {
  })

  async function complete() {
-    await serverSDK().client.global.dispose()
+    const value = directory()
+    await queryClient
+      .refetchQueries(serverSync().queryOptions.providers(value ? pathKey(value) : null))
+      .catch(() => undefined)
    dialog.close()
    showToast({
      variant: "success",
@@ -805,7 +774,7 @@ function ProviderConnection(props: {
              listRef = ref
            }}
            items={methods}
-            key={(m) => m?.label}
+            key={(m) => m?.label ?? m?.type}
            onSelect={async (selected, index) => {
              if (!selected) return
              void selectMethod(index)
@@ -851,13 +820,10 @@ function ProviderConnection(props: {
      }

      setFormStore("error", undefined)
-      await serverSDK().client.auth.set({
-        providerID: props.provider,
-        auth: {
-          type: "api",
-          key: apiKey,
-          ...(store.promptInputs ? { metadata: store.promptInputs } : {}),
-        },
+      await serverSDK().api.integration.connect.key({
+        integrationID: props.provider,
+        location: location(),
+        key: apiKey,
      })
      await complete()
    }
@@ -984,12 +950,13 @@ function ProviderConnection(props: {

      setFormStore("error", undefined)
      const result = await serverSDK()
-        .client.provider.oauth.callback({
-          providerID: props.provider,
-          method: store.methodIndex,
+        .api.integration.oauth.complete({
+          integrationID: props.provider,
+          attemptID: store.authorization!.attemptID,
+          location: location(),
          code,
        })
-        .then((value) => (value.error ? { ok: false as const, error: value.error } : { ok: true as const }))
+        .then(() => ({ ok: true as const }))
        .catch((error) => ({ ok: false as const, error }))
      if (result.ok) {
        await complete()
@@ -1076,25 +1043,37 @@ function ProviderConnection(props: {
    })

    onMount(() => {
-      void (async () => {
+      const poll = async () => {
+        const authorization = store.authorization
+        if (!authorization || !alive.value) return
        const result = await serverSDK()
-          .client.provider.oauth.callback({
-            providerID: props.provider,
-            method: store.methodIndex,
+          .api.integration.oauth.status({
+            integrationID: props.provider,
+            attemptID: authorization.attemptID,
+            location: location(),
          })
-          .then((value) => (value.error ? { ok: false as const, error: value.error } : { ok: true as const }))
+          .then((value) => ({ ok: true as const, status: value.data }))
          .catch((error) => ({ ok: false as const, error }))
-
        if (!alive.value) return
-
        if (!result.ok) {
-          const message = formatError(result.error, language.t("common.requestFailed"))
-          dispatch({ type: "auth.error", error: message })
+          dispatch({ type: "auth.error", error: formatError(result.error, language.t("common.requestFailed")) })
          return
        }
-
-        await complete()
-      })()
+        if (result.status.status === "complete") {
+          await complete()
+          return
+        }
+        if (result.status.status === "failed") {
+          dispatch({ type: "auth.error", error: result.status.message })
+          return
+        }
+        if (result.status.status === "expired") {
+          dispatch({ type: "auth.error", error: language.t("common.requestFailed") })
+          return
+        }
+        timer.current = setTimeout(poll, 1_000)
+      }
+      void poll()
    })

    return (
@@ -1178,15 +1157,15 @@ function ProviderConnection(props: {
                </div>
              </div>
            </Match>
-            <Match when={method()?.type === "api"}>
+            <Match when={method()?.type === "key"}>
              <ApiAuthView />
            </Match>
            <Match when={method()?.type === "oauth"}>
              <Switch>
-                <Match when={store.authorization?.method === "code"}>
+                <Match when={store.authorization?.mode === "code"}>
                  <OAuthCodeView />
                </Match>
-                <Match when={store.authorization?.method === "auto"}>
+                <Match when={store.authorization?.mode === "auto"}>
                  <OAuthAutoView />
                </Match>
              </Switch>
@@ -69,15 +69,11 @@ export const DialogFork: Component = () => {
    const dir = base64Encode(sdk().directory)

    sdk()
-      .client.session.fork({ sessionID, messageID: item.id })
+      .api.session.fork({ sessionID, messageID: item.id })
      .then((forked) => {
-        if (!forked.data) {
-          showToast({ title: language.t("common.requestFailed") })
-          return
-        }
        dialog.close()
-        prompt.set(restored, undefined, { dir, id: forked.data.id })
-        navigate(`/${dir}/session/${forked.data.id}`)
+        prompt.set(restored, undefined, { dir, id: forked.id })
+        navigate(`/${dir}/session/${forked.id}`)
      })
      .catch((err: unknown) => {
        const message = err instanceof Error ? err.message : String(err)
@@ -28,6 +28,7 @@ import {
 } from "./directory-picker-domain"
 import "./dialog-select-directory-v2.css"
 import { DividerV2 } from "@opencode-ai/ui/v2/divider-v2"
+import { getFilename } from "@opencode-ai/core/util/path"

 interface DialogSelectDirectoryV2Props {
  title?: string
@@ -67,11 +68,7 @@ export function DialogSelectDirectoryV2(props: DialogSelectDirectoryV2Props) {
  const missingBase = createMemo(() => !(sync.data.path.home || sync.data.path.directory))
  const [fallbackPath] = createResource(
    () => (missingBase() ? true : undefined),
-    () =>
-      sdk.client.path
-        .get()
-        .then((result) => result.data)
-        .catch(() => undefined),
+    () => sdk.api.path.get().catch(() => undefined),
    { initialValue: undefined },
  )
  const home = createMemo(() => sync.data.path.home || fallbackPath()?.home || "")
@@ -85,18 +82,26 @@ export function DialogSelectDirectoryV2(props: DialogSelectDirectoryV2Props) {
  )
  const search = createDirectorySearch({ sdk, home, base: () => root() || start() })
  const [suggestions] = createResource(input, async (value) => {
-    const typed = cleanPickerInput(value).replace(/\/+$/, "")
+    const cleaned = cleanPickerInput(value)
+    const typed = cleaned.replace(/\/+$/, "")
    const current = displayPickerPath(root(), value, home()).replace(/\/+$/, "")
-    if (!typed || typed === current) return { query: value, items: [] }
+    if (!cleaned || (root() && typed === current)) return { query: value, items: [] }
    const directories = (await search(value)).map((absolute) => ({ absolute, type: "directory" as const }))
    if (!policy.includeFiles) return { query: value, items: directories.slice(0, 5) }
-    const files = await sdk.client.find
-      .files({ directory: root(), query: pickerFileSearchQuery(root(), value, home()), type: "file", limit: 20 })
-      .then((result) => result.data ?? [])
+    const base = pickerRoot(cleaned) || root() || start()
+    if (!base) return { query: value, items: directories.slice(0, 5) }
+    const files = await sdk.api.file
+      .find({
+        location: { directory: base },
+        query: pickerFileSearchQuery(base, value, home()),
+        type: "file",
+        limit: 20,
+      })
+      .then((result) => result.data)
      .catch(() => [])
    const results = [
      ...directories,
-      ...files.map((path) => ({ absolute: absoluteTreePath(root(), path), type: "file" as const })),
+      ...files.map((entry) => ({ absolute: absoluteTreePath(base, entry.path), type: "file" as const })),
    ]
    return {
      query: value,
@@ -115,9 +120,14 @@ export function DialogSelectDirectoryV2(props: DialogSelectDirectoryV2Props) {
      existing ??
      loads.schedule(`${generation}:${key}`, eager ? "background" : "user", () => {
        if (!activeTreeNavigation(generation, navigation)) return Promise.resolve(undefined)
-        return sdk.client.file
-          .list({ directory: absolute, path: "" })
-          .then((result) => result.data ?? [])
+        return sdk.api.file
+          .list({ location: { directory: absolute } })
+          .then((result) =>
+            result.data.map((entry) => ({
+              name: getFilename(entry.path.replace(/[\\/]+$/, "")),
+              type: entry.type,
+            })),
+          )
          .catch(() => undefined)
      })
    listings.set(key, request)
@@ -60,10 +60,7 @@ export function DialogSelectDirectory(props: DialogSelectDirectoryProps) {
  const [fallbackPath] = createResource(
    () => (missingBase() ? true : undefined),
    async () => {
-      return sdk.client.path
-        .get()
-        .then((x) => x.data)
-        .catch(() => undefined)
+      return sdk.api.path.get().catch(() => undefined)
    },
    { initialValue: undefined },
  )
@@ -43,7 +43,7 @@ export const DialogSelectMcp: Component = () => {
        filterKeys={["name", "status"]}
        sortBy={(a, b) => a.name.localeCompare(b.name)}
        onSelect={(x) => {
-          if (!x || toggle.isPending) return
+          if (!x || x.status === "pending" || toggle.isPending) return
          toggle.mutate(x.name)
        }}
      >
@@ -76,7 +76,7 @@ export const DialogSelectMcp: Component = () => {
              <div onClick={(e) => e.stopPropagation()}>
                <Switch
                  checked={enabled()}
-                  disabled={toggle.isPending && toggle.variables === i.name}
+                  disabled={status() === "pending" || (toggle.isPending && toggle.variables === i.name)}
                  onChange={() => {
                    if (toggle.isPending) return
                    toggle.mutate(i.name)
@@ -133,10 +133,10 @@ test("scopes file autocomplete to the current browser root", () => {
 test("resolves directory autocomplete from the current browser root", async () => {
  const directories: string[] = []
  const sdk = {
-    client: {
-      find: {
-        files: (input: { directory: string }) => {
-          directories.push(input.directory)
+    api: {
+      file: {
+        find: (input: { location?: { directory?: string } }) => {
+          directories.push(input.location?.directory ?? "")
          return Promise.resolve({ data: [] })
        },
      },
@@ -152,6 +152,29 @@ test("resolves directory autocomplete from the current browser root", async () =
  expect(directories).toEqual(["/repo", "/repo/src"])
 })

+test("searches from an absolute root without a default base", async () => {
+  const directories: string[] = []
+  const sdk = {
+    api: {
+      file: {
+        list: (input: { location?: { directory?: string } }) => {
+          directories.push(input.location?.directory ?? "")
+          return Promise.resolve({
+            data: [
+              { path: "Users/", type: "directory" },
+              { path: "tmp/", type: "directory" },
+            ],
+          })
+        },
+      },
+    },
+  } as unknown as Parameters<typeof createDirectorySearch>[0]["sdk"]
+  const search = createDirectorySearch({ sdk, home: () => "", base: () => undefined })
+
+  expect(await search("/")).toEqual(["/Users", "/tmp"])
+  expect(directories).toEqual(["/"])
+})
+
 test("identifies the next directory level to preload", () => {
  expect(
    preloadTreeDirectories("src/", [
@@ -326,15 +326,15 @@ export function createDirectorySearch(args: { sdk: ServerSDK; base: () => string
  let current = 0

  const scoped = (value: string) => {
+    const raw = normalizePickerDrive(value)
+    const root = pickerRoot(raw)
+    if (root) return { directory: trimPickerPath(root), path: raw.slice(root.length) }
    const base = args.base()
    if (!base) return
-    const raw = normalizePickerDrive(value)
    if (!raw) return { directory: trimPickerPath(base), path: "" }
    const home = args.home()
    if (raw === "~") return { directory: trimPickerPath(home || base), path: "" }
    if (raw.startsWith("~/")) return { directory: trimPickerPath(home || base), path: raw.slice(2) }
-    const root = pickerRoot(raw)
-    if (root) return { directory: trimPickerPath(root), path: raw.slice(root.length) }
    return { directory: trimPickerPath(base), path: raw }
  }

@@ -342,14 +342,17 @@ export function createDirectorySearch(args: { sdk: ServerSDK; base: () => string
    const key = trimPickerPath(directory)
    const existing = cache.get(key)
    if (existing) return existing
-    const request = args.sdk.client.file
-      .list({ directory: key, path: "" })
-      .then((result) => result.data ?? [])
+    const request = args.sdk.api.file
+      .list({ location: { directory: key } })
+      .then((result) => result.data)
      .catch(() => [])
      .then((nodes) =>
        nodes
          .filter((node) => node.type === "directory")
-          .map((node) => ({ name: node.name, absolute: trimPickerPath(normalizePickerDrive(node.absolute)) })),
+          .map((node) => {
+            const relative = trimPickerPath(normalizePickerDrive(node.path))
+            return { name: getFilename(relative), absolute: joinPickerPath(key, relative) }
+          }),
      )
    cache.set(key, request)
    return request
@@ -371,9 +374,9 @@ export function createDirectorySearch(args: { sdk: ServerSDK; base: () => string
    const pathInput = raw.startsWith("~") || !!pickerRoot(raw) || raw.includes("/")
    const query = normalizePickerDrive(input.path)
    if (!pathInput) {
-      const results = await args.sdk.client.find
-        .files({ directory: input.directory, query, type: "directory", limit: 50 })
-        .then((result) => result.data ?? [])
+      const results = await args.sdk.api.file
+        .find({ location: { directory: input.directory }, query, type: "directory", limit: 50 })
+        .then((result) => result.data.map((entry) => entry.path))
        .catch(() => [])
      if (!active()) return []
      return results.map((path) => joinPickerPath(input.directory, path)).slice(0, 50)
@@ -1,6 +1,7 @@
 import { getFilename } from "@opencode-ai/core/util/path"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { useMutation } from "@tanstack/solid-query"
+import { normalizeProjectInfo } from "@/context/global-sync/utils"
 import { createMemo } from "solid-js"
 import { createStore } from "solid-js/store"
 import { useGlobal } from "@/context/global"
@@ -70,13 +71,15 @@ export function createEditProjectModel(props: { project: LocalProject; server: S
      const start = store.startup.trim()

      if (props.project.id && props.project.id !== "global") {
-        await serverCtx().sdk.client.project.update({
+        const project = await serverCtx().sdk.api.project.update({
          projectID: props.project.id,
-          directory: props.project.worktree,
          name,
          icon: { color: store.color || "", override: store.iconOverride || "" },
          commands: { start },
        })
+        serverCtx().sync.set("project", (items) =>
+          items.map((item) => (item.id === project.id ? normalizeProjectInfo(project) : item)),
+        )
        serverCtx().sync.project.icon(props.project.worktree, store.iconOverride || undefined)
        dialog.close()
        return
@@ -7,6 +7,11 @@ let createPromptSubmit: typeof import("./submit").createPromptSubmit

 const createdClients: string[] = []
 const createdSessions: string[] = []
+const sessionCreateInputs: Array<{
+  agent?: string
+  model?: { id: string; providerID: string; variant?: string }
+  location?: { directory: string }
+}> = []
 const enabledAutoAccept: Array<{ server: string; sessionID: string; directory: string }> = []
 const optimistic: Array<{
  directory?: string
@@ -19,11 +24,15 @@ const optimistic: Array<{
 }> = []
 const optimisticSeeded: boolean[] = []
 const storedSessions: Record<string, Array<{ id: string; title?: string }>> = {}
-const sessionDirectories: Record<string, string> = {}
 const promoted: Array<{ directory: string; sessionID: string }> = []
-const sentShell: string[] = []
+const sentShell: Array<{ sessionID: string; id?: string; command: string }> = []
 const syncedDirectories: string[] = []
 const promotedDrafts: Array<{ draftID: string; server: string; sessionId: string }> = []
+const sentPrompts: string[] = []
+const promptInputs: unknown[] = []
+const sentCommands: unknown[] = []
+const commands: Array<{ name: string }> = []
+let serverSessionSyncs = 0

 let params: { id?: string } = {}
 let search: { draftId?: string } = {}
@@ -32,7 +41,7 @@ let variant: string | undefined
 let permissionServer = "server-a"
 let createSessionGate: Promise<void> | undefined

-const promptValue: Prompt = [{ type: "text", content: "ls", start: 0, end: 2 }]
+let promptValue: Prompt = [{ type: "text", content: "ls", start: 0, end: 2 }]
 const [promptStore, setPromptStore] = createStore<PromptStore>({
  prompt: promptValue,
  cursor: 0,
@@ -64,23 +73,39 @@ const prompt = {
 const clientFor = (directory: string) => {
  createdClients.push(directory)
  return {
-    session: {
-      create: async () => {
-        await createSessionGate
-        createdSessions.push(directory)
-        return {
-          data: {
+    api: {
+      session: {
+        create: async (input: (typeof sessionCreateInputs)[number]) => {
+          await createSessionGate
+          const location = input.location?.directory ?? directory
+          createdSessions.push(location)
+          sessionCreateInputs.push(input)
+          return {
            id: `session-${createdSessions.length}`,
+            projectID: "project",
+            agent: input.agent,
+            model: input.model,
+            cost: 0,
+            tokens: { input: 0, output: 0, reasoning: 0, cache: { read: 0, write: 0 } },
+            time: { created: 1, updated: 1 },
            title: `New session ${createdSessions.length}`,
-          },
-        }
+            location: { directory: location },
+          }
+        },
+        prompt: async (input: unknown) => {
+          sentPrompts.push(directory)
+          promptInputs.push(input)
+          return { data: undefined }
+        },
+        command: async (input: unknown) => {
+          sentCommands.push(input)
+        },
+        shell: async (input: { sessionID: string; id?: string; command: string }) => {
+          sentShell.push(input)
+        },
      },
-      shell: async () => {
-        sentShell.push(directory)
-        return { data: undefined }
-      },
-      prompt: async () => ({ data: undefined }),
-      promptAsync: async () => ({ data: undefined }),
+    },
+    session: {
      command: async () => ({ data: undefined }),
      abort: async () => ({ data: undefined }),
    },
@@ -90,27 +115,6 @@ const clientFor = (directory: string) => {
  }
 }

-const api = {
-  session: {
-    async create(input: { location: { directory: string } }) {
-      await createSessionGate
-      createdSessions.push(input.location.directory)
-      const session = {
-        id: `session-${createdSessions.length}`,
-        title: `New session ${createdSessions.length}`,
-      }
-      sessionDirectories[session.id] = input.location.directory
-      return session
-    },
-    async shell(input: { sessionID: string }) {
-      sentShell.push(sessionDirectories[input.sessionID] ?? "/repo/main")
-    },
-    async prompt() {},
-    async command() {},
-    async interrupt() {},
-  },
-}
-
 beforeAll(async () => {
  const rootClient = clientFor("/repo/main")

@@ -193,8 +197,8 @@ beforeAll(async () => {
      const sdk = {
        scope: "local",
        directory: "/repo/main",
-        api,
        client: rootClient,
+        api: rootClient.api,
        url: "http://localhost:4096",
        createClient(opts: any) {
          return clientFor(opts.directory)
@@ -206,7 +210,7 @@ beforeAll(async () => {

  mock.module("@/context/sync", () => ({
    useSync: () => () => ({
-      data: { command: [] },
+      data: { command: commands },
      session: {
        optimistic: {
          add: (value: {
@@ -233,6 +237,9 @@ beforeAll(async () => {
      session: {
        remember: () => undefined,
        set: () => undefined,
+        sync: async () => {
+          serverSessionSyncs++
+        },
      },
      child: (directory: string) => {
        syncedDirectories.push(directory)
@@ -274,11 +281,17 @@ beforeAll(async () => {
 beforeEach(() => {
  createdClients.length = 0
  createdSessions.length = 0
+  sessionCreateInputs.length = 0
  enabledAutoAccept.length = 0
  optimistic.length = 0
  optimisticSeeded.length = 0
  promoted.length = 0
  promotedDrafts.length = 0
+  sentPrompts.length = 0
+  promptInputs.length = 0
+  sentCommands.length = 0
+  commands.length = 0
+  promptValue = [{ type: "text", content: "ls", start: 0, end: 2 }]
  params = {}
  search = {}
  sentShell.length = 0
@@ -287,8 +300,8 @@ beforeEach(() => {
  variant = undefined
  permissionServer = "server-a"
  createSessionGate = undefined
+  serverSessionSyncs = 0
  for (const key of Object.keys(storedSessions)) delete storedSessions[key]
-  for (const key of Object.keys(sessionDirectories)) delete sessionDirectories[key]
 })

 describe("prompt submit worktree selection", () => {
@@ -321,8 +334,24 @@ describe("prompt submit worktree selection", () => {

    expect(createdClients).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
    expect(createdSessions).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
-    expect(sentShell).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
+    expect(sessionCreateInputs).toEqual([
+      {
+        agent: "agent",
+        model: { id: "model", providerID: "provider", variant: undefined },
+        location: { directory: "/repo/worktree-a" },
+      },
+      {
+        agent: "agent",
+        model: { id: "model", providerID: "provider", variant: undefined },
+        location: { directory: "/repo/worktree-b" },
+      },
+    ])
+    expect(sentShell).toEqual([
+      expect.objectContaining({ sessionID: "session-1", id: expect.stringMatching(/^evt_/), command: "ls" }),
+      expect.objectContaining({ sessionID: "session-2", id: expect.stringMatching(/^evt_/), command: "ls" }),
+    ])
    expect(syncedDirectories).toEqual(["/repo/worktree-a", "/repo/worktree-a", "/repo/worktree-b", "/repo/worktree-b"])
+    expect(serverSessionSyncs).toBe(0)
    expect(promoted).toEqual([
      { directory: "/repo/worktree-a", sessionID: "session-1" },
      { directory: "/repo/worktree-b", sessionID: "session-2" },
@@ -443,6 +472,7 @@ describe("prompt submit worktree selection", () => {
    const event = { preventDefault: () => undefined } as unknown as Event

    await submit.handleSubmit(event)
+    await Bun.sleep(0)

    expect(optimistic).toHaveLength(1)
    expect(optimistic[0]).toMatchObject({
@@ -451,6 +481,53 @@ describe("prompt submit worktree selection", () => {
        model: { providerID: "provider", modelID: "model", variant: "high" },
      },
    })
+    expect(sentPrompts).toEqual(["/repo/main"])
+    expect(promptInputs[0]).toMatchObject({
+      sessionID: "session-1",
+      text: "ls",
+      files: [],
+      agents: [],
+    })
+    expect((promptInputs[0] as { id?: string }).id).toStartWith("msg_")
+  })
+
+  test("submits slash commands through the current session API", async () => {
+    params = { id: "session-1" }
+    variant = "high"
+    commands.push({ name: "review" })
+    promptValue = [{ type: "text", content: "/review staged changes", start: 0, end: 22 }]
+
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => ({ id: "session-1" }),
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "normal",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+    })
+
+    await submit.handleSubmit({ preventDefault: () => undefined } as unknown as Event)
+
+    expect(sentCommands).toEqual([
+      {
+        sessionID: "session-1",
+        id: expect.stringMatching(/^msg_/),
+        command: "review",
+        arguments: "staged changes",
+        agent: "agent",
+        model: { id: "model", providerID: "provider", variant: "high" },
+        files: [],
+      },
+    ])
+    expect(serverSessionSyncs).toBe(0)
  })

  test("uses an injected model selection", async () => {
@@ -511,7 +588,8 @@ describe("prompt submit worktree selection", () => {

    await submit.handleSubmit(event)

-    expect(storedSessions["/repo/worktree-a"]).toEqual([{ id: "session-1", title: "New session 1" }])
+    expect(storedSessions["/repo/worktree-a"]).toHaveLength(1)
+    expect(storedSessions["/repo/worktree-a"]?.[0]).toMatchObject({ id: "session-1", title: "New session 1" })
    expect(optimisticSeeded).toEqual([true])
  })
 })
@@ -15,9 +15,47 @@ export const ServerRowMenu: Component<{
 }> = (props) => {
  const language = useLanguage()
  const key = ServerConnection.key(props.server)
-  const builtin = ServerConnection.builtin(props.server)
-  const isDefault = () => props.controller.defaultKey() === key
+  return (
+    <ServerRowMenuView
+      server={props.server}
+      labels={serverMenuLabels(language)}
+      canDefault={props.controller.canDefault()}
+      isDefault={props.controller.defaultKey() === key}
+      onEdit={props.onEdit}
+      onSetDefault={() => props.controller.setDefault(key)}
+      onRemoveDefault={() => props.controller.setDefault(null)}
+      onRemove={() => props.controller.handleRemove(key)}
+      open={props.open}
+      onOpenChange={props.onOpenChange}
+    />
+  )
+}

+export function serverMenuLabels(language: ReturnType<typeof useLanguage>) {
+  return {
+    more: language.t("common.moreOptions"),
+    server: language.t("settings.section.server"),
+    edit: language.t("dialog.server.menu.edit"),
+    default: language.t("dialog.server.menu.default"),
+    defaultRemove: language.t("dialog.server.menu.defaultRemove"),
+    delete: language.t("dialog.server.menu.delete"),
+  }
+}
+
+export const ServerRowMenuView: Component<{
+  server: ServerConnection.Any
+  labels: ReturnType<typeof serverMenuLabels>
+  canDefault: boolean
+  isDefault: boolean
+  onEdit: (server: ServerConnection.Http) => void
+  onSetDefault: () => void
+  onRemoveDefault: () => void
+  onRemove: () => void
+  open?: boolean
+  onOpenChange?: (open: boolean) => void
+}> = (props) => {
+  const builtin = () => ServerConnection.builtin(props.server)
+  const httpServer = () => (props.server.type === "http" ? props.server : undefined)
  return (
    <MenuV2 gutter={6} modal={false} placement="bottom-end" open={props.open} onOpenChange={props.onOpenChange}>
      <MenuV2.Trigger
@@ -25,31 +63,30 @@ export const ServerRowMenu: Component<{
        variant="ghost-muted"
        size="small"
        icon={<IconV2 name="outline-dots" />}
-        aria-label={language.t("common.moreOptions")}
+        aria-label={props.labels.more}
      />
      <MenuV2.Portal>
        <MenuV2.Content>
          <MenuV2.Group>
-            <MenuV2.GroupLabel>{language.t("settings.section.server")}</MenuV2.GroupLabel>
+            <MenuV2.GroupLabel>{props.labels.server}</MenuV2.GroupLabel>
            <MenuV2.Item
-              disabled={builtin || props.server.type !== "http"}
-              onSelect={() => props.onEdit(props.server as ServerConnection.Http)}
+              disabled={builtin() || !httpServer()}
+              onSelect={() => {
+                const server = httpServer()
+                if (server) props.onEdit(server)
+              }}
            >
-              {language.t("dialog.server.menu.edit")}
+              {props.labels.edit}
            </MenuV2.Item>
-            <Show when={props.controller.canDefault() && !isDefault()}>
-              <MenuV2.Item onSelect={() => props.controller.setDefault(key)}>
-                {language.t("dialog.server.menu.default")}
-              </MenuV2.Item>
+            <Show when={props.canDefault && !props.isDefault}>
+              <MenuV2.Item onSelect={props.onSetDefault}>{props.labels.default}</MenuV2.Item>
            </Show>
-            <Show when={props.controller.canDefault() && isDefault()}>
-              <MenuV2.Item onSelect={() => props.controller.setDefault(null)}>
-                {language.t("dialog.server.menu.defaultRemove")}
-              </MenuV2.Item>
+            <Show when={props.canDefault && props.isDefault}>
+              <MenuV2.Item onSelect={props.onRemoveDefault}>{props.labels.defaultRemove}</MenuV2.Item>
            </Show>
            <MenuV2.Separator />
-            <MenuV2.Item disabled={builtin} onSelect={() => props.controller.handleRemove(key)}>
-              {language.t("dialog.server.menu.delete")}
+            <MenuV2.Item disabled={builtin()} onSelect={props.onRemove}>
+              {props.labels.delete}
            </MenuV2.Item>
          </MenuV2.Group>
        </MenuV2.Content>
@@ -120,8 +120,7 @@ export function TabNavItem(props: {
    const ctx = serverCtx()
    const session = props.session()
    if (!ctx || !session) return
-    const client = ctx.sdk.createClient({ directory: session.directory, throwOnError: true })
-    await client.session.update({ sessionID: session.id, title })
+    await ctx.sdk.api.session.rename({ sessionID: session.id, title })
  }

  const closeRename = async (save: boolean) => {
@@ -28,6 +28,7 @@ import { tabKey, useTabs } from "@/context/tabs"
 import type { PromptSession } from "@/context/prompt"
 import "./titlebar.css"
 import { newTabTooltipKeybind } from "./command-tooltip-keybind"
+import { normalizeSessionInfo } from "@/utils/session"

 type TauriDesktopWindow = {
  startDragging?: () => Promise<void>
@@ -267,9 +268,9 @@ export function Titlebar(props: { update?: TitlebarUpdate; debugTools?: { visibl
                return conn ? { route, sdk: global.ensureServerCtx(conn).sdk } : undefined
              },
              ({ route, sdk }) =>
-                sdk.client.session
+                sdk.api.session
                  .get({ sessionID: route.sessionId })
-                  .then((x) => x.data)
+                  .then(normalizeSessionInfo)
                  .catch(() => {}),
            )

@@ -204,10 +204,18 @@ export const { use: useFile, provider: FileProvider } = createSimpleContext({
    }

    const search = (query: string, dirs: "true" | "false", options?: { limit?: number; signal?: AbortSignal }) =>
-      sdk()
-        .client.find.files({ query, dirs, limit: options?.limit }, { signal: options?.signal })
+      serverSDK()
+        .api.file.find(
+          {
+            location: { directory: sdk().directory },
+            query,
+            type: dirs === "true" ? "directory" : "file",
+            limit: options?.limit,
+          },
+          { signal: options?.signal },
+        )
        .then(
-          (x) => (x.data ?? []).map(path.normalize),
+          (x) => x.data.map((entry) => path.normalize(entry.path)),
          (error) => {
            if (options?.signal?.aborted) throw error
            return []
@@ -373,6 +373,33 @@ export async function bootstrapDirectory(input: {
          .then((data) => input.setStore("agent", data)),
      () =>
        retry(() => input.sdk.config.get().then((x) => input.setStore("config", reconcile(x.data!, { merge: false })))),
+      () =>
+        retry(() =>
+          (async () => {
+            if ((await input.protocol) !== "v1") return
+            const x = await input.sdk.session.status()
+            if (!input.session) {
+              input.setStore("session_status", x.data!)
+              return
+            }
+            const statuses = x.data ?? {}
+            input.session.set(
+              "session_status",
+              produce((draft) => {
+                for (const sessionID of Object.keys(draft)) {
+                  if (statuses[sessionID]) continue
+                  if (input.session?.get(sessionID)?.directory === input.directory) delete draft[sessionID]
+                }
+              }),
+            )
+            for (const [sessionID, status] of Object.entries(statuses)) {
+              input.session.set("session_status", sessionID, reconcile(status))
+            }
+            await Promise.all(
+              Object.keys(statuses).map((sessionID) => input.session!.resolve(sessionID).catch(() => undefined)),
+            )
+          })(),
+        ),
      !seededProject &&
        (() =>
          retry(() => input.api.project.current({ location: { directory: input.directory } })).then((project) =>
@@ -8,6 +8,7 @@ import { useServerSDK } from "./server-sdk"
 import { RECENTLY_CLOSED_DISPLAY_LIMIT, ServerConnection, useServer } from "./server"
 import { usePlatform } from "./platform"
 import { Project } from "@opencode-ai/sdk/v2"
+import { normalizeProjectInfo } from "./global-sync/utils"
 import { Persist, persisted, removePersisted } from "@/utils/persist"
 import { pathKey } from "@/utils/path-key"
 import { decode64 } from "@/utils/base64"
@@ -570,7 +571,12 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
        }

        void serverSdk()
-          .client.project.update({ projectID: project.id, directory: worktree, icon: { color } })
+          .api.project.update({ projectID: project.id, icon: { color } })
+          .then((result) =>
+            serverSync().set("project", (items) =>
+              items.map((item) => (item.id === result.id ? normalizeProjectInfo(result) : item)),
+            ),
+          )
          .catch(() => {
            if (colorRequested.get(worktree) === color) colorRequested.delete(worktree)
          })
@@ -13,6 +13,7 @@ import { type DraftTab, useTabs } from "./tabs"
 import { useSettings } from "./settings"
 import { requireServerKey } from "@/utils/session-route"
 import type { ServerScope } from "@/utils/server-scope"
+import { normalizePermissionRequest } from "./global-sync/utils"
 import {
  acceptKey,
  directoryAcceptKey,
@@ -243,9 +244,25 @@ function createServerPermissionState(input: { sdk: ServerSDK; sync: ServerSync }

  const respond: PermissionRespondFn = (request) => {
    if (meta.disposed) return
-    input.sdk.client.permission.respond(request).catch(() => {
-      responded.delete(request.permissionID)
-    })
+    input.sdk.api.permission
+      .reply({
+        sessionID: request.sessionID,
+        requestID: request.permissionID,
+        reply: request.response,
+        location: request.directory ? { directory: request.directory } : undefined,
+      })
+      .catch(() => {
+        responded.delete(request.permissionID)
+      })
+  }
+
+  const list = async (directory: string) => {
+    if ((await input.sdk.protocol) === "v1") {
+      return (await input.sdk.client.permission.list({ directory })).data ?? []
+    }
+    return input.sdk.api.permission.request
+      .list({ location: { directory } })
+      .then((result) => result.data.map(normalizePermissionRequest))
  }

  function respondOnce(permission: PermissionRequest, directory?: string) {
@@ -343,14 +360,12 @@ function createServerPermissionState(input: { sdk: ServerSDK; sync: ServerSync }
      }),
    )

-    input.sdk.client.permission
-      .list({ directory })
-      .then((x) => {
+    list(directory)
+      .then((permissions) => {
        if (meta.disposed) return
        if (!isAutoAcceptingDirectory(directory)) return
-        for (const perm of x.data ?? []) {
-          if (!perm?.id) continue
-          void respondPending(perm, directory, () => isAutoAcceptingDirectory(directory))
+        for (const permission of permissions) {
+          void respondPending(permission, directory, () => isAutoAcceptingDirectory(directory))
        }
      })
      .catch(() => undefined)
@@ -377,16 +392,14 @@ function createServerPermissionState(input: { sdk: ServerSDK; sync: ServerSync }
      }),
    )

-    input.sdk.client.permission
-      .list({ directory })
-      .then((x) => {
+    list(directory)
+      .then((permissions) => {
        if (meta.disposed) return
        if (enableVersion.get(key) !== version) return
        if (!isAutoAccepting(sessionID, directory)) return
-        for (const perm of x.data ?? []) {
-          if (!perm?.id) continue
+        for (const permission of permissions) {
          void respondPending(
-            perm,
+            permission,
            directory,
            () => enableVersion.get(key) === version && isAutoAccepting(sessionID, directory),
          )
@@ -19,7 +19,7 @@ test("archiving a Home session removes its open titlebar tab", async () => {
  await archiveHomeSession({
    server: remote,
    session: { id: "ses_1", directory: "/workspace" },
-    update: async () => undefined,
+    archive: async () => undefined,
    remove: () => {
      removed = true
    },
@@ -37,7 +37,7 @@ test("reports archive failures without removing the session", async () => {
  await archiveHomeSession({
    server: remote,
    session: { id: "ses_1", directory: "/workspace" },
-    update: async () => Promise.reject(failure),
+    archive: async () => Promise.reject(failure),
    remove: () => {
      removed = true
    },
@@ -6,25 +6,15 @@ type HomeSession = {
  directory: string
 }

-type SessionUpdate = {
-  directory: string
-  sessionID: string
-  time: { archived: number }
-}
-
 export async function archiveHomeSession(input: {
  server: ServerConnection.Key
  session: HomeSession
-  update: (value: SessionUpdate) => Promise<unknown>
+  archive: (sessionID: string) => Promise<unknown>
  remove: () => void
  onError?: (error: unknown) => void
 }) {
  await input
-    .update({
-      directory: input.session.directory,
-      sessionID: input.session.id,
-      time: { archived: Date.now() },
-    })
+    .archive(input.session.id)
    .then(() => {
      input.remove()
      notifySessionTabsRemoved({
@@ -1,1926 +1,50 @@
-import type { Session } from "@opencode-ai/sdk/v2/client"
-import {
-  type ComponentProps,
-  createEffect,
-  createMemo,
-  createResource,
-  createRoot,
-  createSignal,
-  For,
-  Match,
-  on,
-  onCleanup,
-  onMount,
-  Show,
-  startTransition,
-  Switch,
-} from "solid-js"
-import { makeEventListener } from "@solid-primitives/event-listener"
-import { createStore, produce } from "solid-js/store"
-import { DragDropProvider, PointerSensor } from "@dnd-kit/solid"
-import { isSortable, useSortable } from "@dnd-kit/solid/sortable"
-import { AutoScroller, Feedback, PointerActivationConstraints } from "@dnd-kit/dom"
-import { RestrictToVerticalAxis } from "@dnd-kit/abstract/modifiers"
-import { RestrictToElement } from "@dnd-kit/dom/modifiers"
-import { useQuery } from "@tanstack/solid-query"
-import { Button } from "@opencode-ai/ui/button"
-import { Logo } from "@opencode-ai/ui/logo"
-import { Spinner } from "@opencode-ai/ui/spinner"
 import { ScrollView } from "@opencode-ai/ui/scroll-view"
-import { ProjectAvatar } from "@opencode-ai/ui/v2/project-avatar-v2"
-import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
-import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
-import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
-import { MenuV2 } from "@opencode-ai/ui/v2/menu-v2"
-import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
-import { getProjectAvatarVariant, useLayout, type HomeProjectSelection, type LocalProject } from "@/context/layout"
-import { useNavigate } from "@solidjs/router"
-import { base64Encode } from "@opencode-ai/core/util/encode"
-import { Icon } from "@opencode-ai/ui/icon"
-import { usePlatform } from "@/context/platform"
-import { DateTime } from "luxon"
-import { useDialog } from "@opencode-ai/ui/context/dialog"
-import { useDirectoryPicker } from "@/components/directory-picker"
-import { useSettingsCommand } from "@/components/settings-dialog"
-import { DialogSelectServer, useServerManagementController } from "@/components/dialog-select-server"
-import { DialogServerV2 } from "@/components/settings-v2/dialog-server-v2"
-import { ServerConnection, serverName, useServer } from "@/context/server"
-import { sessionHasOpenTab, useTabs } from "@/context/tabs"
-import { useServerSync } from "@/context/server-sync"
-import { useLanguage } from "@/context/language"
-import { useNotification } from "@/context/notification"
-import {
-  closeHomeProject,
-  displayName,
-  errorMessage,
-  getProjectAvatarSource,
-  homeProjectDirectories,
-  projectForSession,
-  toggleHomeProjectSelection,
-} from "@/pages/layout/helpers"
-import { SessionTabAvatar } from "@/pages/layout/session-tab-avatar"
-import { sessionTitle } from "@/utils/session-title"
-import { pathKey } from "@/utils/path-key"
-import { useGlobal } from "@/context/global"
-import { useCommand } from "@/context/command"
-import { Binary } from "@opencode-ai/core/util/binary"
-import { ServerRowMenu } from "@/components/server/server-row-menu"
-import { ServerHealthIndicator } from "@/components/server/server-row"
-import { type ServerHealth } from "@/utils/server-health"
-import { Persist, persisted } from "@/utils/persist"
-import { useMarked } from "@opencode-ai/ui/context/marked"
-import { preloadMarkdown } from "@opencode-ai/session-ui/markdown-cache"
-import { archiveHomeSession } from "./home-session-archive"
-import { shouldOpenSessionInBackground } from "./home-session-open"
-import { showToast } from "@/utils/toast"
-import { fileManagerApp } from "@/utils/file-manager"
-import {
-  loadHomeSessionIndex,
-  retainHomeSessions,
-  type HomeSessionEvents,
-} from "@/context/global-sync/home-session-index"
-
-const HOME_SESSION_LIMIT = 64
-const HOME_SESSION_HEADER_STICKY_TOP = 12
-const HOME_SESSION_HEADER_TEXT_HEIGHT = 16
-const HOME_SESSION_HEADER_FADE_DISTANCE = 16
-
-function containHomeWheel(event: WheelEvent, viewport: HTMLElement) {
-  if (event.defaultPrevented || event.ctrlKey || !event.deltaY) return
-  if (!(event.target instanceof Element)) return
-
-  const scrollable = event.target.closest<HTMLElement>("[data-scrollable]")
-  if (
-    scrollable !== viewport &&
-    scrollable &&
-    (event.deltaY < 0
-      ? scrollable.scrollTop > 0
-      : scrollable.scrollTop < scrollable.scrollHeight - scrollable.clientHeight)
-  )
-    return
-
-  event.preventDefault()
-}
-const SHOW_HOME_SESSION_ARCHIVE = false
-const HOME_ROW_LAYOUT =
-  "flex min-w-0 w-full shrink-0 cursor-default items-center rounded-[6px] bg-transparent text-left transition-[background-color,color,box-shadow] duration-[120ms] ease-in-out focus-visible:outline-none"
-const HOME_ROW_BASE = `${HOME_ROW_LAYOUT} border-0`
-const HOME_ROW = `${HOME_ROW_BASE} [font-weight:530] text-v2-text-text-muted hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover`
-const HOME_PROJECT_NAV_LABEL = "min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap"
-const HOME_PROJECT_NAV_ROW = `${HOME_ROW_LAYOUT} h-7 gap-2 px-1.5 [font-weight:440] text-v2-text-text-muted hover:bg-v2-background-bg-layer-01 hover:text-v2-text-text-base hover:[box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)] data-[selected]:bg-v2-background-bg-layer-03 data-[selected]:text-v2-text-text-base data-[selected]:[box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)] data-[selected]:hover:bg-v2-background-bg-layer-03 focus-visible:bg-v2-background-bg-layer-01 focus-visible:text-v2-text-text-base focus-visible:[box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)]`
-const HOME_SECTION_LABEL = "text-v2-text-text-muted [font-weight:440]"
-
-type HomeSessionRecord = {
-  session: Session
-  project: LocalProject
-  projectName: string
-}
-
-type HomeSessionGroup = {
-  id: "today" | "yesterday" | "older"
-  title: string
-  sessions: HomeSessionRecord[]
-}
-
-const HOME_SESSION_SEARCH_RESULTS_ID = "home-session-search-results"
-const HOME_SEARCH_RESULT_ROW =
-  "flex h-10 w-full shrink-0 cursor-default items-center gap-2 border-0 py-3 pl-[18px] pr-6 text-left transition-[background-color] duration-[120ms] ease-in-out hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none"
-const HOME_SEARCH_RESULT_TITLE =
-  "min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-[13px] leading-4 tracking-[-0.04px] text-v2-text-text-base [font-weight:530]"
-const HOME_SEARCH_RESULT_META =
-  "min-w-0 flex-[1_1_auto] overflow-hidden text-ellipsis whitespace-nowrap text-[13px] leading-4 tracking-[-0.04px] text-v2-text-text-muted [font-weight:440]"
-
-let pendingHomeNavigation: { server: ServerConnection.Key; href: string } | undefined
-
-function buildHomeSessionRecords(input: {
-  sessions: () => Session[]
-  projectDirectories: () => string[]
-  projects: () => LocalProject[]
-  projectByID: () => Map<string, LocalProject>
-}) {
-  const directories = new Set(input.projectDirectories().map(pathKey))
-  const sessions = input.sessions().filter((session) => directories.has(pathKey(session.directory)))
-  return [...new Map(sessions.map((session) => [session.id, session] as const)).values()]
-    .sort((a, b) => (b.time.updated ?? b.time.created) - (a.time.updated ?? a.time.created))
-    .flatMap((session) => {
-      const directory = pathKey(session.directory)
-      const project =
-        input
-          .projects()
-          .find(
-            (item) =>
-              pathKey(item.worktree) === directory || item.sandboxes?.some((sandbox) => pathKey(sandbox) === directory),
-          ) ?? projectForSession(session, input.projects(), input.projectByID())
-      if (!project) return []
-      return {
-        session,
-        project,
-        projectName: displayName(project),
-      }
-    })
-}
-
-function matchesHomeSessionSearch(record: HomeSessionRecord, query: string) {
-  return `${record.session.title} ${record.projectName}`.toLowerCase().includes(query)
-}
-
-function homeSessionSearchKey(record: HomeSessionRecord) {
-  return `${pathKey(record.session.directory)}:${record.session.id}`
-}
-
-function useHomeSessionHeaderOpacity(groups: () => HomeSessionGroup[]) {
-  let viewport: HTMLDivElement | undefined
-  let content: HTMLDivElement | undefined
-  let positionFrame: number | undefined
-  let resizeObserver: ResizeObserver | undefined
-  let stickyTop = HOME_SESSION_HEADER_STICKY_TOP
-  const headerRefs = new Map<HomeSessionGroup["id"], HTMLDivElement>()
-  const headerOffsets = new Map<HomeSessionGroup["id"], number>()
-  const [state, setState] = createStore({
-    titleOpacity: {} as Partial<Record<HomeSessionGroup["id"], number>>,
-  })
-
-  createEffect(() => {
-    const items = groups()
-    const ids = new Set(items.map((group) => group.id))
-    headerRefs.forEach((_, id) => {
-      if (!ids.has(id)) headerRefs.delete(id)
-    })
-    headerOffsets.forEach((_, id) => {
-      if (!ids.has(id)) headerOffsets.delete(id)
-    })
-    if (items.length === 0) {
-      content = undefined
-      bindResizeObserver()
-    }
-    queuePositionUpdate()
-  })
-
-  onCleanup(() => {
-    if (positionFrame !== undefined) cancelAnimationFrame(positionFrame)
-    resizeObserver?.disconnect()
-  })
-
-  function setViewport(el: HTMLDivElement) {
-    viewport = el
-    bindResizeObserver()
-    queuePositionUpdate()
-  }
-
-  function setContentRef(el: HTMLDivElement) {
-    content = el
-    bindResizeObserver()
-    queuePositionUpdate()
-  }
-
-  function setHeaderRef(id: HomeSessionGroup["id"], el: HTMLDivElement) {
-    headerRefs.set(id, el)
-    queuePositionUpdate()
-  }
-
-  function queuePositionUpdate() {
-    if (typeof requestAnimationFrame === "undefined") {
-      updatePositionCache()
-      return
-    }
-    if (positionFrame !== undefined) return
-    positionFrame = requestAnimationFrame(() => {
-      positionFrame = undefined
-      updatePositionCache()
-    })
-  }
-
-  function updatePositionCache() {
-    if (!viewport) return
-    const header = groups()
-      .map((group) => headerRefs.get(group.id))
-      .find((el) => el !== undefined)
-    if (header && typeof getComputedStyle === "function") {
-      const top = Number.parseFloat(getComputedStyle(header).top)
-      if (Number.isFinite(top)) stickyTop = top
-    }
-    groups().forEach((group) => {
-      const el = headerRefs.get(group.id)
-      if (!el) return
-      headerOffsets.set(group.id, el.offsetTop)
-    })
-    update(viewport.scrollTop)
-  }
-
-  function update(scrollTop: number) {
-    const items = groups()
-    items.forEach((group, index) => {
-      const nextOffset = items
-        .slice(index + 1)
-        .map((item) => headerOffsets.get(item.id))
-        .find((offset) => offset !== undefined)
-      const fadeEnd = stickyTop + HOME_SESSION_HEADER_TEXT_HEIGHT
-      const nextTop = nextOffset === undefined ? undefined : nextOffset - scrollTop
-      const opacity =
-        nextTop === undefined ? 1 : Math.max(0, Math.min(1, (nextTop - fadeEnd) / HOME_SESSION_HEADER_FADE_DISTANCE))
-      setState("titleOpacity", group.id, Math.round(opacity * 1000) / 1000)
-    })
-  }
-
-  function titleOpacity(id: HomeSessionGroup["id"]) {
-    return state.titleOpacity[id] ?? 1
-  }
-
-  function bindResizeObserver() {
-    resizeObserver?.disconnect()
-    if (typeof ResizeObserver === "undefined") return
-    resizeObserver = new ResizeObserver(() => queuePositionUpdate())
-    if (viewport) resizeObserver.observe(viewport)
-    if (content) resizeObserver.observe(content)
-  }
-
-  return { setViewport, setContentRef, setHeaderRef, update, titleOpacity }
-}
-
-// Middle-click or Cmd+click on macOS (Ctrl+click elsewhere) opens a session
-// tab in the background without navigating, matching browser conventions.
-function isBackgroundOpen(event: MouseEvent) {
-  return shouldOpenSessionInBackground({
-    button: event.button,
-    mac: typeof navigator === "object" && /(Mac|iPod|iPhone|iPad)/.test(navigator.platform),
-    meta: event.metaKey,
-    ctrl: event.ctrlKey,
-    shift: event.shiftKey,
-    alt: event.altKey,
-  })
-}
-
-type OpenSessionOptions = { background?: boolean }
+import { createHomeController } from "./home/home-controller"
+import { createHomeProjectsController } from "./home/home-projects-controller"
+import { HomeUtilityNav } from "./home/home-projects-view"
+import { HomeProjects } from "./home/home-projects"
+import { createHomeScrollController } from "./home/home-scroll-controller"
+import { createHomeSessionSearchController } from "./home/home-session-search-controller"
+import { createHomeSessionsController } from "./home/home-sessions-controller"
+import { HomeSessions } from "./home/home-sessions"

 export function NewHome() {
-  const sync = useServerSync()
-  const layout = useLayout()
-  const platform = usePlatform()
-  const pickDirectory = useDirectoryPicker()
-  const dialog = useDialog()
-  const navigate = useNavigate()
-  const server = useServer()
-  const language = useLanguage()
-  const global = useGlobal()
-  const tabs = useTabs()
-  const command = useCommand()
-  const notification = useNotification()
-  const marked = useMarked()
-  const openSettings = useSettingsCommand()
-  let focusSessionSearch: (() => void) | undefined
-  let sessionViewport: HTMLDivElement | undefined
-  const [sessionThumbTrack, setSessionThumbTrack] = createSignal<HTMLDivElement>()
-  const [sessionHoverTarget, setSessionHoverTarget] = createSignal<HTMLElement>()
-  const [state, setState] = createStore({
-    search: "",
-    searchFocused: false,
-  })
-  const selection = layout.home.selection
-
-  const focusedServer = createMemo(
-    () => global.servers.list().find((conn) => ServerConnection.key(conn) === selection().server) ?? server.current,
-  )
-  const focusedServerCtx = createMemo(() => {
-    const conn = focusedServer()
-    if (!conn) return
-    return global.ensureServerCtx(conn)
-  })
-  const focusedSync = () => focusedServerCtx()?.sync ?? sync()
-  const homeSessions = () => focusedSync().homeSessions
-  const projects = createMemo(() => focusedServerCtx()?.projects.list() ?? layout.projects.list())
-  const recentlyClosed = createMemo(
-    () => focusedServerCtx()?.projects.recentlyClosed() ?? layout.projects.recentlyClosed(),
-  )
-  const homedir = createMemo(() => focusedSync().data.path.home ?? "")
-  const selectedProject = createMemo(() => projects().find((project) => project.worktree === selection().directory))
-  const newSessionProject = createMemo(
-    () =>
-      selectedProject() ??
-      projects().find((project) => project.worktree === focusedServerCtx()?.projects.last()) ??
-      projects()[0],
-  )
-  const directories = (project: LocalProject) => [project.worktree, ...(project.sandboxes ?? [])]
-  const projectDirectories = createMemo(() => {
-    const project = selectedProject()
-    if (!project) return projects().flatMap(directories)
-    return directories(project)
-  })
-  const search = createMemo(() => state.search.trim())
-  const searchPlaceholder = createMemo(() => {
-    const project = selectedProject()
-    if (project) {
-      return language.t("home.sessions.search.placeholder.scoped", { scope: displayName(project) })
-    }
-    if (global.servers.list().length > 1) {
-      const conn = focusedServer()
-      if (conn) {
-        return language.t("home.sessions.search.placeholder.scoped", { scope: serverName(conn) })
-      }
-    }
-    return language.t("home.sessions.search.placeholder")
-  })
-  const sessionEventLoad = useQuery(() => ({
-    queryKey: homeSessions().eventsKey,
-    queryFn: async (): Promise<HomeSessionEvents> => ({ sequence: 0, entries: [] }),
-    initialData: { sequence: 0, entries: [] } satisfies HomeSessionEvents,
-    enabled: false,
-  }))
-  const sessionLoad = useQuery(() => ({
-    queryKey: homeSessions().indexKey,
-    enabled: !!focusedServerCtx(),
-    queryFn: async ({ signal }) => {
-      const ctx = focusedServerCtx()
-      if (!ctx) return { sessions: [], eventSequence: 0 }
-      const cache = homeSessions()
-      const eventSequence = cache.eventSequence()
-      const index = await loadHomeSessionIndex(
-        (input, options) => ctx.sdk.client.v2.session.list(input, options),
-        eventSequence,
-        signal,
-      )
-      cache.complete(eventSequence)
-      return index
-    },
-    retry: false,
-    staleTime: 30_000,
-    refetchOnMount: true,
-    refetchOnReconnect: true,
-  }))
-
-  const projectByID = createMemo(
-    () => new Map(projects().flatMap((project) => (project.id ? [[project.id, project] as const] : []))),
-  )
-  const indexedSessions = createMemo(() =>
-    retainHomeSessions(
-      homeSessions().sessions(sessionLoad.data, sessionEventLoad.data),
-      HOME_SESSION_LIMIT,
-      Date.now(),
-    ),
-  )
-  const allRecords = createMemo(() =>
-    buildHomeSessionRecords({
-      sessions: indexedSessions,
-      projectDirectories,
-      projects,
-      projectByID,
-    }),
-  )
-  const records = createMemo(() => allRecords().slice(0, HOME_SESSION_LIMIT))
-  const searchResults = createMemo(() => {
-    const query = search().toLowerCase()
-    if (!query) return []
-    return allRecords().filter((record) => matchesHomeSessionSearch(record, query))
-  })
-  const searchOpen = createMemo(() => state.searchFocused && search().length > 0)
-  const groups = createMemo(() => groupSessions(records(), language))
-  const sessionHeaderOpacity = useHomeSessionHeaderOpacity(groups)
-  const prefetched = new Set<string>()
-
-  createEffect(() => {
-    const ctx = focusedServerCtx()
-    if (!ctx) return
-    records()
-      .slice(0, 2)
-      .forEach((record) => {
-        const key = `${ServerConnection.key(focusedServer()!)}\0${record.session.id}`
-        if (prefetched.has(key)) return
-        prefetched.add(key)
-        createRoot((dispose) => {
-          try {
-            void ctx.sync.session
-              .sync(record.session.id)
-              .then(() => {
-                return Promise.all(
-                  (ctx.sync.session.data.message[record.session.id] ?? []).flatMap((message) =>
-                    (ctx.sync.session.data.part[message.id] ?? []).flatMap((part) => {
-                      if (part.type !== "text" || !part.text) return []
-                      return preloadMarkdown(part.text, part.id, marked)
-                    }),
-                  ),
-                )
-              })
-              .catch(() => {})
-              .finally(dispose)
-          } catch {
-            dispose()
-          }
-        })
-      })
-  })
-
-  function setSelection(next: HomeProjectSelection) {
-    layout.home.setSelection(next)
-  }
-
-  function closeSearch() {
-    setState("search", "")
-    setState("searchFocused", false)
-  }
-
-  function selectSearchSession(session: Session, options?: OpenSessionOptions) {
-    openSession(session, options)
-    // Background opens keep the search visible so several results can be
-    // opened in a row.
-    if (!options?.background) closeSearch()
-  }
-
-  command.register("home", () => [
-    {
-      id: "command.palette",
-      title: language.t("command.palette"),
-      hidden: true,
-      onSelect: async () => {
-        const conn = focusedServer()
-        if (!conn) return
-        const ctx = global.ensureServerCtx(conn)
-        const { DialogHomeCommandPaletteV2 } = await import("@/components/dialog-command-palette-v2")
-        void dialog.show(() => (
-          <DialogHomeCommandPaletteV2
-            server={conn}
-            onSelectSession={(entry) => {
-              if (!entry.sessionID || !entry.directory || !entry.server) return
-              const sessionID = entry.sessionID
-              const server = entry.server
-              const directory = entry.project?.worktree ?? entry.directory
-              ctx.projects.open(directory)
-              ctx.projects.touch(directory)
-              void startTransition(() => {
-                const tab = tabs.addSessionTab({ server, sessionId: sessionID })
-                tabs.select(tab)
-              })
-            }}
-          />
-        ))
-      },
-    },
-    {
-      id: "home.sessions.search.focus",
-      title: searchPlaceholder(),
-      keybind: "mod+f",
-      hidden: true,
-      onSelect: () => focusSessionSearch?.(),
-    },
-  ])
-
-  createEffect(() => {
-    const list = global.servers.list()
-    if (list.some((conn) => ServerConnection.key(conn) === selection().server)) return
-    const conn = list.find((conn) => ServerConnection.key(conn) === server.key) ?? list[0]
-    if (conn) setSelection({ server: ServerConnection.key(conn) })
-  })
-
-  createEffect(() => {
-    const pending = pendingHomeNavigation
-    if (!pending || pending.server !== server.key) return
-    pendingHomeNavigation = undefined
-    navigate(pending.href)
-  })
-
-  function focusServer(conn: ServerConnection.Any) {
-    setSelection({ server: ServerConnection.key(conn) })
-  }
-
-  function selectProject(conn: ServerConnection.Any, directory: string) {
-    const key = ServerConnection.key(conn)
-    if (global.servers.health[key]?.healthy === false) return
-    if (
-      !global
-        .ensureServerCtx(conn)
-        .projects.list()
-        .some((project) => project.worktree === directory)
-    )
-      return
-    setSelection(toggleHomeProjectSelection(selection(), key, directory))
-  }
-
-  function addProjects(conn: ServerConnection.Any, directories: string[]) {
-    const directory = directories[0]
-    if (!directory) return
-    const ctx = global.ensureServerCtx(conn)
-    directories.forEach(ctx.projects.open)
-    ctx.projects.touch(directory)
-    setSelection({ server: ServerConnection.key(conn), directory })
-  }
-
-  function openNewSession() {
-    const conn = focusedServer()
-    const project = newSessionProject()
-    if (!conn || !project) return
-    openProjectNewSession(conn, project.worktree)
-  }
-
-  function openProjectNewSession(conn: ServerConnection.Any, directory: string) {
-    const ctx = global.ensureServerCtx(conn)
-    ctx.projects.open(directory)
-    ctx.projects.touch(directory)
-    tabs.newDraft({ server: ServerConnection.key(conn), directory })
-  }
-
-  function editProject(conn: ServerConnection.Any, project: LocalProject) {
-    void import("@/components/dialog-edit-project-v2").then((x) => {
-      void dialog.show(() => <x.DialogEditProjectV2 server={conn} project={project} />)
-    })
-  }
-
-  function unseenCount(conn: ServerConnection.Any, project: LocalProject) {
-    const state = notification.ensureServerState(ServerConnection.key(conn))
-    return directories(project).reduce((total, directory) => total + state.project.unseenCount(directory), 0)
-  }
-
-  function clearNotifications(conn: ServerConnection.Any, project: LocalProject) {
-    const state = notification.ensureServerState(ServerConnection.key(conn))
-    directories(project)
-      .filter((directory) => state.project.unseenCount(directory) > 0)
-      .forEach((directory) => state.project.markViewed(directory))
-  }
-
-  function openSession(session: Session, options?: OpenSessionOptions) {
-    const directoryKey = pathKey(session.directory)
-    const project =
-      projects().find(
-        (item) =>
-          pathKey(item.worktree) === directoryKey ||
-          item.sandboxes?.some((sandbox) => pathKey(sandbox) === directoryKey),
-      ) ?? projectForSession(session, projects(), projectByID())
-    const conn = focusedServer()
-    if (!conn) return
-    const directory = project?.worktree ?? session.directory
-    const ctx = global.ensureServerCtx(conn)
-    ctx.projects.open(directory)
-    if (options?.background) {
-      tabs.addSessionTab({ server: ServerConnection.key(conn), sessionId: session.id })
-      return
-    }
-    ctx.projects.touch(directory)
-    startTransition(() => {
-      const tab = tabs.addSessionTab({ server: ServerConnection.key(conn), sessionId: session.id })
-      tabs.select(tab)
-    })
-  }
-
-  async function archiveSession(session: Session) {
-    const conn = focusedServer()
-    const ctx = focusedServerCtx()
-    if (!conn || !ctx) return
-    const [, setStore] = ctx.sync.child(session.directory)
-    await archiveHomeSession({
-      server: ServerConnection.key(conn),
-      session,
-      update: (value) => ctx.sdk.client.session.update(value),
-      remove: () =>
-        setStore(
-          produce((draft) => {
-            const match = Binary.search(draft.session, session.id, (s) => s.id)
-            if (match.found) draft.session.splice(match.index, 1)
-          }),
-        ),
-      onError: (error) =>
-        showToast({
-          title: language.t("common.requestFailed"),
-          description: errorMessage(error, language.t("common.requestFailed")),
-        }),
-    })
-  }
-
-  function chooseProject(conn: ServerConnection.Any) {
-    if (global.servers.health[ServerConnection.key(conn)]?.healthy === false) return
-
-    function resolve(result: string | string[] | null) {
-      addProjects(conn, homeProjectDirectories(result))
-    }
-
-    pickDirectory({
-      server: conn,
-      title: language.t("command.project.open"),
-      multiple: true,
-      onSelect: resolve,
-    })
-  }
-
+  const home = createHomeController()
+  const projects = createHomeProjectsController(home)
+  const sessions = createHomeSessionsController(home)
+  const search = createHomeSessionSearchController(home, sessions)
+  const scroll = createHomeScrollController(sessions.data.groups)
  return (
-    <div class="rounded-[10px] shadow-[var(--v2-elevation-raised)] m-2 min-h-0 overflow-hidden bg-v2-background-bg-base self-stretch flex-1">
+    <div
+      class={`
+        m-2 min-h-0 flex-1 self-stretch overflow-hidden rounded-[10px]
+        bg-v2-background-bg-base shadow-[var(--v2-elevation-raised)]
+      `}
+    >
      <ScrollView
        class="h-full [container-type:size]"
-        thumbContainer={sessionThumbTrack}
-        thumbHoverTarget={sessionHoverTarget}
-        viewportRef={(el) => {
-          sessionViewport = el
-          sessionHeaderOpacity.setViewport(el)
-        }}
-        onScroll={(event) => sessionHeaderOpacity.update(event.currentTarget.scrollTop)}
-        onWheel={(event) => {
-          if (!sessionViewport) return
-          if (event.target instanceof Node && sessionViewport.contains(event.target)) return
-          containHomeWheel(event, sessionViewport)
-        }}
-      >
-        <div class="mx-auto grid min-h-full w-full max-w-[1080px] grid-rows-[auto_minmax(0,1fr)_auto] gap-4 px-3 lg:grid-cols-[280px_minmax(0,720px)] lg:grid-rows-1 lg:gap-8 lg:px-6">
-          <HomeProjectColumn
-            projects={projects()}
-            recentlyClosed={recentlyClosed()}
-            homedir={homedir()}
-            selected={selection()}
-            focusServer={focusServer}
-            selectProject={selectProject}
-            openNewSession={openProjectNewSession}
-            openRecentProject={(conn, directory) => addProjects(conn, [directory])}
-            chooseProject={(conn) => void chooseProject(conn)}
-            editProject={editProject}
-            closeProject={(conn, directory) => {
-              const next = closeHomeProject(
-                selection(),
-                ServerConnection.key(conn),
-                global.ensureServerCtx(conn).projects,
-                directory,
-              )
-              if (next) setSelection(next)
-            }}
-            clearNotifications={clearNotifications}
-            unseenCount={unseenCount}
-            openSettings={openSettings}
-            openHelp={() => platform.openLink("https://opencode.ai/desktop-feedback")}
-            language={language}
-            onWheel={(event) => {
-              if (sessionViewport) containHomeWheel(event, sessionViewport)
-            }}
-          />
-
-          <section
-            ref={setSessionHoverTarget}
-            class="min-h-0 min-w-0 flex-1 flex flex-col"
-            aria-label={language.t("sidebar.project.recentSessions")}
-          >
-            <div
-              class="sticky top-0 z-30 shrink-0 bg-v2-background-bg-base pb-3 pt-6 lg:pt-12"
-              onWheel={(event) => {
-                if (sessionViewport) containHomeWheel(event, sessionViewport)
-              }}
-            >
-              <HomeSessionSearch
-                value={state.search}
-                placeholder={searchPlaceholder()}
-                open={searchOpen()}
-                loading={sessionLoad.isLoading}
-                results={searchResults()}
-                showProjectName={!selectedProject()}
-                server={selection().server}
-                noResultsLabel={language.t("home.sessions.search.noResults", { query: search() })}
-                bindFocus={(focus) => {
-                  focusSessionSearch = focus
-                }}
-                onInput={(value) => setState("search", value)}
-                onFocus={() => setState("searchFocused", true)}
-                onClose={closeSearch}
-                onSelect={selectSearchSession}
-              />
-              <Show when={groups().length > 0 && newSessionProject()}>
-                <div class="pointer-events-none absolute right-0 top-[84px] z-20 flex lg:top-[108px]">
-                  <ButtonV2
-                    data-action="home-new-session"
-                    variant="ghost-muted"
-                    size="normal"
-                    icon="edit"
-                    class="pointer-events-auto h-7 px-2 [font-weight:530]"
-                    onClick={openNewSession}
-                  >
-                    {language.t("command.session.new")}
-                  </ButtonV2>
-                </div>
-              </Show>
-            </div>
-            {/* Sticky chrome for the portaled session scrollbar — matches old sessions ScrollView bounds */}
-            <div class="pointer-events-none sticky top-[84px] z-40 h-0 -mr-3 lg:top-[108px]">
-              <div
-                ref={setSessionThumbTrack}
-                data-component="home-session-scroll-track"
-                class="relative ml-auto h-[calc(100cqh-84px)] w-3 lg:h-[calc(100cqh-108px)]"
-              />
-            </div>
-            <div class="-mr-3 min-h-[calc(100cqh-72px)] lg:min-h-[calc(100cqh-96px)]">
-              <Show
-                when={!sessionLoad.isLoading}
-                fallback={
-                  <div class="pt-3">
-                    <HomeSessionSkeleton label={language.t("common.loading")} />
-                  </div>
-                }
-              >
-                <Show
-                  when={groups().length > 0}
-                  fallback={<HomeSessionsEmpty onNewSession={newSessionProject() ? openNewSession : undefined} />}
-                >
-                  <div ref={sessionHeaderOpacity.setContentRef} class="flex flex-col pt-3 pr-3 pb-16">
-                    <For each={groups()}>
-                      {(group, index) => (
-                        <>
-                          <HomeSessionGroupHeader
-                            title={group.title}
-                            titleOpacity={sessionHeaderOpacity.titleOpacity(group.id)}
-                            ref={(el) => sessionHeaderOpacity.setHeaderRef(group.id, el)}
-                            elevated={index() === 0}
-                          />
-                          <div
-                            class={`flex min-w-0 flex-col gap-px pt-4 ${index() === groups().length - 1 ? "" : "mb-6"}`}
-                          >
-                            <For each={group.sessions}>
-                              {(record) => (
-                                <HomeSessionRow
-                                  record={record}
-                                  showProjectName={!selectedProject()}
-                                  server={selection().server}
-                                  openSession={openSession}
-                                  archiveSession={archiveSession}
-                                />
-                              )}
-                            </For>
-                          </div>
-                        </>
-                      )}
-                    </For>
-                  </div>
-                </Show>
-              </Show>
-            </div>
-          </section>
-          <HomeUtilityNav
-            class="flex lg:hidden"
-            openSettings={openSettings}
-            openHelp={() => platform.openLink("https://opencode.ai/desktop-feedback")}
-            language={language}
-          />
-        </div>
-      </ScrollView>
-    </div>
-  )
-}
-
-function HomeProjectColumn(props: {
-  projects: LocalProject[]
-  recentlyClosed: LocalProject[]
-  homedir: string
-  selected: HomeProjectSelection
-  focusServer: (server: ServerConnection.Any) => void
-  selectProject: (server: ServerConnection.Any, directory: string) => void
-  openNewSession: (server: ServerConnection.Any, directory: string) => void
-  openRecentProject: (server: ServerConnection.Any, directory: string) => void
-  chooseProject: (server: ServerConnection.Any) => void
-  editProject: (server: ServerConnection.Any, project: LocalProject) => void
-  closeProject: (server: ServerConnection.Any, directory: string) => void
-  clearNotifications: (server: ServerConnection.Any, project: LocalProject) => void
-  unseenCount: (server: ServerConnection.Any, project: LocalProject) => number
-  openSettings: () => void
-  openHelp: () => void
-  language: ReturnType<typeof useLanguage>
-  onWheel: (event: WheelEvent) => void
-}) {
-  const global = useGlobal()
-  const dialog = useDialog()
-  const controller = useServerManagementController({ navigateOnAdd: false })
-  const [_state, setState, _, ready] = persisted(
-    Persist.global("home.servers", ["home.servers.v1"]),
-    createStore({ collapsed: {} as Record<string, boolean> }),
-  )
-  const [state] = createResource(
-    () => ready.promise ?? Promise.resolve(),
-    (p) => p.then(() => _state),
-    { initialValue: _state },
-  )
-
-  return (
-    <aside
-      class="mt-6 flex min-h-0 min-w-0 flex-col gap-4 overflow-hidden lg:sticky lg:top-14 lg:mt-14 lg:h-[calc(100cqh-56px)] lg:self-start lg:pt-[52px]"
-      aria-label={props.language.t("home.projects")}
-      onWheel={(event) => {
-        if (event.target === event.currentTarget) return
-        props.onWheel(event)
-      }}
-    >
-      <div class="flex h-7 min-w-0 shrink-0 items-center justify-between pl-1.5 pr-3">
-        <div class="text-v2-text-text-muted [font-weight:530]">{props.language.t("home.projects")}</div>
-        <Show
-          when={global.servers.list().length === 1 && !(props.projects.length === 0 && props.recentlyClosed.length > 0)}
-        >
-          <TooltipV2 placement="bottom" value={props.language.t("home.project.add")}>
-            <IconButtonV2
-              data-action="home-add-project"
-              variant="ghost-muted"
-              size="large"
-              class="titlebar-icon [&_[data-slot=icon-svg]]:text-v2-icon-icon-muted"
-              icon={<IconV2 name="folder-add-left" />}
-              disabled={global.servers.health[ServerConnection.key(global.servers.list()[0]!)]?.healthy === false}
-              onClick={() => props.chooseProject(global.servers.list()[0]!)}
-              aria-label={props.language.t("home.project.add")}
-            />
-          </TooltipV2>
-        </Show>
-      </div>
-      <ScrollView data-slot="home-projects-scroll" class="min-h-0 min-w-0 shrink">
-        <Show
-          when={global.servers.list().length > 1}
-          fallback={
-            <div class="pr-3">
-              <Show
-                when={props.projects.length > 0}
-                fallback={
-                  <HomeProjectEmpty
-                    server={global.servers.list()[0]!}
-                    recentlyClosed={props.recentlyClosed}
-                    homedir={props.homedir}
-                    chooseProject={props.chooseProject}
-                    openRecentProject={props.openRecentProject}
-                    language={props.language}
-                  />
-                }
-              >
-                <HomeProjectList {...props} server={global.servers.list()[0]!} />
-              </Show>
-            </div>
-          }
-        >
-          <div class="flex min-w-0 flex-col gap-4 pr-3">
-            <For each={global.servers.list()}>
-              {(item) => {
-                const key = ServerConnection.key(item)
-                const healthy = () => !!global.servers.health[key]?.healthy
-                const serverCtx = global.ensureServerCtx(item)
-                const projects = () => serverCtx.projects.list()
-                const hasProjects = () => projects().length > 0
-                const collapsed = () => !!state().collapsed[key]
-                return (
-                  <div class="flex min-w-0 flex-col gap-1">
-                    <HomeServerRow
-                      server={item}
-                      selected={props.selected.server === key && !props.selected.directory}
-                      collapsed={collapsed()}
-                      health={global.servers.health[key]}
-                      controller={controller}
-                      focusServer={props.focusServer}
-                      chooseProject={props.chooseProject}
-                      openEdit={(server) => dialog.show(() => <DialogServerV2 mode="edit" server={server} />)}
-                      toggleCollapsed={() => setState("collapsed", key, !state().collapsed[key])}
-                      language={props.language}
-                    />
-                    <Show when={healthy() && hasProjects() && !collapsed()}>
-                      <div class="mx-3 h-px bg-v2-border-border-base" />
-                      <HomeProjectList {...props} server={item} projects={projects()} />
-                    </Show>
-                  </div>
-                )
-              }}
-            </For>
-          </div>
-        </Show>
-      </ScrollView>
-      <HomeUtilityNav
-        class="mb-8 mt-4 hidden shrink-0 lg:flex"
-        openSettings={props.openSettings}
-        openHelp={props.openHelp}
-        language={props.language}
-      />
-    </aside>
-  )
-}
-
-function HomeUtilityNav(props: {
-  class?: string
-  openSettings: () => void
-  openHelp: () => void
-  language: ReturnType<typeof useLanguage>
-}) {
-  return (
-    <div class={`${props.class ?? ""} min-w-0 flex-col gap-1 pr-3`}>
-      <button
-        type="button"
-        class={`${HOME_PROJECT_NAV_ROW} text-v2-text-text-faint [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted`}
-        onClick={props.openSettings}
-      >
-        <IconV2 name="settings-gear" size="small" />
-        <span class={HOME_PROJECT_NAV_LABEL}>{props.language.t("sidebar.settings")}</span>
-      </button>
-      <button
-        type="button"
-        class={`${HOME_PROJECT_NAV_ROW} text-v2-text-text-faint [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted`}
-        onClick={props.openHelp}
-      >
-        <IconV2 name="help" size="small" />
-        <span class={HOME_PROJECT_NAV_LABEL}>{props.language.t("sidebar.help")}</span>
-      </button>
-    </div>
-  )
-}
-
-function HomeServerRow(props: {
-  server: ServerConnection.Any
-  selected: boolean
-  collapsed: boolean
-  health: ServerHealth | undefined
-  controller: ReturnType<typeof useServerManagementController>
-  focusServer: (server: ServerConnection.Any) => void
-  chooseProject: (server: ServerConnection.Any) => void
-  openEdit: (server: ServerConnection.Http) => void
-  toggleCollapsed: () => void
-  language: ReturnType<typeof useLanguage>
-}) {
-  const global = useGlobal()
-  const [state, setState] = createStore({ menuOpen: false })
-  const healthy = () => !!props.health?.healthy
-  const canToggle = () => healthy() && global.ensureServerCtx(props.server).projects.list().length > 0
-  return (
-    <div class="group/server relative flex h-7 min-w-0 items-center rounded-[6px]">
-      <button
-        type="button"
-        class={`${HOME_PROJECT_NAV_ROW} pr-16 disabled:opacity-60`}
-        data-selected={props.selected ? "" : undefined}
-        disabled={!healthy()}
-        onClick={() => props.focusServer(props.server)}
-      >
-        <span
-          data-action="home-server-collapse"
-          class="inline-flex -ml-0.5 -mr-1.5 size-5 shrink-0 items-center justify-center rounded-[4px] text-v2-icon-icon-muted"
-          classList={{
-            "hover:bg-v2-overlay-simple-overlay-hover": canToggle(),
-            "cursor-default opacity-40": !canToggle(),
-          }}
-          aria-label={
-            props.collapsed ? props.language.t("home.server.expand") : props.language.t("home.server.collapse")
-          }
-          aria-disabled={!canToggle()}
-          aria-expanded={canToggle() ? !props.collapsed : undefined}
-          onClick={(event) => {
-            event.preventDefault()
-            event.stopPropagation()
-            if (!canToggle()) return
-            props.toggleCollapsed()
-          }}
-          onPointerDown={(event) => event.preventDefault()}
-        >
-          <IconV2
-            name="chevron-down"
-            size="small"
-            class="transition-transform duration-150 ease-in-out"
-            style={{ transform: `rotate(${props.collapsed ? -90 : 0}deg)` }}
-          />
-        </span>
-        <div class="flex size-4 shrink-0 items-center justify-center -mr-0.5">
-          <ServerHealthIndicator health={props.health} />
-        </div>
-        <span class="flex min-w-0 items-center gap-1">
-          <span class={HOME_PROJECT_NAV_LABEL}>{props.server.displayName ?? new URL(props.server.http.url).host}</span>
-          <Show when={props.server.label}>
-            {(label) => (
-              <span class="shrink-0 rounded-[3px] border border-v2-border-border-base px-1 py-0.5 text-[9px] leading-none text-v2-text-text-muted">
-                {label()}
-              </span>
-            )}
-          </Show>
-        </span>
-      </button>
-      <div
-        class="hover-reveal absolute right-1 top-1/2 flex -translate-y-1/2 items-center gap-1 group-hover/server:opacity-100 focus-within:opacity-100 data-[menu=true]:opacity-100"
-        data-menu={state.menuOpen}
-      >
-        <ServerRowMenu
-          server={props.server}
-          controller={props.controller}
-          onEdit={props.openEdit}
-          open={state.menuOpen}
-          onOpenChange={(open) => setState("menuOpen", open)}
-        />
-        <TooltipV2 class="flex shrink-0 items-center" placement="bottom" value={props.language.t("home.project.add")}>
-          <IconButtonV2
-            data-action="home-add-project"
-            variant="ghost-muted"
-            size="small"
-            icon={<IconV2 name="folder-add-left" />}
-            aria-label={props.language.t("home.project.add")}
-            disabled={props.health?.healthy === false}
-            onClick={() => props.chooseProject(props.server)}
-          />
-        </TooltipV2>
-      </div>
-    </div>
-  )
-}
-
-type HomeProjectListProps = {
-  server: ServerConnection.Any
-  projects: LocalProject[]
-  selected: HomeProjectSelection
-  selectProject: (server: ServerConnection.Any, directory: string) => void
-  openNewSession: (server: ServerConnection.Any, directory: string) => void
-  editProject: (server: ServerConnection.Any, project: LocalProject) => void
-  closeProject: (server: ServerConnection.Any, directory: string) => void
-  clearNotifications: (server: ServerConnection.Any, project: LocalProject) => void
-  unseenCount: (server: ServerConnection.Any, project: LocalProject) => number
-  language: ReturnType<typeof useLanguage>
-}
-
-function HomeProjectList(props: HomeProjectListProps) {
-  const global = useGlobal()
-  let listRef!: HTMLDivElement
-  const projects = () => global.ensureServerCtx(props.server).projects
-
-  return (
-    <DragDropProvider
-      sensors={(defaults) => [
-        ...defaults.filter((sensor) => sensor !== PointerSensor),
-        PointerSensor.configure({
-          activationConstraints: (event) =>
-            event.pointerType === "touch"
-              ? [new PointerActivationConstraints.Delay({ value: 250, tolerance: 5 })]
-              : [new PointerActivationConstraints.Distance({ value: 4 })],
-          preventActivation: (event) => event.target instanceof Element && !!event.target.closest("[data-action]"),
-        }),
-      ]}
-      modifiers={[RestrictToVerticalAxis, RestrictToElement.configure({ element: () => listRef })]}
-      plugins={(defaults) => [
-        ...defaults.filter((plugin) => plugin !== AutoScroller && plugin !== Feedback),
-        AutoScroller.configure({ acceleration: 8, threshold: { x: 0, y: 0.05 } }),
-        Feedback.configure({ dropAnimation: null }),
-      ]}
-      onDragEnd={(event) => {
-        const source = event.operation.source
-        if (event.canceled || !isSortable(source)) return
-        if (source.initialIndex !== source.index) projects().move(source.id.toString(), source.index)
-        if (props.selected.server !== ServerConnection.key(props.server))
-          props.selectProject(props.server, source.id.toString())
-      }}
-    >
-      <div class="flex min-w-0 flex-col gap-1" ref={listRef}>
-        {/* Keyed on worktree strings: the enriched project objects are
-            recreated on every store or sync update, so iterating them directly
-            remounts all rows — killing any in-flight drag activation (the
-            row's sortable unregisters on unmount) and discarding animations.
-            String keys keep row elements alive and move them on reorder. */}
-        <For each={props.projects.map((project) => project.worktree)}>
-          {(worktree, index) => <HomeProjectSlot {...props} worktree={worktree} index={index} />}
-        </For>
-      </div>
-    </DragDropProvider>
-  )
-}
-
-function HomeProjectSlot(
-  props: HomeProjectListProps & {
-    worktree: string
-    index: () => number
-  },
-) {
-  const project = createMemo(() => props.projects.find((item) => item.worktree === props.worktree))
-
-  return (
-    <Show when={project()}>
-      {(item) => (
-        <HomeProjectRow
-          project={item()}
-          server={props.server}
-          index={props.index}
-          serverSelected={props.selected.server === ServerConnection.key(props.server)}
-          selected={
-            props.selected.server === ServerConnection.key(props.server) && props.selected.directory === props.worktree
-          }
-          unseenCount={props.unseenCount(props.server, item())}
-          selectProject={props.selectProject}
-          openNewSession={props.openNewSession}
-          editProject={props.editProject}
-          closeProject={props.closeProject}
-          clearNotifications={props.clearNotifications}
-          language={props.language}
-        />
-      )}
-    </Show>
-  )
-}
-
-function HomeProjectEmpty(props: {
-  server: ServerConnection.Any
-  recentlyClosed: LocalProject[]
-  homedir: string
-  chooseProject: (server: ServerConnection.Any) => void
-  openRecentProject: (server: ServerConnection.Any, directory: string) => void
-  language: ReturnType<typeof useLanguage>
-}) {
-  const global = useGlobal()
-  const unreachable = () => global.servers.health[ServerConnection.key(props.server)]?.healthy === false
-  return (
-    <div class="flex min-w-0 flex-col gap-1">
-      <button
-        type="button"
-        data-action="home-add-project-row"
-        class={`${HOME_PROJECT_NAV_ROW} disabled:opacity-60 [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted`}
-        disabled={unreachable()}
-        onClick={() => props.chooseProject(props.server)}
-      >
-        <IconV2 name="folder-add-left" size="small" />
-        <span class={HOME_PROJECT_NAV_LABEL}>{props.language.t("home.project.add")}</span>
-      </button>
-      <Show when={props.recentlyClosed.length > 0}>
-        <div class="mt-3 flex h-7 min-w-0 shrink-0 items-center pl-1.5 pr-3">
-          <div class="text-v2-text-text-faint [font-weight:530]">{props.language.t("home.recentlyClosed")}</div>
-        </div>
-        <For each={props.recentlyClosed}>
-          {(project) => (
-            <HomeRecentlyClosedRow
-              project={project}
-              server={props.server}
-              homedir={props.homedir}
-              openRecentProject={props.openRecentProject}
-              language={props.language}
-            />
-          )}
-        </For>
-      </Show>
-    </div>
-  )
-}
-
-function HomeRecentlyClosedRow(props: {
-  project: LocalProject
-  server: ServerConnection.Any
-  homedir: string
-  openRecentProject: (server: ServerConnection.Any, directory: string) => void
-  language: ReturnType<typeof useLanguage>
-}) {
-  const global = useGlobal()
-  const unreachable = () => global.servers.health[ServerConnection.key(props.server)]?.healthy === false
-  const path = () => {
-    const home = props.homedir
-    const worktree = props.project.worktree
-    if (home && (worktree === home || worktree.startsWith(`${home}/`))) return `~${worktree.slice(home.length)}`
-    return worktree
-  }
-  return (
-    <TooltipV2 placement="right" value={path()}>
-      <button
-        type="button"
-        data-component="home-recently-closed-row"
-        class={`${HOME_PROJECT_NAV_ROW} disabled:opacity-60`}
-        disabled={unreachable()}
-        onClick={() => props.openRecentProject(props.server, props.project.worktree)}
-      >
-        <HomeProjectAvatar project={props.project} outline />
-        <span class={HOME_PROJECT_NAV_LABEL}>{displayName(props.project)}</span>
-      </button>
-    </TooltipV2>
-  )
-}
-
-function HomeProjectRow(props: {
-  project: LocalProject
-  server: ServerConnection.Any
-  index: () => number
-  serverSelected: boolean
-  selected: boolean
-  unseenCount: number
-  selectProject: (server: ServerConnection.Any, directory: string) => void
-  openNewSession: (server: ServerConnection.Any, directory: string) => void
-  editProject: (server: ServerConnection.Any, project: LocalProject) => void
-  closeProject: (server: ServerConnection.Any, directory: string) => void
-  clearNotifications: (server: ServerConnection.Any, project: LocalProject) => void
-  language: ReturnType<typeof useLanguage>
-}) {
-  const global = useGlobal()
-  const platform = usePlatform()
-  const serverUnreachable = () => global.servers.health[ServerConnection.key(props.server)]?.healthy === false
-  const [state, setState] = createStore({ menuOpen: false })
-  const sortable = useSortable({
-    get id() {
-      return props.project.worktree
-    },
-    get index() {
-      return props.index()
-    },
-  })
-  let pointerDownSelected: boolean | undefined
-  const canRevealInFileManager = () =>
-    platform.platform === "desktop" && !!platform.openPath && ServerConnection.local(props.server)
-  const fileManagerActionLabel = () =>
-    props.language.t(
-      fileManagerApp(platform.platform === "desktop" ? (platform.os ?? "unknown") : "unknown").actionLabel,
-    )
-  const revealInFileManager = () => {
-    if (!platform.openPath) return
-    platform.openPath(props.project.worktree).catch((err: unknown) =>
-      showToast({
-        title: props.language.t("common.requestFailed"),
-        description: errorMessage(err, props.language.t("common.requestFailed")),
-      }),
-    )
-  }
-  return (
-    <div
-      ref={sortable.ref}
-      class="group/project relative flex h-7 min-w-0 items-center rounded-[6px]"
-      classList={{ "z-10": sortable.isDragSource() }}
-    >
-      <button
-        type="button"
-        data-component="home-project-row"
-        class={`${HOME_PROJECT_NAV_ROW} pr-16 disabled:opacity-60`}
-        classList={{
-          "bg-v2-background-bg-layer-01 text-v2-text-text-base [box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)]":
-            sortable.isDragSource(),
-        }}
-        data-selected={props.selected ? "" : undefined}
-        aria-current={props.selected ? "page" : undefined}
-        disabled={serverUnreachable()}
-        onPointerDown={(event) => {
-          // Same-server mouse selection happens on pointerdown (like tabs),
-          // but only ever selects; selectProject toggles, and deselecting here
-          // would fire on every drag before the threshold is met. Cross-server
-          // selection waits for click so reordering a remote server's projects
-          // does not focus that server and load its session index. Touch is
-          // excluded so flick-scrolling the list cannot select rows.
-          pointerDownSelected = undefined
-          if (event.button !== 0 || event.pointerType === "touch") return
-          if (!props.serverSelected) return
-          pointerDownSelected = props.selected
-          if (!props.selected) props.selectProject(props.server, props.project.worktree)
-        }}
-        onClick={(event) => {
-          // The drag sensor calls preventDefault on post-drag clicks; never
-          // toggle selection as part of a reorder.
-          if (event.defaultPrevented) return
-          // Keyboard activation and touch taps keep the original toggle.
-          if (event.detail === 0 || pointerDownSelected === undefined) {
-            props.selectProject(props.server, props.project.worktree)
-            return
-          }
-          // Mouse: pointerdown already selected unselected rows; a plain click
-          // on an already-selected row toggles it off.
-          if (pointerDownSelected) props.selectProject(props.server, props.project.worktree)
-          pointerDownSelected = undefined
-        }}
-      >
-        <HomeProjectAvatar project={props.project} />
-        <span class={HOME_PROJECT_NAV_LABEL}>{displayName(props.project)}</span>
-      </button>
-      <div
-        class="hover-reveal absolute right-1 top-1/2 flex -translate-y-1/2 items-center gap-1 group-hover/project:opacity-100 focus-within:opacity-100 data-[menu=true]:opacity-100"
-        data-menu={state.menuOpen}
-      >
-        <MenuV2
-          gutter={6}
-          modal={false}
-          placement="bottom-end"
-          open={state.menuOpen}
-          onOpenChange={(open) => setState("menuOpen", open)}
-        >
-          <MenuV2.Trigger
-            as={IconButtonV2}
-            data-action="home-project-menu"
-            variant="ghost-muted"
-            size="small"
-            icon={<IconV2 name="outline-dots" />}
-            aria-label={props.language.t("common.moreOptions")}
-          />
-          <MenuV2.Portal>
-            <MenuV2.Content>
-              <MenuV2.Item onSelect={() => props.openNewSession(props.server, props.project.worktree)}>
-                {props.language.t("command.session.new")}
-              </MenuV2.Item>
-              <MenuV2.Item onSelect={() => props.editProject(props.server, props.project)}>
-                {props.language.t("dialog.project.edit.title")}
-              </MenuV2.Item>
-              <Show when={canRevealInFileManager()}>
-                <MenuV2.Item onSelect={revealInFileManager}>{fileManagerActionLabel()}</MenuV2.Item>
-              </Show>
-              <MenuV2.Item
-                disabled={props.unseenCount === 0}
-                onSelect={() => props.clearNotifications(props.server, props.project)}
-              >
-                {props.language.t("sidebar.project.clearNotifications")}
-              </MenuV2.Item>
-              <MenuV2.Separator />
-              <MenuV2.Item onSelect={() => props.closeProject(props.server, props.project.worktree)}>
-                {props.language.t("common.close")}
-              </MenuV2.Item>
-            </MenuV2.Content>
-          </MenuV2.Portal>
-        </MenuV2>
-        <IconButtonV2
-          data-action="home-project-new-session"
-          variant="ghost-muted"
-          size="small"
-          icon={<IconV2 name="edit" />}
-          aria-label={props.language.t("command.session.new")}
-          onClick={() => props.openNewSession(props.server, props.project.worktree)}
-        />
-      </div>
-    </div>
-  )
-}
-
-function HomeProjectAvatar(props: { project: LocalProject; outline?: boolean }) {
-  const name = createMemo(() => displayName(props.project))
-  return (
-    <ProjectAvatar
-      fallback={name()}
-      src={props.outline ? undefined : getProjectAvatarSource(props.project.id, props.project.icon)}
-      variant={props.outline ? "outline" : getProjectAvatarVariant(props.project.icon?.color)}
-    />
-  )
-}
-
-function HomeSessionLeading(props: {
-  project: LocalProject
-  session: Session
-  server: ServerConnection.Key
-  revealProjectOnHover: boolean
-}) {
-  const tabs = useTabs()
-  const hasOpenTab = createMemo(() => sessionHasOpenTab(tabs.store, props.server, props.session))
-  return (
-    <div class="relative shrink-0">
-      <Show when={hasOpenTab()}>
-        <span
-          aria-hidden="true"
-          class="pointer-events-none absolute top-1/2 h-3 w-0.5 -translate-y-1/2 rounded-[2px] bg-v2-background-bg-layer-04"
-          style={{ right: "calc(100% + 4px)" }}
-        />
-      </Show>
-      <SessionTabAvatar
-        project={props.project}
-        directory={props.session.directory}
-        sessionId={props.session.id}
-        server={props.server}
-        revealProjectOnHover={props.revealProjectOnHover}
-      />
-    </div>
-  )
-}
-
-function HomeSessionSearch(props: {
-  value: string
-  placeholder: string
-  open: boolean
-  loading: boolean
-  results: HomeSessionRecord[]
-  showProjectName: boolean
-  server: ServerConnection.Key
-  noResultsLabel: string
-  bindFocus: (focus: () => void) => void
-  onInput: (value: string) => void
-  onFocus: () => void
-  onClose: () => void
-  onSelect: (session: Session, options?: OpenSessionOptions) => void
-}) {
-  const language = useLanguage()
-  const [store, setStore] = createStore({ active: "" })
-  let root: HTMLDivElement | undefined
-  let input: HTMLInputElement | undefined
-  let listRef: HTMLDivElement | undefined
-
-  const focusInput = () => {
-    input?.focus()
-    props.onFocus()
-  }
-
-  onMount(() => {
-    props.bindFocus(focusInput)
-  })
-
-  const syncActive = (results: HomeSessionRecord[]) => {
-    if (results.length === 0) {
-      setStore("active", "")
-      return
-    }
-    if (!results.some((record) => homeSessionSearchKey(record) === store.active)) {
-      setStore("active", homeSessionSearchKey(results[0]))
-    }
-  }
-
-  createEffect(() => syncActive(props.results))
-
-  createEffect(
-    on(
-      () => props.value,
-      () => syncActive(props.results),
-    ),
-  )
-
-  const scrollActiveIntoView = () => {
-    const key = store.active
-    if (!key || !listRef) return
-    const element = listRef.querySelector<HTMLElement>(`[data-key="${key}"]`)
-    element?.scrollIntoView({ block: "nearest" })
-  }
-
-  const moveActive = (delta: number) => {
-    const results = props.results
-    if (results.length === 0) return
-    const index = results.findIndex((record) => homeSessionSearchKey(record) === store.active)
-    const start = index === -1 ? 0 : index
-    const next = (start + delta + results.length) % results.length
-    setStore("active", homeSessionSearchKey(results[next]))
-    scrollActiveIntoView()
-  }
-
-  const selectActive = () => {
-    const record = props.results.find((item) => homeSessionSearchKey(item) === store.active)
-    if (!record) return
-    props.onSelect(record.session)
-  }
-
-  onCleanup(
-    makeEventListener(document, "pointerdown", (event) => {
-      if (!props.open) return
-      const target = event.target
-      if (!(target instanceof Node)) return
-      if (root?.contains(target)) return
-      props.onClose()
-    }),
-  )
-
-  return (
-    <div class="w-full">
-      <div ref={root} data-component="home-session-search" class="relative z-30 w-full">
-        <Show when={props.open}>
-          <div
-            data-component="home-session-search-panel"
-            class="absolute flex flex-col overflow-hidden rounded-[12px] bg-v2-background-bg-base shadow-[var(--v2-elevation-floating)]"
-            style={{
-              top: "-6px",
-              left: "-6px",
-              width: "calc(100% + 12px)",
-            }}
-          >
-            <div class="flex flex-col pt-9">
-              <div id={HOME_SESSION_SEARCH_RESULTS_ID} role="listbox" class="flex flex-col gap-4 pt-4">
-                <Show
-                  when={!props.loading}
-                  fallback={
-                    <div class="flex items-center justify-center px-4 py-3 text-v2-text-text-muted [font-weight:440]">
-                      <Spinner class="size-4" />
-                    </div>
-                  }
-                >
-                  <Show
-                    when={props.results.length > 0}
-                    fallback={
-                      <p class="my-1.5 px-4 pb-2 text-[13px] leading-4 tracking-[-0.04px] text-v2-text-text-muted [font-weight:440]">
-                        {props.noResultsLabel}
-                      </p>
-                    }
-                  >
-                    <div class="flex flex-col">
-                      <p class="my-1.5 pl-[18px] pr-6 text-[13px] leading-4 tracking-[-0.04px] text-v2-text-text-muted [font-weight:440]">
-                        {language.t("home.sessions.search.sessions")}
-                      </p>
-                      <ScrollView class="max-h-80" viewportRef={(el) => (listRef = el)}>
-                        <div class="flex flex-col gap-px pb-2">
-                          <For each={props.results}>
-                            {(record) => (
-                              <HomeSessionSearchResultRow
-                                record={record}
-                                showProjectName={props.showProjectName}
-                                server={props.server}
-                                selected={store.active === homeSessionSearchKey(record)}
-                                onHighlight={() => setStore("active", homeSessionSearchKey(record))}
-                                onSelect={(session, options) => props.onSelect(session, options)}
-                              />
-                            )}
-                          </For>
-                        </div>
-                      </ScrollView>
-                    </div>
-                  </Show>
-                </Show>
-              </div>
-            </div>
-          </div>
-        </Show>
-        <label class="relative z-20 flex h-9 w-full items-center gap-2 rounded-[6px] bg-v2-background-bg-layer-02/60 py-1 pl-3 pr-2 text-v2-icon-icon-muted transition-[background-color,box-shadow] duration-[120ms] ease-in-out hover:bg-v2-background-bg-layer-02 focus-within:bg-v2-background-bg-layer-02">
-          <IconV2 name="magnifying-glass" />
-          <input
-            ref={input}
-            class="relative z-20 min-w-0 flex-1 border-0 bg-transparent text-v2-text-text-base outline-0 [font-weight:440] placeholder:text-v2-text-text-faint"
-            value={props.value}
-            placeholder={props.placeholder}
-            aria-label={props.placeholder}
-            aria-expanded={props.open}
-            aria-controls={HOME_SESSION_SEARCH_RESULTS_ID}
-            aria-autocomplete="list"
-            aria-activedescendant={
-              store.active && props.open ? `home-session-search-option-${store.active}` : undefined
-            }
-            onFocus={() => props.onFocus()}
-            onInput={(event) => props.onInput(event.currentTarget.value)}
-            onKeyDown={(event) => {
-              if (event.key === "Escape") {
-                event.preventDefault()
-                props.onClose()
-                input?.blur()
-                return
-              }
-              if (!props.open || props.results.length === 0) return
-              if (event.altKey || event.metaKey) return
-              if (event.key === "ArrowDown") {
-                event.preventDefault()
-                moveActive(1)
-                return
-              }
-              if (event.key === "ArrowUp") {
-                event.preventDefault()
-                moveActive(-1)
-                return
-              }
-              if (event.key === "Enter" && !event.isComposing) {
-                event.preventDefault()
-                selectActive()
-              }
-            }}
-          />
-          <Show when={props.value}>
-            <IconButtonV2
-              type="button"
-              variant="ghost-muted"
-              size="small"
-              class="relative z-20 shrink-0"
-              icon={<IconV2 name="close" size="large" class="text-v2-icon-icon-muted" />}
-              aria-label={props.placeholder}
-              onClick={() => {
-                props.onClose()
-                input?.focus()
-              }}
-            />
-          </Show>
-        </label>
-      </div>
-    </div>
-  )
-}
-
-function HomeSessionSearchResultRow(props: {
-  record: HomeSessionRecord
-  showProjectName: boolean
-  server: ServerConnection.Key
-  selected: boolean
-  onHighlight: () => void
-  onSelect: (session: Session, options?: OpenSessionOptions) => void
-}) {
-  const title = createMemo(() => sessionTitle(props.record.session.title) || props.record.session.id)
-  const showProjectName = () => props.showProjectName && props.record.projectName
-
-  const key = () => homeSessionSearchKey(props.record)
-
-  return (
-    <button
-      type="button"
-      id={`home-session-search-option-${key()}`}
-      data-key={key()}
-      data-component="home-session-search-row"
-      role="option"
-      aria-selected={props.selected}
-      classList={{
-        [HOME_SEARCH_RESULT_ROW]: true,
-        "bg-v2-overlay-simple-overlay-hover": props.selected,
-        group: !!showProjectName(),
-      }}
-      onMouseEnter={() => props.onHighlight()}
-      onMouseDown={(event) => {
-        if (event.button === 1) event.preventDefault()
-      }}
-      onClick={(event) => props.onSelect(props.record.session, { background: isBackgroundOpen(event) })}
-      onAuxClick={(event) => {
-        if (!isBackgroundOpen(event)) return
-        event.preventDefault()
-        props.onSelect(props.record.session, { background: true })
-      }}
-    >
-      <HomeSessionLeading
-        project={props.record.project}
-        session={props.record.session}
-        server={props.server}
-        revealProjectOnHover={!!showProjectName()}
-      />
-      <div class="flex min-w-0 flex-1 items-center gap-1.5">
-        <span
-          class={`${HOME_SEARCH_RESULT_TITLE} ${showProjectName() ? "max-w-[min(70%,480px)] flex-[0_1_auto]" : "flex-[1_1_auto]"}`}
-        >
-          {title()}
-        </span>
-        <Show when={showProjectName()}>
-          <span class={HOME_SEARCH_RESULT_META}>{props.record.projectName}</span>
-        </Show>
-      </div>
-    </button>
-  )
-}
-
-function HomeSessionGroupHeader(props: {
-  title: string
-  titleOpacity: number
-  ref: ComponentProps<"div">["ref"]
-  elevated?: boolean
-}) {
-  return (
-    <div
-      ref={props.ref}
-      class={`pointer-events-none sticky top-[84px] lg:top-[108px] flex h-7 min-w-0 items-center justify-between pl-3 bg-v2-background-bg-base ${props.elevated ? "home-session-group-header z-[5]" : "z-10"}`}
-    >
-      <div class={HOME_SECTION_LABEL} style={{ opacity: props.titleOpacity }}>
-        {props.title}
-      </div>
-    </div>
-  )
-}
-
-function HomeSessionRow(props: {
-  record: HomeSessionRecord
-  showProjectName: boolean
-  server: ServerConnection.Key
-  openSession: (session: Session, options?: OpenSessionOptions) => void
-  archiveSession: (session: Session) => Promise<void>
-}) {
-  const language = useLanguage()
-  const title = createMemo(() => sessionTitle(props.record.session.title) || props.record.session.id)
-  const showProjectName = () => props.showProjectName && props.record.projectName
-
-  return (
-    <div
-      class="group/session relative flex h-10 min-w-0 items-center rounded-[6px]"
-      classList={{ group: !!showProjectName() }}
-    >
-      <button
-        type="button"
-        data-component="home-session-row"
-        class={`${HOME_ROW} h-10 min-w-0 flex-1 gap-2 py-3 pl-3 pr-10`}
-        onMouseDown={(event) => {
-          if (event.button === 1) event.preventDefault()
-        }}
-        onClick={(event) => props.openSession(props.record.session, { background: isBackgroundOpen(event) })}
-        onAuxClick={(event) => {
-          if (!isBackgroundOpen(event)) return
-          event.preventDefault()
-          props.openSession(props.record.session, { background: true })
-        }}
-      >
-        <HomeSessionLeading
-          project={props.record.project}
-          session={props.record.session}
-          server={props.server}
-          revealProjectOnHover={!!showProjectName()}
-        />
-        <span
-          class={`min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-v2-text-text-base [font-weight:530] ${showProjectName() ? "max-w-[min(70%,480px)] flex-[0_1_auto]" : "flex-[1_1_auto]"}`}
-        >
-          {title()}
-        </span>
-        <Show when={showProjectName()}>
-          <span class="min-w-0 flex-[1_1_auto] overflow-hidden text-ellipsis whitespace-nowrap text-v2-text-text-muted [font-weight:440]">
-            {props.record.projectName}
-          </span>
-        </Show>
-      </button>
-      <Show when={SHOW_HOME_SESSION_ARCHIVE}>
-        <div class="hover-reveal absolute right-1.5 top-1/2 flex -translate-y-1/2 items-center gap-1 group-hover/session:opacity-100 focus-within:opacity-100">
-          <TooltipV2 class="flex shrink-0 items-center" placement="bottom" value={language.t("common.archive")}>
-            <IconButtonV2
-              data-action="home-session-archive"
-              variant="ghost-muted"
-              size="large"
-              icon={<IconV2 name="archive" />}
-              aria-label={language.t("common.archive")}
-              onClick={(event) => {
-                event.preventDefault()
-                event.stopPropagation()
-                void props.archiveSession(props.record.session)
-              }}
-            />
-          </TooltipV2>
-        </div>
-      </Show>
-    </div>
-  )
-}
-
-function HomeSessionsEmpty(props: { onNewSession?: () => void }) {
-  const language = useLanguage()
-  return (
-    <div class="flex min-h-full flex-col items-center gap-4 px-6 pt-[52px] text-center">
-      <div class="shrink-0 text-[13px] leading-[13px] tracking-[-0.04px] text-v2-text-text-base [font-weight:530]">
-        {language.t("home.sessions.empty")}
-      </div>
-      <p class="mb-1 text-center text-[13px] leading-5 tracking-[-0.04px] text-v2-text-text-muted [font-weight:440]">
-        {language.t("home.sessions.empty.description")}
-      </p>
-      <Show when={props.onNewSession}>
-        {(onNewSession) => (
-          <ButtonV2 data-action="home-new-session" variant="neutral" size="normal" icon="edit" onClick={onNewSession()}>
-            {language.t("command.session.new")}
-          </ButtonV2>
-        )}
-      </Show>
-    </div>
-  )
-}
-
-function HomeSessionSkeleton(props: { label: string }) {
-  return (
-    <div class="flex min-w-0 flex-col gap-4">
-      <div class="flex h-7 min-w-0 items-center justify-between px-4">
-        <div class={HOME_SECTION_LABEL}>{props.label}</div>
-      </div>
-      <div class="flex min-w-0 flex-col gap-px" aria-hidden="true">
-        <For each={[0, 1, 2, 3]}>{() => <div class="h-10 rounded-[6px] bg-v2-background-bg-deep opacity-70" />}</For>
-      </div>
-    </div>
-  )
-}
-
-function groupSessions(records: HomeSessionRecord[], language: ReturnType<typeof useLanguage>): HomeSessionGroup[] {
-  const now = DateTime.local()
-  const yesterday = now.minus({ days: 1 })
-  const todaySessions = records.filter((record) =>
-    DateTime.fromMillis(record.session.time.updated ?? record.session.time.created).hasSame(now, "day"),
-  )
-  const yesterdaySessions = records.filter((record) =>
-    DateTime.fromMillis(record.session.time.updated ?? record.session.time.created).hasSame(yesterday, "day"),
-  )
-  const olderSessions = records.filter((record) => {
-    const time = DateTime.fromMillis(record.session.time.updated ?? record.session.time.created)
-    return !time.hasSame(now, "day") && !time.hasSame(yesterday, "day")
-  })
-  const olderTitle =
-    todaySessions.length === 0 && yesterdaySessions.length === 0
-      ? language.t("sidebar.project.recentSessions")
-      : language.t("home.sessions.group.older")
-
-  return [
-    { id: "today" as const, title: language.t("home.sessions.group.today"), sessions: todaySessions },
-    { id: "yesterday" as const, title: language.t("home.sessions.group.yesterday"), sessions: yesterdaySessions },
-    { id: "older" as const, title: olderTitle, sessions: olderSessions },
-  ].filter((group) => group.sessions.length > 0)
-}
-
-export function LegacyHome() {
-  const sync = useServerSync()
-  const platform = usePlatform()
-  const pickDirectory = useDirectoryPicker()
-  const dialog = useDialog()
-  const navigate = useNavigate()
-  const global = useGlobal()
-  const server = useServer()
-  const language = useLanguage()
-  const homedir = createMemo(() => sync().data.path.home)
-  const serverUnreachable = createMemo(() => global.servers.health[server.key]?.healthy === false)
-  const recent = createMemo(() => {
-    return sync()
-      .data.project.slice()
-      .sort((a, b) => (b.time.updated ?? b.time.created) - (a.time.updated ?? a.time.created))
-      .slice(0, 5)
-  })
-
-  const serverDotClass = createMemo(() => {
-    const healthy = global.servers.health[server.key]?.healthy
-    if (healthy === true) return "bg-icon-success-base"
-    if (healthy === false) return "bg-icon-critical-base"
-    return "bg-border-weak-base"
-  })
-
-  function openProject(server: ServerConnection.Any, directory: string) {
-    const serverCtx = global.ensureServerCtx(server)
-    serverCtx.projects.open(directory)
-    serverCtx.projects.touch(directory)
-    navigate(`/${base64Encode(directory)}`)
-  }
-
-  function chooseProject() {
-    if (serverUnreachable()) return
-    const s = server.current
-    if (!s) return
-
-    const resolve = (result: string | string[] | null) => {
-      if (Array.isArray(result)) {
-        for (const directory of result) {
-          openProject(s, directory)
-        }
-      } else if (result) {
-        openProject(s, result)
-      }
-    }
-
-    pickDirectory({
-      server: s,
-      title: language.t("command.project.open"),
-      multiple: true,
-      onSelect: resolve,
-    })
-  }
-
-  return (
-    <div class="mx-auto mt-55 w-full md:w-auto px-4">
-      <Logo class="md:w-xl opacity-12" />
-      <Button
-        size="large"
-        variant="ghost"
-        class="mt-4 mx-auto text-14-regular text-text-weak"
-        onClick={() => dialog.show(() => <DialogSelectServer />)}
+        thumbContainer={scroll.viewport.thumbTrack}
+        thumbHoverTarget={scroll.viewport.hoverTarget}
+        viewportRef={scroll.viewport.setViewport}
+        onScroll={(event) => scroll.viewport.update(event.currentTarget.scrollTop)}
+        onWheel={scroll.viewport.containOuterWheel}
      >
        <div
-          classList={{
-            "size-2 rounded-full": true,
-            [serverDotClass()]: true,
-          }}
-        />
-        {server.name}
-      </Button>
-      <Switch>
-        <Match when={sync().data.project.length > 0}>
-          <div class="mt-20 w-full flex flex-col gap-4">
-            <div class="flex gap-2 items-center justify-between pl-3">
-              <div class="text-14-medium text-text-strong">{language.t("home.recentProjects")}</div>
-              <Button
-                icon="folder-add-left"
-                size="normal"
-                class="pl-2 pr-3"
-                disabled={serverUnreachable()}
-                onClick={chooseProject}
-              >
-                {language.t("command.project.open")}
-              </Button>
-            </div>
-            <ul class="flex flex-col gap-2">
-              <For each={recent()}>
-                {(project) => (
-                  <Button
-                    size="large"
-                    variant="ghost"
-                    class="text-14-mono text-left justify-between px-3"
-                    onClick={() => openProject(server.current!, project.worktree)}
-                  >
-                    {project.worktree.replace(homedir(), "~")}
-                    <div class="text-14-regular text-text-weak">
-                      {DateTime.fromMillis(project.time.updated ?? project.time.created).toRelative()}
-                    </div>
-                  </Button>
-                )}
-              </For>
-            </ul>
-          </div>
-        </Match>
-        <Match when={!sync().ready}>
-          <div class="mt-30 mx-auto flex flex-col items-center gap-3">
-            <div class="text-12-regular text-text-weak">{language.t("common.loading")}</div>
-            <Button class="px-3" disabled={serverUnreachable()} onClick={chooseProject}>
-              {language.t("command.project.open")}
-            </Button>
-          </div>
-        </Match>
-        <Match when={true}>
-          <div class="mt-30 mx-auto flex flex-col items-center gap-3">
-            <Icon name="folder-add-left" size="large" />
-            <div class="flex flex-col gap-1 items-center justify-center">
-              <div class="text-14-medium text-text-strong">{language.t("home.empty.title")}</div>
-              <div class="text-12-regular text-text-weak">{language.t("home.empty.description")}</div>
-            </div>
-            <Button class="px-3 mt-1" disabled={serverUnreachable()} onClick={chooseProject}>
-              {language.t("command.project.open")}
-            </Button>
-          </div>
-        </Match>
-      </Switch>
+          class={`
+            mx-auto grid min-h-full w-full max-w-[1080px] grid-rows-[auto_minmax(0,1fr)_auto] gap-4 px-3
+            lg:grid-cols-[280px_minmax(0,720px)] lg:grid-rows-1 lg:gap-8 lg:px-6
+          `}
+        >
+          <HomeProjects projects={projects} scroll={scroll} />
+          <HomeSessions sessions={sessions} search={search} scroll={scroll} />
+          <HomeUtilityNav
+            class="flex lg:hidden"
+            onOpenSettings={projects.utility.settings}
+            onOpenHelp={projects.utility.help}
+            language={projects.copy.language}
+          />
+        </div>
+      </ScrollView>
    </div>
  )
 }
@@ -0,0 +1,108 @@
+import { useGlobal } from "@/context/global"
+import { type HomeProjectSelection, useLayout } from "@/context/layout"
+import { ServerConnection, useServer } from "@/context/server"
+import { useServerSync } from "@/context/server-sync"
+import { useTabs } from "@/context/tabs"
+import { toggleHomeProjectSelection } from "@/pages/layout/helpers"
+import { createEffect, createMemo } from "solid-js"
+
+export function createHomeController() {
+  const sync = useServerSync()
+  const layout = useLayout()
+  const server = useServer()
+  const global = useGlobal()
+  const tabs = useTabs()
+  const selection = layout.home.selection
+  const focusedServer = createMemo(
+    () => global.servers.list().find((conn) => ServerConnection.key(conn) === selection().server) ?? server.current,
+  )
+  const focusedServerCtx = createMemo(() => {
+    const conn = focusedServer()
+    if (!conn) return undefined
+    return global.ensureServerCtx(conn)
+  })
+  const focusedSync = () => focusedServerCtx()?.sync ?? sync()
+  const projects = createMemo(() => focusedServerCtx()?.projects.list() ?? layout.projects.list())
+  const recentlyClosed = createMemo(
+    () => focusedServerCtx()?.projects.recentlyClosed() ?? layout.projects.recentlyClosed(),
+  )
+  const homedir = createMemo(() => focusedSync().data.path.home ?? "")
+  const selectedProject = createMemo(() => projects().find((project) => project.worktree === selection().directory))
+  const newSessionProject = createMemo(
+    () =>
+      selectedProject() ??
+      projects().find((project) => project.worktree === focusedServerCtx()?.projects.last()) ??
+      projects()[0],
+  )
+
+  createEffect(() => {
+    const list = global.servers.list()
+    if (list.some((conn) => ServerConnection.key(conn) === selection().server)) return
+    const conn = list.find((conn) => ServerConnection.key(conn) === server.key) ?? list[0]
+    if (conn) setSelection({ server: ServerConnection.key(conn) })
+  })
+
+  function setSelection(next: HomeProjectSelection) {
+    layout.home.setSelection(next)
+  }
+
+  function openProjectNewSession(conn: ServerConnection.Any, directory: string) {
+    const ctx = global.ensureServerCtx(conn)
+    ctx.projects.open(directory)
+    ctx.projects.touch(directory)
+    void tabs.newDraft({ server: ServerConnection.key(conn), directory })
+  }
+
+  return {
+    selection: {
+      value: selection,
+      set: setSelection,
+      focusServer: (conn: ServerConnection.Any) => setSelection({ server: ServerConnection.key(conn) }),
+    },
+    server: {
+      list: global.servers.list,
+      health: (conn: ServerConnection.Any) => global.servers.health[ServerConnection.key(conn)],
+      context: (conn: ServerConnection.Any) => global.ensureServerCtx(conn),
+      focused: focusedServer,
+      focusedContext: focusedServerCtx,
+      focusedSync,
+    },
+    project: {
+      list: projects,
+      recentlyClosed,
+      homedir,
+      selected: selectedProject,
+      newSession: newSessionProject,
+      forServer: (conn: ServerConnection.Any) => global.ensureServerCtx(conn).projects.list(),
+      select: (conn: ServerConnection.Any, directory: string) => {
+        const key = ServerConnection.key(conn)
+        if (global.servers.health[key]?.healthy === false) return
+        if (
+          !global
+            .ensureServerCtx(conn)
+            .projects.list()
+            .some((project) => project.worktree === directory)
+        )
+          return
+        setSelection(toggleHomeProjectSelection(selection(), key, directory))
+      },
+      add: (conn: ServerConnection.Any, directories: string[]) => {
+        const directory = directories[0]
+        if (!directory) return
+        const ctx = global.ensureServerCtx(conn)
+        directories.forEach((item) => ctx.projects.open(item))
+        ctx.projects.touch(directory)
+        setSelection({ server: ServerConnection.key(conn), directory })
+      },
+      openNewSession: () => {
+        const conn = focusedServer()
+        const project = newSessionProject()
+        if (!conn || !project) return
+        openProjectNewSession(conn, project.worktree)
+      },
+      openProjectNewSession,
+    },
+  }
+}
+
+export type HomeController = ReturnType<typeof createHomeController>
@@ -0,0 +1,128 @@
+import { useDirectoryPicker } from "@/components/directory-picker"
+import { useServerManagementController } from "@/components/dialog-select-server"
+import { useSettingsCommand } from "@/components/settings-dialog"
+import { DialogServerV2 } from "@/components/settings-v2/dialog-server-v2"
+import { type LocalProject } from "@/context/layout"
+import { useLanguage } from "@/context/language"
+import { useNotification } from "@/context/notification"
+import { usePlatform } from "@/context/platform"
+import { ServerConnection } from "@/context/server"
+import { closeHomeProject, errorMessage, homeProjectDirectories } from "@/pages/layout/helpers"
+import { Persist, persisted } from "@/utils/persist"
+import { showToast } from "@/utils/toast"
+import { useDialog } from "@opencode-ai/ui/context/dialog"
+import { createResource } from "solid-js"
+import { createStore } from "solid-js/store"
+import type { HomeController } from "./home-controller"
+
+export function createHomeProjectsController(home: HomeController) {
+  const platform = usePlatform()
+  const pickDirectory = useDirectoryPicker()
+  const dialog = useDialog()
+  const language = useLanguage()
+  const notification = useNotification()
+  const openSettings = useSettingsCommand()
+  const serverManagement = useServerManagementController({ navigateOnAdd: false })
+  const [_state, setState, _, ready] = persisted(
+    Persist.global("home.servers", ["home.servers.v1"]),
+    createStore({ collapsed: {} as Record<string, boolean> }),
+  )
+  const [state] = createResource(
+    () => ready.promise ?? Promise.resolve(),
+    (promise) => promise.then(() => _state),
+    { initialValue: _state },
+  )
+  function directories(project: LocalProject) {
+    return [project.worktree, ...(project.sandboxes ?? [])]
+  }
+
+  function canRevealProject(conn: ServerConnection.Any) {
+    return platform.platform === "desktop" && !!platform.openPath && ServerConnection.local(conn)
+  }
+
+  return {
+    copy: {
+      language,
+    },
+    selection: {
+      value: home.selection.value,
+    },
+    server: {
+      list: home.server.list,
+      health: home.server.health,
+      projects: home.project.forServer,
+      collapsed: (conn: ServerConnection.Any) => state().collapsed[ServerConnection.key(conn)] ?? false,
+      toggleCollapsed: (conn: ServerConnection.Any) => {
+        const key = ServerConnection.key(conn)
+        setState("collapsed", key, !state().collapsed[key])
+      },
+      canDefault: serverManagement.canDefault,
+      defaultKey: serverManagement.defaultKey,
+      setDefault: (conn: ServerConnection.Any | undefined) =>
+        serverManagement.setDefault(conn ? ServerConnection.key(conn) : null),
+      remove: (conn: ServerConnection.Any) => serverManagement.handleRemove(ServerConnection.key(conn)),
+      edit: (conn: ServerConnection.Http) => dialog.show(() => <DialogServerV2 mode="edit" server={conn} />),
+      focus: home.selection.focusServer,
+    },
+    project: {
+      list: home.project.list,
+      recentlyClosed: home.project.recentlyClosed,
+      homedir: home.project.homedir,
+      select: home.project.select,
+      add: home.project.add,
+      openNewSession: home.project.openProjectNewSession,
+      edit: (conn: ServerConnection.Any, project: LocalProject) => {
+        void import("@/components/dialog-edit-project-v2").then(({ DialogEditProjectV2 }) => {
+          void dialog.show(() => <DialogEditProjectV2 server={conn} project={project} />)
+        })
+      },
+      unseenCount: (conn: ServerConnection.Any, project: LocalProject) => {
+        const state = notification.ensureServerState(ServerConnection.key(conn))
+        return directories(project).reduce((total, directory) => total + state.project.unseenCount(directory), 0)
+      },
+      clearNotifications: (conn: ServerConnection.Any, project: LocalProject) => {
+        const state = notification.ensureServerState(ServerConnection.key(conn))
+        directories(project)
+          .filter((directory) => state.project.unseenCount(directory) > 0)
+          .forEach((directory) => state.project.markViewed(directory))
+      },
+      choose: (conn: ServerConnection.Any) => {
+        if (home.server.health(conn)?.healthy === false) return
+        pickDirectory({
+          server: conn,
+          title: language.t("command.project.open"),
+          multiple: true,
+          onSelect: (result) => home.project.add(conn, homeProjectDirectories(result)),
+        })
+      },
+      close: (conn: ServerConnection.Any, directory: string) => {
+        const next = closeHomeProject(
+          home.selection.value(),
+          ServerConnection.key(conn),
+          home.server.context(conn).projects,
+          directory,
+        )
+        if (next) home.selection.set(next)
+      },
+      move: (conn: ServerConnection.Any, worktree: string, index: number) => {
+        home.server.context(conn).projects.move(worktree, index)
+      },
+      canReveal: canRevealProject,
+      reveal: (conn: ServerConnection.Any, project: LocalProject) => {
+        if (!platform.openPath || !canRevealProject(conn)) return
+        platform.openPath(project.worktree).catch((cause: unknown) =>
+          showToast({
+            title: language.t("common.requestFailed"),
+            description: errorMessage(cause, language.t("common.requestFailed")),
+          }),
+        )
+      },
+    },
+    utility: {
+      settings: openSettings,
+      help: () => platform.openLink("https://opencode.ai/desktop-feedback"),
+    },
+  }
+}
+
+export type HomeProjectsController = ReturnType<typeof createHomeProjectsController>
@@ -0,0 +1,615 @@
+import { type Accessor, createMemo, For, type JSX, onCleanup, Show, splitProps } from "solid-js"
+import { createStore } from "solid-js/store"
+import { DragDropProvider, PointerSensor } from "@dnd-kit/solid"
+import { isSortable, useSortable } from "@dnd-kit/solid/sortable"
+import { AutoScroller, Feedback, PointerActivationConstraints } from "@dnd-kit/dom"
+import { RestrictToVerticalAxis } from "@dnd-kit/abstract/modifiers"
+import { RestrictToElement } from "@dnd-kit/dom/modifiers"
+import { ScrollView } from "@opencode-ai/ui/scroll-view"
+import { ProjectAvatar } from "@opencode-ai/ui/v2/project-avatar-v2"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
+import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
+import { MenuV2 } from "@opencode-ai/ui/v2/menu-v2"
+import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
+import { getProjectAvatarVariant, type HomeProjectSelection, type LocalProject } from "@/context/layout"
+import { ServerConnection } from "@/context/server"
+import { useLanguage } from "@/context/language"
+import { usePlatform } from "@/context/platform"
+import { displayName, getProjectAvatarSource } from "@/pages/layout/helpers"
+import { ServerRowMenuView, serverMenuLabels } from "@/components/server/server-row-menu"
+import { ServerHealthIndicator } from "@/components/server/server-row"
+import { type ServerHealth } from "@/utils/server-health"
+import { fileManagerApp } from "@/utils/file-manager"
+
+const HOME_PROJECT_NAV_LABEL = "min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap"
+
+const serverContextMenuID = (server: ServerConnection.Any) => `server:${ServerConnection.key(server)}`
+const projectContextMenuID = (server: ServerConnection.Any, directory: string) =>
+  `project:${ServerConnection.key(server)}:${directory}`
+
+export type HomeProjectsViewProps = {
+  language: ReturnType<typeof useLanguage>
+  servers: Accessor<ServerConnection.Any[]>
+  projects: Accessor<LocalProject[]>
+  recentlyClosed: Accessor<LocalProject[]>
+  selection: Accessor<HomeProjectSelection>
+  homedir: Accessor<string>
+  serverHealth: (server: ServerConnection.Any) => ServerHealth | undefined
+  projectsForServer: (server: ServerConnection.Any) => LocalProject[]
+  collapsed: (server: ServerConnection.Any) => boolean
+  canDefaultServer: Accessor<boolean>
+  defaultServerKey: Accessor<ServerConnection.Key | null | undefined>
+  canRevealProject: (server: ServerConnection.Any) => boolean
+  unseenCount: (server: ServerConnection.Any, project: LocalProject) => number
+  onWheel: (event: WheelEvent) => void
+  onChooseProject: (server: ServerConnection.Any) => void
+  onFocusServer: (server: ServerConnection.Any) => void
+  onToggleCollapsed: (server: ServerConnection.Any) => void
+  onEditServer: (server: ServerConnection.Http) => void
+  onSetDefaultServer: (server: ServerConnection.Any | undefined) => void
+  onRemoveServer: (server: ServerConnection.Any) => void
+  onMoveProject: (server: ServerConnection.Any, worktree: string, index: number) => void
+  onSelectProject: (server: ServerConnection.Any, directory: string) => void
+  onAddProjects: (server: ServerConnection.Any, directories: string[]) => void
+  onOpenProjectNewSession: (server: ServerConnection.Any, directory: string) => void
+  onEditProject: (server: ServerConnection.Any, project: LocalProject) => void
+  onRevealProject: (server: ServerConnection.Any, project: LocalProject) => void
+  onClearNotifications: (server: ServerConnection.Any, project: LocalProject) => void
+  onCloseProject: (server: ServerConnection.Any, directory: string) => void
+  onOpenSettings: () => void
+  onOpenHelp: () => void
+}
+
+export function HomeProjectsView(props: HomeProjectsViewProps) {
+  const [contextMenu, setContextMenu] = createStore({ open: undefined as string | undefined })
+  const contextMenuProps = {
+    contextMenuOpen: (id: string) => contextMenu.open === id,
+    onSetContextMenuOpen: (id: string, open: boolean) => setContextMenu("open", open ? id : undefined),
+  }
+  return (
+    <aside
+      class={`
+        mt-6 flex min-h-0 min-w-0 flex-col gap-4 overflow-hidden
+        lg:sticky lg:top-14 lg:mt-14 lg:h-[calc(100cqh-56px)] lg:self-start lg:pt-[52px]
+      `}
+      aria-label={props.language.t("home.projects")}
+      onWheel={(event) => {
+        if (event.target === event.currentTarget) return
+        props.onWheel(event)
+      }}
+    >
+      <div class="flex h-7 min-w-0 shrink-0 items-center justify-between pl-1.5 pr-3">
+        <div class="text-v2-text-text-muted [font-weight:530]">{props.language.t("home.projects")}</div>
+        <Show
+          when={props.servers().length === 1 && !(props.projects().length === 0 && props.recentlyClosed().length > 0)}
+        >
+          <TooltipV2 placement="bottom" value={props.language.t("home.project.add")}>
+            <IconButtonV2
+              data-action="home-add-project"
+              variant="ghost-muted"
+              size="large"
+              class="titlebar-icon [&_[data-slot=icon-svg]]:text-v2-icon-icon-muted"
+              icon={<IconV2 name="folder-add-left" />}
+              disabled={props.serverHealth(props.servers()[0])?.healthy === false}
+              onClick={() => props.onChooseProject(props.servers()[0])}
+              aria-label={props.language.t("home.project.add")}
+            />
+          </TooltipV2>
+        </Show>
+      </div>
+      <ScrollView data-slot="home-projects-scroll" class="min-h-0 min-w-0 shrink">
+        <Show
+          when={props.servers().length > 1}
+          fallback={
+            <div class="pr-3">
+              <Show
+                when={props.projects().length > 0}
+                fallback={<HomeProjectEmpty {...props} server={props.servers()[0]} items={props.recentlyClosed()} />}
+              >
+                <HomeProjectList
+                  {...props}
+                  {...contextMenuProps}
+                  server={props.servers()[0]}
+                  items={props.projects()}
+                />
+              </Show>
+            </div>
+          }
+        >
+          <div class="flex min-w-0 flex-col gap-4 pr-3">
+            <For each={props.servers()}>
+              {(item) => {
+                const projects = () => props.projectsForServer(item)
+                const healthy = () => !!props.serverHealth(item)?.healthy
+                const hasProjects = () => projects().length > 0
+                const collapsed = () => props.collapsed(item)
+                return (
+                  <div class="flex min-w-0 flex-col gap-1">
+                    <HomeServerRow
+                      server={item}
+                      {...props}
+                      {...contextMenuProps}
+                      selected={props.selection().server === ServerConnection.key(item) && !props.selection().directory}
+                      collapsed={collapsed()}
+                      health={props.serverHealth(item)}
+                    />
+                    <Show when={healthy() && hasProjects() && !collapsed()}>
+                      <div class="mx-3 h-px bg-v2-border-border-base" />
+                      <HomeProjectList {...props} {...contextMenuProps} server={item} items={projects()} />
+                    </Show>
+                  </div>
+                )
+              }}
+            </For>
+          </div>
+        </Show>
+      </ScrollView>
+      <HomeUtilityNav
+        class="mb-8 mt-4 hidden shrink-0 lg:flex"
+        onOpenSettings={props.onOpenSettings}
+        onOpenHelp={props.onOpenHelp}
+        language={props.language}
+      />
+    </aside>
+  )
+}
+
+export function HomeUtilityNav(props: {
+  class?: string
+  onOpenSettings: () => void
+  onOpenHelp: () => void
+  language: ReturnType<typeof useLanguage>
+}) {
+  return (
+    <div class={`${props.class ?? ""} min-w-0 flex-col gap-1 pr-3`}>
+      <HomeProjectNavButton
+        type="button"
+        class="text-v2-text-text-faint [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted"
+        onClick={props.onOpenSettings}
+      >
+        <IconV2 name="settings-gear" size="small" />
+        <span class={HOME_PROJECT_NAV_LABEL}>{props.language.t("sidebar.settings")}</span>
+      </HomeProjectNavButton>
+      <HomeProjectNavButton
+        type="button"
+        class="text-v2-text-text-faint [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted"
+        onClick={props.onOpenHelp}
+      >
+        <IconV2 name="help" size="small" />
+        <span class={HOME_PROJECT_NAV_LABEL}>{props.language.t("sidebar.help")}</span>
+      </HomeProjectNavButton>
+    </div>
+  )
+}
+
+function HomeServerRow(props: {
+  language: HomeProjectsViewProps["language"]
+  projectsForServer: HomeProjectsViewProps["projectsForServer"]
+  contextMenuOpen: HomeProjectsContextMenuProps["contextMenuOpen"]
+  canDefaultServer: HomeProjectsViewProps["canDefaultServer"]
+  defaultServerKey: HomeProjectsViewProps["defaultServerKey"]
+  onFocusServer: HomeProjectsViewProps["onFocusServer"]
+  onToggleCollapsed: HomeProjectsViewProps["onToggleCollapsed"]
+  onEditServer: HomeProjectsViewProps["onEditServer"]
+  onSetDefaultServer: HomeProjectsViewProps["onSetDefaultServer"]
+  onRemoveServer: HomeProjectsViewProps["onRemoveServer"]
+  onSetContextMenuOpen: HomeProjectsContextMenuProps["onSetContextMenuOpen"]
+  onChooseProject: HomeProjectsViewProps["onChooseProject"]
+  server: ServerConnection.Any
+  selected: boolean
+  collapsed: boolean
+  health: ServerHealth | undefined
+}) {
+  const healthy = () => !!props.health?.healthy
+  const canToggle = () => healthy() && props.projectsForServer(props.server).length > 0
+  const contextMenuID = () => serverContextMenuID(props.server)
+  onCleanup(() => {
+    const id = contextMenuID()
+    if (props.contextMenuOpen(id)) props.onSetContextMenuOpen(id, false)
+  })
+  return (
+    <div class="group/server relative flex h-7 min-w-0 items-center rounded-[6px]">
+      <HomeProjectNavButton
+        type="button"
+        class="pr-16 disabled:opacity-60"
+        data-selected={props.selected ? "" : undefined}
+        disabled={!healthy()}
+        onClick={() => props.onFocusServer(props.server)}
+      >
+        <span
+          data-action="home-server-collapse"
+          class={`
+            -ml-0.5 -mr-1.5 inline-flex size-5 shrink-0 items-center justify-center
+            rounded-[4px] text-v2-icon-icon-muted
+          `}
+          classList={{
+            "hover:bg-v2-overlay-simple-overlay-hover": canToggle(),
+            "cursor-default opacity-40": !canToggle(),
+          }}
+          aria-label={
+            props.collapsed ? props.language.t("home.server.expand") : props.language.t("home.server.collapse")
+          }
+          aria-disabled={!canToggle()}
+          aria-expanded={canToggle() ? !props.collapsed : undefined}
+          onClick={(event) => {
+            event.preventDefault()
+            event.stopPropagation()
+            if (!canToggle()) return
+            props.onToggleCollapsed(props.server)
+          }}
+          onPointerDown={(event) => event.preventDefault()}
+        >
+          <IconV2
+            name="chevron-down"
+            size="small"
+            class="transition-transform duration-150 ease-in-out"
+            style={{ transform: `rotate(${props.collapsed ? -90 : 0}deg)` }}
+          />
+        </span>
+        <div class="flex size-4 shrink-0 items-center justify-center -mr-0.5">
+          <ServerHealthIndicator health={props.health} />
+        </div>
+        <span class="flex min-w-0 items-center gap-1">
+          <span class={HOME_PROJECT_NAV_LABEL}>{props.server.displayName ?? new URL(props.server.http.url).host}</span>
+          <Show when={props.server.label}>
+            {(label) => (
+              <span
+                class={`
+                  shrink-0 rounded-[3px] border border-v2-border-border-base px-1 py-0.5
+                  text-[9px] leading-none text-v2-text-text-muted
+                `}
+              >
+                {label()}
+              </span>
+            )}
+          </Show>
+        </span>
+      </HomeProjectNavButton>
+      <div
+        class={`
+          hover-reveal absolute right-1 top-1/2 flex -translate-y-1/2 items-center gap-1
+          group-hover/server:opacity-100 focus-within:opacity-100 data-[menu=true]:opacity-100
+        `}
+        data-menu={props.contextMenuOpen(contextMenuID())}
+      >
+        <ServerRowMenuView
+          server={props.server}
+          labels={serverMenuLabels(props.language)}
+          canDefault={props.canDefaultServer()}
+          isDefault={props.defaultServerKey() === ServerConnection.key(props.server)}
+          onEdit={props.onEditServer}
+          onSetDefault={() => props.onSetDefaultServer(props.server)}
+          onRemoveDefault={() => props.onSetDefaultServer(undefined)}
+          onRemove={() => props.onRemoveServer(props.server)}
+          open={props.contextMenuOpen(contextMenuID())}
+          onOpenChange={(open) => props.onSetContextMenuOpen(contextMenuID(), open)}
+        />
+        <TooltipV2 class="flex shrink-0 items-center" placement="bottom" value={props.language.t("home.project.add")}>
+          <IconButtonV2
+            data-action="home-add-project"
+            variant="ghost-muted"
+            size="small"
+            icon={<IconV2 name="folder-add-left" />}
+            aria-label={props.language.t("home.project.add")}
+            disabled={props.health?.healthy === false}
+            onClick={() => props.onChooseProject(props.server)}
+          />
+        </TooltipV2>
+      </div>
+    </div>
+  )
+}
+
+type HomeProjectsContextMenuProps = {
+  contextMenuOpen: (id: string) => boolean
+  onSetContextMenuOpen: (id: string, open: boolean) => void
+}
+
+type HomeProjectListProps = HomeProjectsViewProps &
+  HomeProjectsContextMenuProps & {
+    server: ServerConnection.Any
+    items: LocalProject[]
+  }
+
+function HomeProjectList(props: HomeProjectListProps) {
+  let listRef!: HTMLDivElement
+
+  return (
+    <DragDropProvider
+      sensors={(defaults) => [
+        ...defaults.filter((sensor) => sensor !== PointerSensor),
+        PointerSensor.configure({
+          activationConstraints: (event) =>
+            event.pointerType === "touch"
+              ? [new PointerActivationConstraints.Delay({ value: 250, tolerance: 5 })]
+              : [new PointerActivationConstraints.Distance({ value: 4 })],
+          preventActivation: (event) => event.target instanceof Element && !!event.target.closest("[data-action]"),
+        }),
+      ]}
+      modifiers={[RestrictToVerticalAxis, RestrictToElement.configure({ element: () => listRef })]}
+      plugins={(defaults) => [
+        ...defaults.filter((plugin) => plugin !== AutoScroller && plugin !== Feedback),
+        AutoScroller.configure({ acceleration: 8, threshold: { x: 0, y: 0.05 } }),
+        Feedback.configure({ dropAnimation: null }),
+      ]}
+      onDragEnd={(event) => {
+        const source = event.operation.source
+        if (event.canceled || !isSortable(source)) return
+        if (source.initialIndex !== source.index) props.onMoveProject(props.server, source.id.toString(), source.index)
+        if (props.selection().server !== ServerConnection.key(props.server))
+          props.onSelectProject(props.server, source.id.toString())
+      }}
+    >
+      <div class="flex min-w-0 flex-col gap-1" ref={listRef}>
+        {/* Keyed on worktree strings: the enriched project objects are
+            recreated on every store or sync update, so iterating them directly
+            remounts all rows — killing any in-flight drag activation (the
+            row's sortable unregisters on unmount) and discarding animations.
+            String keys keep row elements alive and move them on reorder. */}
+        <For each={props.items.map((project) => project.worktree)}>
+          {(worktree, index) => <HomeProjectSlot {...props} worktree={worktree} index={index} />}
+        </For>
+      </div>
+    </DragDropProvider>
+  )
+}
+
+function HomeProjectSlot(
+  props: HomeProjectListProps & {
+    worktree: string
+    index: () => number
+  },
+) {
+  const project = createMemo(() => props.items.find((item) => item.worktree === props.worktree))
+
+  return (
+    <Show when={project()}>
+      {(item) => (
+        <HomeProjectRow
+          {...props}
+          project={item()}
+          server={props.server}
+          index={props.index}
+          serverSelected={props.selection().server === ServerConnection.key(props.server)}
+          selected={
+            props.selection().server === ServerConnection.key(props.server) &&
+            props.selection().directory === props.worktree
+          }
+          unseen={props.unseenCount(props.server, item())}
+        />
+      )}
+    </Show>
+  )
+}
+
+function HomeProjectEmpty(
+  props: HomeProjectsViewProps & {
+    server: ServerConnection.Any
+    items: LocalProject[]
+  },
+) {
+  const unreachable = () => props.serverHealth(props.server)?.healthy === false
+  return (
+    <div class="flex min-w-0 flex-col gap-1">
+      <HomeProjectNavButton
+        type="button"
+        data-action="home-add-project-row"
+        class="disabled:opacity-60 [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted"
+        disabled={unreachable()}
+        onClick={() => props.onChooseProject(props.server)}
+      >
+        <IconV2 name="folder-add-left" size="small" />
+        <span class={HOME_PROJECT_NAV_LABEL}>{props.language.t("home.project.add")}</span>
+      </HomeProjectNavButton>
+      <Show when={props.items.length > 0}>
+        <div class="mt-3 flex h-7 min-w-0 shrink-0 items-center pl-1.5 pr-3">
+          <div class="text-v2-text-text-faint [font-weight:530]">{props.language.t("home.recentlyClosed")}</div>
+        </div>
+        <For each={props.items}>
+          {(project) => <HomeRecentlyClosedRow {...props} project={project} server={props.server} />}
+        </For>
+      </Show>
+    </div>
+  )
+}
+
+function HomeRecentlyClosedRow(
+  props: HomeProjectsViewProps & {
+    project: LocalProject
+    server: ServerConnection.Any
+  },
+) {
+  const unreachable = () => props.serverHealth(props.server)?.healthy === false
+  const path = () => {
+    const home = props.homedir()
+    const worktree = props.project.worktree
+    if (home && (worktree === home || worktree.startsWith(`${home}/`))) return `~${worktree.slice(home.length)}`
+    return worktree
+  }
+  return (
+    <TooltipV2 placement="right" value={path()}>
+      <HomeProjectNavButton
+        type="button"
+        data-component="home-recently-closed-row"
+        class="disabled:opacity-60"
+        disabled={unreachable()}
+        onClick={() => props.onAddProjects(props.server, [props.project.worktree])}
+      >
+        <HomeProjectAvatar project={props.project} outline />
+        <span class={HOME_PROJECT_NAV_LABEL}>{displayName(props.project)}</span>
+      </HomeProjectNavButton>
+    </TooltipV2>
+  )
+}
+
+function HomeProjectRow(
+  props: HomeProjectsViewProps &
+    HomeProjectsContextMenuProps & {
+      project: LocalProject
+      server: ServerConnection.Any
+      index: () => number
+      serverSelected: boolean
+      selected: boolean
+      unseen: number
+    },
+) {
+  const platform = usePlatform()
+  const serverUnreachable = () => props.serverHealth(props.server)?.healthy === false
+  const sortable = useSortable({
+    get id() {
+      return props.project.worktree
+    },
+    get index() {
+      return props.index()
+    },
+  })
+  let pointerDownSelected: boolean | undefined
+  const contextMenuID = () => projectContextMenuID(props.server, props.project.worktree)
+  onCleanup(() => {
+    const id = contextMenuID()
+    if (props.contextMenuOpen(id)) props.onSetContextMenuOpen(id, false)
+  })
+  return (
+    <div
+      ref={sortable.ref}
+      class="group/project relative flex h-7 min-w-0 items-center rounded-[6px]"
+      classList={{ "z-10": sortable.isDragSource() }}
+    >
+      <HomeProjectNavButton
+        type="button"
+        data-component="home-project-row"
+        class="pr-16 disabled:opacity-60"
+        classList={{
+          "bg-v2-background-bg-layer-01 text-v2-text-text-base": sortable.isDragSource(),
+          "[box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)]": sortable.isDragSource(),
+        }}
+        data-selected={props.selected ? "" : undefined}
+        aria-current={props.selected ? "page" : undefined}
+        disabled={serverUnreachable()}
+        onPointerDown={(event) => {
+          // Same-server mouse selection happens on pointerdown (like tabs),
+          // but only ever selects; selectProject toggles, and deselecting here
+          // would fire on every drag before the threshold is met. Cross-server
+          // selection waits for click so reordering a remote server's projects
+          // does not focus that server and load its session index. Touch is
+          // excluded so flick-scrolling the list cannot select rows.
+          pointerDownSelected = undefined
+          if (event.button !== 0 || event.pointerType === "touch") return
+          if (!props.serverSelected) return
+          pointerDownSelected = props.selected
+          if (!props.selected) props.onSelectProject(props.server, props.project.worktree)
+        }}
+        onClick={(event) => {
+          // The drag sensor calls preventDefault on post-drag clicks; never
+          // toggle selection as part of a reorder.
+          if (event.defaultPrevented) return
+          // Keyboard activation and touch taps keep the original toggle.
+          if (event.detail === 0 || pointerDownSelected === undefined) {
+            props.onSelectProject(props.server, props.project.worktree)
+            return
+          }
+          // Mouse: pointerdown already selected unselected rows; a plain click
+          // on an already-selected row toggles it off.
+          if (pointerDownSelected) props.onSelectProject(props.server, props.project.worktree)
+          pointerDownSelected = undefined
+        }}
+      >
+        <HomeProjectAvatar project={props.project} />
+        <span class={HOME_PROJECT_NAV_LABEL}>{displayName(props.project)}</span>
+      </HomeProjectNavButton>
+      <div
+        class={`
+          hover-reveal absolute right-1 top-1/2 flex -translate-y-1/2 items-center gap-1
+          group-hover/project:opacity-100 focus-within:opacity-100 data-[menu=true]:opacity-100
+        `}
+        data-menu={props.contextMenuOpen(contextMenuID())}
+      >
+        <MenuV2
+          gutter={6}
+          modal={false}
+          placement="bottom-end"
+          open={props.contextMenuOpen(contextMenuID())}
+          onOpenChange={(open) => props.onSetContextMenuOpen(contextMenuID(), open)}
+        >
+          <MenuV2.Trigger
+            as={IconButtonV2}
+            data-action="home-project-menu"
+            variant="ghost-muted"
+            size="small"
+            icon={<IconV2 name="outline-dots" />}
+            aria-label={props.language.t("common.moreOptions")}
+          />
+          <MenuV2.Portal>
+            <MenuV2.Content>
+              <MenuV2.Item onSelect={() => props.onOpenProjectNewSession(props.server, props.project.worktree)}>
+                {props.language.t("command.session.new")}
+              </MenuV2.Item>
+              <MenuV2.Item onSelect={() => props.onEditProject(props.server, props.project)}>
+                {props.language.t("dialog.project.edit.title")}
+              </MenuV2.Item>
+              <Show when={props.canRevealProject(props.server)}>
+                <MenuV2.Item onSelect={() => props.onRevealProject(props.server, props.project)}>
+                  {props.language.t(
+                    fileManagerApp(platform.platform === "desktop" ? (platform.os ?? "unknown") : "unknown")
+                      .actionLabel,
+                  )}
+                </MenuV2.Item>
+              </Show>
+              <MenuV2.Item
+                disabled={props.unseen === 0}
+                onSelect={() => props.onClearNotifications(props.server, props.project)}
+              >
+                {props.language.t("sidebar.project.clearNotifications")}
+              </MenuV2.Item>
+              <MenuV2.Separator />
+              <MenuV2.Item onSelect={() => props.onCloseProject(props.server, props.project.worktree)}>
+                {props.language.t("common.close")}
+              </MenuV2.Item>
+            </MenuV2.Content>
+          </MenuV2.Portal>
+        </MenuV2>
+        <IconButtonV2
+          data-action="home-project-new-session"
+          variant="ghost-muted"
+          size="small"
+          icon={<IconV2 name="edit" />}
+          aria-label={props.language.t("command.session.new")}
+          onClick={() => props.onOpenProjectNewSession(props.server, props.project.worktree)}
+        />
+      </div>
+    </div>
+  )
+}
+
+function HomeProjectNavButton(props: JSX.ButtonHTMLAttributes<HTMLButtonElement>) {
+  const [local, rest] = splitProps(props, ["class", "classList", "children"])
+  return (
+    <button
+      {...rest}
+      class={`
+        flex h-7 min-w-0 w-full shrink-0 cursor-default items-center gap-2 rounded-[6px] bg-transparent px-1.5 text-left
+        text-v2-text-text-muted [font-weight:440] transition-[background-color,color,box-shadow] duration-[120ms] ease-in-out
+        hover:bg-v2-background-bg-layer-01 hover:text-v2-text-text-base hover:[box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)]
+        data-[selected]:bg-v2-background-bg-layer-03 data-[selected]:text-v2-text-text-base
+        data-[selected]:[box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)] data-[selected]:hover:bg-v2-background-bg-layer-03
+        focus-visible:bg-v2-background-bg-layer-01 focus-visible:text-v2-text-text-base focus-visible:outline-none
+        focus-visible:[box-shadow:inset_0_0_0_0.5px_var(--v2-border-border-muted)]
+        ${local.class ?? ""}
+      `}
+      classList={local.classList}
+    >
+      {local.children}
+    </button>
+  )
+}
+
+function HomeProjectAvatar(props: { project: LocalProject; outline?: boolean }) {
+  const name = createMemo(() => displayName(props.project))
+  return (
+    <ProjectAvatar
+      fallback={name()}
+      src={props.outline ? undefined : getProjectAvatarSource(props.project.id, props.project.icon)}
+      variant={props.outline ? "outline" : getProjectAvatarVariant(props.project.icon?.color)}
+    />
+  )
+}
@@ -0,0 +1,40 @@
+import type { HomeProjectsController } from "./home-projects-controller"
+import { HomeProjectsView } from "./home-projects-view"
+import type { HomeScrollController } from "./home-scroll-controller"
+
+export function HomeProjects(props: { projects: HomeProjectsController; scroll: HomeScrollController }) {
+  return (
+    <HomeProjectsView
+      language={props.projects.copy.language}
+      servers={props.projects.server.list}
+      projects={props.projects.project.list}
+      recentlyClosed={props.projects.project.recentlyClosed}
+      selection={props.projects.selection.value}
+      homedir={props.projects.project.homedir}
+      serverHealth={props.projects.server.health}
+      projectsForServer={props.projects.server.projects}
+      collapsed={props.projects.server.collapsed}
+      canDefaultServer={props.projects.server.canDefault}
+      defaultServerKey={props.projects.server.defaultKey}
+      canRevealProject={props.projects.project.canReveal}
+      unseenCount={props.projects.project.unseenCount}
+      onWheel={props.scroll.viewport.containWheel}
+      onChooseProject={props.projects.project.choose}
+      onFocusServer={props.projects.server.focus}
+      onToggleCollapsed={props.projects.server.toggleCollapsed}
+      onEditServer={props.projects.server.edit}
+      onSetDefaultServer={props.projects.server.setDefault}
+      onRemoveServer={props.projects.server.remove}
+      onMoveProject={props.projects.project.move}
+      onSelectProject={props.projects.project.select}
+      onAddProjects={props.projects.project.add}
+      onOpenProjectNewSession={props.projects.project.openNewSession}
+      onEditProject={props.projects.project.edit}
+      onRevealProject={props.projects.project.reveal}
+      onClearNotifications={props.projects.project.clearNotifications}
+      onCloseProject={props.projects.project.close}
+      onOpenSettings={props.projects.utility.settings}
+      onOpenHelp={props.projects.utility.help}
+    />
+  )
+}
@@ -0,0 +1,145 @@
+import { createEffect, createSignal, onCleanup, type Accessor } from "solid-js"
+import { createStore } from "solid-js/store"
+import type { HomeSessionGroup } from "./home-sessions-controller"
+
+const HOME_SESSION_HEADER_STICKY_TOP = 12
+const HOME_SESSION_HEADER_TEXT_HEIGHT = 16
+const HOME_SESSION_HEADER_FADE_DISTANCE = 16
+
+export function createHomeScrollController(groups: Accessor<HomeSessionGroup[]>) {
+  const [thumbTrack, setThumbTrack] = createSignal<HTMLDivElement>()
+  const [hoverTarget, setHoverTarget] = createSignal<HTMLElement>()
+  const [state, setState] = createStore({
+    titleOpacity: {} as Partial<Record<HomeSessionGroup["id"], number>>,
+  })
+  const headerRefs = new Map<HomeSessionGroup["id"], HTMLDivElement>()
+  const headerOffsets = new Map<HomeSessionGroup["id"], number>()
+  let viewport: HTMLDivElement | undefined
+  let content: HTMLDivElement | undefined
+  let positionFrame: number | undefined
+  let resizeObserver: ResizeObserver | undefined
+  let stickyTop = HOME_SESSION_HEADER_STICKY_TOP
+
+  createEffect(() => {
+    const items = groups()
+    const ids = new Set(items.map((group) => group.id))
+    headerRefs.forEach((_, id) => {
+      if (!ids.has(id)) headerRefs.delete(id)
+    })
+    headerOffsets.forEach((_, id) => {
+      if (!ids.has(id)) headerOffsets.delete(id)
+    })
+    if (items.length === 0) {
+      content = undefined
+      bindResizeObserver()
+    }
+    queuePositionUpdate()
+  })
+
+  onCleanup(() => {
+    if (positionFrame !== undefined) cancelAnimationFrame(positionFrame)
+    resizeObserver?.disconnect()
+  })
+
+  function queuePositionUpdate() {
+    if (typeof requestAnimationFrame === "undefined") {
+      updatePositionCache()
+      return
+    }
+    if (positionFrame !== undefined) return
+    positionFrame = requestAnimationFrame(() => {
+      positionFrame = undefined
+      updatePositionCache()
+    })
+  }
+
+  function updatePositionCache() {
+    if (!viewport) return
+    const header = groups()
+      .map((group) => headerRefs.get(group.id))
+      .find((element) => element !== undefined)
+    if (header && typeof getComputedStyle === "function") {
+      const top = Number.parseFloat(getComputedStyle(header).top)
+      if (Number.isFinite(top)) stickyTop = top
+    }
+    groups().forEach((group) => {
+      const element = headerRefs.get(group.id)
+      if (element) headerOffsets.set(group.id, element.offsetTop)
+    })
+    update(viewport.scrollTop)
+  }
+
+  function update(scrollTop: number) {
+    const items = groups()
+    items.forEach((group, index) => {
+      const nextOffset = items
+        .slice(index + 1)
+        .map((item) => headerOffsets.get(item.id))
+        .find((offset) => offset !== undefined)
+      const fadeEnd = stickyTop + HOME_SESSION_HEADER_TEXT_HEIGHT
+      const nextTop = nextOffset === undefined ? undefined : nextOffset - scrollTop
+      const opacity =
+        nextTop === undefined ? 1 : Math.max(0, Math.min(1, (nextTop - fadeEnd) / HOME_SESSION_HEADER_FADE_DISTANCE))
+      setState("titleOpacity", group.id, Math.round(opacity * 1000) / 1000)
+    })
+  }
+
+  function bindResizeObserver() {
+    resizeObserver?.disconnect()
+    if (typeof ResizeObserver === "undefined") return
+    resizeObserver = new ResizeObserver(queuePositionUpdate)
+    if (viewport) resizeObserver.observe(viewport)
+    if (content) resizeObserver.observe(content)
+  }
+
+  function containWheel(event: WheelEvent) {
+    if (!viewport) return
+    if (event.defaultPrevented || event.ctrlKey || !event.deltaY) return
+    if (!(event.target instanceof Element)) return
+    const scrollable = event.target.closest<HTMLElement>("[data-scrollable]")
+    if (
+      scrollable !== viewport &&
+      scrollable &&
+      (event.deltaY < 0
+        ? scrollable.scrollTop > 0
+        : scrollable.scrollTop < scrollable.scrollHeight - scrollable.clientHeight)
+    )
+      return
+    event.preventDefault()
+  }
+
+  return {
+    viewport: {
+      thumbTrack,
+      hoverTarget,
+      setThumbTrack,
+      setHoverTarget,
+      setViewport: (element: HTMLDivElement) => {
+        viewport = element
+        bindResizeObserver()
+        queuePositionUpdate()
+      },
+      update,
+      containWheel,
+      containOuterWheel: (event: WheelEvent) => {
+        if (!viewport) return
+        if (event.target instanceof Node && viewport.contains(event.target)) return
+        containWheel(event)
+      },
+    },
+    header: {
+      setContent: (element: HTMLDivElement) => {
+        content = element
+        bindResizeObserver()
+        queuePositionUpdate()
+      },
+      setHeader: (id: HomeSessionGroup["id"], element: HTMLDivElement) => {
+        headerRefs.set(id, element)
+        queuePositionUpdate()
+      },
+      titleOpacity: (id: HomeSessionGroup["id"]) => state.titleOpacity[id] ?? 1,
+    },
+  }
+}
+
+export type HomeScrollController = ReturnType<typeof createHomeScrollController>
@@ -0,0 +1,114 @@
+import { useCommand } from "@/context/command"
+import { useLanguage } from "@/context/language"
+import { serverName } from "@/context/server"
+import { displayName } from "@/pages/layout/helpers"
+import { makeEventListener } from "@solid-primitives/event-listener"
+import { createMemo, onCleanup } from "solid-js"
+import { createStore } from "solid-js/store"
+import type { HomeController } from "./home-controller"
+import { homeSessionSearchKey, type HomeSessionRecord, type HomeSessionsController } from "./home-sessions-controller"
+
+type HomeSessionSearchSource = Pick<HomeSessionsController, "data" | "session">
+
+export function createHomeSessionSearchController(home: HomeController, sessions: HomeSessionSearchSource) {
+  const command = useCommand()
+  const language = useLanguage()
+  const [state, setState] = createStore({ value: "", focused: false, highlighted: "" })
+  let root: HTMLDivElement | undefined
+  let input: HTMLInputElement | undefined
+  let list: HTMLDivElement | undefined
+  const query = createMemo(() => state.value.trim())
+  const results = createMemo(() => {
+    const value = query().toLowerCase()
+    if (!value) return []
+    return sessions.data
+      .searchRecords()
+      .filter((record) => `${record.session.title} ${record.projectName}`.toLowerCase().includes(value))
+  })
+  const active = createMemo(() => {
+    const records = results()
+    if (records.some((record) => homeSessionSearchKey(record) === state.highlighted)) return state.highlighted
+    return records[0] ? homeSessionSearchKey(records[0]) : ""
+  })
+  const open = createMemo(() => state.focused && query().length > 0)
+  const placeholder = createMemo(() => {
+    const project = home.project.selected()
+    if (project) return language.t("home.sessions.search.placeholder.scoped", { scope: displayName(project) })
+    if (home.server.list().length > 1) {
+      const conn = home.server.focused()
+      if (conn) return language.t("home.sessions.search.placeholder.scoped", { scope: serverName(conn) })
+    }
+    return language.t("home.sessions.search.placeholder")
+  })
+
+  onCleanup(
+    makeEventListener(document, "pointerdown", (event) => {
+      if (!open()) return
+      const target = event.target
+      if (!(target instanceof Node) || root?.contains(target)) return
+      close()
+    }),
+  )
+
+  command.register("home.search", () => [
+    {
+      id: "home.sessions.search.focus",
+      title: placeholder(),
+      keybind: "mod+f",
+      hidden: true,
+      onSelect: focus,
+    },
+  ])
+
+  function focus() {
+    input?.focus()
+    setState("focused", true)
+  }
+
+  function close() {
+    setState({ value: "", focused: false })
+  }
+
+  function select(record: HomeSessionRecord, options?: { background?: boolean }) {
+    sessions.session.open(record.session, options)
+    if (!options?.background) close()
+  }
+
+  return {
+    query: {
+      value: () => state.value,
+      placeholder,
+      open,
+      focus,
+      input: (value: string) => setState({ value, highlighted: "" }),
+      close,
+    },
+    result: {
+      loading: sessions.data.loading,
+      list: results,
+      active,
+      noResultsLabel: () => language.t("home.sessions.search.noResults", { query: query() }),
+      highlight: (record: HomeSessionRecord) => setState("highlighted", homeSessionSearchKey(record)),
+      move: (delta: number) => {
+        const records = results()
+        if (records.length === 0) return
+        const index = records.findIndex((record) => homeSessionSearchKey(record) === active())
+        const next = ((index === -1 ? 0 : index) + delta + records.length) % records.length
+        setState("highlighted", homeSessionSearchKey(records[next]))
+        list?.querySelector<HTMLElement>(`[data-key="${state.highlighted}"]`)?.scrollIntoView({ block: "nearest" })
+      },
+      select,
+      selectActive: () => {
+        const record = results().find((item) => homeSessionSearchKey(item) === active())
+        if (record) select(record)
+      },
+    },
+    element: {
+      setRoot: (element: HTMLDivElement) => (root = element),
+      setInput: (element: HTMLInputElement) => (input = element),
+      setList: (element: HTMLDivElement) => (list = element),
+    },
+  }
+}
+
+export type HomeSessionSearchController = ReturnType<typeof createHomeSessionSearchController>
@@ -0,0 +1,314 @@
+import type { Session } from "@opencode-ai/sdk/v2/client"
+import { preloadMarkdown } from "@opencode-ai/session-ui/markdown-cache"
+import { useDialog } from "@opencode-ai/ui/context/dialog"
+import { useMarked } from "@opencode-ai/ui/context/marked"
+import { useQuery } from "@tanstack/solid-query"
+import { DateTime } from "luxon"
+import { type Accessor, createEffect, createMemo, createRoot, type JSX, startTransition } from "solid-js"
+import { produce } from "solid-js/store"
+import { useCommand } from "@/context/command"
+import {
+  loadHomeSessionIndex,
+  retainHomeSessions,
+  type HomeSessionEvents,
+} from "@/context/global-sync/home-session-index"
+import type { LocalProject } from "@/context/layout"
+import { useLanguage } from "@/context/language"
+import { ServerConnection } from "@/context/server"
+import { sessionHasOpenTab, useTabs } from "@/context/tabs"
+import { displayName, errorMessage, projectForSession } from "@/pages/layout/helpers"
+import { useSessionTabAvatarState } from "@/pages/layout/project-avatar-state"
+import { pathKey } from "@/utils/path-key"
+import { showToast } from "@/utils/toast"
+import { Binary } from "@opencode-ai/core/util/binary"
+import { archiveHomeSession } from "../home-session-archive"
+import type { HomeController } from "./home-controller"
+
+const HOME_SESSION_LIMIT = 64
+export type HomeSessionRecord = {
+  session: Session
+  project: LocalProject
+  projectName: string
+}
+
+export type HomeSessionGroup = {
+  id: "today" | "yesterday" | "older"
+  title: string
+  sessions: HomeSessionRecord[]
+}
+
+export type OpenSessionOptions = { background?: boolean }
+
+export function createHomeSessionsController(home: HomeController) {
+  const tabs = useTabs()
+  const command = useCommand()
+  const dialog = useDialog()
+  const language = useLanguage()
+  const marked = useMarked()
+  const projectDirectories = createMemo(() => {
+    const project = home.project.selected()
+    if (!project) return home.project.list().flatMap(directories)
+    return directories(project)
+  })
+  const projectByID = createMemo(
+    () => new Map(home.project.list().flatMap((project) => (project.id ? [[project.id, project] as const] : []))),
+  )
+  const homeSessions = () => home.server.focusedSync().homeSessions
+  const sessionEventLoad = useQuery(() => ({
+    queryKey: homeSessions().eventsKey,
+    queryFn: async (): Promise<HomeSessionEvents> => ({ sequence: 0, entries: [] }),
+    initialData: { sequence: 0, entries: [] } satisfies HomeSessionEvents,
+    enabled: false,
+  }))
+  const sessionLoad = useQuery(() => ({
+    queryKey: homeSessions().indexKey,
+    enabled: !!home.server.focusedContext(),
+    queryFn: async ({ signal }) => {
+      const ctx = home.server.focusedContext()
+      if (!ctx) return { sessions: [], eventSequence: 0 }
+      const cache = homeSessions()
+      const eventSequence = cache.eventSequence()
+      const index = await loadHomeSessionIndex(
+        (input, options) => ctx.sdk.client.v2.session.list(input, options),
+        eventSequence,
+        signal,
+      )
+      cache.complete(eventSequence)
+      return index
+    },
+    retry: false,
+    staleTime: 30_000,
+    refetchOnMount: true,
+    refetchOnReconnect: true,
+  }))
+  const indexedSessions = createMemo(() =>
+    retainHomeSessions(
+      homeSessions().sessions(sessionLoad.data, sessionEventLoad.data),
+      HOME_SESSION_LIMIT,
+      Date.now(),
+    ),
+  )
+  const allRecords = createMemo(() =>
+    buildHomeSessionRecords({
+      sessions: indexedSessions,
+      projectDirectories,
+      projects: home.project.list,
+      projectByID,
+    }),
+  )
+  const records = createMemo(() => allRecords().slice(0, HOME_SESSION_LIMIT))
+  const groups = createMemo(() => groupSessions(records(), language))
+  const prefetched = new Set<string>()
+
+  createEffect(() => {
+    const ctx = home.server.focusedContext()
+    const conn = home.server.focused()
+    if (!ctx || !conn) return
+    records()
+      .slice(0, 2)
+      .forEach((record) => {
+        const key = `${ServerConnection.key(conn)}\0${record.session.id}`
+        if (prefetched.has(key)) return
+        prefetched.add(key)
+        createRoot((dispose) => {
+          try {
+            void ctx.sync.session
+              .sync(record.session.id)
+              .then(() =>
+                Promise.all(
+                  (ctx.sync.session.data.message[record.session.id] ?? []).flatMap((message) =>
+                    (ctx.sync.session.data.part[message.id] ?? []).flatMap((part) => {
+                      if (part.type !== "text" || !part.text) return []
+                      return preloadMarkdown(part.text, part.id, marked)
+                    }),
+                  ),
+                ),
+              )
+              .catch(() => {})
+              .finally(dispose)
+          } catch {
+            dispose()
+          }
+        })
+      })
+  })
+
+  command.register("home.palette", () => [
+    {
+      id: "command.palette",
+      title: language.t("command.palette"),
+      hidden: true,
+      onSelect: async () => {
+        const conn = home.server.focused()
+        if (!conn) return
+        const ctx = home.server.focusedContext()
+        if (!ctx) return
+        const { DialogHomeCommandPaletteV2 } = await import("@/components/dialog-command-palette-v2")
+        void dialog.show(() => (
+          <DialogHomeCommandPaletteV2
+            server={conn}
+            onSelectSession={(entry) => {
+              if (!entry.sessionID || !entry.directory || !entry.server) return
+              const sessionID = entry.sessionID
+              const server = entry.server
+              const directory = entry.project?.worktree ?? entry.directory
+              ctx.projects.open(directory)
+              ctx.projects.touch(directory)
+              void startTransition(() => {
+                const tab = tabs.addSessionTab({ server, sessionId: sessionID })
+                tabs.select(tab)
+              })
+            }}
+          />
+        ))
+      },
+    },
+  ])
+
+  return {
+    copy: {
+      language,
+    },
+    data: {
+      records,
+      groups,
+      loading: () => sessionLoad.isLoading,
+      searchRecords: allRecords,
+    },
+    session: {
+      showProjectName: () => !home.project.selected(),
+      server: () => home.selection.value().server,
+      canCreate: () => !!home.project.newSession(),
+      create: home.project.openNewSession,
+      open: (session: Session, options?: OpenSessionOptions) => {
+        const directoryKey = pathKey(session.directory)
+        const project =
+          home.project
+            .list()
+            .find(
+              (item) =>
+                pathKey(item.worktree) === directoryKey ||
+                item.sandboxes?.some((sandbox) => pathKey(sandbox) === directoryKey),
+            ) ?? projectForSession(session, home.project.list(), projectByID())
+        const conn = home.server.focused()
+        if (!conn) return
+        const directory = project?.worktree ?? session.directory
+        const ctx = home.server.focusedContext()
+        if (!ctx) return
+        ctx.projects.open(directory)
+        if (options?.background) {
+          tabs.addSessionTab({ server: ServerConnection.key(conn), sessionId: session.id })
+          return
+        }
+        ctx.projects.touch(directory)
+        void startTransition(() => {
+          const tab = tabs.addSessionTab({ server: ServerConnection.key(conn), sessionId: session.id })
+          tabs.select(tab)
+        })
+      },
+      archive: async (session: Session) => {
+        const conn = home.server.focused()
+        const ctx = home.server.focusedContext()
+        if (!conn || !ctx) return
+        const [, setStore] = ctx.sync.child(session.directory)
+        await archiveHomeSession({
+          server: ServerConnection.key(conn),
+          session,
+          archive: (sessionID) => ctx.sdk.api.session.archive({ sessionID, directory: session.directory }),
+          remove: () =>
+            setStore(
+              produce((draft) => {
+                const match = Binary.search(draft.session, session.id, (item) => item.id)
+                if (match.found) draft.session.splice(match.index, 1)
+              }),
+            ),
+          onError: (cause) =>
+            showToast({
+              title: language.t("common.requestFailed"),
+              description: errorMessage(cause, language.t("common.requestFailed")),
+            }),
+        })
+      },
+    },
+    tab: {
+      isOpen: (record: HomeSessionRecord) =>
+        sessionHasOpenTab(tabs.store, home.selection.value().server, record.session),
+    },
+  }
+}
+
+function directories(project: LocalProject) {
+  return [project.worktree, ...(project.sandboxes ?? [])]
+}
+
+function buildHomeSessionRecords(input: {
+  sessions: () => Session[]
+  projectDirectories: () => string[]
+  projects: () => LocalProject[]
+  projectByID: () => Map<string, LocalProject>
+}) {
+  const directories = new Set(input.projectDirectories().map(pathKey))
+  const sessions = input.sessions().filter((session) => directories.has(pathKey(session.directory)))
+  return [...new Map(sessions.map((session) => [session.id, session] as const)).values()]
+    .sort((a, b) => (b.time.updated ?? b.time.created) - (a.time.updated ?? a.time.created))
+    .flatMap((session) => {
+      const directory = pathKey(session.directory)
+      const project =
+        input
+          .projects()
+          .find(
+            (item) =>
+              pathKey(item.worktree) === directory || item.sandboxes?.some((sandbox) => pathKey(sandbox) === directory),
+          ) ?? projectForSession(session, input.projects(), input.projectByID())
+      if (!project) return []
+      return { session, project, projectName: displayName(project) }
+    })
+}
+
+export function homeSessionSearchKey(record: HomeSessionRecord) {
+  return `${pathKey(record.session.directory)}:${record.session.id}`
+}
+
+function groupSessions(records: HomeSessionRecord[], language: ReturnType<typeof useLanguage>): HomeSessionGroup[] {
+  const now = DateTime.local()
+  const yesterday = now.minus({ days: 1 })
+  const todaySessions = records.filter((record) =>
+    DateTime.fromMillis(record.session.time.updated ?? record.session.time.created).hasSame(now, "day"),
+  )
+  const yesterdaySessions = records.filter((record) =>
+    DateTime.fromMillis(record.session.time.updated ?? record.session.time.created).hasSame(yesterday, "day"),
+  )
+  const olderSessions = records.filter((record) => {
+    const time = DateTime.fromMillis(record.session.time.updated ?? record.session.time.created)
+    return !time.hasSame(now, "day") && !time.hasSame(yesterday, "day")
+  })
+  const olderTitle =
+    todaySessions.length === 0 && yesterdaySessions.length === 0
+      ? language.t("sidebar.project.recentSessions")
+      : language.t("home.sessions.group.older")
+  return [
+    { id: "today" as const, title: language.t("home.sessions.group.today"), sessions: todaySessions },
+    { id: "yesterday" as const, title: language.t("home.sessions.group.yesterday"), sessions: yesterdaySessions },
+    { id: "older" as const, title: olderTitle, sessions: olderSessions },
+  ].filter((group) => group.sessions.length > 0)
+}
+
+export type HomeSessionsController = ReturnType<typeof createHomeSessionsController>
+
+export function HomeSessionStatusController(props: {
+  server: Accessor<ServerConnection.Key>
+  record: HomeSessionRecord
+  isOpenTab: (record: HomeSessionRecord) => boolean
+  render: (state: { unread: Accessor<boolean>; loading: Accessor<boolean>; open: Accessor<boolean> }) => JSX.Element
+}) {
+  const avatar = useSessionTabAvatarState(
+    props.server,
+    () => props.record.session.directory,
+    () => props.record.session.id,
+  )
+  return props.render({
+    unread: avatar.unread,
+    loading: avatar.loading,
+    open: () => props.isOpenTab(props.record),
+  })
+}
@@ -0,0 +1,550 @@
+import type { Session } from "@opencode-ai/sdk/v2/client"
+import { type Accessor, createMemo, For, Show } from "solid-js"
+import { Spinner } from "@opencode-ai/ui/spinner"
+import { ScrollView } from "@opencode-ai/ui/scroll-view"
+import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
+import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
+import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
+import { useLanguage } from "@/context/language"
+import { ServerConnection } from "@/context/server"
+import { SessionTabAvatarView } from "@/pages/layout/session-tab-avatar"
+import { sessionTitle } from "@/utils/session-title"
+import { shouldOpenSessionInBackground } from "../home-session-open"
+import {
+  HomeSessionStatusController,
+  homeSessionSearchKey,
+  type HomeSessionGroup,
+  type HomeSessionRecord,
+  type OpenSessionOptions,
+} from "./home-sessions-controller"
+
+const SHOW_HOME_SESSION_ARCHIVE = false
+const HOME_SECTION_LABEL = "text-v2-text-text-muted [font-weight:440]"
+const HOME_SESSION_SEARCH_RESULTS_ID = "home-session-search-results"
+
+// Middle-click or Cmd+click on macOS (Ctrl+click elsewhere) opens a session
+// tab in the background without navigating, matching browser conventions.
+function isBackgroundOpen(event: MouseEvent) {
+  return shouldOpenSessionInBackground({
+    button: event.button,
+    mac: typeof navigator === "object" && /(Mac|iPod|iPhone|iPad)/.test(navigator.platform),
+    meta: event.metaKey,
+    ctrl: event.ctrlKey,
+    shift: event.shiftKey,
+    alt: event.altKey,
+  })
+}
+
+export type HomeSessionsViewProps = {
+  language: ReturnType<typeof useLanguage>
+  groups: Accessor<HomeSessionGroup[]>
+  loading: Accessor<boolean>
+  showProjectName: Accessor<boolean>
+  server: Accessor<ServerConnection.Key>
+  canCreateSession: Accessor<boolean>
+  searchValue: Accessor<string>
+  searchPlaceholder: Accessor<string>
+  searchOpen: Accessor<boolean>
+  searchLoading: Accessor<boolean>
+  searchResults: Accessor<HomeSessionRecord[]>
+  searchActive: Accessor<string>
+  searchNoResultsLabel: Accessor<string>
+  titleOpacity: (id: HomeSessionGroup["id"]) => number
+  isOpenTab: (record: HomeSessionRecord) => boolean
+  onCreateSession: () => void
+  onOpenSession: (session: Session, options?: OpenSessionOptions) => void
+  onArchiveSession: (session: Session) => Promise<void>
+  onSetHoverTarget: (element: HTMLElement) => void
+  onSetThumbTrack: (element: HTMLDivElement) => void
+  onSetContent: (element: HTMLDivElement) => void
+  onSetHeader: (id: HomeSessionGroup["id"], element: HTMLDivElement) => void
+  onWheel: (event: WheelEvent) => void
+  onSetSearchRoot: (element: HTMLDivElement) => void
+  onSetSearchInput: (element: HTMLInputElement) => void
+  onSetSearchList: (element: HTMLDivElement) => void
+  onSearchFocus: () => void
+  onSearchInput: (value: string) => void
+  onSearchClose: () => void
+  onSearchMove: (delta: number) => void
+  onSearchSelectActive: () => void
+  onSearchHighlight: (record: HomeSessionRecord) => void
+  onSearchSelect: (record: HomeSessionRecord, options?: OpenSessionOptions) => void
+}
+
+export function HomeSessionsView(props: HomeSessionsViewProps) {
+  return (
+    <section
+      ref={props.onSetHoverTarget}
+      class="min-h-0 min-w-0 flex-1 flex flex-col"
+      aria-label={props.language.t("sidebar.project.recentSessions")}
+    >
+      <div class="sticky top-0 z-30 shrink-0 bg-v2-background-bg-base pb-3 pt-6 lg:pt-12" onWheel={props.onWheel}>
+        <HomeSessionSearch {...props} />
+        <Show when={props.groups().length > 0 && props.canCreateSession()}>
+          <div class="pointer-events-none absolute right-0 top-[84px] z-20 flex lg:top-[108px]">
+            <ButtonV2
+              data-action="home-new-session"
+              variant="ghost-muted"
+              size="normal"
+              icon="edit"
+              class="pointer-events-auto h-7 px-2 [font-weight:530]"
+              onClick={props.onCreateSession}
+            >
+              {props.language.t("command.session.new")}
+            </ButtonV2>
+          </div>
+        </Show>
+      </div>
+      <div class="pointer-events-none sticky top-[84px] z-40 h-0 -mr-3 lg:top-[108px]">
+        <div
+          ref={props.onSetThumbTrack}
+          data-component="home-session-scroll-track"
+          class="relative ml-auto h-[calc(100cqh-84px)] w-3 lg:h-[calc(100cqh-108px)]"
+        />
+      </div>
+      <div class="-mr-3 min-h-[calc(100cqh-72px)] lg:min-h-[calc(100cqh-96px)]">
+        <Show
+          when={!props.loading()}
+          fallback={
+            <div class="pt-3">
+              <HomeSessionSkeleton label={props.language.t("common.loading")} />
+            </div>
+          }
+        >
+          <Show
+            when={props.groups().length > 0}
+            fallback={
+              <HomeSessionsEmpty
+                onNewSession={props.canCreateSession() ? props.onCreateSession : undefined}
+                language={props.language}
+              />
+            }
+          >
+            <div ref={props.onSetContent} class="flex flex-col pt-3 pr-3 pb-16">
+              <For each={props.groups()}>
+                {(group, index) => (
+                  <>
+                    <HomeSessionGroupHeader
+                      title={group.title}
+                      titleOpacity={props.titleOpacity(group.id)}
+                      onSetRef={(element) => props.onSetHeader(group.id, element)}
+                      elevated={index() === 0}
+                    />
+                    <div
+                      class={`flex min-w-0 flex-col gap-px pt-4 ${index() === props.groups().length - 1 ? "" : "mb-6"}`}
+                    >
+                      <For each={group.sessions}>{(record) => <HomeSessionRow {...props} record={record} />}</For>
+                    </div>
+                  </>
+                )}
+              </For>
+            </div>
+          </Show>
+        </Show>
+      </div>
+    </section>
+  )
+}
+
+function HomeSessionLeadingController(props: {
+  server: HomeSessionsViewProps["server"]
+  isOpenTab: HomeSessionsViewProps["isOpenTab"]
+  record: HomeSessionRecord
+  revealProjectOnHover: boolean
+}) {
+  return (
+    <HomeSessionStatusController
+      server={props.server}
+      record={props.record}
+      isOpenTab={props.isOpenTab}
+      render={(state) => (
+        <HomeSessionLeading
+          record={props.record}
+          revealProjectOnHover={props.revealProjectOnHover}
+          open={state.open()}
+          unread={state.unread()}
+          loading={state.loading()}
+        />
+      )}
+    />
+  )
+}
+
+function HomeSessionLeading(props: {
+  record: HomeSessionRecord
+  revealProjectOnHover: boolean
+  open: boolean
+  unread: boolean
+  loading: boolean
+}) {
+  return (
+    <div class="relative shrink-0">
+      <Show when={props.open}>
+        <span
+          aria-hidden="true"
+          class={`
+            pointer-events-none absolute top-1/2 h-3 w-0.5 -translate-y-1/2
+            rounded-[2px] bg-v2-background-bg-layer-04
+          `}
+          style={{ right: "calc(100% + 4px)" }}
+        />
+      </Show>
+      <SessionTabAvatarView
+        project={props.record.project}
+        directory={props.record.session.directory}
+        revealProjectOnHover={props.revealProjectOnHover}
+        unread={props.unread}
+        loading={props.loading}
+      />
+    </div>
+  )
+}
+
+function HomeSessionSearch(props: HomeSessionsViewProps) {
+  return (
+    <div class="w-full">
+      <div ref={props.onSetSearchRoot} data-component="home-session-search" class="relative z-30 w-full">
+        <Show when={props.searchOpen()}>
+          <div
+            data-component="home-session-search-panel"
+            class={`
+              absolute flex flex-col overflow-hidden rounded-[12px]
+              bg-v2-background-bg-base shadow-[var(--v2-elevation-floating)]
+            `}
+            style={{ top: "-6px", left: "-6px", width: "calc(100% + 12px)" }}
+          >
+            <div class="flex flex-col pt-9">
+              <div id={HOME_SESSION_SEARCH_RESULTS_ID} role="listbox" class="flex flex-col gap-4 pt-4">
+                <Show
+                  when={!props.searchLoading()}
+                  fallback={
+                    <div class="flex items-center justify-center px-4 py-3 text-v2-text-text-muted [font-weight:440]">
+                      <Spinner class="size-4" />
+                    </div>
+                  }
+                >
+                  <Show
+                    when={props.searchResults().length > 0}
+                    fallback={
+                      <p
+                        class={`
+                          my-1.5 px-4 pb-2 text-[13px] leading-4 tracking-[-0.04px]
+                          text-v2-text-text-muted [font-weight:440]
+                        `}
+                      >
+                        {props.searchNoResultsLabel()}
+                      </p>
+                    }
+                  >
+                    <div class="flex flex-col">
+                      <p
+                        class={`
+                          my-1.5 pl-[18px] pr-6 text-[13px] leading-4 tracking-[-0.04px]
+                          text-v2-text-text-muted [font-weight:440]
+                        `}
+                      >
+                        {props.language.t("home.sessions.search.sessions")}
+                      </p>
+                      <ScrollView class="max-h-80" viewportRef={props.onSetSearchList}>
+                        <div class="flex flex-col gap-px pb-2">
+                          <For each={props.searchResults()}>
+                            {(record) => (
+                              <HomeSessionSearchResultRow
+                                {...props}
+                                record={record}
+                                selected={props.searchActive() === homeSessionSearchKey(record)}
+                              />
+                            )}
+                          </For>
+                        </div>
+                      </ScrollView>
+                    </div>
+                  </Show>
+                </Show>
+              </div>
+            </div>
+          </div>
+        </Show>
+        <label
+          class={`
+            relative z-20 flex h-9 w-full items-center gap-2 rounded-[6px] py-1 pl-3 pr-2
+            bg-v2-background-bg-layer-02/60 text-v2-icon-icon-muted transition-[background-color,box-shadow]
+            duration-[120ms] ease-in-out hover:bg-v2-background-bg-layer-02 focus-within:bg-v2-background-bg-layer-02
+          `}
+        >
+          <IconV2 name="magnifying-glass" />
+          <input
+            ref={props.onSetSearchInput}
+            class={`
+              relative z-20 min-w-0 flex-1 border-0 bg-transparent outline-0
+              text-v2-text-text-base [font-weight:440] placeholder:text-v2-text-text-faint
+            `}
+            value={props.searchValue()}
+            placeholder={props.searchPlaceholder()}
+            aria-label={props.searchPlaceholder()}
+            aria-expanded={props.searchOpen()}
+            aria-controls={HOME_SESSION_SEARCH_RESULTS_ID}
+            aria-autocomplete="list"
+            aria-activedescendant={
+              props.searchActive() && props.searchOpen()
+                ? `home-session-search-option-${props.searchActive()}`
+                : undefined
+            }
+            onFocus={props.onSearchFocus}
+            onInput={(event) => props.onSearchInput(event.currentTarget.value)}
+            onKeyDown={(event) => {
+              if (event.key === "Escape") {
+                event.preventDefault()
+                props.onSearchClose()
+                event.currentTarget.blur()
+                return
+              }
+              if (!props.searchOpen() || props.searchResults().length === 0) return
+              if (event.altKey || event.metaKey) return
+              if (event.key === "ArrowDown") {
+                event.preventDefault()
+                props.onSearchMove(1)
+                return
+              }
+              if (event.key === "ArrowUp") {
+                event.preventDefault()
+                props.onSearchMove(-1)
+                return
+              }
+              if (event.key === "Enter" && !event.isComposing) {
+                event.preventDefault()
+                props.onSearchSelectActive()
+              }
+            }}
+          />
+          <Show when={props.searchValue()}>
+            <IconButtonV2
+              type="button"
+              variant="ghost-muted"
+              size="small"
+              class="relative z-20 shrink-0"
+              icon={<IconV2 name="close" size="large" class="text-v2-icon-icon-muted" />}
+              aria-label={props.searchPlaceholder()}
+              onClick={() => {
+                props.onSearchClose()
+                props.onSearchFocus()
+              }}
+            />
+          </Show>
+        </label>
+      </div>
+    </div>
+  )
+}
+
+function HomeSessionSearchResultRow(
+  props: HomeSessionsViewProps & {
+    record: HomeSessionRecord
+    selected: boolean
+  },
+) {
+  const title = createMemo(() => sessionTitle(props.record.session.title) || props.record.session.id)
+  const showProjectName = () => props.showProjectName() && props.record.projectName
+  const key = () => homeSessionSearchKey(props.record)
+
+  return (
+    <button
+      type="button"
+      id={`home-session-search-option-${key()}`}
+      data-key={key()}
+      data-component="home-session-search-row"
+      role="option"
+      aria-selected={props.selected}
+      class={`
+        flex h-10 w-full shrink-0 cursor-default items-center gap-2 border-0 py-3 pl-[18px] pr-6 text-left
+        transition-[background-color] duration-[120ms] ease-in-out
+        hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none
+      `}
+      classList={{
+        "bg-v2-overlay-simple-overlay-hover": props.selected,
+        group: !!showProjectName(),
+      }}
+      onMouseEnter={() => props.onSearchHighlight(props.record)}
+      onMouseDown={(event) => {
+        if (event.button === 1) event.preventDefault()
+      }}
+      onClick={(event) => props.onSearchSelect(props.record, { background: isBackgroundOpen(event) })}
+      onAuxClick={(event) => {
+        if (!isBackgroundOpen(event)) return
+        event.preventDefault()
+        props.onSearchSelect(props.record, { background: true })
+      }}
+    >
+      <HomeSessionLeadingController
+        server={props.server}
+        isOpenTab={props.isOpenTab}
+        record={props.record}
+        revealProjectOnHover={!!showProjectName()}
+      />
+      <div class="flex min-w-0 flex-1 items-center gap-1.5">
+        <HomeSessionTitle title={title()} showProjectName={!!showProjectName()} search />
+        <Show when={showProjectName()}>
+          <HomeSessionProjectName name={props.record.projectName} search />
+        </Show>
+      </div>
+    </button>
+  )
+}
+
+function HomeSessionGroupHeader(props: {
+  title: string
+  titleOpacity: number
+  onSetRef: (element: HTMLDivElement) => void
+  elevated?: boolean
+}) {
+  return (
+    <div
+      ref={props.onSetRef}
+      class={`
+        pointer-events-none sticky top-[84px] flex h-7 min-w-0 items-center justify-between
+        bg-v2-background-bg-base pl-3 lg:top-[108px]
+      `}
+      classList={{ "home-session-group-header z-[5]": !!props.elevated, "z-10": !props.elevated }}
+    >
+      <div class={HOME_SECTION_LABEL} style={{ opacity: props.titleOpacity }}>
+        {props.title}
+      </div>
+    </div>
+  )
+}
+
+function HomeSessionRow(props: HomeSessionsViewProps & { record: HomeSessionRecord }) {
+  const title = createMemo(() => sessionTitle(props.record.session.title) || props.record.session.id)
+  const showProjectName = () => props.showProjectName() && props.record.projectName
+
+  return (
+    <div
+      class="group/session relative flex h-10 min-w-0 items-center rounded-[6px]"
+      classList={{ group: !!showProjectName() }}
+    >
+      <button
+        type="button"
+        data-component="home-session-row"
+        class={`
+          flex h-10 min-w-0 w-full flex-1 shrink-0 cursor-default items-center gap-2 rounded-[6px] border-0
+          bg-transparent py-3 pl-3 pr-10 text-left text-v2-text-text-muted [font-weight:530]
+          transition-[background-color,color,box-shadow] duration-[120ms] ease-in-out
+          hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none
+        `}
+        onMouseDown={(event) => {
+          if (event.button === 1) event.preventDefault()
+        }}
+        onClick={(event) => props.onOpenSession(props.record.session, { background: isBackgroundOpen(event) })}
+        onAuxClick={(event) => {
+          if (!isBackgroundOpen(event)) return
+          event.preventDefault()
+          props.onOpenSession(props.record.session, { background: true })
+        }}
+      >
+        <HomeSessionLeadingController
+          server={props.server}
+          isOpenTab={props.isOpenTab}
+          record={props.record}
+          revealProjectOnHover={!!showProjectName()}
+        />
+        <HomeSessionTitle title={title()} showProjectName={!!showProjectName()} />
+        <Show when={showProjectName()}>
+          <HomeSessionProjectName name={props.record.projectName} />
+        </Show>
+      </button>
+      <Show when={SHOW_HOME_SESSION_ARCHIVE}>
+        <div
+          class={`
+            hover-reveal absolute right-1.5 top-1/2 flex -translate-y-1/2 items-center gap-1
+            group-hover/session:opacity-100 focus-within:opacity-100
+          `}
+        >
+          <TooltipV2 class="flex shrink-0 items-center" placement="bottom" value={props.language.t("common.archive")}>
+            <IconButtonV2
+              data-action="home-session-archive"
+              variant="ghost-muted"
+              size="large"
+              icon={<IconV2 name="archive" />}
+              aria-label={props.language.t("common.archive")}
+              onClick={(event) => {
+                event.preventDefault()
+                event.stopPropagation()
+                void props.onArchiveSession(props.record.session)
+              }}
+            />
+          </TooltipV2>
+        </div>
+      </Show>
+    </div>
+  )
+}
+
+function HomeSessionTitle(props: { title: string; showProjectName: boolean; search?: boolean }) {
+  return (
+    <span
+      class="min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-v2-text-text-base [font-weight:530]"
+      classList={{
+        "text-[13px] leading-4 tracking-[-0.04px]": !!props.search,
+        "max-w-[min(70%,480px)] flex-[0_1_auto]": props.showProjectName,
+        "flex-[1_1_auto]": !props.showProjectName,
+      }}
+    >
+      {props.title}
+    </span>
+  )
+}
+
+function HomeSessionProjectName(props: { name: string; search?: boolean }) {
+  return (
+    <span
+      class="min-w-0 flex-[1_1_auto] overflow-hidden text-ellipsis whitespace-nowrap text-v2-text-text-muted [font-weight:440]"
+      classList={{ "text-[13px] leading-4 tracking-[-0.04px]": !!props.search }}
+    >
+      {props.name}
+    </span>
+  )
+}
+
+function HomeSessionsEmpty(props: { onNewSession?: () => void; language: ReturnType<typeof useLanguage> }) {
+  return (
+    <div class="flex min-h-full flex-col items-center gap-4 px-6 pt-[52px] text-center">
+      <div
+        class={`
+          shrink-0 text-[13px] leading-[13px] tracking-[-0.04px]
+          text-v2-text-text-base [font-weight:530]
+        `}
+      >
+        {props.language.t("home.sessions.empty")}
+      </div>
+      <p
+        class={`
+          mb-1 text-center text-[13px] leading-5 tracking-[-0.04px]
+          text-v2-text-text-muted [font-weight:440]
+        `}
+      >
+        {props.language.t("home.sessions.empty.description")}
+      </p>
+      <Show when={props.onNewSession}>
+        {(onNewSession) => (
+          <ButtonV2 data-action="home-new-session" variant="neutral" size="normal" icon="edit" onClick={onNewSession()}>
+            {props.language.t("command.session.new")}
+          </ButtonV2>
+        )}
+      </Show>
+    </div>
+  )
+}
+
+function HomeSessionSkeleton(props: { label: string }) {
+  return (
+    <div class="flex min-w-0 flex-col gap-4">
+      <div class="flex h-7 min-w-0 items-center justify-between px-4">
+        <div class={HOME_SECTION_LABEL}>{props.label}</div>
+      </div>
+      <div class="flex min-w-0 flex-col gap-px" aria-hidden="true">
+        <For each={[0, 1, 2, 3]}>{() => <div class="h-10 rounded-[6px] bg-v2-background-bg-deep opacity-70" />}</For>
+      </div>
+    </div>
+  )
+}
@@ -0,0 +1,48 @@
+import type { HomeScrollController } from "./home-scroll-controller"
+import type { HomeSessionSearchController } from "./home-session-search-controller"
+import type { HomeSessionsController } from "./home-sessions-controller"
+import { HomeSessionsView } from "./home-sessions-view"
+
+export function HomeSessions(props: {
+  sessions: HomeSessionsController
+  search: HomeSessionSearchController
+  scroll: HomeScrollController
+}) {
+  return (
+    <HomeSessionsView
+      language={props.sessions.copy.language}
+      groups={props.sessions.data.groups}
+      loading={props.sessions.data.loading}
+      showProjectName={props.sessions.session.showProjectName}
+      server={props.sessions.session.server}
+      canCreateSession={props.sessions.session.canCreate}
+      searchValue={props.search.query.value}
+      searchPlaceholder={props.search.query.placeholder}
+      searchOpen={props.search.query.open}
+      searchLoading={props.search.result.loading}
+      searchResults={props.search.result.list}
+      searchActive={props.search.result.active}
+      searchNoResultsLabel={props.search.result.noResultsLabel}
+      titleOpacity={props.scroll.header.titleOpacity}
+      isOpenTab={props.sessions.tab.isOpen}
+      onCreateSession={props.sessions.session.create}
+      onOpenSession={props.sessions.session.open}
+      onArchiveSession={props.sessions.session.archive}
+      onSetHoverTarget={props.scroll.viewport.setHoverTarget}
+      onSetThumbTrack={props.scroll.viewport.setThumbTrack}
+      onSetContent={props.scroll.header.setContent}
+      onSetHeader={props.scroll.header.setHeader}
+      onWheel={props.scroll.viewport.containWheel}
+      onSetSearchRoot={props.search.element.setRoot}
+      onSetSearchInput={props.search.element.setInput}
+      onSetSearchList={props.search.element.setList}
+      onSearchFocus={props.search.query.focus}
+      onSearchInput={props.search.query.input}
+      onSearchClose={props.search.query.close}
+      onSearchMove={props.search.result.move}
+      onSearchSelectActive={props.search.result.selectActive}
+      onSearchHighlight={props.search.result.highlight}
+      onSearchSelect={props.search.result.select}
+    />
+  )
+}
@@ -0,0 +1,142 @@
+import { DialogSelectServer } from "@/components/dialog-select-server"
+import { useDirectoryPicker } from "@/components/directory-picker"
+import { useGlobal } from "@/context/global"
+import { useLanguage } from "@/context/language"
+import { type ServerConnection, useServer } from "@/context/server"
+import { useServerSync } from "@/context/server-sync"
+import { base64Encode } from "@opencode-ai/core/util/encode"
+import { Button } from "@opencode-ai/ui/button"
+import { useDialog } from "@opencode-ai/ui/context/dialog"
+import { Icon } from "@opencode-ai/ui/icon"
+import { Logo } from "@opencode-ai/ui/logo"
+import { useNavigate } from "@solidjs/router"
+import { DateTime } from "luxon"
+import { createMemo, For, Match, Switch } from "solid-js"
+
+export function LegacyHome() {
+  const sync = useServerSync()
+  const pickDirectory = useDirectoryPicker()
+  const dialog = useDialog()
+  const navigate = useNavigate()
+  const global = useGlobal()
+  const server = useServer()
+  const language = useLanguage()
+  const homedir = createMemo(() => sync().data.path.home)
+  const serverUnreachable = createMemo(() => global.servers.health[server.key]?.healthy === false)
+  const recent = createMemo(() => {
+    return sync()
+      .data.project.slice()
+      .sort((a, b) => (b.time.updated ?? b.time.created) - (a.time.updated ?? a.time.created))
+      .slice(0, 5)
+  })
+
+  const serverDotClass = createMemo(() => {
+    const healthy = global.servers.health[server.key]?.healthy
+    if (healthy === true) return "bg-icon-success-base"
+    if (healthy === false) return "bg-icon-critical-base"
+    return "bg-border-weak-base"
+  })
+
+  function openProject(conn: ServerConnection.Any, directory: string) {
+    const serverCtx = global.ensureServerCtx(conn)
+    serverCtx.projects.open(directory)
+    serverCtx.projects.touch(directory)
+    navigate(`/${base64Encode(directory)}`)
+  }
+
+  function chooseProject() {
+    if (serverUnreachable()) return
+    const conn = server.current
+    if (!conn) return
+
+    const resolve = (result: string | string[] | null) => {
+      if (Array.isArray(result)) {
+        result.forEach((directory) => openProject(conn, directory))
+        return
+      }
+      if (result) openProject(conn, result)
+    }
+
+    pickDirectory({
+      server: conn,
+      title: language.t("command.project.open"),
+      multiple: true,
+      onSelect: resolve,
+    })
+  }
+
+  return (
+    <div class="mx-auto mt-55 w-full md:w-auto px-4">
+      <Logo class="md:w-xl opacity-12" />
+      <Button
+        size="large"
+        variant="ghost"
+        class="mt-4 mx-auto text-14-regular text-text-weak"
+        onClick={() => dialog.show(() => <DialogSelectServer />)}
+      >
+        <div
+          classList={{
+            "size-2 rounded-full": true,
+            [serverDotClass()]: true,
+          }}
+        />
+        {server.name}
+      </Button>
+      <Switch>
+        <Match when={sync().data.project.length > 0}>
+          <div class="mt-20 w-full flex flex-col gap-4">
+            <div class="flex gap-2 items-center justify-between pl-3">
+              <div class="text-14-medium text-text-strong">{language.t("home.recentProjects")}</div>
+              <Button
+                icon="folder-add-left"
+                size="normal"
+                class="pl-2 pr-3"
+                disabled={serverUnreachable()}
+                onClick={chooseProject}
+              >
+                {language.t("command.project.open")}
+              </Button>
+            </div>
+            <ul class="flex flex-col gap-2">
+              <For each={recent()}>
+                {(project) => (
+                  <Button
+                    size="large"
+                    variant="ghost"
+                    class="text-14-mono text-left justify-between px-3"
+                    onClick={() => openProject(server.current!, project.worktree)}
+                  >
+                    {project.worktree.replace(homedir(), "~")}
+                    <div class="text-14-regular text-text-weak">
+                      {DateTime.fromMillis(project.time.updated ?? project.time.created).toRelative()}
+                    </div>
+                  </Button>
+                )}
+              </For>
+            </ul>
+          </div>
+        </Match>
+        <Match when={!sync().ready}>
+          <div class="mt-30 mx-auto flex flex-col items-center gap-3">
+            <div class="text-12-regular text-text-weak">{language.t("common.loading")}</div>
+            <Button class="px-3" disabled={serverUnreachable()} onClick={chooseProject}>
+              {language.t("command.project.open")}
+            </Button>
+          </div>
+        </Match>
+        <Match when={true}>
+          <div class="mt-30 mx-auto flex flex-col items-center gap-3">
+            <Icon name="folder-add-left" size="large" />
+            <div class="flex flex-col gap-1 items-center justify-center">
+              <div class="text-14-medium text-text-strong">{language.t("home.empty.title")}</div>
+              <div class="text-12-regular text-text-weak">{language.t("home.empty.description")}</div>
+            </div>
+            <Button class="px-3 mt-1" disabled={serverUnreachable()} onClick={chooseProject}>
+              {language.t("command.project.open")}
+            </Button>
+          </div>
+        </Match>
+      </Switch>
+    </div>
+  )
+}
@@ -36,6 +36,7 @@ import { useProviders } from "@/hooks/use-providers"
 import { toaster } from "@opencode-ai/ui/toast"
 import { setV2Toast, showToast, ToastRegion } from "@/utils/toast"
 import { useServerSDK } from "@/context/server-sdk"
+import { normalizeProjectInfo } from "@/context/global-sync/utils"
 import { clearWorkspaceTerminals } from "@/context/terminal"
 import { pickSessionCacheEvictions } from "@/context/global-sync/session-cache"
 import { useNotification } from "@/context/notification"
@@ -48,6 +49,7 @@ import { setNavigate } from "@/utils/notification-click"
 import { Worktree as WorktreeState } from "@/utils/worktree"
 import { setSessionHandoff } from "@/pages/session/handoff"
 import { SessionRouteKey, SessionStateKey } from "@/utils/server-scope"
+import { listAllSessions } from "@/utils/session"

 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { useTheme, type ColorScheme } from "@opencode-ai/ui/theme/context"
@@ -875,11 +877,7 @@ export default function LegacyLayout(props: ParentProps) {
    const index = sessions.findIndex((s) => s.id === session.id)
    const nextSession = sessions[index + 1] ?? sessions[index - 1]

-    await serverSDK().client.session.update({
-      directory: session.directory,
-      sessionID: session.id,
-      time: { archived: Date.now() },
-    })
+    await serverSDK().api.session.archive({ sessionID: session.id, directory: session.directory })
    setStore(
      produce((draft) => {
        const match = Binary.search(draft.session, session.id, (s) => s.id)
@@ -1185,9 +1183,12 @@ export default function LegacyLayout(props: ParentProps) {
    }
    const refreshDirs = async (target?: string) => {
      if (!target || target === root || canOpen(target)) return canOpen(target)
-      const listed = await serverSDK()
-        .client.worktree.list({ directory: root })
-        .then((x) => x.data ?? [])
+      const listed = await Promise.resolve(
+        project?.id ?? serverSDK().api.project.current({ location: { directory: root } }),
+      )
+        .then((value) => (typeof value === "string" ? value : value.id))
+        .then((projectID) => serverSDK().api.project.directories({ projectID, location: { directory: root } }))
+        .then((items) => items.map((item) => item.directory).filter((item) => pathKey(item) !== pathKey(root)))
        .catch(() => [] as string[])
      dirs = effectiveWorkspaceOrder(root, [root, ...listed], store.workspaceOrder[root])
      return canOpen(target)
@@ -1231,10 +1232,11 @@ export default function LegacyLayout(props: ParentProps) {
      await Promise.all(
        dirs.map(async (item) => ({
          path: { directory: item },
-          session: await serverSDK()
-            .client.session.list({ directory: item })
-            .then((x) => x.data ?? [])
-            .catch(() => []),
+          session: await listAllSessions(serverSDK().api.session, {
+            directory: item,
+            parentID: null,
+            order: "desc",
+          }).catch(() => []),
        })),
      ),
      Date.now(),
@@ -1294,7 +1296,10 @@ export default function LegacyLayout(props: ParentProps) {
    const name = next === getFilename(project.worktree) ? "" : next

    if (project.id && project.id !== "global") {
-      await serverSDK().client.project.update({ projectID: project.id, directory: project.worktree, name })
+      const result = await serverSDK().api.project.update({ projectID: project.id, name })
+      serverSync().set("project", (items) =>
+        items.map((item) => (item.id === result.id ? normalizeProjectInfo(result) : item)),
+      )
      return
    }

@@ -1445,10 +1450,7 @@ export default function LegacyLayout(props: ParentProps) {
    })
    const dismiss = () => toaster.dismiss(progress)

-    const sessions: Session[] = await serverSDK()
-      .client.session.list({ directory })
-      .then((x) => x.data ?? [])
-      .catch(() => [])
+    const sessions = await listAllSessions(serverSDK().api.session, { directory, order: "desc" }).catch(() => [])

    clearWorkspaceTerminals(
      directory,
@@ -1477,17 +1479,12 @@ export default function LegacyLayout(props: ParentProps) {
      return
    }

-    const archivedAt = Date.now()
    await Promise.all(
      sessions
        .filter((session) => session.time.archived === undefined)
        .map((session) =>
          serverSDK()
-            .client.session.update({
-              sessionID: session.id,
-              directory: session.directory,
-              time: { archived: archivedAt },
-            })
+            .api.session.archive({ sessionID: session.id, directory: session.directory })
            .catch(() => undefined),
        ),
    )
@@ -1524,9 +1521,9 @@ export default function LegacyLayout(props: ParentProps) {

    onMount(() => {
      serverSDK()
-        .client.vcs.status({ directory: props.directory })
-        .then((x) => {
-          const files = x.data ?? []
+        .api.vcs.status({ location: { directory: props.directory } })
+        .then((result) => {
+          const files = result.data
          const dirty = files.length > 0
          setData({ status: "ready", dirty })
        })
@@ -1582,19 +1579,19 @@ export default function LegacyLayout(props: ParentProps) {
    })

    const refresh = async () => {
-      const sessions = await serverSDK()
-        .client.session.list({ directory: props.directory })
-        .then((x) => x.data ?? [])
-        .catch(() => [])
+      const sessions = await listAllSessions(serverSDK().api.session, {
+        directory: props.directory,
+        order: "desc",
+      }).catch(() => [])
      const active = sessions.filter((session) => session.time.archived === undefined)
      setState({ sessions: active })
    }

    onMount(() => {
      serverSDK()
-        .client.vcs.status({ directory: props.directory })
-        .then((x) => {
-          const files = x.data ?? []
+        .api.vcs.status({ location: { directory: props.directory } })
+        .then((result) => {
+          const files = result.data
          const dirty = files.length > 0
          setState({ status: "ready", dirty })
          void refresh()
@@ -19,16 +19,34 @@ export function SessionTabAvatar(props: {
    () => props.directory,
    () => props.sessionId,
  )
+  return (
+    <SessionTabAvatarView
+      project={props.project}
+      directory={props.directory}
+      revealProjectOnHover={props.revealProjectOnHover}
+      unread={state.unread()}
+      loading={state.loading()}
+    />
+  )
+}
+
+export function SessionTabAvatarView(props: {
+  project?: LocalProject
+  directory: string
+  revealProjectOnHover?: boolean
+  unread: boolean
+  loading: boolean
+}) {
  const projectAvatar = () => (
    <ProjectAvatar
      fallback={displayName(props.project ?? { worktree: props.directory })}
      src={getProjectAvatarSource(props.project?.id, props.project?.icon)}
      variant={getProjectAvatarVariant(props.project?.icon?.color)}
-      unread={state.unread()}
+      unread={props.unread}
    />
  )
  return (
-    <Show when={state.loading()} fallback={projectAvatar()}>
+    <Show when={props.loading} fallback={projectAvatar()}>
      <span class="relative block size-4 shrink-0">
        <SessionProgressIndicatorV2
          class={`absolute inset-0 ${props.revealProjectOnHover === false ? "" : "group-hover:invisible"}`}
@@ -45,7 +45,8 @@ export function createPromptInputController(input: {
    model: {
      selection: input.model ?? local.model,
      paid: providers.paid().length > 0,
-      loading: agentsQuery.isLoading || providersQuery.isLoading || globalProvidersQuery.isLoading,
+      loading:
+        (local.agent.visible() && agentsQuery.isLoading) || providersQuery.isLoading || globalProvidersQuery.isLoading,
    },
    session: {
      id: input.sessionID(),
@@ -82,7 +82,7 @@ export function createSessionComposerController(options?: { closeMs?: number | (

    setStore("responding", perm.id)
    sdk()
-      .client.permission.respond({ sessionID: perm.sessionID, permissionID: perm.id, response })
+      .api.permission.reply({ sessionID: perm.sessionID, requestID: perm.id, reply: response })
      .catch((err: unknown) => {
        const description = err instanceof Error ? err.message : String(err)
        showToast({ title: language.t("common.requestFailed"), description })
@@ -223,7 +223,8 @@ export const SessionQuestionDock: Component<{ request: QuestionRequest; onSubmit
  }

  const replyMutation = useMutation(() => ({
-    mutationFn: (answers: QuestionAnswer[]) => sdk().client.question.reply({ requestID: props.request.id, answers }),
+    mutationFn: (answers: QuestionAnswer[]) =>
+      sdk().api.question.reply({ sessionID: props.request.sessionID, requestID: props.request.id, answers }),
    onMutate: () => {
      props.onSubmit()
    },
@@ -235,7 +236,7 @@ export const SessionQuestionDock: Component<{ request: QuestionRequest; onSubmit
  }))

  const rejectMutation = useMutation(() => ({
-    mutationFn: () => sdk().client.question.reject({ requestID: props.request.id }),
+    mutationFn: () => sdk().api.question.reject({ sessionID: props.request.sessionID, requestID: props.request.id }),
    onMutate: () => {
      props.onSubmit()
    },
@@ -5,7 +5,6 @@ import { previewSelectedLines } from "@opencode-ai/session-ui/pierre/selection-b
 import { useFile, selectionFromLines, type FileSelection, type SelectedLineRange } from "@/context/file"
 import { useLanguage } from "@/context/language"
 import { useLayout } from "@/context/layout"
-import { useLocal } from "@/context/local"
 import { usePermission } from "@/context/permission"
 import { usePrompt } from "@/context/prompt"
 import { useSDK } from "@/context/sdk"
@@ -19,6 +18,7 @@ import { extractPromptFromParts } from "@/utils/prompt"
 import { UserMessage } from "@opencode-ai/sdk/v2"
 import { useSessionLayout } from "@/pages/session/session-layout"
 import { createSessionOwnership } from "./session-ownership"
+import { useLocal } from "@/context/local"

 export type SessionCommandContext = {
  navigateMessageByOffset: (offset: number) => void
@@ -40,7 +40,6 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
  const dialog = useDialog()
  const file = useFile()
  const language = useLanguage()
-  const local = useLocal()
  const permission = usePermission()
  const prompt = usePrompt()
  const sdk = useSDK()
@@ -48,6 +47,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
  const sync = useSync()
  const terminal = useTerminal()
  const layout = useLayout()
+  const local = useLocal()
  const navigate = useNavigate()
  const { params, sessionKey, tabs, view } = useSessionLayout()
  const sessionOwnership = createSessionOwnership(sessionKey)
@@ -306,7 +306,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
    const sessionID = params.id
    if (!sessionID) return
    const owner = sessionOwnership.capture()
-    const client = sdk().client
+    const session = sdk().api.session
    const directory = sdk().directory
    const promptSession = prompt.capture()
    const revert = info()?.revert?.messageID
@@ -316,13 +316,13 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
    const parts = sync().data.part[message.id]

    if (sync().data.session_working(sessionID)) {
-      await client.session.abort({ sessionID }).catch(() => {})
+      await session.interrupt({ sessionID }).catch(() => {})
    }

    await runCommand({
      owner,
      prompt: promptSession,
-      request: () => client.session.revert({ sessionID, messageID: message.id }),
+      request: () => session.revert.stage({ sessionID, messageID: message.id }),
      updatePrompt: (promptSession) => {
        if (parts) promptSession.set(extractPromptFromParts(parts, { directory }))
      },
@@ -334,7 +334,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
    const sessionID = params.id
    if (!sessionID) return
    const owner = sessionOwnership.capture()
-    const client = sdk().client
+    const session = sdk().api.session
    const messages = userMessages()
    const promptSession = prompt.capture()

@@ -346,7 +346,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
      await runCommand({
        owner,
        prompt: promptSession,
-        request: () => client.session.unrevert({ sessionID }),
+        request: () => session.revert.clear({ sessionID }),
        updatePrompt: (promptSession) => promptSession.reset(),
        updateViewport: () => setActiveMessage(findLast(messages, (x) => x.id >= revertMessageID)),
      })
@@ -356,7 +356,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
    await runCommand({
      owner,
      prompt: promptSession,
-      request: () => client.session.revert({ sessionID, messageID: next.id }),
+      request: () => session.revert.stage({ sessionID, messageID: next.id }),
      updatePrompt: () => undefined,
      updateViewport: () => setActiveMessage(findLast(messages, (x) => x.id < next.id)),
    })
@@ -375,10 +375,9 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
      return
    }

-    await sdk().client.session.summarize({
+    await sdk().api.session.compact({
      sessionID,
-      modelID: model.id,
-      providerID: model.provider.id,
+      model: { providerID: model.provider.id, modelID: model.id },
    })
  }

@@ -123,4 +123,27 @@ describe("createCompatibleApi", () => {
      data: { branch: "feature", defaultBranch: "dev" },
    })
  })
+
+  test("translates current file searches to the V1 dirs parameter", async () => {
+    const { api, requests } = setup("v1")
+    await api.file.find({ location: { directory: "/repo" }, query: "src", type: "file", limit: 20 })
+
+    const url = new URL(requests[0]!.url)
+    expect(url.pathname).toBe("/find/file")
+    expect(url.searchParams.get("dirs")).toBe("false")
+    expect(url.searchParams.get("limit")).toBe("20")
+  })
+
+  test("routes V1 permission replies through the requested directory", async () => {
+    const { api, requests } = setup("v1")
+    await api.permission.reply({
+      sessionID: "ses_1",
+      requestID: "permission_1",
+      reply: "once",
+      location: { directory: "/other" },
+    })
+
+    expect(new URL(requests[0]!.url).pathname).toBe("/session/ses_1/permissions/permission_1")
+    expect(new URL(requests[0]!.url).searchParams.get("directory")).toBe("/other")
+  })
 })
@@ -30,7 +30,15 @@ type CompatibleSessionApi = Omit<
  archive: (input: Parameters<SessionApi["archive"]>[0] & LegacyLocation) => ReturnType<SessionApi["archive"]>
  remove: (input: Parameters<SessionApi["remove"]>[0] & LegacyLocation) => ReturnType<SessionApi["remove"]>
 }
-export type CompatibleApi = Omit<ServerApi, "session"> & { readonly session: CompatibleSessionApi }
+type CompatiblePermissionApi = Omit<ServerApi["permission"], "reply"> & {
+  reply: (
+    input: Parameters<ServerApi["permission"]["reply"]>[0] & { location?: { directory?: string } },
+  ) => ReturnType<ServerApi["permission"]["reply"]>
+}
+export type CompatibleApi = Omit<ServerApi, "session" | "permission"> & {
+  readonly session: CompatibleSessionApi
+  readonly permission: CompatiblePermissionApi
+}
 type LegacyPrompt = {
  agent?: string
  model?: { providerID: string; modelID: string }
@@ -350,7 +358,7 @@ function createV1Api(input: CompatibleInput): CompatibleApi {
      async find(value: Parameters<ServerApi["file"]["find"]>[0]) {
        const result = await legacy(value.location).find.files({
          query: value.query,
-          type: value.type,
+          dirs: value.type === undefined ? undefined : value.type === "directory" ? "true" : "false",
          limit: value.limit,
        })
        return located(
@@ -471,11 +479,12 @@ function createV1Api(input: CompatibleInput): CompatibleApi {
    },
    permission: {
      ...input.current.permission,
-      async reply(value: Parameters<ServerApi["permission"]["reply"]>[0]) {
-        await legacy().permission.respond({
+      async reply(value: Parameters<ServerApi["permission"]["reply"]>[0] & { location?: { directory?: string } }) {
+        await legacy(value.location).permission.respond({
          sessionID: value.sessionID,
          permissionID: value.requestID,
          response: value.reply,
+          directory: directory(value.location),
        })
      },
    },
@@ -1,5 +1,6 @@
 import { describe, expect, test } from "bun:test"
-import type { GlobalSession, Project } from "@opencode-ai/sdk/v2/client"
+import type { Project } from "@opencode-ai/sdk/v2/client"
+import type { SessionInfo } from "@opencode-ai/client/promise"
 import { createRoot } from "solid-js"
 import { createServerSessionEntries } from "@/components/command-palette"
 import type { LocalProject } from "@/context/layout"
@@ -14,15 +15,16 @@ const stored: Project = {
  time: { created: 1, updated: 1 },
 }

-const session: GlobalSession = {
+const session: SessionInfo = {
  id: "session-1",
-  slug: "session-1",
  projectID: stored.id,
-  directory: stored.worktree,
+  agent: "build",
+  model: { id: "model-1", providerID: "provider-1" },
+  cost: 0,
+  tokens: { input: 0, output: 0, reasoning: 0, cache: { read: 0, write: 0 } },
+  location: { directory: stored.worktree },
  title: "Palette session",
-  version: "1",
  time: { created: 1, updated: 2 },
-  project: { id: stored.id, name: stored.name, worktree: stored.worktree },
 }

 describe("command palette sessions", () => {
Author	SHA1	Message	Date
Brendan Allan	a48912cbb1	fix(app): restore directory-scoped session status for v1 servers (#38637 ) containers / build (push) Waiting to run Details deploy / deploy (push) Waiting to run Details docs-locale-sync / sync-locales (push) Waiting to run Details generate / generate (push) Waiting to run Details nix-eval / nix-eval (push) Waiting to run Details nix-hashes / compute-hash (blacksmith-4vcpu-ubuntu-2404, x86_64-linux) (push) Waiting to run Details nix-hashes / compute-hash (blacksmith-4vcpu-ubuntu-2404-arm, aarch64-linux) (push) Waiting to run Details nix-hashes / compute-hash (macos-15-intel, x86_64-darwin) (push) Waiting to run Details nix-hashes / compute-hash (macos-latest, aarch64-darwin) (push) Waiting to run Details nix-hashes / update-hashes (push) Blocked by required conditions Details publish / version (push) Waiting to run Details publish / build-cli (push) Blocked by required conditions Details publish / sign-cli-windows (push) Blocked by required conditions Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=arm64 host:macos-26 platform_flag:--mac --arm64 target:aarch64-apple-darwin]) (push) Blocked by required conditions Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=x64 host:macos-26-intel platform_flag:--mac --x64 target:x86_64-apple-darwin]) (push) Blocked by required conditions Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404 platform_flag:--linux target:x86_64-unknown-linux-gnu]) (push) Blocked by required conditions Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404-arm platform_flag:--linux --arm64 target:aarch64-unknown-linux-gnu]) (push) Blocked by required conditions Details publish / build-electron (map[host:blacksmith-4vcpu-windows-2025 platform_flag:--win target:x86_64-pc-windows-msvc]) (push) Blocked by required conditions Details publish / build-electron (map[host:windows-2025 platform_flag:--win --arm64 target:aarch64-pc-windows-msvc]) (push) Blocked by required conditions Details publish / publish (push) Blocked by required conditions Details storybook / storybook build (push) Waiting to run Details typecheck / typecheck (push) Waiting to run Details	2026-07-24 14:55:54 +08:00
opencode-agent[bot]	2ea4bb793e	chore: generate	2026-07-24 06:40:05 +00:00
Brendan Allan	d07323ef59	feat(app): migrate discovery workflows (#38465 )	2026-07-24 14:38:39 +08:00
opencode-agent[bot]	5ce89dc2ad	chore: generate	2026-07-24 06:07:04 +00:00
Brendan Allan	589ef16128	refactor(app): split home view controllers (#38607 )	2026-07-24 06:05:40 +00:00
opencode-agent[bot]	386afb77e0	chore: generate	2026-07-24 04:59:34 +00:00
Brendan Allan	29af2e39ff	feat(app): migrate session interactions (#38461 )	2026-07-24 12:58:20 +08:00