chore(ui): remove unused dependencies

Co-authored-by: opencode-agent[bot] <opencode-agent[bot]@users.noreply.github.com>

bun.lock

@@ -31,6 +31,10 @@
       "name": "@opencode-ai/app",
       "version": "1.17.11",
       "dependencies": {
+        "@dnd-kit/abstract": "0.5.0",
+        "@dnd-kit/dom": "0.5.0",
+        "@dnd-kit/helpers": "0.5.0",
+        "@dnd-kit/solid": "0.5.0",
         "@kobalte/core": "catalog:",
         "@opencode-ai/core": "workspace:*",
         "@opencode-ai/sdk": "workspace:*",
@@ -59,7 +63,7 @@
         "diff": "catalog:",
         "effect": "catalog:",
         "fuzzysort": "catalog:",
-        "ghostty-web": "github:anomalyco/ghostty-web#main",
+        "ghostty-web": "github:anomalyco/ghostty-web#513463a6f1190253057e8a3f0dac8f6ee8393553",
         "luxon": "catalog:",
         "marked": "catalog:",
         "marked-shiki": "catalog:",
@@ -79,6 +83,7 @@
         "@types/luxon": "catalog:",
         "@types/node": "catalog:",
         "@typescript/native-preview": "catalog:",
+        "tw-animate-css": "1.4.0",
         "typescript": "catalog:",
         "vite": "catalog:",
         "vite-plugin-icons-spritesheet": "3.0.1",
@@ -952,37 +957,23 @@
       "dependencies": {
         "@kobalte/core": "catalog:",
         "@pierre/diffs": "catalog:",
-        "@shikijs/stream": "catalog:",
-        "@shikijs/transformers": "3.9.2",
-        "@solid-primitives/bounds": "0.1.3",
         "@solid-primitives/event-listener": "2.4.5",
-        "@solid-primitives/media": "2.3.3",
         "@solid-primitives/resize-observer": "2.1.3",
-        "diff": "catalog:",
-        "dompurify": "3.3.1",
         "fuzzysort": "catalog:",
         "katex": "0.16.27",
-        "luxon": "catalog:",
         "marked": "catalog:",
         "marked-katex-extension": "5.1.6",
         "marked-shiki": "catalog:",
-        "morphdom": "2.7.8",
         "motion": "12.34.5",
-        "motion-dom": "12.34.3",
-        "motion-utils": "12.29.2",
         "remeda": "catalog:",
-        "remend": "catalog:",
         "shiki": "catalog:",
         "solid-list": "catalog:",
-        "strip-ansi": "7.1.2",
       },
       "devDependencies": {
         "@solidjs/meta": "catalog:",
-        "@tailwindcss/vite": "catalog:",
         "@tsconfig/node22": "catalog:",
         "@types/bun": "catalog:",
         "@types/katex": "0.16.7",
-        "@types/luxon": "catalog:",
         "@typescript/native-preview": "catalog:",
         "solid-js": "catalog:",
         "tailwindcss": "catalog:",
@@ -1451,6 +1442,20 @@
 
     "@develar/schema-utils": ["@develar/schema-utils@2.6.5", "", { "dependencies": { "ajv": "^6.12.0", "ajv-keywords": "^3.4.1" } }, "sha512-0cp4PsWQ/9avqTVMCtZ+GirikIA36ikvjtHweU4/j8yLtgObI0+JUPhYFScgwlteveGB1rt3Cm8UhN04XayDig=="],
 
+    "@dnd-kit/abstract": ["@dnd-kit/abstract@0.5.0", "", { "dependencies": { "@dnd-kit/geometry": "^0.5.0", "@dnd-kit/state": "^0.5.0", "tslib": "^2.6.2" } }, "sha512-hi13iMJgjPX/KDYVKg5VeDIhmYiV6buc9bAX+tCLYf4QdyYjPbsXjn2sPo6m7fQ6SGJBEFgHJ2PemeKDUbwBaA=="],
+
+    "@dnd-kit/collision": ["@dnd-kit/collision@0.5.0", "", { "dependencies": { "@dnd-kit/abstract": "^0.5.0", "@dnd-kit/geometry": "^0.5.0", "tslib": "^2.6.2" } }, "sha512-xUqRn3lS7oqLkT0AnnHS/STh/Czvwe1UapZFYiLbsUGxopMsQd4teaPCzPouOThoMdGEe+dHWjfqJl6t9iG4mQ=="],
+
+    "@dnd-kit/dom": ["@dnd-kit/dom@0.5.0", "", { "dependencies": { "@dnd-kit/abstract": "^0.5.0", "@dnd-kit/collision": "^0.5.0", "@dnd-kit/geometry": "^0.5.0", "@dnd-kit/state": "^0.5.0", "tslib": "^2.6.2" } }, "sha512-f2xFJp5SYQ8EW/Fbtaa8iBb66hpkWc7qa8vU826KW11/tb44sH+AisZnGtwOOTWTQ0GraqBDr5ixTErww+eKXw=="],
+
+    "@dnd-kit/geometry": ["@dnd-kit/geometry@0.5.0", "", { "dependencies": { "@dnd-kit/state": "^0.5.0", "tslib": "^2.6.2" } }, "sha512-ubHQS1CiSDH8ssYH2xG5BnpwPSFP1tStXXjug7/Ba6qnQdu/EUH47l6QXKIksQnnanfVfDf0aGeevRxgZlj28A=="],
+
+    "@dnd-kit/helpers": ["@dnd-kit/helpers@0.5.0", "", { "dependencies": { "@dnd-kit/abstract": "^0.5.0", "tslib": "^2.6.2" } }, "sha512-i4y+51/icSw+OHMr/su19qhnmNhAzh8PnBwXvapFYTd+64oodIyJRiRkB+hhfxAfnur7RYSW8qacDTrXjg2XOg=="],
+
+    "@dnd-kit/solid": ["@dnd-kit/solid@0.5.0", "", { "dependencies": { "@dnd-kit/abstract": "^0.5.0", "@dnd-kit/dom": "^0.5.0", "@dnd-kit/state": "^0.5.0", "tslib": "^2.6.2" }, "peerDependencies": { "solid-js": "^1.8.0" } }, "sha512-IKDqVZICS0jEeUzpJMIIF61w0WA4zisyx9U7K7Skbmkb/kQSDa3lB0cOc0947RwSO+ALoxytRNOuoNfyOIm3lQ=="],
+
+    "@dnd-kit/state": ["@dnd-kit/state@0.5.0", "", { "dependencies": { "@preact/signals-core": "^1.10.0", "tslib": "^2.6.2" } }, "sha512-y7XbabQqjF58Lk8YmDQuR8l6QjN+Kh4qlGEjUvHuIeasLk1QP+9L5diXS98VMxQIivyMmUtX2//f+3N7qPJX4w=="],
+
     "@dot/log": ["@dot/log@0.1.5", "", { "dependencies": { "chalk": "^4.1.2", "loglevelnext": "^6.0.0", "p-defer": "^3.0.0" } }, "sha512-ECraEVJWv2f2mWK93lYiefUkphStVlKD6yKDzisuoEmxuLKrxO9iGetHK2DoEAkj7sxjE886n0OUVVCUx0YPNg=="],
 
     "@drizzle-team/brocli": ["@drizzle-team/brocli@0.11.0", "", {}, "sha512-hD3pekGiPg0WPCCGAZmusBBJsDqGUR66Y452YgQsZOnkdQ7ViEPKuyP4huUGEZQefp8g34RRodXYmJ2TbCH+tg=="],
@@ -2287,6 +2292,8 @@
 
     "@poppinss/exception": ["@poppinss/exception@1.2.3", "", {}, "sha512-dCED+QRChTVatE9ibtoaxc+WkdzOSjYTKi/+uacHWIsfodVfpsueo3+DKpgU5Px8qXjgmXkSvhXvSCz3fnP9lw=="],
 
+    "@preact/signals-core": ["@preact/signals-core@1.14.3", "", {}, "sha512-m0K3vnbSLC5rHs2ZVfeAMvBtT1zIyq4mxx5OlNncSgMj5Iz6W5Rn3kPrDxAC+iIKmiVe0lSl6U37t5ZkEWoVAw=="],
+
     "@protobuf-ts/plugin": ["@protobuf-ts/plugin@2.11.1", "", { "dependencies": { "@bufbuild/protobuf": "^2.4.0", "@bufbuild/protoplugin": "^2.4.0", "@protobuf-ts/protoc": "^2.11.1", "@protobuf-ts/runtime": "^2.11.1", "@protobuf-ts/runtime-rpc": "^2.11.1", "typescript": "^3.9" }, "bin": { "protoc-gen-ts": "bin/protoc-gen-ts", "protoc-gen-dump": "bin/protoc-gen-dump" } }, "sha512-HyuprDcw0bEEJqkOWe1rnXUP0gwYLij8YhPuZyZk6cJbIgc/Q0IFgoHQxOXNIXAcXM4Sbehh6kjVnCzasElw1A=="],
 
     "@protobuf-ts/protoc": ["@protobuf-ts/protoc@2.11.1", "", { "bin": { "protoc": "protoc.js" } }, "sha512-mUZJaV0daGO6HUX90o/atzQ6A7bbN2RSuHtdwo8SSF2Qoe3zHwa4IHyCN1evftTeHfLmdz+45qo47sL+5P8nyg=="],
@@ -3781,7 +3788,7 @@
 
     "get-tsconfig": ["get-tsconfig@4.14.0", "", { "dependencies": { "resolve-pkg-maps": "^1.0.0" } }, "sha512-yTb+8DXzDREzgvYmh6s9vHsSVCHeC0G3PI5bEXNBHtmshPnO+S5O7qgLEOn0I5QvMy6kpZN8K1NKGyilLb93wA=="],
 
-    "ghostty-web": ["ghostty-web@github:anomalyco/ghostty-web#20bd361", {}, "anomalyco-ghostty-web-20bd361", "sha512-dW0nwaiBBcun9y5WJSvm3HxDLe5o9V0xLCndQvWonRVubU8CS1PHxZpLffyPt1YujPWC13ez03aWxcuKBPYYGQ=="],
+    "ghostty-web": ["ghostty-web@github:anomalyco/ghostty-web#513463a", {}, "anomalyco-ghostty-web-513463a", "sha512-GZR8LSmgGzViWnBJrqRI8MpAZRCJxhcr1Hi9Tyeh7YRooHZQjK9J97FQRD3tbBaM2wjq05gzGY2UEsG+JtZeBw=="],
 
     "giget": ["giget@2.0.0", "", { "dependencies": { "citty": "^0.1.6", "consola": "^3.4.0", "defu": "^6.1.4", "node-fetch-native": "^1.6.6", "nypm": "^0.6.0", "pathe": "^2.0.3" }, "bin": { "giget": "dist/cli.mjs" } }, "sha512-L5bGsVkxJbJgdnwyuheIunkGatUF/zssUoxxjACCseZYAVbaqdh9Tsmmlkl8vYan09H7sbvKt4pS8GqKLBrEzA=="],
 
@@ -4425,9 +4432,9 @@
 
     "motion": ["motion@12.34.5", "", { "dependencies": { "framer-motion": "^12.34.5", "tslib": "^2.4.0" }, "peerDependencies": { "@emotion/is-prop-valid": "*", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" }, "optionalPeers": ["@emotion/is-prop-valid", "react", "react-dom"] }, "sha512-N06NLJ9IeBHeielRqIvYvjPfXuRdyTxa+9++BgpGa+hY2D7TcMkI6QzV3jaRuv0aZRXgMa7cPy9YcBUBisPzAQ=="],
 
-    "motion-dom": ["motion-dom@12.34.3", "", { "dependencies": { "motion-utils": "^12.29.2" } }, "sha512-sYgFe+pR9aIM7o4fhs2aXtOI+oqlUd33N9Yoxcgo1Fv7M20sRkHtCmzE/VRNIcq7uNJ+qio+Xubt1FXH3pQ+eQ=="],
+    "motion-dom": ["motion-dom@12.40.0", "", { "dependencies": { "motion-utils": "^12.39.0" } }, "sha512-HxU3ZaBwNPVQUBQf1xxgq+7JrPNZvjLVxgbpEZL7RrWJnsxOf0/OM+yrHG9ogLQ31Do/r57Oz2gQWPK+6q62mg=="],
 
-    "motion-utils": ["motion-utils@12.29.2", "", {}, "sha512-G3kc34H2cX2gI63RqU+cZq+zWRRPSsNIOjpdl9TN4AQwC4sgwYPl/Q/Obf/d53nOm569T0fYK+tcoSV50BWx8A=="],
+    "motion-utils": ["motion-utils@12.39.0", "", {}, "sha512-8nadJAJjTtqRkmRF36FoJTrywK9nnFmnPwnSMyxaOCU7GDjN9RTMJIxx9De8ErM+vpPhMccr/6fo5WciyQLnMQ=="],
 
     "mrmime": ["mrmime@2.0.1", "", {}, "sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ=="],
 
@@ -5295,6 +5302,8 @@
 
     "turndown": ["turndown@7.2.0", "", { "dependencies": { "@mixmark-io/domino": "^2.2.0" } }, "sha512-eCZGBN4nNNqM9Owkv9HAtWRYfLA4h909E/WGAWWBpmB275ehNhZyk87/Tpvjbp0jjNl9XwCsbe6bm6CqFsgD+A=="],
 
+    "tw-animate-css": ["tw-animate-css@1.4.0", "", {}, "sha512-7bziOlRqH0hJx80h/3mbicLW7o8qLsH5+RaLR2t+OHM3D0JlWGODQKQ4cxbK7WlvmUxpcj6Kgu6EKqjrGFe3QQ=="],
+
     "tw-to-css": ["tw-to-css@0.0.12", "", { "dependencies": { "postcss": "8.4.31", "postcss-css-variables": "0.18.0", "tailwindcss": "3.3.2" } }, "sha512-rQAsQvOtV1lBkyCw+iypMygNHrShYAItES5r8fMsrhhaj5qrV2LkZyXc8ccEH+u5bFjHjQ9iuxe90I7Kykf6pw=="],
 
     "type-fest": ["type-fest@4.41.0", "", {}, "sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA=="],
@@ -7009,10 +7018,6 @@
 
     "lazystream/readable-stream/string_decoder": ["string_decoder@1.1.1", "", { "dependencies": { "safe-buffer": "~5.1.0" } }, "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg=="],
 
-    "motion/framer-motion/motion-dom": ["motion-dom@12.40.0", "", { "dependencies": { "motion-utils": "^12.39.0" } }, "sha512-HxU3ZaBwNPVQUBQf1xxgq+7JrPNZvjLVxgbpEZL7RrWJnsxOf0/OM+yrHG9ogLQ31Do/r57Oz2gQWPK+6q62mg=="],
-
-    "motion/framer-motion/motion-utils": ["motion-utils@12.39.0", "", {}, "sha512-8nadJAJjTtqRkmRF36FoJTrywK9nnFmnPwnSMyxaOCU7GDjN9RTMJIxx9De8ErM+vpPhMccr/6fo5WciyQLnMQ=="],
-
     "opencode-gitlab-auth/open/wsl-utils": ["wsl-utils@0.1.0", "", { "dependencies": { "is-wsl": "^3.1.0" } }, "sha512-h3Fbisa2nKGPxCpm89Hk33lBLsnaGBvctQopaBSOW/uIs6FTe1ATyAnKFJrzVs9vpGdsTe73WF3V4lIsk4Gacw=="],
 
     "p-locate/p-limit/yocto-queue": ["yocto-queue@0.1.0", "", {}, "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="],

nix/hashes.json

@@ -1,8 +1,8 @@
 {
   "nodeModules": {
-    "x86_64-linux": "sha256-drc/Ev96W6b8b0b5LqdZeeGDQ1SMgsz8r5cMO91ei2o=",
-    "aarch64-linux": "sha256-Ti0hNjhUgkVtdb54vea/lpI0ltDwLoPitVyHtx4JGwY=",
-    "aarch64-darwin": "sha256-br4iQ/kK3tSGp+1FefiCTlwsCRhHHhGbKzSixGWaCto=",
-    "x86_64-darwin": "sha256-h7yje968Kyh8/mVY19YmDB5g693XDhIf0XnuwukzCWE="
+    "x86_64-linux": "sha256-rB/CcrBUQVZ08nBFSYA8u2w88rQmTpKxKPkIreDEKgI=",
+    "aarch64-linux": "sha256-ZRTphtic8Ip96MnILteFgZAUxjK9O4YfJu2O6u/0H8k=",
+    "aarch64-darwin": "sha256-VK5XIzraP0HtqnPwPCejiDKer4ewtNtX1vxP5uuyjSk=",
+    "x86_64-darwin": "sha256-ZLPHqcCZB1EmxQk95cmUpiODTTKOyi7PSF0yr/rDk6Y="
   }
 }

packages/app/package.json

@@ -38,12 +38,17 @@
     "@types/luxon": "catalog:",
     "@types/node": "catalog:",
     "@typescript/native-preview": "catalog:",
+    "tw-animate-css": "1.4.0",
     "typescript": "catalog:",
     "vite": "catalog:",
     "vite-plugin-icons-spritesheet": "3.0.1",
     "vite-plugin-solid": "catalog:"
   },
   "dependencies": {
+    "@dnd-kit/abstract": "0.5.0",
+    "@dnd-kit/dom": "0.5.0",
+    "@dnd-kit/helpers": "0.5.0",
+    "@dnd-kit/solid": "0.5.0",
     "@kobalte/core": "catalog:",
     "@opencode-ai/core": "workspace:*",
     "@opencode-ai/sdk": "workspace:*",
@@ -72,7 +77,7 @@
     "diff": "catalog:",
     "effect": "catalog:",
     "fuzzysort": "catalog:",
-    "ghostty-web": "github:anomalyco/ghostty-web#main",
+    "ghostty-web": "github:anomalyco/ghostty-web#513463a6f1190253057e8a3f0dac8f6ee8393553",
     "luxon": "catalog:",
     "marked": "catalog:",
     "marked-shiki": "catalog:",

packages/app/src/app.tsx

@@ -16,6 +16,7 @@ import {
   type Component,
   createEffect,
   createMemo,
+  createRenderEffect,
   createResource,
   createSignal,
   ErrorBoundary,
@@ -37,7 +38,7 @@ import { HighlightsProvider } from "@/context/highlights"
 import { LanguageProvider, type Locale, useLanguage } from "@/context/language"
 import { LayoutProvider } from "@/context/layout"
 import { ModelsProvider } from "@/context/models"
-import { NotificationProvider } from "@/context/notification"
+import { NotificationProvider, useNotification } from "@/context/notification"
 import { PermissionProvider } from "@/context/permission"
 import { PromptProvider } from "@/context/prompt"
 import { ServerConnection, ServerProvider, serverName, useServer } from "@/context/server"
@@ -278,10 +279,11 @@ function QueryProvider(props: ParentProps) {
 function BodyDesignClass() {
   const settings = useSettings()
 
-  createEffect(() => {
+  createRenderEffect(() => {
     if (typeof document === "undefined") return
 
     const enabled = settings.general.newLayoutDesigns()
+    document.body.toggleAttribute("data-new-layout", enabled)
     document.body.classList.toggle("text-12-regular", !enabled)
     document.body.classList.toggle("font-(family-name:--font-family-text)", enabled)
     document.body.classList.toggle("text-[13px]", enabled)
@@ -314,9 +316,7 @@ function ServerScopedProviders(props: ServerScopedShellProps) {
   return (
     <PermissionProvider directory={props.directory}>
       <LayoutProvider>
-        <NotificationProvider directory={props.directory} sessionID={props.sessionID}>
-          <ModelsProvider directory={props.directory}>{props.children}</ModelsProvider>
-        </NotificationProvider>
+        <ModelsProvider directory={props.directory}>{props.children}</ModelsProvider>
       </LayoutProvider>
     </PermissionProvider>
   )
@@ -343,13 +343,23 @@ function NewAppLayout(props: ParentProps) {
 function TargetServerScopedProviders(props: ServerScopedShellProps) {
   return (
     <PermissionProvider directory={props.directory}>
-      <NotificationProvider directory={props.directory} sessionID={props.sessionID}>
-        <ModelsProvider directory={props.directory}>{props.children}</ModelsProvider>
-      </NotificationProvider>
+      <MarkSessionNotificationsViewed sessionID={props.sessionID} />
+      <ModelsProvider directory={props.directory}>{props.children}</ModelsProvider>
     </PermissionProvider>
   )
 }
 
+function MarkSessionNotificationsViewed(props: { sessionID?: () => string | undefined }) {
+  const notification = useNotification()
+  createEffect(() => {
+    const sessionID = props.sessionID?.()
+    if (!notification.ready() || !sessionID) return
+    if (notification.session.unseenCount(sessionID) === 0) return
+    notification.session.markViewed(sessionID)
+  })
+  return null
+}
+
 function SessionProviders(props: ParentProps) {
   return (
     <TerminalProvider>
@@ -558,11 +568,13 @@ export function AppInterface(props: {
                 component={props.router ?? Router}
                 root={(routerProps) => (
                   <TabsProvider>
-                    <ServerShell>
-                      <Show when={useSettings().general.newLayoutDesigns()} fallback={routerProps.children}>
-                        <NewAppLayout>{routerProps.children}</NewAppLayout>
-                      </Show>
-                    </ServerShell>
+                    <NotificationProvider>
+                      <ServerShell>
+                        <Show when={useSettings().general.newLayoutDesigns()} fallback={routerProps.children}>
+                          <NewAppLayout>{routerProps.children}</NewAppLayout>
+                        </Show>
+                      </ServerShell>
+                    </NotificationProvider>
                   </TabsProvider>
                 )}
               >

packages/app/src/components/dialog-select-directory-v2.tsx

@@ -1,6 +1,6 @@
 import "@pierre/trees/web-components"
 import { FileTree } from "@pierre/trees"
-import { Dialog, DialogFooter } from "@opencode-ai/ui/v2/dialog-v2"
+import { Dialog, DialogBody, DialogFooter, DialogHeader, DialogTitle } from "@opencode-ai/ui/v2/dialog-v2"
 import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
 import { TextInputV2 } from "@opencode-ai/ui/v2/text-input-v2"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
@@ -27,6 +27,7 @@ import {
   pickerRoot,
 } from "./directory-picker-domain"
 import "./dialog-select-directory-v2.css"
+import { DividerV2 } from "@opencode-ai/ui/v2/divider-v2"
 
 interface DialogSelectDirectoryV2Props {
   title?: string
@@ -266,8 +267,12 @@ export function DialogSelectDirectoryV2(props: DialogSelectDirectoryV2Props) {
   onCleanup(() => tree?.cleanUp())
 
   return (
-    <Dialog title={props.title ?? language.t("command.project.open")} size="large" class="directory-picker-v2">
-      <div class="directory-picker-v2-body">
+    <Dialog size="large" class="directory-picker-v2">
+      <DialogHeader>
+        <DialogTitle>{props.title ?? language.t("command.project.open")}</DialogTitle>
+      </DialogHeader>
+      <DividerV2 />
+      <DialogBody class="directory-picker-v2-body pt-4!">
         <div class="directory-picker-v2-path" ref={pathArea}>
           <TextInputV2
             value={input()}
@@ -349,7 +354,7 @@ export function DialogSelectDirectoryV2(props: DialogSelectDirectoryV2Props) {
           </Show>
         </div>
         <div class="directory-picker-v2-selection">{policy.result(root(), selected(), rootValid())}</div>
-      </div>
+      </DialogBody>
       <DialogFooter>
         <ButtonV2 variant="neutral" onClick={() => dialog.close()}>
           {language.t("common.cancel")}

packages/app/src/components/dialog-select-model.tsx

@@ -59,6 +59,7 @@ const ModelList: Component<{
           class="w-full"
           placement="right-start"
           gutter={12}
+          openDelay={0}
           value={<ModelTooltip model={item} latest={item.latest} free={isFree(item.provider.id, item.cost)} />}
         >
           {node}

packages/app/src/components/prompt-input.tsx

@@ -1343,9 +1343,9 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
   }
 
   const agentsLoading = () => props.controls.agents.loading
-  const agentsShouldFadeIn = createMemo((prev) => prev ?? agentsLoading())
+  const agentsShouldFadeIn = createMemo<boolean>((prev) => prev ?? agentsLoading())
   const providersLoading = () => props.controls.model.loading
-  const providersShouldFadeIn = createMemo((prev) => prev ?? providersLoading())
+  const providersShouldFadeIn = createMemo<boolean>((prev) => prev ?? providersLoading())
 
   const [promptReady] = createResource(
     () => prompt.ready.promise,
@@ -1359,6 +1359,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
 
   const modelControlState = createMemo<ComposerModelControlState>(() => ({
     loading: providersLoading(),
+    shouldAnimate: providersShouldFadeIn(),
     paid: props.controls.model.paid,
     title: language.t("command.model.choose"),
     keybind: command.keybind("model.choose"),
@@ -1519,10 +1520,11 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                   </Show>
                   {props.toolbar}
                   <ComposerModelControl state={modelControlState()} />
-                  <Show when={store.mode !== "shell" && showVariantControl()}>
+                  <Show when={!providersLoading() && store.mode !== "shell" && showVariantControl()}>
                     <div
                       data-component="prompt-variant-control"
                       classList={{
+                        "animate-in fade-in": providersShouldFadeIn(),
                         "hidden group-hover/prompt-input:block group-focus-within/prompt-input:block":
                           !props.controls.model.selection.variant.current() && !store.variantOpen,
                       }}
@@ -1765,7 +1767,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                     <Show when={!agentsLoading()}>
                       <div
                         data-component="prompt-agent-control"
-                        style={agentsShouldFadeIn() ? { animation: "fade-in 0.3s" } : undefined}
+                        classList={{ "animate-in fade-in duration-300": agentsShouldFadeIn() }}
                       >
                         <TooltipKeybind
                           placement="top"
@@ -1794,7 +1796,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                       <Show when={store.mode !== "shell"}>
                         <div
                           data-component="prompt-model-control"
-                          style={providersShouldFadeIn() ? { animation: "fade-in 0.3s" } : undefined}
+                          classList={{ "animate-in fade-in duration-300": providersShouldFadeIn() }}
                         >
                           <Show
                             when={props.controls.model.paid}
@@ -1873,7 +1875,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                         <Show when={showVariantControl()}>
                           <div
                             data-component="prompt-variant-control"
-                            style={providersShouldFadeIn() ? { animation: "fade-in 0.3s" } : undefined}
+                            classList={{ "animate-in fade-in duration-300": providersShouldFadeIn() }}
                           >
                             <TooltipKeybind
                               placement="top"
@@ -1923,6 +1925,7 @@ type ComposerAgentControlState = {
 
 type ComposerModelControlState = {
   loading: boolean
+  shouldAnimate: boolean
   paid: boolean
   title: string
   keybind: string
@@ -1970,6 +1973,7 @@ function ComposerModelControl(props: { state: ComposerModelControlState }) {
               variant="ghost"
               size="normal"
               class="min-w-0 max-w-[220px] justify-start text-[13px] font-[440] leading-5 text-v2-text-text-faint group"
+              classList={{ "animate-in fade-in": props.state.shouldAnimate }}
               style={props.state.style}
               onClick={props.state.onUnpaidClick}
             >
@@ -2000,6 +2004,7 @@ function ComposerModelControl(props: { state: ComposerModelControlState }) {
               style: props.state.style,
               class:
                 "min-w-0 max-w-[220px] justify-start text-[13px] font-[440] leading-5 text-v2-text-text-faint group",
+              classList: { "animate-in fade-in": props.state.shouldAnimate },
               "data-action": "prompt-model",
             }}
             onClose={props.state.onClose}

packages/app/src/components/prompt-project-selector.tsx

@@ -1,7 +1,8 @@
-import { Popover } from "@kobalte/core/popover"
 import { For, Show, splitProps, type Accessor, type ComponentProps } from "solid-js"
 import { createStore } from "solid-js/store"
+import { DropdownMenu } from "@opencode-ai/ui/dropdown-menu"
 import { Icon } from "@opencode-ai/ui/icon"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
 import { ProjectAvatar } from "@opencode-ai/ui/v2/project-avatar-v2"
 import { getProjectAvatarVariant } from "@/context/layout"
 import { useLanguage } from "@/context/language"
@@ -25,12 +26,23 @@ export type PromptProjectControls = {
   add: (title: string, server?: string) => void
 }
 
+const actionPrefix = "action:"
+const projectPrefix = "project:"
+
+function projectKey(project: PromptProject) {
+  return `${projectPrefix}${encodeURIComponent(project.server?.key ?? "")}:${encodeURIComponent(project.worktree)}`
+}
+
+function actionKey(server?: string) {
+  return `${actionPrefix}${encodeURIComponent(server ?? "")}`
+}
+
 export function createPromptProjectController(input: {
   controls: Accessor<PromptProjectControls>
   onDone: () => void
 }) {
   const language = useLanguage()
-  const [store, setStore] = createStore({ open: false, search: "" })
+  const [store, setStore] = createStore({ open: false, search: "", active: "" })
   let searchRef: HTMLInputElement | undefined
 
   const selected = () => {
@@ -53,8 +65,27 @@ export function createPromptProjectController(input: {
       .controls()
       .available.map((project) => project.server)
       .filter((server, index, all) => server && all.findIndex((item) => item?.key === server.key) === index)
+  const keys = () => {
+    if (servers().length <= 1) {
+      return [...projects().map(projectKey), actionKey(servers()[0]?.key)]
+    }
+    return [
+      ...servers().flatMap((server) =>
+        projects()
+          .filter((project) => project.server?.key === server!.key)
+          .map(projectKey),
+      ),
+      actionKey(),
+    ]
+  }
+  const initialActive = () => {
+    const selectedKey = selected() ? projectKey(selected()!) : undefined
+    const options = keys()
+    if (selectedKey && options.includes(selectedKey)) return selectedKey
+    return options[0] ?? ""
+  }
   const close = () => {
-    setStore({ open: false, search: "" })
+    setStore({ open: false, search: "", active: "" })
     input.onDone()
   }
   const select = (project: PromptProject) => {
@@ -67,7 +98,7 @@ export function createPromptProjectController(input: {
     close()
   }
   const add = (server?: string) => {
-    setStore("open", false)
+    setStore({ open: false, search: "", active: "" })
     input.controls().add(language.t("command.project.open"), server)
   }
 
@@ -75,8 +106,11 @@ export function createPromptProjectController(input: {
     selected,
     projects,
     servers,
+    projectKey,
+    actionKey,
     open: () => store.open,
     search: () => store.search,
+    active: () => store.active,
     labels: {
       add: () => language.t("session.new.project.add"),
       clear: () => language.t("common.clear"),
@@ -86,50 +120,202 @@ export function createPromptProjectController(input: {
     add,
     select,
     setOpen(open: boolean) {
-      setStore("open", open)
-      if (open) requestAnimationFrame(() => searchRef?.focus())
+      if (open) {
+        setStore({ open: true, active: initialActive() })
+        setTimeout(() => requestAnimationFrame(() => searchRef?.focus()))
+        return
+      }
+      setStore({ open: false, search: "", active: "" })
     },
     setSearch(value: string) {
-      setStore("search", value)
+      const search = value.trim().toLowerCase()
+      const first = input
+        .controls()
+        .available.find((project) => !search || displayName(project).toLowerCase().includes(search))
+      setStore({
+        search: value,
+        active: first ? projectKey(first) : actionKey(servers().length > 1 ? undefined : servers()[0]?.key),
+      })
+    },
+    clearSearch() {
+      setStore({ search: "", active: initialActive() })
+      setTimeout(() => searchRef?.focus())
+    },
+    setActive(key: string) {
+      setStore("active", key)
+    },
+    moveActive(delta: number) {
+      const options = keys()
+      if (options.length === 0) return
+      const index = options.indexOf(store.active)
+      const start = index === -1 ? 0 : index
+      setStore("active", options[(start + delta + options.length) % options.length])
+    },
+    activeProject() {
+      return store.active.startsWith(projectPrefix)
+        ? projects().find((project) => projectKey(project) === store.active)
+        : undefined
+    },
+    activeServer() {
+      return store.active.startsWith(actionPrefix)
+        ? decodeURIComponent(store.active.slice(actionPrefix.length)) || undefined
+        : undefined
+    },
+    activeAction() {
+      return store.active.startsWith(actionPrefix)
     },
     setSearchRef(el: HTMLInputElement) {
       searchRef = el
     },
+    focusSearch() {
+      setTimeout(() => requestAnimationFrame(() => searchRef?.focus()))
+    },
   }
 }
 
 export type PromptProjectController = ReturnType<typeof createPromptProjectController>
 
-export function PromptProjectSelector(props: { controller: PromptProjectController }) {
+export function PromptProjectSelector(props: {
+  controller: PromptProjectController
+  placement?: "bottom" | "bottom-start"
+}) {
+  let contentRef: HTMLDivElement | undefined
+  let restoreTrigger = true
+
+  const activeItem = () =>
+    props.controller.active()
+      ? contentRef?.querySelector<HTMLElement>(`[data-option-key="${CSS.escape(props.controller.active())}"]`)
+      : undefined
+  const afterClose = (callback: () => void) => {
+    const complete = () => {
+      if (contentRef?.isConnected) {
+        requestAnimationFrame(complete)
+        return
+      }
+      requestAnimationFrame(() => requestAnimationFrame(callback))
+    }
+    requestAnimationFrame(complete)
+  }
+  const selectProject = (project: PromptProject) => {
+    restoreTrigger = false
+    props.controller.setOpen(false)
+    afterClose(() => props.controller.select(project))
+  }
+  const selectAction = (server?: string) => {
+    restoreTrigger = false
+    props.controller.setOpen(false)
+    afterClose(() => props.controller.add(server))
+  }
+  const selectActive = () => {
+    const project = props.controller.activeProject()
+    if (project) {
+      selectProject(project)
+      return
+    }
+    if (props.controller.activeAction() && props.controller.servers().length > 1) {
+      const item = activeItem()
+      item?.focus()
+      item?.dispatchEvent(new KeyboardEvent("keydown", { key: "ArrowRight", bubbles: true }))
+      return
+    }
+    selectAction(props.controller.activeServer())
+  }
+  const moveActive = (delta: number) => {
+    props.controller.moveActive(delta)
+    queueMicrotask(() => activeItem()?.scrollIntoView({ block: "nearest" }))
+  }
+  const focusPreviousControl = () => {
+    const target = Array.from(
+      document.querySelectorAll<HTMLElement>(
+        'button:not([disabled]), a[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])',
+      ),
+    )
+      .filter((element) => !contentRef?.contains(element) && !element.hasAttribute("data-focus-trap"))
+      .findLast((element) => element.offsetParent !== null)
+    restoreTrigger = false
+    target?.focus()
+    queueMicrotask(() => {
+      if (props.controller.open()) props.controller.setOpen(false)
+    })
+  }
+  const selectedValue = () => {
+    const project = props.controller.selected()
+    return project ? props.controller.projectKey(project) : undefined
+  }
+
   return (
-    <Popover
+    <DropdownMenu
       open={props.controller.open()}
-      placement="bottom-start"
+      placement={props.placement ?? "bottom"}
       gutter={4}
       modal={false}
       onOpenChange={(open) => props.controller.setOpen(open)}
     >
-      <Popover.Trigger as={ProjectTrigger} controller={props.controller} />
-      <Popover.Portal>
-        <Popover.Content
-          class="w-[243px] overflow-hidden rounded-md bg-v2-background-bg-layer-01 shadow-[var(--v2-elevation-floating)] focus:outline-none"
+      <DropdownMenu.Trigger as={ProjectTrigger} controller={props.controller} />
+      <DropdownMenu.Portal>
+        <DropdownMenu.Content
+          ref={contentRef}
+          id="prompt-project-menu"
+          class="w-[243px] overflow-hidden rounded-md border-0 bg-v2-background-bg-layer-01 p-0 shadow-[var(--v2-elevation-floating)] focus:outline-none [&[data-closed]]:!animate-none"
           onOpenAutoFocus={(event) => event.preventDefault()}
+          onPointerDownOutside={() => (restoreTrigger = false)}
+          onFocusOutside={() => (restoreTrigger = false)}
+          onCloseAutoFocus={(event) => {
+            if (!restoreTrigger) event.preventDefault()
+          }}
         >
           <div class="flex flex-col p-0.5">
-            <div class="flex h-7 items-center gap-2 rounded px-3 text-v2-icon-icon-muted">
+            <div class="flex h-7 items-center gap-2 rounded-sm pl-3 pr-2.5 text-v2-icon-icon-muted">
               <Icon name="magnifying-glass" size="small" class="shrink-0" />
               <input
                 ref={(el) => props.controller.setSearchRef(el)}
                 value={props.controller.search()}
                 placeholder={props.controller.labels.search()}
+                aria-autocomplete="list"
+                aria-controls="prompt-project-menu"
+                aria-activedescendant={props.controller.active() || undefined}
                 class="h-7 min-w-0 flex-1 border-0 bg-transparent text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base outline-none placeholder:text-v2-text-text-faint"
                 onInput={(event) => props.controller.setSearch(event.currentTarget.value)}
+                onKeyDown={(event) => {
+                  if (event.key === "Tab") {
+                    event.preventDefault()
+                    event.stopPropagation()
+                    if (event.shiftKey) {
+                      focusPreviousControl()
+                      return
+                    }
+                    activeItem()?.focus()
+                    return
+                  }
+                  event.stopPropagation()
+                  if (event.key === "Escape") {
+                    event.preventDefault()
+                    props.controller.setOpen(false)
+                    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.controller.search().trim()}>
                 <button
                   type="button"
-                  class="flex size-5 items-center justify-center rounded text-v2-icon-icon-muted hover:bg-v2-overlay-simple-overlay-hover"
-                  onClick={() => props.controller.setSearch("")}
+                  class="flex size-5 items-center justify-center rounded-sm text-v2-icon-icon-muted hover:bg-v2-overlay-simple-overlay-hover"
+                  onPointerDown={(event) => event.preventDefault()}
+                  onClick={() => props.controller.clearSearch()}
                   aria-label={props.controller.labels.clear()}
                 >
                   <Icon name="close-small" size="small" />
@@ -139,53 +325,80 @@ export function PromptProjectSelector(props: { controller: PromptProjectControll
             <Show
               when={props.controller.servers().length > 1}
               fallback={
-                <For each={props.controller.projects()}>
-                  {(project) => (
-                    <ProjectItem
-                      project={project}
-                      selected={props.controller.selected()}
-                      onSelect={props.controller.select}
-                    />
-                  )}
-                </For>
+                <DropdownMenu.RadioGroup value={selectedValue()}>
+                  <For each={props.controller.projects()}>
+                    {(project) => (
+                      <ProjectItem project={project} controller={props.controller} onSelect={selectProject} />
+                    )}
+                  </For>
+                </DropdownMenu.RadioGroup>
               }
             >
-              <For each={props.controller.servers()}>
+              <For
+                each={props.controller
+                  .servers()
+                  .filter((server) =>
+                    props.controller.projects().some((project) => project.server?.key === server!.key),
+                  )}
+              >
                 {(server) => (
                   <div>
                     <div class="flex h-7 select-none items-center pl-1.5 pr-3 text-[11px] font-[530] leading-none tracking-[0.05px] text-v2-text-text-faint">
                       {server!.name}
                     </div>
-                    <For each={props.controller.projects().filter((project) => project.server?.key === server!.key)}>
-                      {(project) => (
-                        <ProjectItem
-                          project={project}
-                          selected={props.controller.selected()}
-                          onSelect={props.controller.select}
-                        />
-                      )}
-                    </For>
-                    <ProjectAction
-                      label={props.controller.labels.add()}
-                      onSelect={() => props.controller.add(server!.key)}
-                    />
+                    <DropdownMenu.RadioGroup value={selectedValue()}>
+                      <For each={props.controller.projects().filter((project) => project.server?.key === server!.key)}>
+                        {(project) => (
+                          <ProjectItem project={project} controller={props.controller} onSelect={selectProject} />
+                        )}
+                      </For>
+                    </DropdownMenu.RadioGroup>
                   </div>
                 )}
               </For>
             </Show>
           </div>
-          <Show when={props.controller.servers().length <= 1}>
-            <div class="h-px bg-v2-border-border-muted" />
-            <div class="flex flex-col p-0.5">
-              <ProjectAction
-                label={props.controller.labels.add()}
-                onSelect={() => props.controller.add(props.controller.servers()[0]?.key)}
-              />
-            </div>
-          </Show>
-        </Popover.Content>
-      </Popover.Portal>
-    </Popover>
+          <div class="h-px bg-v2-border-border-muted" />
+          <div class="flex flex-col p-0.5">
+            <Show
+              when={props.controller.servers().length > 1}
+              fallback={
+                <ProjectAction
+                  server={props.controller.servers()[0]?.key}
+                  controller={props.controller}
+                  onSelect={selectAction}
+                />
+              }
+            >
+              <DropdownMenu.Sub>
+                <DropdownMenu.SubTrigger
+                  id={props.controller.actionKey()}
+                  data-option-key={props.controller.actionKey()}
+                  class={projectActionClass}
+                  classList={{
+                    "!bg-v2-overlay-simple-overlay-hover": props.controller.active() === props.controller.actionKey(),
+                  }}
+                  onMouseEnter={() => props.controller.setActive(props.controller.actionKey())}
+                >
+                  <Icon name="plus" size="small" />
+                  <span data-slot="dropdown-menu-item-label" class="min-w-0 flex-1 truncate leading-5">
+                    {props.controller.labels.add()}
+                  </span>
+                  <Icon name="chevron-right" size="small" class="shrink-0 text-v2-icon-icon-muted" />
+                </DropdownMenu.SubTrigger>
+                <DropdownMenu.Portal>
+                  <DropdownMenu.SubContent class="min-w-[180px] overflow-hidden rounded-md border-0 bg-v2-background-bg-layer-01 p-0.5 shadow-[var(--v2-elevation-floating)] focus:outline-none">
+                    <For each={props.controller.servers()}>
+                      {(server) => <ServerAction server={server!} onSelect={selectAction} />}
+                    </For>
+                  </DropdownMenu.SubContent>
+                </DropdownMenu.Portal>
+              </DropdownMenu.Sub>
+            </Show>
+          </div>
+        </DropdownMenu.Content>
+      </DropdownMenu.Portal>
+    </DropdownMenu>
   )
 }
 
@@ -205,15 +418,29 @@ export function PromptProjectAddButton(props: { controller: PromptProjectControl
 }
 
 function ProjectTrigger(props: ComponentProps<"button"> & { controller: PromptProjectController }) {
-  const [local, rest] = splitProps(props, ["controller", "class", "onClick"])
+  const [local, rest] = splitProps(props, ["controller", "class", "classList", "onClick", "onKeyDown"])
   const project = () => local.controller.selected()
   return (
     <button
       {...rest}
       data-action="prompt-project"
       type="button"
-      class="flex h-7 min-w-0 max-w-[203px] items-center gap-1.5 rounded-sm px-2 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-faint transition-colors hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none"
-      onClick={() => local.controller.setOpen(true)}
+      class="flex h-7 min-w-0 max-w-[203px] items-center gap-1.5 rounded-sm px-1.5 transition-colors focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none"
+      classList={{
+        ...local.classList,
+        "hover:bg-v2-overlay-simple-overlay-hover": !local.controller.open(),
+        "bg-v2-overlay-simple-overlay-pressed": local.controller.open(),
+        "text-v2-text-text-muted": local.controller.open(),
+      }}
+      onClick={local.onClick ?? (() => local.controller.setOpen(true))}
+      onKeyDown={(event) => {
+        if (!local.controller.open() && (event.key === "ArrowDown" || event.key === "ArrowUp")) {
+          event.preventDefault()
+          event.stopPropagation()
+          return
+        }
+        if (typeof local.onKeyDown === "function") local.onKeyDown(event)
+      }}
     >
       <Show
         when={project()}
@@ -237,42 +464,88 @@ function ProjectTrigger(props: ComponentProps<"button"> & { controller: PromptPr
 
 function ProjectItem(props: {
   project: PromptProject
-  selected?: PromptProject
+  controller: PromptProjectController
   onSelect: (project: PromptProject) => void
 }) {
+  const key = () => props.controller.projectKey(props.project)
   return (
-    <button
-      type="button"
-      class="flex h-7 w-full items-center gap-2 rounded-sm px-3 text-left text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none"
-      onClick={() => props.onSelect(props.project)}
+    <DropdownMenu.RadioItem
+      id={key()}
+      value={key()}
+      data-option-key={key()}
+      class="h-7 gap-2 rounded-sm px-3 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base data-[highlighted]:!bg-v2-overlay-simple-overlay-hover"
+      classList={{ "!bg-v2-overlay-simple-overlay-hover": props.controller.active() === key() }}
+      style={{
+        "font-family": "var(--v2-font-family-sans)",
+        "font-size": "13px",
+        "font-weight": 440,
+        "line-height": "20px",
+        "letter-spacing": "-0.04px",
+        color: "var(--v2-text-text-base)",
+        padding: "0 12px",
+      }}
+      closeOnSelect
+      onMouseEnter={() => {
+        props.controller.setActive(key())
+        props.controller.focusSearch()
+      }}
+      onSelect={() => props.onSelect(props.project)}
     >
       <ProjectAvatar
         fallback={displayName(props.project)}
         src={getProjectAvatarSource(props.project.id, props.project.icon)}
         variant={getProjectAvatarVariant(props.project.icon?.color)}
       />
-      <span class="min-w-0 flex-1 truncate leading-5">{displayName(props.project)}</span>
-      <Show
-        when={
-          props.selected?.worktree === props.project.worktree &&
-          props.selected?.server?.key === props.project.server?.key
-        }
-      >
-        <Icon name="check-small" size="small" class="shrink-0 text-v2-icon-icon-base" />
-      </Show>
-    </button>
+      <DropdownMenu.ItemLabel class="min-w-0 truncate leading-5">{displayName(props.project)}</DropdownMenu.ItemLabel>
+      <DropdownMenu.ItemIndicator style={{ width: "14px", height: "14px", right: "12px" }}>
+        <IconV2 name="check" size="small" class="shrink-0 text-v2-icon-icon-base" />
+      </DropdownMenu.ItemIndicator>
+    </DropdownMenu.RadioItem>
   )
 }
 
-function ProjectAction(props: { label: string; onSelect: () => void }) {
+const projectActionClass =
+  "h-7 gap-2 rounded-sm px-3 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base [font-family:var(--v2-font-family-sans)] data-[highlighted]:!bg-v2-overlay-simple-overlay-hover"
+
+function ProjectAction(props: {
+  server?: string
+  controller: PromptProjectController
+  onSelect: (server?: string) => void
+}) {
+  const key = () => props.controller.actionKey(props.server)
   return (
-    <button
-      type="button"
-      class="flex h-7 w-full items-center gap-2 rounded-sm px-3 text-left text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none"
-      onClick={props.onSelect}
+    <DropdownMenu.Item
+      id={key()}
+      data-option-key={key()}
+      class="h-7 gap-2 rounded-sm px-3 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base data-[highlighted]:!bg-v2-overlay-simple-overlay-hover"
+      classList={{ "!bg-v2-overlay-simple-overlay-hover": props.controller.active() === key() }}
+      style={{
+        "font-family": "var(--v2-font-family-sans)",
+        "font-size": "13px",
+        "font-weight": 440,
+        "line-height": "20px",
+        "letter-spacing": "-0.04px",
+        color: "var(--v2-text-text-base)",
+        padding: "0 12px",
+      }}
+      onMouseEnter={() => {
+        props.controller.setActive(key())
+        props.controller.focusSearch()
+      }}
+      onSelect={() => props.onSelect(props.server)}
     >
       <Icon name="plus" size="small" />
-      <span class="min-w-0 flex-1 truncate leading-5">{props.label}</span>
-    </button>
+      <DropdownMenu.ItemLabel class="min-w-0 truncate leading-5">
+        {props.controller.labels.add()}
+      </DropdownMenu.ItemLabel>
+    </DropdownMenu.Item>
+  )
+}
+
+function ServerAction(props: { server: { key: string; name: string }; onSelect: (server: string) => void }) {
+  return (
+    <DropdownMenu.Item class={projectActionClass} onSelect={() => props.onSelect(props.server.key)}>
+      <DropdownMenu.ItemLabel class="min-w-0 flex-1 truncate leading-5">{props.server.name}</DropdownMenu.ItemLabel>
+    </DropdownMenu.Item>
   )
 }

packages/app/src/components/prompt-workspace-selector.tsx

@@ -0,0 +1,102 @@
+import { For, Show } from "solid-js"
+import { MenuV2 } from "@opencode-ai/ui/v2/menu-v2"
+import { Icon } from "@opencode-ai/ui/icon"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
+import { getFilename } from "@opencode-ai/core/util/path"
+import { useLanguage } from "@/context/language"
+
+export function PromptWorkspaceSelector(props: {
+  value: string
+  projectRoot: string
+  workspaces: string[]
+  branch?: string
+  onChange: (value: string) => void
+  onDone: () => void
+}) {
+  const language = useLanguage()
+  let pending: string | undefined
+  const selected = () => (props.value === props.projectRoot ? "main" : props.value)
+  const icon = () => {
+    if (selected() === "main") return "monitor"
+    if (selected() === "create") return "workspace-new"
+    return "workspace"
+  }
+  const select = (value: string) => {
+    pending = value
+  }
+  const onOpenChange = (open: boolean) => {
+    if (open) return
+    const value = pending
+    pending = undefined
+    if (value) props.onChange(value)
+    props.onDone()
+  }
+  const label = () => {
+    if (selected() === "main") return language.t("session.new.workspace.triggerLocal")
+    if (props.value === "create") return language.t("workspace.new")
+    return getFilename(props.value)
+  }
+
+  return (
+    <>
+      <span class="hidden select-none opacity-50 sm:inline mx-1">/</span>
+      <MenuV2 placement="bottom" gutter={4} onOpenChange={onOpenChange}>
+        <MenuV2.Trigger class="flex h-7 min-w-0 max-w-[203px] items-center gap-1.5 rounded-sm px-1.5 hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none data-[expanded]:bg-v2-overlay-simple-overlay-pressed data-[expanded]:text-v2-text-text-muted">
+          <IconV2 name={icon()} class="shrink-0 text-v2-icon-icon-muted" />
+          <span class="min-w-0 truncate">{label()}</span>
+          <Icon name="chevron-down" size="small" class="shrink-0 text-v2-icon-icon-muted" />
+        </MenuV2.Trigger>
+        <MenuV2.Portal>
+          <MenuV2.Content class="w-[180px]">
+            <MenuV2.Group>
+              <MenuV2.GroupLabel>{language.t("session.new.workspace.runIn")}</MenuV2.GroupLabel>
+              <MenuV2.Item onSelect={() => select("main")}>
+                <IconV2 name="monitor" />
+                <span class="min-w-0 flex-1 truncate">{language.t("session.new.workspace.local")}</span>
+                <Show when={selected() === "main"}>
+                  <Icon name="check" size="small" class="shrink-0" />
+                </Show>
+              </MenuV2.Item>
+              <MenuV2.Item onSelect={() => select("create")}>
+                <IconV2 name="workspace-new" />
+                <span class="min-w-0 flex-1 truncate">{language.t("workspace.new")}</span>
+                <Show when={selected() === "create"}>
+                  <Icon name="check" size="small" class="shrink-0" />
+                </Show>
+              </MenuV2.Item>
+            </MenuV2.Group>
+            <Show when={props.workspaces.length > 0}>
+              <MenuV2.Separator />
+              <MenuV2.Sub gutter={0} overlap overflowPadding={8}>
+                <MenuV2.SubTrigger>
+                  <IconV2 name="workspace" />
+                  {language.t("session.new.workspace.existing")}
+                </MenuV2.SubTrigger>
+                <MenuV2.Portal>
+                  <MenuV2.SubContent class="max-w-[200px]">
+                    <For each={props.workspaces}>
+                      {(workspace) => (
+                        <MenuV2.Item onSelect={() => select(workspace)}>
+                          <IconV2 name="workspace-isolated" />
+                          <span class="min-w-0 flex-1 truncate">{getFilename(workspace)}</span>
+                          <Show when={selected() === workspace}>
+                            <Icon name="check" size="small" class="shrink-0" />
+                          </Show>
+                        </MenuV2.Item>
+                      )}
+                    </For>
+                  </MenuV2.SubContent>
+                </MenuV2.Portal>
+              </MenuV2.Sub>
+            </Show>
+          </MenuV2.Content>
+        </MenuV2.Portal>
+      </MenuV2>
+      <span class="hidden select-none opacity-50 sm:inline mx-1">/</span>
+      <div class="flex h-7 min-w-0 max-w-[220px] items-center gap-1.5 px-2 text-[13px] font-[440] leading-5 tracking-[-0.04px]">
+        <Icon name="branch" size="small" class="shrink-0 text-v2-icon-icon-muted" />
+        <span class="min-w-0 truncate">{props.branch || "main"}</span>
+      </div>
+    </>
+  )
+}

packages/app/src/components/settings-v2/dialog-server-v2.tsx

@@ -1,5 +1,6 @@
 import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
-import { Dialog, DialogFooter } from "@opencode-ai/ui/v2/dialog-v2"
+import { Dialog, DialogBody, DialogFooter, DialogHeader, DialogTitle } from "@opencode-ai/ui/v2/dialog-v2"
+import { DividerV2 } from "@opencode-ai/ui/v2/divider-v2"
 import { TextInputV2 } from "@opencode-ai/ui/v2/text-input-v2"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { type Component, Show, createEffect, createSignal, onCleanup, onMount } from "solid-js"
@@ -52,8 +53,12 @@ export const DialogServerV2: Component<{
   }
 
   return (
-    <Dialog title={title()} fit class="settings-v2-server-dialog">
-      <div class="flex w-full min-w-0 flex-1 flex-col px-4">
+    <Dialog fit class="settings-v2-server-dialog">
+      <DialogHeader hideClose={true}>
+        <DialogTitle>{title()}</DialogTitle>
+      </DialogHeader>
+      <DividerV2 />
+      <DialogBody class="flex w-full min-w-0 flex-1 flex-col px-4 pt-4 pb-2">
         <div class="flex w-full min-w-0 flex-col gap-6">
           <div class="flex w-full min-w-0 flex-col gap-2">
             <label class="settings-v2-server-dialog-label">{language.t("dialog.server.add.url")}</label>
@@ -115,7 +120,7 @@ export const DialogServerV2: Component<{
             </div>
           </div>
         </div>
-      </div>
+      </DialogBody>
       <DialogFooter>
         <ButtonV2 variant="neutral" disabled={controller.formBusy()} onClick={() => dialog.close()}>
           {language.t("common.cancel")}

packages/app/src/components/settings-v2/settings-v2.css

@@ -633,7 +633,7 @@
 
 [data-component="dialog-v2"].settings-v2-server-dialog [data-slot="dialog-header"] {
   align-items: center;
-  padding: 24px 24px 0;
+  padding: 24px 24px 16px;
 }
 
 [data-component="dialog-v2"].settings-v2-server-dialog [data-slot="dialog-body"] {

packages/app/src/components/titlebar-tab-drag.test.ts

@@ -1,141 +0,0 @@
-import { describe, expect, test } from "bun:test"
-import { captureTabDragLayout, insertIndexFromVirtualLayout } from "./titlebar-tab-drag"
-import {
-  canOpenTabRename,
-  captureTabPointerDown,
-  canStartTabDrag,
-  createTabDragPreview,
-  forwardTabRef,
-  isPrimaryPointerPressed,
-  isTabCloseTarget,
-} from "./titlebar-tab-gesture"
-
-describe("titlebar tab drag", () => {
-  const layout = {
-    listLeft: 100,
-    dividerWidth: 13,
-    tabWidthById: new Map([
-      ["a", 40],
-      ["b", 40],
-      ["c", 40],
-      ["d", 40],
-    ]),
-  }
-
-  test("moves across multiple tabs from one pointer update", () => {
-    expect(insertIndexFromVirtualLayout(260, ["a", "b", "c", "d"], "a", 0, layout)).toBe(3)
-    expect(insertIndexFromVirtualLayout(90, ["a", "b", "c", "d"], "d", 3, layout)).toBe(0)
-  })
-
-  test("keeps the current index inside the left hysteresis deadband", () => {
-    expect(insertIndexFromVirtualLayout(146, ["a", "b", "c", "d"], "b", 1, layout)).toBe(1)
-  })
-
-  test("includes slot margins in captured divider width", () => {
-    const list = document.createElement("div")
-    const first = document.createElement("div")
-    const second = document.createElement("div")
-    const firstTab = document.createElement("div")
-    const secondTab = document.createElement("div")
-    first.dataset.titlebarTabSlot = ""
-    first.dataset.tabKey = "a"
-    second.dataset.titlebarTabSlot = ""
-    second.dataset.tabKey = "b"
-    second.style.marginLeft = "6px"
-    firstTab.dataset.titlebarTab = ""
-    secondTab.dataset.titlebarTab = ""
-    first.append(firstTab)
-    second.append(secondTab)
-    list.append(first, second)
-    document.body.append(list)
-    firstTab.getBoundingClientRect = () => ({ width: 40 }) as DOMRect
-    secondTab.getBoundingClientRect = () => ({ width: 40 }) as DOMRect
-    second.getBoundingClientRect = () => ({ width: 47 }) as DOMRect
-    list.getBoundingClientRect = () => ({ left: 100 }) as DOMRect
-
-    expect(captureTabDragLayout(list, ["a", "b"]).dividerWidth).toBe(13)
-    list.remove()
-  })
-
-  test("uses the list gap as the divider width", () => {
-    const list = document.createElement("div")
-    const first = document.createElement("div")
-    const second = document.createElement("div")
-    const firstTab = document.createElement("div")
-    const secondTab = document.createElement("div")
-    first.dataset.titlebarTabSlot = ""
-    first.dataset.tabKey = "a"
-    second.dataset.titlebarTabSlot = ""
-    second.dataset.tabKey = "b"
-    firstTab.dataset.titlebarTab = ""
-    secondTab.dataset.titlebarTab = ""
-    first.append(firstTab)
-    second.append(secondTab)
-    list.append(first, second)
-    list.style.columnGap = "13.5px"
-    document.body.append(list)
-
-    expect(captureTabDragLayout(list, ["a", "b"]).dividerWidth).toBe(13.5)
-    list.remove()
-  })
-})
-
-describe("titlebar tab gestures", () => {
-  test("excludes close controls from tab gestures", () => {
-    const close = document.createElement("div")
-    const button = document.createElement("button")
-    const link = document.createElement("a")
-    close.dataset.slot = "tab-close"
-    close.append(button)
-    expect(isTabCloseTarget(close)).toBe(true)
-    expect(isTabCloseTarget(button)).toBe(true)
-    expect(isTabCloseTarget(link)).toBe(false)
-  })
-
-  test("forwards component refs", () => {
-    const element = document.createElement("div")
-    let received: HTMLDivElement | undefined
-    forwardTabRef((value) => (received = value), element)
-    expect(received).toBe(element)
-  })
-
-  test("does not reopen rename while a save is pending", () => {
-    expect(canOpenTabRename(false, false, false)).toBe(true)
-    expect(canOpenTabRename(false, false, true)).toBe(false)
-  })
-
-  test("keeps the rendered tab content in the drag preview", () => {
-    const tab = document.createElement("div")
-    tab.innerHTML = '<span data-slot="project-avatar-slot"></span><span data-slot="tab-title">Session</span>'
-    const preview = createTabDragPreview(tab)
-    expect(preview.querySelector('[data-slot="project-avatar-slot"]')).not.toBeNull()
-    expect(preview.querySelector('[data-slot="tab-title"]')?.textContent).toBe("Session")
-  })
-
-  test("captures the grab offset before navigation scrolls the tab", () => {
-    const tab = document.createElement("div")
-    tab.getBoundingClientRect = () => ({ left: 80, top: 10, width: 120 }) as DOMRect
-
-    expect(captureTabPointerDown(tab, 100, 20)).toEqual({
-      startX: 100,
-      startY: 20,
-      grabOffsetX: 20,
-      grabOffsetY: 10,
-      width: 120,
-      element: tab,
-    })
-  })
-
-  test("detects when the primary pointer button was released outside the window", () => {
-    expect(isPrimaryPointerPressed(1)).toBe(true)
-    expect(isPrimaryPointerPressed(3)).toBe(true)
-    expect(isPrimaryPointerPressed(0)).toBe(false)
-    expect(isPrimaryPointerPressed(2)).toBe(false)
-  })
-
-  test("preserves native panning for touch pointers", () => {
-    expect(canStartTabDrag("mouse")).toBe(true)
-    expect(canStartTabDrag("pen")).toBe(true)
-    expect(canStartTabDrag("touch")).toBe(false)
-  })
-})

packages/app/src/components/titlebar-tab-drag.ts

@@ -1,137 +0,0 @@
-export type TabDragLayout = {
-  tabWidthById: Map<string, number>
-  dividerWidth: number
-  listLeft: number
-}
-
-export const ACTIVATION_DISTANCE = 4
-export const HYSTERESIS_DEADBAND = 8
-export const AUTOSCROLL_EDGE = 24
-export const AUTOSCROLL_MAX_SPEED = 8
-export const FLOATER_OVERSHOOT_MAX = 8
-
-export function pointerDistance(x1: number, y1: number, x2: number, y2: number) {
-  const dx = x2 - x1
-  const dy = y2 - y1
-  return Math.sqrt(dx * dx + dy * dy)
-}
-
-export function captureTabDragLayout(list: HTMLElement, order: string[]) {
-  const tabWidthById = new Map<string, number>()
-  const slots = list.querySelectorAll<HTMLElement>("[data-titlebar-tab-slot]")
-  for (const slot of slots) {
-    const id = slot.dataset.tabKey
-    if (!id) continue
-    const tab = slot.matches("[data-titlebar-tab]") ? slot : slot.querySelector<HTMLElement>("[data-titlebar-tab]")
-    if (!tab) continue
-    tabWidthById.set(id, tab.getBoundingClientRect().width)
-  }
-
-  let dividerWidth = 0
-  if (order.length >= 2) {
-    const gap = Number.parseFloat(getComputedStyle(list).columnGap) || 0
-    const secondId = order[1]
-    for (const slot of slots) {
-      if (slot.dataset.tabKey !== secondId) continue
-      const tab = slot.matches("[data-titlebar-tab]") ? slot : slot.querySelector<HTMLElement>("[data-titlebar-tab]")
-      if (!tab) break
-      const style = getComputedStyle(slot)
-      dividerWidth =
-        gap ||
-        slot.getBoundingClientRect().width -
-          tab.getBoundingClientRect().width +
-          (Number.parseFloat(style.marginLeft) || 0) +
-          (Number.parseFloat(style.marginRight) || 0)
-      break
-    }
-  }
-
-  return {
-    tabWidthById,
-    dividerWidth,
-    listLeft: list.getBoundingClientRect().left,
-  }
-}
-
-export function syncLayoutScroll(list: HTMLElement, layout: TabDragLayout) {
-  layout.listLeft = list.getBoundingClientRect().left
-}
-
-function slotWidthAt(order: readonly string[], index: number, layout: TabDragLayout) {
-  const id = order[index]
-  if (!id) return 0
-  const tabWidth = layout.tabWidthById.get(id) ?? 0
-  return index === 0 ? tabWidth : layout.dividerWidth + tabWidth
-}
-
-function slotLeft(order: readonly string[], index: number, layout: TabDragLayout) {
-  let left = layout.listLeft
-  for (let i = 0; i < index; i++) {
-    left += slotWidthAt(order, i, layout)
-  }
-  return left
-}
-
-export function insertIndexFromVirtualLayout(
-  pointerX: number,
-  order: readonly string[],
-  draggedId: string,
-  currentIndex: number,
-  layout: TabDragLayout,
-  deadband = HYSTERESIS_DEADBAND,
-) {
-  if (order.length === 0) return 0
-
-  const others = order.filter((id) => id !== draggedId)
-  let target = currentIndex
-
-  while (target > 0 && pointerX < slotLeft(others, target, layout) - deadband) target--
-  while (target < order.length - 1 && pointerX >= slotLeft(others, target + 1, layout)) target++
-
-  return target
-}
-
-export function movePlaceholder(order: readonly string[], draggedId: string, toIndex: number) {
-  const fromIndex = order.indexOf(draggedId)
-  if (fromIndex === -1 || fromIndex === toIndex) return [...order]
-  const next = [...order]
-  next.splice(toIndex, 0, ...next.splice(fromIndex, 1))
-  return next
-}
-
-export function draftOrderChanged(initial: readonly string[], final: readonly string[]) {
-  if (initial.length === 0 || final.length === 0 || initial.length !== final.length) return false
-  return final.some((key, index) => key !== initial[index])
-}
-
-function easeOvershoot(overshoot: number) {
-  return (FLOATER_OVERSHOOT_MAX * overshoot) / (overshoot + FLOATER_OVERSHOOT_MAX)
-}
-
-export function clampFloaterLeft(left: number, width: number, stripLeft: number, stripRight: number) {
-  const stripWidth = stripRight - stripLeft
-  if (width >= stripWidth) return stripLeft
-
-  const maxLeft = stripRight - width
-  if (left > maxLeft) return maxLeft + easeOvershoot(left - maxLeft)
-  if (left < stripLeft) return stripLeft - easeOvershoot(stripLeft - left)
-
-  return left
-}
-
-export function autoscrollSpeed(pointerX: number, containerLeft: number, containerRight: number) {
-  const leftEdge = containerLeft + AUTOSCROLL_EDGE
-  const rightEdge = containerRight - AUTOSCROLL_EDGE
-
-  if (pointerX < leftEdge) {
-    const depth = (leftEdge - pointerX) / AUTOSCROLL_EDGE
-    return -Math.ceil(AUTOSCROLL_MAX_SPEED * Math.min(depth, 1))
-  }
-
-  if (pointerX > rightEdge) {
-    const depth = (pointerX - rightEdge) / AUTOSCROLL_EDGE
-    return Math.ceil(AUTOSCROLL_MAX_SPEED * Math.min(depth, 1))
-  }
-
-  return 0
-}

packages/app/src/components/titlebar-tab-gesture.test.ts

@@ -0,0 +1,33 @@
+import { describe, expect, test } from "bun:test"
+import { canOpenTabRename, canStartTabDrag, forwardTabRef, isTabCloseTarget } from "./titlebar-tab-gesture"
+
+describe("titlebar tab gestures", () => {
+  test("excludes close controls from tab gestures", () => {
+    const close = document.createElement("div")
+    const button = document.createElement("button")
+    const link = document.createElement("a")
+    close.dataset.slot = "tab-close"
+    close.append(button)
+    expect(isTabCloseTarget(close)).toBe(true)
+    expect(isTabCloseTarget(button)).toBe(true)
+    expect(isTabCloseTarget(link)).toBe(false)
+  })
+
+  test("forwards component refs", () => {
+    const element = document.createElement("div")
+    let received: HTMLDivElement | undefined
+    forwardTabRef((value) => (received = value), element)
+    expect(received).toBe(element)
+  })
+
+  test("does not reopen rename while a save is pending", () => {
+    expect(canOpenTabRename(false, false, false)).toBe(true)
+    expect(canOpenTabRename(false, false, true)).toBe(false)
+  })
+
+  test("preserves native panning for touch pointers", () => {
+    expect(canStartTabDrag("mouse")).toBe(true)
+    expect(canStartTabDrag("pen")).toBe(true)
+    expect(canStartTabDrag("touch")).toBe(false)
+  })
+})

packages/app/src/components/titlebar-tab-gesture.ts

@@ -8,22 +8,6 @@ export function canStartTabDrag(pointerType: string) {
   return pointerType !== "touch"
 }
 
-export function isPrimaryPointerPressed(buttons: number) {
-  return (buttons & 1) !== 0
-}
-
-export function captureTabPointerDown(element: HTMLDivElement, clientX: number, clientY: number) {
-  const rect = element.getBoundingClientRect()
-  return {
-    startX: clientX,
-    startY: clientY,
-    grabOffsetX: clientX - rect.left,
-    grabOffsetY: clientY - rect.top,
-    width: rect.width,
-    element,
-  }
-}
-
 export function forwardTabRef(ref: Ref<HTMLDivElement> | undefined, element: HTMLDivElement) {
   if (typeof ref === "function") ref(element)
 }
@@ -31,7 +15,3 @@ export function forwardTabRef(ref: Ref<HTMLDivElement> | undefined, element: HTM
 export function canOpenTabRename(dragging: boolean | undefined, editing: boolean, committing: boolean) {
   return !dragging && !editing && !committing
 }
-
-export function createTabDragPreview(element: HTMLDivElement) {
-  return element.cloneNode(true) as HTMLDivElement
-}

packages/app/src/components/titlebar-tab-nav.css

@@ -9,6 +9,10 @@
   justify-content: center;
 }
 
+[data-titlebar-tab][data-editing="true"] [data-slot="tab-close"] {
+  display: none;
+}
+
 [data-titlebar-tab-list] {
   gap: 13.5px;
 }

packages/app/src/components/titlebar-tab-nav.tsx

@@ -29,9 +29,6 @@ export function TabNavItem(props: {
   dragging?: boolean
   pressed?: boolean
   hidden?: boolean
-  tabKey: string
-  dragActive: boolean
-  onPointerDown: (event: PointerEvent) => void
 }) {
   const language = useLanguage()
   const [editing, setEditing] = createSignal(false)
@@ -173,112 +170,105 @@ export function TabNavItem(props: {
 
   return (
     <div
-      data-titlebar-tab-slot
-      data-tab-key={props.tabKey}
-      class="relative flex w-56 min-w-7 max-w-56 flex-shrink"
-      classList={{ invisible: props.hidden, "pointer-events-none": props.dragActive }}
-      onPointerDown={props.onPointerDown}
+      ref={(el) => {
+        tabRoot = el
+        forwardTabRef(props.ref, el)
+      }}
+      data-titlebar-tab
+      data-slot="titlebar-tab-item"
+      data-title-overflow={titleOverflowing()}
+      data-editing={editing()}
+      class="group relative flex h-7 w-full min-w-0 select-none flex-row items-center gap-1.5 overflow-hidden whitespace-nowrap rounded-[6px] bg-[var(--tab-bg)] px-1.5 [container-type:inline-size] [--tab-bg:var(--v2-background-bg-deep)] hover:[--tab-bg:var(--v2-background-bg-layer-02)] has-[>a:focus-visible]:[--tab-bg:var(--v2-background-bg-layer-02)] data-[active='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[dragging='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[pressed='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[editing='true']:[--tab-bg:var(--v2-background-bg-layer-02)]"
+      classList={{ invisible: props.hidden }}
+      data-active={props.active}
+      data-dragging={props.dragging}
+      data-pressed={props.pressed}
+      onMouseDown={(event) => {
+        if (event.button !== 1) return
+        closeTab(event)
+      }}
     >
-      <div
-        ref={(el) => {
-          tabRoot = el
-          forwardTabRef(props.ref, el)
-        }}
-        data-titlebar-tab
-        data-slot="titlebar-tab-item"
-        data-title-overflow={titleOverflowing()}
-        data-editing={editing()}
-        class="group relative flex h-7 w-full min-w-0 select-none flex-row items-center gap-1.5 overflow-hidden whitespace-nowrap rounded-[6px] bg-[var(--tab-bg)] px-1.5 [container-type:inline-size] [--tab-bg:var(--v2-background-bg-deep)] hover:[--tab-bg:var(--v2-background-bg-layer-02)] has-[>a:focus-visible]:[--tab-bg:var(--v2-background-bg-layer-02)] data-[active='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[dragging='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[pressed='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[editing='true']:[--tab-bg:var(--v2-background-bg-layer-02)]"
-        data-active={props.active}
-        data-dragging={props.dragging}
-        data-pressed={props.pressed}
-        onMouseDown={(event) => {
-          if (event.button !== 1) return
-          closeTab(event)
-        }}
-      >
-        <Show when={props.session()}>
-          {(session) => {
-            return (
-              <a
-                data-slot="tab-link"
-                data-titlebar-tab-link
-                href={props.href}
-                draggable={false}
-                onDragStart={(event) => {
+      <Show when={props.session()}>
+        {(session) => {
+          return (
+            <a
+              data-slot="tab-link"
+              data-titlebar-tab-link
+              href={props.href}
+              draggable={false}
+              onDragStart={(event) => {
+                event.preventDefault()
+                event.stopPropagation()
+              }}
+              onClick={(event) => {
+                event.preventDefault()
+                if (editing()) return
+                if (props.suppressNavigation?.()) return
+                props.onNavigate()
+              }}
+              class="flex h-full min-w-0 flex-1 flex-row items-center gap-1.5 text-[13px] font-medium text-v2-text-text-faint group-data-[active='true']:text-v2-text-text-base group-data-[editing='true']:text-v2-text-text-base [-webkit-user-drag:none]"
+            >
+              <span data-slot="project-avatar-slot">
+                <SessionTabAvatar
+                  project={project()}
+                  directory={session().directory}
+                  sessionId={session().id}
+                  activeServer={props.activeServer}
+                />
+              </span>
+              <span
+                ref={(el) => {
+                  titleEl = el
+                  titleEl.textContent = session().title
+                }}
+                data-slot="tab-title"
+                data-titlebar-tab-title
+                class="min-w-0 flex-1 outline-none leading-4"
+                classList={{
+                  "overflow-hidden text-clip whitespace-nowrap": !editing(),
+                  "select-text": editing(),
+                }}
+                contenteditable={editing() ? true : undefined}
+                onDblClick={openRename}
+                onKeyDown={(event) => {
+                  event.stopPropagation()
+                  if (event.key === "Enter") {
+                    event.preventDefault()
+                    void closeRename(true)
+                    return
+                  }
+                  if (event.key !== "Escape") return
                   event.preventDefault()
+                  titleEl.textContent = session().title
+                  void closeRename(false)
+                }}
+                onBlur={() => void closeRename(true)}
+                onPointerDown={(event) => {
+                  if (!editing()) return
                   event.stopPropagation()
                 }}
                 onClick={(event) => {
+                  if (!editing()) return
                   event.preventDefault()
-                  if (editing()) return
-                  if (props.suppressNavigation?.()) return
-                  props.onNavigate()
                 }}
-                class="flex h-full min-w-0 flex-1 flex-row items-center gap-1.5 text-[13px] font-medium text-v2-text-text-faint group-data-[active='true']:text-v2-text-text-base group-data-[editing='true']:text-v2-text-text-base [-webkit-user-drag:none]"
-              >
-                <span data-slot="project-avatar-slot">
-                  <SessionTabAvatar
-                    project={project()}
-                    directory={session().directory}
-                    sessionId={session().id}
-                    activeServer={props.activeServer}
-                  />
-                </span>
-                <span
-                  ref={(el) => {
-                    titleEl = el
-                    titleEl.textContent = session().title
-                  }}
-                  data-slot="tab-title"
-                  data-titlebar-tab-title
-                  class="min-w-0 flex-1 outline-none leading-4"
-                  classList={{
-                    "overflow-hidden text-clip whitespace-nowrap": !editing(),
-                    "select-text": editing(),
-                  }}
-                  contenteditable={editing() ? true : undefined}
-                  onDblClick={openRename}
-                  onKeyDown={(event) => {
-                    event.stopPropagation()
-                    if (event.key === "Enter") {
-                      event.preventDefault()
-                      void closeRename(true)
-                      return
-                    }
-                    if (event.key !== "Escape") return
-                    event.preventDefault()
-                    titleEl.textContent = session().title
-                    void closeRename(false)
-                  }}
-                  onBlur={() => void closeRename(true)}
-                  onPointerDown={(event) => {
-                    if (!editing()) return
-                    event.stopPropagation()
-                  }}
-                  onClick={(event) => {
-                    if (!editing()) return
-                    event.preventDefault()
-                  }}
-                />
-              </a>
-            )
-          }}
-        </Show>
+              />
+            </a>
+          )
+        }}
+      </Show>
 
-        <div data-slot="tab-close" class="group-hover:bg-[var(--tab-bg)] group-data-[active=true]:bg-[var(--tab-bg)]">
-          <IconButtonV2
-            size="small"
-            variant="ghost-muted"
-            class="hover-reveal relative z-10 group-hover:opacity-100 group-data-[active=true]:opacity-100 group-data-[editing=true]:opacity-100"
-            onPointerDown={(event) => {
-              event.preventDefault()
-              event.stopPropagation()
-            }}
-            onClick={closeTab}
-            icon={<IconV2 name="xmark-small" />}
-          />
-        </div>
+      <div data-slot="tab-close" class="group-hover:bg-[var(--tab-bg)] group-data-[active=true]:bg-[var(--tab-bg)]">
+        <IconButtonV2
+          size="small"
+          variant="ghost-muted"
+          class="hover-reveal relative z-10 group-hover:opacity-100 group-data-[active=true]:opacity-100 group-data-[editing=true]:opacity-100"
+          onPointerDown={(event) => {
+            event.preventDefault()
+            event.stopPropagation()
+          }}
+          onClick={closeTab}
+          icon={<IconV2 name="xmark-small" />}
+        />
       </div>
     </div>
   )
@@ -295,9 +285,6 @@ export function DraftTabItem(props: {
   dragging?: boolean
   pressed?: boolean
   hidden?: boolean
-  tabKey: string
-  dragActive: boolean
-  onPointerDown: (event: PointerEvent) => void
 }) {
   const closeTab = (event: MouseEvent) => {
     event.preventDefault()
@@ -306,69 +293,62 @@ export function DraftTabItem(props: {
   }
   return (
     <div
-      data-titlebar-tab-slot
-      data-tab-key={props.tabKey}
-      class="relative flex w-56 min-w-7 max-w-56 flex-shrink"
-      classList={{ invisible: props.hidden, "pointer-events-none": props.dragActive }}
-      onPointerDown={props.onPointerDown}
+      ref={(el) => forwardTabRef(props.ref, el)}
+      data-titlebar-tab
+      data-slot="titlebar-tab-item"
+      data-active={props.active}
+      data-dragging={props.dragging}
+      data-pressed={props.pressed}
+      class="group relative flex h-7 w-full min-w-0 flex-row items-center gap-1.5 overflow-hidden rounded-[6px] bg-[var(--tab-bg)] px-1.5 [container-type:inline-size] whitespace-nowrap [--tab-bg:var(--v2-background-bg-deep)] hover:[--tab-bg:var(--v2-background-bg-layer-02)] has-[>a:focus-visible]:[--tab-bg:var(--v2-background-bg-layer-02)] data-[active='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[dragging='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[pressed='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[editing='true']:[--tab-bg:var(--v2-background-bg-layer-02)]"
+      classList={{ invisible: props.hidden }}
+      onMouseDown={(event) => {
+        if (event.button !== 1) return
+        closeTab(event)
+      }}
     >
-      <div
-        ref={(el) => forwardTabRef(props.ref, el)}
-        data-titlebar-tab
-        data-slot="titlebar-tab-item"
-        data-active={props.active}
-        data-dragging={props.dragging}
-        data-pressed={props.pressed}
-        class="group relative flex h-7 w-full min-w-0 select-none flex-row items-center gap-1.5 overflow-hidden whitespace-nowrap rounded-[6px] bg-[var(--tab-bg)] px-1.5 [container-type:inline-size] [--tab-bg:var(--v2-background-bg-deep)] hover:[--tab-bg:var(--v2-background-bg-layer-02)] has-[>a:focus-visible]:[--tab-bg:var(--v2-background-bg-layer-02)] data-[active='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[dragging='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[pressed='true']:[--tab-bg:var(--v2-background-bg-layer-02)]"
-        onMouseDown={(event) => {
-          if (event.button !== 1) return
-          closeTab(event)
+      <a
+        data-slot="tab-link"
+        data-titlebar-tab-link
+        href={props.href}
+        draggable={false}
+        onDragStart={(event) => {
+          event.preventDefault()
+          event.stopPropagation()
         }}
+        onClick={(event) => {
+          event.preventDefault()
+          if (props.suppressNavigation?.()) return
+          props.onNavigate()
+        }}
+        class="flex h-full min-w-0 flex-1 flex-row items-center gap-1.5 text-[13px] font-medium text-v2-text-text-faint group-data-[active='true']:text-v2-text-text-base [-webkit-user-drag:none]"
       >
-        <a
-          data-slot="tab-link"
-          data-titlebar-tab-link
-          href={props.href}
-          draggable={false}
-          onDragStart={(event) => {
+        <span class="flex size-4 shrink-0 items-center justify-center">
+          <IconV2 name="edit" />
+        </span>
+        <span
+          data-titlebar-tab-title
+          class="min-w-0 flex-1 overflow-hidden text-clip whitespace-nowrap outline-none leading-4"
+        >
+          {props.title}
+        </span>
+      </a>
+      <div data-slot="tab-close" class="group-hover:bg-[var(--tab-bg)] group-data-[active=true]:bg-[var(--tab-bg)]">
+        <IconButtonV2
+          size="small"
+          variant="ghost-muted"
+          onPointerDown={(event) => {
             event.preventDefault()
             event.stopPropagation()
           }}
-          onClick={(event) => {
+          onMouseDown={(event) => {
             event.preventDefault()
-            if (props.suppressNavigation?.()) return
-            props.onNavigate()
+            event.stopPropagation()
           }}
-          class="flex h-full min-w-0 flex-1 flex-row items-center gap-1.5 text-[13px] font-medium text-v2-text-text-faint group-data-[active='true']:text-v2-text-text-base [-webkit-user-drag:none]"
-        >
-          <span class="flex size-4 shrink-0 items-center justify-center">
-            <IconV2 name="edit" />
-          </span>
-          <span
-            data-titlebar-tab-title
-            class="min-w-0 flex-1 overflow-hidden text-clip whitespace-nowrap outline-none leading-4"
-          >
-            {props.title}
-          </span>
-        </a>
-        <div data-slot="tab-close" class="group-hover:bg-[var(--tab-bg)] group-data-[active=true]:bg-[var(--tab-bg)]">
-          <IconButtonV2
-            size="small"
-            variant="ghost-muted"
-            onPointerDown={(event) => {
-              event.preventDefault()
-              event.stopPropagation()
-            }}
-            onMouseDown={(event) => {
-              event.preventDefault()
-              event.stopPropagation()
-            }}
-            class="hover-reveal relative z-10 group-hover:opacity-100 group-data-[active=true]:opacity-100 group-data-[editing=true]:opacity-100"
-            onClick={closeTab}
-            icon={<IconV2 name="xmark-small" />}
-            aria-label="Close tab"
-          />
-        </div>
+          class="hover-reveal relative z-10 group-hover:opacity-100 group-data-[active=true]:opacity-100 group-data-[editing=true]:opacity-100"
+          onClick={closeTab}
+          icon={<IconV2 name="xmark-small" />}
+          aria-label="Close tab"
+        />
       </div>
     </div>
   )

packages/app/src/components/titlebar-tab-strip.tsx

@@ -1,18 +1,11 @@
-import {
-  createEffect,
-  createMemo,
-  createResource,
-  createRoot,
-  createSignal,
-  For,
-  onCleanup,
-  onMount,
-  Show,
-} from "solid-js"
-import { Portal } from "solid-js/web"
-import { createStore } from "solid-js/store"
-import { makeEventListener } from "@solid-primitives/event-listener"
+import { createEffect, createMemo, createResource, createRoot, For, onCleanup, onMount } from "solid-js"
 import { createResizeObserver } from "@solid-primitives/resize-observer"
+import { DragDropProvider, PointerSensor } from "@dnd-kit/solid"
+import { isSortable, useSortable } from "@dnd-kit/solid/sortable"
+import { Accessibility, AutoScroller, Feedback, PointerActivationConstraints } from "@dnd-kit/dom"
+import { RestrictToHorizontalAxis } from "@dnd-kit/abstract/modifiers"
+import { RestrictToElement } from "@dnd-kit/dom/modifiers"
+import { arrayMove } from "@dnd-kit/helpers"
 import { tabHref, tabKey, type SessionTab, type Tab } from "@/context/tabs"
 import { ServerConnection } from "@/context/server"
 import { DraftTabItem, TabNavItem } from "@/components/titlebar-tab-nav"
@@ -22,42 +15,30 @@ import { useCommand } from "@/context/command"
 import { useTabs } from "@/context/tabs"
 import { createTabPromptState } from "@/context/prompt"
 import { base64Encode } from "@opencode-ai/core/util/encode"
-import {
-  captureTabPointerDown,
-  canStartTabDrag,
-  createTabDragPreview,
-  isPrimaryPointerPressed,
-  isTabCloseTarget,
-} from "./titlebar-tab-gesture"
-import {
-  ACTIVATION_DISTANCE,
-  autoscrollSpeed,
-  captureTabDragLayout,
-  clampFloaterLeft,
-  draftOrderChanged,
-  insertIndexFromVirtualLayout,
-  movePlaceholder,
-  pointerDistance,
-  syncLayoutScroll,
-  type TabDragLayout,
-} from "@/components/titlebar-tab-drag"
+import { canStartTabDrag, isTabCloseTarget } from "./titlebar-tab-gesture"
+
+const sortableTransition = { duration: 0 }
 
 function SessionTabSlot(props: {
   tab: SessionTab
   id: string
+  index: () => number
   active: () => boolean
   activeServerKey: ServerConnection.Key
   forceTruncate: boolean
-  dragActive: boolean
-  dragged: () => boolean
-  pressed: () => boolean
   serverCtx: () => ServerCtx | undefined
-  suppressNavigation: () => boolean
-  onPointerDown: (event: PointerEvent) => void
   onNavigate: (element: HTMLDivElement) => void
   onClose: () => void
 }) {
   const tabs = useTabs()
+  const sortable = useSortable({
+    get id() {
+      return props.id
+    },
+    get index() {
+      return props.index()
+    },
+  })
   let ref!: HTMLDivElement
   const sdk = createMemo(() => props.serverCtx()?.sdk ?? null)
   const cachedSession = createMemo(() => props.serverCtx()?.sync.session.peek(props.tab.sessionId))
@@ -100,33 +81,79 @@ function SessionTabSlot(props: {
   })
 
   return (
-    <TabNavItem
-      tabKey={props.id}
-      dragActive={props.dragActive}
-      onPointerDown={props.onPointerDown}
-      ref={ref}
-      href={tabHref(props.tab)}
-      server={props.tab.server}
-      session={session}
-      onTitleChange={(title) => {
-        const value = session()
-        const ctx = props.serverCtx()
-        if (value && ctx) ctx.sync.session.remember({ ...value, title })
-      }}
-      onTitleChangeFailed={(title) => {
-        const value = session()
-        const ctx = props.serverCtx()
-        if (value && ctx) ctx.sync.session.remember({ ...value, title })
-      }}
-      onNavigate={() => props.onNavigate(ref)}
-      onClose={props.onClose}
-      active={props.active()}
-      activeServer={props.tab.server === props.activeServerKey}
-      forceTruncate={props.forceTruncate}
-      suppressNavigation={props.suppressNavigation}
-      pressed={props.pressed()}
-      hidden={props.dragged() || !session()}
-    />
+    <div
+      ref={sortable.ref}
+      data-titlebar-tab-slot
+      data-tab-key={props.id}
+      class="relative flex w-56 min-w-7 max-w-56 flex-shrink"
+      classList={{ hidden: !session() }}
+    >
+      <TabNavItem
+        ref={(el) => {
+          ref = el
+        }}
+        href={tabHref(props.tab)}
+        server={props.tab.server}
+        session={session}
+        onTitleChange={(title) => {
+          const value = session()
+          const ctx = props.serverCtx()
+          if (value && ctx) ctx.sync.session.remember({ ...value, title })
+        }}
+        onTitleChangeFailed={(title) => {
+          const value = session()
+          const ctx = props.serverCtx()
+          if (value && ctx) ctx.sync.session.remember({ ...value, title })
+        }}
+        onNavigate={() => props.onNavigate(ref)}
+        onClose={props.onClose}
+        active={props.active()}
+        activeServer={props.tab.server === props.activeServerKey}
+        forceTruncate={props.forceTruncate}
+        dragging={sortable.isDragSource()}
+      />
+    </div>
+  )
+}
+
+function DraftTabSlot(props: {
+  tab: Extract<Tab, { type: "draft" }>
+  id: string
+  index: () => number
+  active: () => boolean
+  title: string
+  onNavigate: (element: HTMLDivElement) => void
+  onClose: () => void
+}) {
+  const sortable = useSortable({
+    get id() {
+      return props.id
+    },
+    get index() {
+      return props.index()
+    },
+  })
+  let ref!: HTMLDivElement
+
+  return (
+    <div
+      ref={sortable.ref}
+      data-titlebar-tab-slot
+      data-tab-key={props.id}
+      class="relative flex w-56 min-w-7 max-w-56 flex-shrink"
+    >
+      <DraftTabItem
+        ref={(el) => {
+          ref = el
+        }}
+        href={tabHref(props.tab)}
+        title={props.title}
+        onNavigate={() => props.onNavigate(ref)}
+        onClose={props.onClose}
+        active={props.active()}
+        dragging={sortable.isDragSource()}
+      />
+    </div>
   )
 }
 
@@ -142,52 +169,12 @@ export function TitlebarTabStrip(props: {
 }) {
   const global = useGlobal()
   const language = useLanguage()
-  const [drag, setDrag] = createStore({
-    active: false,
-    draggedId: undefined as string | undefined,
-    placeholderIndex: 0,
-    draftOrder: [] as string[],
-    initialOrder: [] as string[],
-    draggedWidth: 0,
-    pointerX: 0,
-    grabOffsetX: 0,
-    floaterTop: 0,
-  })
-
-  const [gesture, setGesture] = createStore({
-    pending: undefined as
-      | {
-          id: string
-          startX: number
-          startY: number
-          grabOffsetX: number
-          grabOffsetY: number
-          pointerId: number
-          width: number
-          element: HTMLDivElement
-        }
-      | undefined,
-  })
-
-  const [suppressNavigation, setSuppressNavigation] = createSignal(false)
-  const [pressedId, setPressedId] = createSignal<string | undefined>()
-  const [stripScrollLeft, setStripScrollLeft] = createSignal(0)
   let scrollRef!: HTMLDivElement
   let listRef!: HTMLDivElement
-  let dragLayout: TabDragLayout | undefined
-  let dragPointerId: number | undefined
-  let autoscrollFrame: number | undefined
   let resizeFrame: number | undefined
-  let dragPreview: HTMLDivElement | undefined
 
   const tabIds = () => props.tabs.map(tabKey)
 
-  const displayTabs = createMemo(() => {
-    if (!drag.active || drag.draftOrder.length === 0) return props.tabs
-    const byKey = new Map(props.tabs.map((tab) => [tabKey(tab), tab]))
-    return drag.draftOrder.map((key) => byKey.get(key)).filter((tab): tab is Tab => !!tab)
-  })
-
   function refreshOverflow() {
     if (!scrollRef) return
     props.onOverflowChange(scrollRef.scrollWidth > scrollRef.clientWidth)
@@ -200,220 +187,14 @@ export function TitlebarTabStrip(props: {
       resizeFrame = requestAnimationFrame(() => {
         resizeFrame = undefined
         refreshOverflow()
-        if (!drag.active || !listRef) return
-        dragLayout = captureTabDragLayout(listRef, drag.draftOrder)
-        updateInsertIndex()
       })
     },
   )
 
-  function syncScroll() {
-    if (!scrollRef || !listRef || !dragLayout) return
-    syncLayoutScroll(listRef, dragLayout)
-    setStripScrollLeft(scrollRef.scrollLeft)
-    updateInsertIndex()
-  }
-
-  function stopAutoscroll() {
-    if (autoscrollFrame === undefined) return
-    cancelAnimationFrame(autoscrollFrame)
-    autoscrollFrame = undefined
-  }
-
-  function tickAutoscroll() {
-    if (!drag.active || !scrollRef) return
-
-    const strip = scrollRef.getBoundingClientRect()
-    const speed = autoscrollSpeed(drag.pointerX, strip.left, strip.right)
-
-    if (speed !== 0) {
-      scrollRef.scrollLeft += speed
-      syncScroll()
-    }
-
-    autoscrollFrame = requestAnimationFrame(tickAutoscroll)
-  }
-
-  function startAutoscroll() {
-    stopAutoscroll()
-    autoscrollFrame = requestAnimationFrame(tickAutoscroll)
-  }
-
-  function applyPlaceholderIndex(nextIndex: number) {
-    const id = drag.draggedId
-    if (!id) return
-    const next = movePlaceholder(drag.draftOrder, id, nextIndex)
-    setDrag({
-      draftOrder: next,
-      placeholderIndex: nextIndex,
-    })
-  }
-
-  function updateInsertIndex() {
-    if (!drag.active || !dragLayout) return
-    const draggedId = drag.draggedId
-    if (!draggedId) return
-    const nextIndex = insertIndexFromVirtualLayout(
-      drag.pointerX,
-      drag.draftOrder,
-      draggedId,
-      drag.placeholderIndex,
-      dragLayout,
-    )
-    if (nextIndex === drag.placeholderIndex) return
-    applyPlaceholderIndex(nextIndex)
-  }
-
-  function startDrag(id: string) {
-    const order = tabIds()
-    const index = order.indexOf(id)
-    const pending = gesture.pending
-    if (index === -1 || !pending || !listRef || !scrollRef) return
-
-    dragLayout = captureTabDragLayout(listRef, order)
-    dragPreview = createTabDragPreview(pending.element)
-    dragPointerId = pending.pointerId
-    setGesture("pending", undefined)
-
-    setDrag({
-      active: true,
-      draggedId: id,
-      placeholderIndex: index,
-      draftOrder: order,
-      initialOrder: order,
-      draggedWidth: pending.width,
-      pointerX: pending.startX,
-      grabOffsetX: pending.grabOffsetX,
-      floaterTop: pending.startY - pending.grabOffsetY,
-    })
-    setPressedId(undefined)
-    setStripScrollLeft(scrollRef.scrollLeft)
-    startAutoscroll()
-  }
-
-  function endDrag(commit: boolean) {
-    const initial = drag.initialOrder
-    const final = drag.draftOrder
-    const moved = drag.active
-
-    if (commit && moved && draftOrderChanged(initial, final)) {
-      props.onReorder(final)
-    }
-
-    if (moved) setSuppressNavigation(true)
-
-    setDrag({
-      active: false,
-      draggedId: undefined,
-      placeholderIndex: 0,
-      draftOrder: [],
-      initialOrder: [],
-      draggedWidth: 0,
-      pointerX: 0,
-      grabOffsetX: 0,
-      floaterTop: 0,
-    })
-
-    dragLayout = undefined
-    dragPreview = undefined
-    dragPointerId = undefined
-    setGesture("pending", undefined)
-    setPressedId(undefined)
-    stopAutoscroll()
-    refreshOverflow()
-    requestAnimationFrame(() => setSuppressNavigation(false))
-  }
-
-  function onPointerDown(id: string, event: PointerEvent) {
-    if (event.button !== 0 || drag.active) return
-    if (!canStartTabDrag(event.pointerType)) return
-    if (isTabCloseTarget(event.target)) return
-    const target = event.currentTarget as HTMLDivElement
-    const tabEl = target.matches("[data-titlebar-tab]")
-      ? target
-      : target.querySelector<HTMLDivElement>("[data-titlebar-tab]")
-    if (!tabEl) return
-    if (!tabEl.querySelector('[data-slot="tab-link"]')) return
-    const tab = props.tabs.find((item) => tabKey(item) === id)
-    if (!tab) return
-    const pointer = captureTabPointerDown(tabEl, event.clientX, event.clientY)
-    setSuppressNavigation(true)
-    props.onNavigate(tab, tabEl)
-    setPressedId(id)
-    setGesture("pending", {
-      id,
-      pointerId: event.pointerId,
-      ...pointer,
-    })
-  }
-
-  function onPointerMove(event: PointerEvent) {
-    const pending = gesture.pending
-    if (pending && event.pointerId !== pending.pointerId) return
-    if (drag.active && dragPointerId !== undefined && event.pointerId !== dragPointerId) return
-    if (!isPrimaryPointerPressed(event.buttons)) {
-      if (drag.active) endDrag(true)
-      if (pending) {
-        setGesture("pending", undefined)
-        setPressedId(undefined)
-        requestAnimationFrame(() => setSuppressNavigation(false))
-      }
-      return
-    }
-
-    if (pending && !drag.active) {
-      if (pointerDistance(pending.startX, pending.startY, event.clientX, event.clientY) < ACTIVATION_DISTANCE) return
-      startDrag(pending.id)
-    }
-
-    if (!drag.active) return
-
-    setDrag("pointerX", event.clientX)
-    syncScroll()
-  }
-
-  function onPointerUp(event: PointerEvent) {
-    if (drag.active) {
-      if (dragPointerId !== undefined && event.pointerId !== dragPointerId) return
-      setDrag("pointerX", event.clientX)
-      syncScroll()
-      endDrag(true)
-      return
-    }
-
-    const pending = gesture.pending
-    if (pending && event.pointerId !== pending.pointerId) return
-
-    setGesture("pending", undefined)
-    setPressedId(undefined)
-    requestAnimationFrame(() => setSuppressNavigation(false))
-  }
-
-  function onPointerCancel(event: PointerEvent) {
-    if (drag.active) {
-      if (dragPointerId !== undefined && event.pointerId !== dragPointerId) return
-      endDrag(false)
-      return
-    }
-
-    if (!gesture.pending) return
-    if (gesture.pending.pointerId !== event.pointerId) return
-    setGesture("pending", undefined)
-    setPressedId(undefined)
-    requestAnimationFrame(() => setSuppressNavigation(false))
-  }
-
   onMount(() => {
-    const cleanups = [
-      makeEventListener(window, "pointermove", onPointerMove),
-      makeEventListener(window, "pointerup", onPointerUp),
-      makeEventListener(window, "pointercancel", onPointerCancel),
-    ]
     refreshOverflow()
-    onCleanup(() => cleanups.forEach((cleanup) => cleanup()))
   })
 
-  onCleanup(stopAutoscroll)
   onCleanup(() => {
     if (resizeFrame !== undefined) cancelAnimationFrame(resizeFrame)
   })
@@ -424,50 +205,54 @@ export function TitlebarTabStrip(props: {
     refreshOverflow()
   })
 
-  createEffect(() => {
-    if (!drag.active || !scrollRef) return
-    onCleanup(makeEventListener(scrollRef, "scroll", syncScroll))
-  })
-
-  const floaterStyle = () => {
-    stripScrollLeft()
-    const strip = scrollRef?.getBoundingClientRect()
-    const left = strip
-      ? clampFloaterLeft(drag.pointerX - drag.grabOffsetX, drag.draggedWidth, strip.left, strip.right)
-      : drag.pointerX - drag.grabOffsetX
-
-    return {
-      position: "fixed" as const,
-      top: `${drag.floaterTop}px`,
-      left: `${left}px`,
-      width: `${drag.draggedWidth}px`,
-      "z-index": "10000",
-      "pointer-events": "none" as const,
-    }
-  }
-
-  const draggedTab = createMemo(() => {
-    const id = drag.draggedId
-    if (!id) return
-    return props.tabs.find((tab) => tabKey(tab) === id)
-  })
-
   return (
-    <>
-      <div data-slot="titlebar-tabs" class="relative min-w-0">
-        <div
-          data-slot="titlebar-tabs-scroll"
-          class="flex min-w-0 flex-row items-center gap-1.5 overflow-x-auto no-scrollbar [app-region:no-drag]"
-          ref={scrollRef}
+    <div data-slot="titlebar-tabs" class="relative min-w-0">
+      <div
+        data-slot="titlebar-tabs-scroll"
+        class="flex min-w-0 flex-row items-center gap-1.5 overflow-x-auto no-scrollbar [app-region:no-drag]"
+        ref={scrollRef}
+      >
+        <DragDropProvider
+          sensors={[
+            PointerSensor.configure({
+              activationConstraints: [new PointerActivationConstraints.Distance({ value: 4 })],
+              preventActivation: (event) =>
+                !canStartTabDrag(event.pointerType) ||
+                isTabCloseTarget(event.target) ||
+                (event.target instanceof Element && !!event.target.closest('[contenteditable="true"]')),
+            }),
+          ]}
+          modifiers={[RestrictToHorizontalAxis, RestrictToElement.configure({ element: () => listRef })]}
+          plugins={(defaults) => [
+            ...defaults.filter((plugin) => plugin !== Accessibility),
+            AutoScroller.configure({ acceleration: 8, threshold: { x: 0.05, y: 0 } }),
+            Feedback.configure({ dropAnimation: null }),
+          ]}
+          onDragStart={(event) => {
+            const source = event.operation.source
+            if (!source) return
+            const tab = props.tabs.find((item) => tabKey(item) === source.id.toString())
+            if (!tab) return
+            const tabEl = source.element?.querySelector<HTMLDivElement>("[data-titlebar-tab]")
+            props.onNavigate(tab, tabEl ?? undefined)
+          }}
+          onDragEnd={(event) => {
+            const current = tabIds()
+            const source = event.operation.source
+            if (event.canceled || !isSortable(source)) return
+
+            const { initialIndex, index } = source
+            if (initialIndex !== index) {
+              props.onReorder(arrayMove(current, source.initialIndex, source.index))
+            }
+          }}
         >
-          <div data-titlebar-tab-list class="flex min-w-0 flex-row items-center" ref={listRef}>
-            <For each={displayTabs()}>
+          <div data-titlebar-tab-list class="flex w-full min-w-0 flex-row items-center" ref={listRef}>
+            <For each={props.tabs}>
               {(tab, index) => {
                 const id = tabKey(tab)
                 let ref!: HTMLDivElement
                 useTabShortcut(index, () => props.onNavigate(tab, ref))
-
-                const dragged = () => drag.active && drag.draggedId === id
                 const serverCtx = createMemo(() => {
                   if (tab.type !== "session") return
                   const conn = global.servers.list().find((item) => ServerConnection.key(item) === tab.server)
@@ -479,68 +264,50 @@ export function TitlebarTabStrip(props: {
                     <SessionTabSlot
                       tab={tab}
                       id={id}
+                      index={index}
                       active={() => props.currentTab() === tab}
                       activeServerKey={props.activeServerKey}
                       forceTruncate={props.forceTruncate}
-                      dragActive={drag.active}
-                      dragged={dragged}
-                      pressed={() => pressedId() === id}
                       serverCtx={serverCtx}
-                      suppressNavigation={() => suppressNavigation()}
-                      onPointerDown={(event) => {
-                        if (dragged()) return
-                        onPointerDown(id, event)
+                      onNavigate={(element) => {
+                        ref = element
+                        props.onNavigate(tab, element)
                       }}
-                      onNavigate={(element) => props.onNavigate(tab, element)}
                       onClose={() => props.onClose(tab)}
                     />
                   )
                 }
 
                 return (
-                  <DraftTabItem
-                    tabKey={id}
-                    dragActive={drag.active}
-                    onPointerDown={(event) => {
-                      if (dragged()) return
-                      onPointerDown(id, event)
-                    }}
-                    ref={ref}
-                    href={tabHref(tab)}
+                  <DraftTabSlot
+                    tab={tab}
+                    id={id}
+                    index={index}
+                    active={() => props.currentTab() === tab}
                     title={language.t("command.session.new")}
-                    onNavigate={() => props.onNavigate(tab, ref)}
+                    onNavigate={(element) => {
+                      ref = element
+                      props.onNavigate(tab, element)
+                    }}
                     onClose={() => props.onClose(tab)}
-                    suppressNavigation={() => suppressNavigation()}
-                    active={props.currentTab() === tab}
-                    pressed={pressedId() === id}
-                    hidden={dragged()}
                   />
                 )
               }}
             </For>
           </div>
-        </div>
-        <div
-          data-slot="titlebar-tabs-fade-left"
-          aria-hidden="true"
-          class="pointer-events-none absolute inset-y-0 left-0 z-10 w-6 bg-[linear-gradient(to_right,var(--v2-background-bg-deep),transparent)]"
-        />
-        <div
-          data-slot="titlebar-tabs-fade-right"
-          aria-hidden="true"
-          class="pointer-events-none absolute inset-y-0 right-0 z-10 w-6 bg-[linear-gradient(to_left,var(--v2-background-bg-deep),transparent)]"
-        />
+        </DragDropProvider>
       </div>
-      <Show when={drag.active && draggedTab() && dragPreview}>
-        {(_) => (
-          <Portal>
-            <div data-titlebar-tab-preview style={floaterStyle()}>
-              {dragPreview}
-            </div>
-          </Portal>
-        )}
-      </Show>
-    </>
+      <div
+        data-slot="titlebar-tabs-fade-left"
+        aria-hidden="true"
+        class="pointer-events-none absolute inset-y-0 left-0 z-10 w-6 bg-[linear-gradient(to_right,var(--v2-background-bg-deep),transparent)]"
+      />
+      <div
+        data-slot="titlebar-tabs-fade-right"
+        aria-hidden="true"
+        class="pointer-events-none absolute inset-y-0 right-0 z-10 w-6 bg-[linear-gradient(to_left,var(--v2-background-bg-deep),transparent)]"
+      />
+    </div>
   )
 }
 

packages/app/src/context/notification.tsx

@@ -1,9 +1,9 @@
 import { createStore, reconcile } from "solid-js/store"
-import { type Accessor, batch, createEffect, createMemo, onCleanup } from "solid-js"
-import { useParams } from "@solidjs/router"
+import { type Accessor, batch, createEffect, createMemo, createRoot, getOwner, onCleanup } from "solid-js"
+import { useParams, useSearchParams } from "@solidjs/router"
 import { createSimpleContext } from "@opencode-ai/ui/context"
-import { useServerSDK } from "./server-sdk"
-import { useServerSync } from "./server-sync"
+import type { ServerSDK } from "./server-sdk"
+import type { ServerSync } from "./server-sync"
 import { usePlatform } from "@/context/platform"
 import { useLanguage } from "@/context/language"
 import { useSettings } from "@/context/settings"
@@ -12,6 +12,11 @@ import { decode64 } from "@/utils/base64"
 import { EventSessionError } from "@opencode-ai/sdk/v2"
 import { Persist, persisted } from "@/utils/persist"
 import { playSoundById } from "@/utils/sound"
+import { useGlobal } from "./global"
+import { ServerConnection, useServer } from "./server"
+import { type DraftTab, useTabs } from "./tabs"
+import { requireServerKey } from "@/utils/session-route"
+import type { ServerScope } from "@/utils/server-scope"
 
 type NotificationBase = {
   directory?: string
@@ -107,267 +112,360 @@ function buildNotificationIndex(list: Notification[]) {
 export const { use: useNotification, provider: NotificationProvider } = createSimpleContext({
   name: "Notification",
   gate: false,
-  init: (props: { directory?: Accessor<string | undefined>; sessionID?: Accessor<string | undefined> }) => {
-    const params = useParams()
-    const serverSDK = useServerSDK()
-    const serverSync = useServerSync()
+  init: () => {
+    const params = useParams<{ serverKey?: string; dir?: string; id?: string }>()
+    const [search] = useSearchParams<{ draftId?: string }>()
+    const global = useGlobal()
+    const server = useServer()
+    const tabs = useTabs()
     const platform = usePlatform()
     const settings = useSettings()
     const language = useLanguage()
+    const owner = getOwner()
+    const states = new Map<ServerScope, { dispose: () => void; state: NotificationState }>()
 
-    const empty: Notification[] = []
-
-    const currentDirectory = createMemo(() => {
-      return props.directory?.() ?? decode64(params.dir)
+    const activeServer = createMemo(() => {
+      if (params.serverKey) return requireServerKey(params.serverKey)
+      if (search.draftId) {
+        const draft = tabs.store.find((tab): tab is DraftTab => tab.type === "draft" && tab.draftID === search.draftId)
+        if (draft) return draft.server
+      }
+      return server.key
     })
+    const activeDirectory = createMemo(() => decode64(params.dir))
+    const activeSession = createMemo(() => params.id)
 
-    const currentSession = createMemo(() => props.sessionID?.() ?? params.id)
-
-    const [store, setStore, _, ready] = persisted(
-      Persist.serverGlobal(serverSDK().scope, "notification", ["notification.v1"]),
-      createStore({
-        list: [] as Notification[],
-      }),
-    )
-    const [index, setIndex] = createStore<NotificationIndex>(buildNotificationIndex(store.list))
-
-    const meta = { pruned: false, disposed: false }
-
-    const updateUnseen = (scope: "session" | "project", key: string, unseen: Notification[]) => {
-      setIndex(scope, "unseen", key, unseen)
-      setIndex(scope, "unseenCount", key, unseen.length)
-      setIndex(
-        scope,
-        "unseenHasError",
-        key,
-        unseen.some((notification) => notification.type === "error"),
+    const ensure = (key: ServerConnection.Key) => {
+      const conn = global.servers.list().find((item) => ServerConnection.key(item) === key)
+      if (!conn) throw new Error(`Notification server not found: ${key}`)
+      const ctx = global.ensureServerCtx(conn)
+      const existing = states.get(ctx.sdk.scope)
+      if (existing) return existing.state
+      const root = createRoot(
+        (dispose) => ({
+          dispose,
+          state: createServerNotificationState({
+            sdk: ctx.sdk,
+            sync: ctx.sync,
+            active: () => server.scope(activeServer()) === ctx.sdk.scope,
+            directory: activeDirectory,
+            sessionID: activeSession,
+            platform,
+            settings,
+            language,
+          }),
+        }),
+        owner ?? undefined,
       )
-    }
-
-    const appendToIndex = (notification: Notification) => {
-      if (notification.session) {
-        setIndex("session", "all", notification.session, (all = []) => [...all, notification])
-        if (!notification.viewed) {
-          setIndex("session", "unseen", notification.session, (unseen = []) => [...unseen, notification])
-          setIndex("session", "unseenCount", notification.session, (count = 0) => count + 1)
-          if (notification.type === "error") setIndex("session", "unseenHasError", notification.session, true)
-        }
-      }
-
-      if (notification.directory) {
-        setIndex("project", "all", notification.directory, (all = []) => [...all, notification])
-        if (!notification.viewed) {
-          setIndex("project", "unseen", notification.directory, (unseen = []) => [...unseen, notification])
-          setIndex("project", "unseenCount", notification.directory, (count = 0) => count + 1)
-          if (notification.type === "error") setIndex("project", "unseenHasError", notification.directory, true)
-        }
-      }
-    }
-
-    const removeFromIndex = (notification: Notification) => {
-      if (notification.session) {
-        setIndex("session", "all", notification.session, (all = []) => all.filter((n) => n !== notification))
-        if (!notification.viewed) {
-          const unseen = (index.session.unseen[notification.session] ?? empty).filter((n) => n !== notification)
-          updateUnseen("session", notification.session, unseen)
-        }
-      }
-
-      if (notification.directory) {
-        setIndex("project", "all", notification.directory, (all = []) => all.filter((n) => n !== notification))
-        if (!notification.viewed) {
-          const unseen = (index.project.unseen[notification.directory] ?? empty).filter((n) => n !== notification)
-          updateUnseen("project", notification.directory, unseen)
-        }
-      }
+      states.set(ctx.sdk.scope, root)
+      return root.state
     }
 
     createEffect(() => {
-      if (!ready()) return
-      if (meta.pruned) return
-      meta.pruned = true
-      const list = pruneNotifications(store.list)
-      batch(() => {
-        setStore("list", list)
-        setIndex(reconcile(buildNotificationIndex(list), { merge: false }))
+      global.servers.list().forEach((conn) => ensure(ServerConnection.key(conn)))
+    })
+
+    createEffect(() => {
+      const scopes = new Set(global.servers.list().map((conn) => server.scope(ServerConnection.key(conn))))
+      states.forEach((value, scope) => {
+        if (scopes.has(scope)) return
+        value.dispose()
+        states.delete(scope)
       })
     })
 
-    const append = (notification: Notification) => {
-      const list = pruneNotifications([...store.list, notification])
-      const keep = new Set(list)
-      const removed = store.list.filter((n) => !keep.has(n))
+    onCleanup(() => states.forEach((value) => value.dispose()))
 
-      batch(() => {
-        if (keep.has(notification)) appendToIndex(notification)
-        removed.forEach((n) => removeFromIndex(n))
-        setStore("list", list)
-      })
-    }
-
-    const lookup = async (directory: string, sessionID?: string) => {
-      if (!sessionID) return undefined
-      const sync = serverSync().ensureDirSyncContext(directory)
-      const session = sync.session.get(sessionID)
-      if (session) return session
-      return sync.session
-        .sync(sessionID)
-        .then(() => sync.session.get(sessionID))
-        .catch(() => undefined)
-    }
-
-    const viewedInCurrentSession = (directory: string, sessionID?: string) => {
-      const activeDirectory = currentDirectory()
-      const activeSession = currentSession()
-      if (!activeDirectory) return false
-      if (!activeSession) return false
-      if (!sessionID) return false
-      if (directory !== activeDirectory) return false
-      return sessionID === activeSession
-    }
-
-    const handleSessionIdle = (directory: string, event: { properties: { sessionID?: string } }, time: number) => {
-      const sessionID = event.properties.sessionID
-      void lookup(directory, sessionID).then((session) => {
-        if (meta.disposed) return
-        if (!session) return
-        if (session.parentID) return
-
-        if (settings.sounds.agentEnabled()) {
-          void playSoundById(settings.sounds.agent())
-        }
-
-        append({
-          directory,
-          time,
-          viewed: viewedInCurrentSession(directory, sessionID),
-          type: "turn-complete",
-          session: sessionID,
-        })
-
-        const href = `/${base64Encode(directory)}/session/${sessionID}`
-        if (settings.notifications.agent()) {
-          void platform.notify(language.t("notification.session.responseReady.title"), session.title ?? sessionID, href)
-        }
-      })
-    }
-
-    const handleSessionError = (
-      directory: string,
-      event: { properties: { sessionID?: string; error?: EventSessionError["properties"]["error"] } },
-      time: number,
-    ) => {
-      const sessionID = event.properties.sessionID
-      void lookup(directory, sessionID).then((session) => {
-        if (meta.disposed) return
-        if (session?.parentID) return
-
-        if (settings.sounds.errorsEnabled()) {
-          void playSoundById(settings.sounds.errors())
-        }
-
-        const error = "error" in event.properties ? event.properties.error : undefined
-        append({
-          directory,
-          time,
-          viewed: viewedInCurrentSession(directory, sessionID),
-          type: "error",
-          session: sessionID ?? "global",
-          error,
-        })
-        const description =
-          session?.title ??
-          (typeof error === "string" ? error : language.t("notification.session.error.fallbackDescription"))
-        const href = sessionID ? `/${base64Encode(directory)}/session/${sessionID}` : `/${base64Encode(directory)}`
-        if (settings.notifications.errors()) {
-          void platform.notify(language.t("notification.session.error.title"), description, href)
-        }
-      })
-    }
-
-    const unsub = serverSDK().event.listen((e) => {
-      const event = e.details
-      if (event.type !== "session.idle" && event.type !== "session.error") return
-
-      const directory = e.name
-      const time = Date.now()
-      if (event.type === "session.idle") {
-        handleSessionIdle(directory, event, time)
-        return
-      }
-      handleSessionError(directory, event, time)
-    })
-    onCleanup(() => {
-      meta.disposed = true
-      unsub()
-    })
+    const selected = () => ensure(activeServer())
 
     return {
-      ready,
+      ready: () => selected().ready(),
+      ensureServerState: ensure,
       session: {
-        all(session: string) {
-          return index.session.all[session] ?? empty
-        },
-        unseen(session: string) {
-          return index.session.unseen[session] ?? empty
-        },
-        unseenCount(session: string) {
-          return index.session.unseenCount[session] ?? 0
-        },
-        unseenHasError(session: string) {
-          return index.session.unseenHasError[session] ?? false
-        },
-        markViewed(session: string) {
-          const unseen = index.session.unseen[session] ?? empty
-          if (!unseen.length) return
-
-          const projects = [
-            ...new Set(unseen.flatMap((notification) => (notification.directory ? [notification.directory] : []))),
-          ]
-          batch(() => {
-            setStore("list", (n) => n.session === session && !n.viewed, "viewed", true)
-            updateUnseen("session", session, [])
-            projects.forEach((directory) => {
-              const next = (index.project.unseen[directory] ?? empty).filter(
-                (notification) => notification.session !== session,
-              )
-              updateUnseen("project", directory, next)
-            })
-          })
-        },
+        all: (session: string) => selected().session.all(session),
+        unseen: (session: string) => selected().session.unseen(session),
+        unseenCount: (session: string) => selected().session.unseenCount(session),
+        unseenHasError: (session: string) => selected().session.unseenHasError(session),
+        markViewed: (session: string) => selected().session.markViewed(session),
       },
       project: {
-        all(directory: string) {
-          return index.project.all[directory] ?? empty
-        },
-        unseen(directory: string) {
-          return index.project.unseen[directory] ?? empty
-        },
-        unseenCount(directory: string) {
-          return index.project.unseenCount[directory] ?? 0
-        },
-        unseenHasError(directory: string) {
-          return index.project.unseenHasError[directory] ?? false
-        },
-        markViewed(directory: string) {
-          const unseen = index.project.unseen[directory] ?? empty
-          if (!unseen.length) return
-
-          const sessions = [
-            ...new Set(unseen.flatMap((notification) => (notification.session ? [notification.session] : []))),
-          ]
-          batch(() => {
-            setStore("list", (n) => n.directory === directory && !n.viewed, "viewed", true)
-            updateUnseen("project", directory, [])
-            sessions.forEach((session) => {
-              const next = (index.session.unseen[session] ?? empty).filter(
-                (notification) => notification.directory !== directory,
-              )
-              updateUnseen("session", session, next)
-            })
-          })
-        },
+        all: (directory: string) => selected().project.all(directory),
+        unseen: (directory: string) => selected().project.unseen(directory),
+        unseenCount: (directory: string) => selected().project.unseenCount(directory),
+        unseenHasError: (directory: string) => selected().project.unseenHasError(directory),
+        markViewed: (directory: string) => selected().project.markViewed(directory),
       },
     }
   },
 })
+
+type NotificationState = ReturnType<typeof createServerNotificationState>
+
+function createServerNotificationState(input: {
+  sdk: ServerSDK
+  sync: ServerSync
+  active: Accessor<boolean>
+  directory: Accessor<string | undefined>
+  sessionID: Accessor<string | undefined>
+  platform: ReturnType<typeof usePlatform>
+  settings: ReturnType<typeof useSettings>
+  language: ReturnType<typeof useLanguage>
+}) {
+  const serverSDK = () => input.sdk
+  const serverSync = () => input.sync
+  const platform = input.platform
+  const settings = input.settings
+  const language = input.language
+
+  const empty: Notification[] = []
+
+  const currentDirectory = input.directory
+  const currentSession = input.sessionID
+
+  const [store, setStore, _, ready] = persisted(
+    Persist.serverGlobal(serverSDK().scope, "notification", ["notification.v1"]),
+    createStore({
+      list: [] as Notification[],
+    }),
+  )
+  const [index, setIndex] = createStore<NotificationIndex>(buildNotificationIndex(store.list))
+
+  const meta = { pruned: false, disposed: false }
+
+  const updateUnseen = (scope: "session" | "project", key: string, unseen: Notification[]) => {
+    setIndex(scope, "unseen", key, unseen)
+    setIndex(scope, "unseenCount", key, unseen.length)
+    setIndex(
+      scope,
+      "unseenHasError",
+      key,
+      unseen.some((notification) => notification.type === "error"),
+    )
+  }
+
+  const appendToIndex = (notification: Notification) => {
+    if (notification.session) {
+      setIndex("session", "all", notification.session, (all = []) => [...all, notification])
+      if (!notification.viewed) {
+        setIndex("session", "unseen", notification.session, (unseen = []) => [...unseen, notification])
+        setIndex("session", "unseenCount", notification.session, (count = 0) => count + 1)
+        if (notification.type === "error") setIndex("session", "unseenHasError", notification.session, true)
+      }
+    }
+
+    if (notification.directory) {
+      setIndex("project", "all", notification.directory, (all = []) => [...all, notification])
+      if (!notification.viewed) {
+        setIndex("project", "unseen", notification.directory, (unseen = []) => [...unseen, notification])
+        setIndex("project", "unseenCount", notification.directory, (count = 0) => count + 1)
+        if (notification.type === "error") setIndex("project", "unseenHasError", notification.directory, true)
+      }
+    }
+  }
+
+  const removeFromIndex = (notification: Notification) => {
+    if (notification.session) {
+      setIndex("session", "all", notification.session, (all = []) => all.filter((n) => n !== notification))
+      if (!notification.viewed) {
+        const unseen = (index.session.unseen[notification.session] ?? empty).filter((n) => n !== notification)
+        updateUnseen("session", notification.session, unseen)
+      }
+    }
+
+    if (notification.directory) {
+      setIndex("project", "all", notification.directory, (all = []) => all.filter((n) => n !== notification))
+      if (!notification.viewed) {
+        const unseen = (index.project.unseen[notification.directory] ?? empty).filter((n) => n !== notification)
+        updateUnseen("project", notification.directory, unseen)
+      }
+    }
+  }
+
+  createEffect(() => {
+    if (!ready()) return
+    if (meta.pruned) return
+    meta.pruned = true
+    const list = pruneNotifications(store.list)
+    batch(() => {
+      setStore("list", list)
+      setIndex(reconcile(buildNotificationIndex(list), { merge: false }))
+    })
+  })
+
+  const append = (notification: Notification) => {
+    const list = pruneNotifications([...store.list, notification])
+    const keep = new Set(list)
+    const removed = store.list.filter((n) => !keep.has(n))
+
+    batch(() => {
+      if (keep.has(notification)) appendToIndex(notification)
+      removed.forEach((n) => removeFromIndex(n))
+      setStore("list", list)
+    })
+  }
+
+  const lookup = async (directory: string, sessionID?: string) => {
+    if (!sessionID) return undefined
+    const sync = serverSync().ensureDirSyncContext(directory)
+    const session = sync.session.get(sessionID)
+    if (session) return session
+    return sync.session
+      .sync(sessionID)
+      .then(() => sync.session.get(sessionID))
+      .catch(() => undefined)
+  }
+
+  const viewedInCurrentSession = (directory: string, sessionID?: string) => {
+    if (!input.active()) return false
+    const activeDirectory = currentDirectory()
+    const activeSession = currentSession()
+    if (!activeSession) return false
+    if (!sessionID) return false
+    if (activeDirectory && directory !== activeDirectory) return false
+    return sessionID === activeSession
+  }
+
+  const handleSessionIdle = (directory: string, event: { properties: { sessionID?: string } }, time: number) => {
+    const sessionID = event.properties.sessionID
+    void lookup(directory, sessionID).then((session) => {
+      if (meta.disposed) return
+      if (!session) return
+      if (session.parentID) return
+
+      if (settings.sounds.agentEnabled()) {
+        void playSoundById(settings.sounds.agent())
+      }
+
+      append({
+        directory,
+        time,
+        viewed: viewedInCurrentSession(directory, sessionID),
+        type: "turn-complete",
+        session: sessionID,
+      })
+
+      const href = `/${base64Encode(directory)}/session/${sessionID}`
+      if (settings.notifications.agent()) {
+        void platform.notify(language.t("notification.session.responseReady.title"), session.title ?? sessionID, href)
+      }
+    })
+  }
+
+  const handleSessionError = (
+    directory: string,
+    event: { properties: { sessionID?: string; error?: EventSessionError["properties"]["error"] } },
+    time: number,
+  ) => {
+    const sessionID = event.properties.sessionID
+    void lookup(directory, sessionID).then((session) => {
+      if (meta.disposed) return
+      if (session?.parentID) return
+
+      if (settings.sounds.errorsEnabled()) {
+        void playSoundById(settings.sounds.errors())
+      }
+
+      const error = "error" in event.properties ? event.properties.error : undefined
+      append({
+        directory,
+        time,
+        viewed: viewedInCurrentSession(directory, sessionID),
+        type: "error",
+        session: sessionID ?? "global",
+        error,
+      })
+      const description =
+        session?.title ??
+        (typeof error === "string" ? error : language.t("notification.session.error.fallbackDescription"))
+      const href = sessionID ? `/${base64Encode(directory)}/session/${sessionID}` : `/${base64Encode(directory)}`
+      if (settings.notifications.errors()) {
+        void platform.notify(language.t("notification.session.error.title"), description, href)
+      }
+    })
+  }
+
+  const unsub = serverSDK().event.listen((e) => {
+    const event = e.details
+    if (event.type !== "session.idle" && event.type !== "session.error") return
+
+    const directory = e.name
+    const time = Date.now()
+    if (event.type === "session.idle") {
+      handleSessionIdle(directory, event, time)
+      return
+    }
+    handleSessionError(directory, event, time)
+  })
+  onCleanup(() => {
+    meta.disposed = true
+    unsub()
+  })
+
+  return {
+    ready,
+    session: {
+      all(session: string) {
+        return index.session.all[session] ?? empty
+      },
+      unseen(session: string) {
+        return index.session.unseen[session] ?? empty
+      },
+      unseenCount(session: string) {
+        return index.session.unseenCount[session] ?? 0
+      },
+      unseenHasError(session: string) {
+        return index.session.unseenHasError[session] ?? false
+      },
+      markViewed(session: string) {
+        const unseen = index.session.unseen[session] ?? empty
+        if (!unseen.length) return
+
+        const projects = [
+          ...new Set(unseen.flatMap((notification) => (notification.directory ? [notification.directory] : []))),
+        ]
+        batch(() => {
+          setStore("list", (n) => n.session === session && !n.viewed, "viewed", true)
+          updateUnseen("session", session, [])
+          projects.forEach((directory) => {
+            const next = (index.project.unseen[directory] ?? empty).filter(
+              (notification) => notification.session !== session,
+            )
+            updateUnseen("project", directory, next)
+          })
+        })
+      },
+    },
+    project: {
+      all(directory: string) {
+        return index.project.all[directory] ?? empty
+      },
+      unseen(directory: string) {
+        return index.project.unseen[directory] ?? empty
+      },
+      unseenCount(directory: string) {
+        return index.project.unseenCount[directory] ?? 0
+      },
+      unseenHasError(directory: string) {
+        return index.project.unseenHasError[directory] ?? false
+      },
+      markViewed(directory: string) {
+        const unseen = index.project.unseen[directory] ?? empty
+        if (!unseen.length) return
+
+        const sessions = [
+          ...new Set(unseen.flatMap((notification) => (notification.session ? [notification.session] : []))),
+        ]
+        batch(() => {
+          setStore("list", (n) => n.directory === directory && !n.viewed, "viewed", true)
+          updateUnseen("project", directory, [])
+          sessions.forEach((session) => {
+            const next = (index.session.unseen[session] ?? empty).filter(
+              (notification) => notification.directory !== directory,
+            )
+            updateUnseen("session", session, next)
+          })
+        })
+      },
+    },
+  }
+}

packages/app/src/i18n/en.ts

@@ -656,6 +656,10 @@ export const dict = {
   "session.new.worktree.main": "Main branch",
   "session.new.worktree.mainWithBranch": "Main branch ({{branch}})",
   "session.new.worktree.create": "Create new worktree",
+  "session.new.workspace.runIn": "Run session in",
+  "session.new.workspace.triggerLocal": "Local",
+  "session.new.workspace.local": "Local repository",
+  "session.new.workspace.existing": "Workspace…",
   "session.new.lastModified": "Last modified",
 
   "session.header.search.placeholder": "Search {{project}}",

packages/app/src/index.css

@@ -1,6 +1,7 @@
 @import "@opencode-ai/ui/styles/tailwind";
 @import "@opencode-ai/session-ui/styles";
 @import "@opencode-ai/ui/v2/styles/tailwind.css";
+@import "tw-animate-css";
 
 @font-face {
   font-family: "JetBrainsMono Nerd Font Mono";
@@ -131,13 +132,4 @@
       transform: rotate(360deg);
     }
   }
-
-  @keyframes fade-in {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
 }

packages/app/src/pages/home.tsx

@@ -2,6 +2,7 @@ import type { Session } from "@opencode-ai/sdk/v2/client"
 import {
   createEffect,
   createMemo,
+  createResource,
   createRoot,
   For,
   Match,
@@ -67,6 +68,7 @@ import { archiveHomeSession } from "./home-session-archive"
 import { showToast } from "@/utils/toast"
 
 const HOME_SESSION_LIMIT = 64
+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`
@@ -340,15 +342,15 @@ export function NewHome() {
   }
 
   function unseenCount(conn: ServerConnection.Any, project: LocalProject) {
-    if (ServerConnection.key(conn) !== server.key) return 0
-    return directories(project).reduce((total, directory) => total + notification.project.unseenCount(directory), 0)
+    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) {
-    if (ServerConnection.key(conn) !== server.key) return
+    const state = notification.ensureServerState(ServerConnection.key(conn))
     directories(project)
-      .filter((directory) => notification.project.unseenCount(directory) > 0)
-      .forEach((directory) => notification.project.markViewed(directory))
+      .filter((directory) => state.project.unseenCount(directory) > 0)
+      .forEach((directory) => state.project.markViewed(directory))
   }
 
   function openSession(session: Session) {
@@ -525,10 +527,16 @@ function HomeProjectColumn(props: {
   const global = useGlobal()
   const dialog = useDialog()
   const controller = useServerManagementController({ navigateOnAdd: false })
-  const [state, setState] = persisted(
+  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-w-0 flex-col gap-4 lg:mt-14 lg:pt-[52px]"
@@ -560,7 +568,7 @@ function HomeProjectColumn(props: {
             const key = ServerConnection.key(item)
             const healthy = () => !!global.servers.health[key]?.healthy
             const serverCtx = global.ensureServerCtx(item)
-            const collapsed = () => !!state.collapsed[key]
+            const collapsed = () => !!state().collapsed[key]
             return (
               <div class="flex max-h-[min(572px,calc(100vh_-_300px))] min-w-0 flex-col gap-1 overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden">
                 <HomeServerRow
@@ -573,7 +581,7 @@ function HomeProjectColumn(props: {
                   focusServer={props.focusServer}
                   chooseProject={props.chooseProject}
                   openEdit={(server) => dialog.show(() => <DialogServerV2 mode="edit" server={server} />)}
-                  toggleCollapsed={() => setState("collapsed", key, !state.collapsed[key])}
+                  toggleCollapsed={() => setState("collapsed", key, !state().collapsed[key])}
                   language={props.language}
                 />
                 <Show when={healthy() && !collapsed()}>
@@ -1182,22 +1190,24 @@ function HomeSessionRow(props: {
           </span>
         </Show>
       </button>
-      <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 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>
   )
 }

packages/app/src/pages/layout-new.tsx

@@ -1,26 +1,18 @@
 import { createEffect, Suspense, type ParentProps } from "solid-js"
-import { useNavigate, useParams } from "@solidjs/router"
+import { useNavigate } from "@solidjs/router"
 import { DebugBar } from "@/components/debug-bar"
 import { HelpButton } from "@/components/help-button"
 import { Titlebar, type TitlebarUpdate } from "@/components/titlebar"
-import { useNotification } from "@/context/notification"
 import { usePlatform } from "@/context/platform"
 import { setNavigate } from "@/utils/notification-click"
 import { setV2Toast, ToastRegion } from "@/utils/toast"
 
 export default function NewLayout(props: ParentProps) {
   const platform = usePlatform()
-  const notification = useNotification()
   const navigate = useNavigate()
-  const params = useParams<{ id?: string }>()
   setNavigate(navigate)
 
   createEffect(() => setV2Toast(true))
-  createEffect(() => {
-    if (!notification.ready() || !params.id) return
-    if (notification.session.unseenCount(params.id) === 0) return
-    notification.session.markViewed(params.id)
-  })
 
   const update: TitlebarUpdate = {
     version: () => {

packages/app/src/pages/new-session.tsx

@@ -19,6 +19,9 @@ import { createPromptInputController, createPromptProjectControls } from "@/page
 import { useSessionKey } from "@/pages/session/session-layout"
 import { useComposerCommands } from "@/pages/session/use-composer-commands"
 import { NEW_SESSION_CONTENT_WIDTH } from "@/pages/session/new-session-layout"
+import { PromptWorkspaceSelector } from "@/components/prompt-workspace-selector"
+
+const showWorkspaceBar = import.meta.env.VITE_OPENCODE_CHANNEL !== "prod"
 
 /**
  * The `/new-session` draft page. Unlike `session.tsx`, this only renders the prompt
@@ -51,16 +54,21 @@ export default function NewSessionPage() {
     onDone: () => inputRef?.focus(),
   })
 
-  const [store, setStore] = createStore({
-    worktree: "main",
-  })
+  const [store, setStore] = createStore<{ worktree?: string }>({})
 
   const newSessionWorktree = createMemo(() => {
-    if (store.worktree === "create") return "create"
+    if (store.worktree) return store.worktree
     const project = sync().project
     if (project && sdk().directory !== project.worktree) return sdk().directory
     return "main"
   })
+  const projectRoot = createMemo(() => sync().project?.worktree ?? sdk().directory)
+  const localBranch = createMemo(() => serverSync().child(projectRoot())[0].vcs?.branch)
+  const selectedBranch = createMemo(() => {
+    const worktree = newSessionWorktree()
+    if (worktree === "main" || worktree === "create") return localBranch()
+    return serverSync().child(worktree)[0].vcs?.branch ?? localBranch()
+  })
 
   createEffect(() => {
     if (!prompt.ready()) return
@@ -97,7 +105,7 @@ export default function NewSessionPage() {
                     </div>
                   }
                 >
-                  <div class="flex flex-col gap-3">
+                  <div class="flex flex-col" classList={{ "gap-8": showWorkspaceBar, "gap-3": !showWorkspaceBar }}>
                     <PromptInput
                       controls={inputController()}
                       variant="new-session"
@@ -105,7 +113,7 @@ export default function NewSessionPage() {
                         inputRef = el
                       }}
                       newSessionWorktree={newSessionWorktree()}
-                      onNewSessionWorktreeReset={() => setStore("worktree", "main")}
+                      onNewSessionWorktreeReset={() => setStore("worktree", undefined)}
                       onSubmit={() => comments.clear()}
                       toolbar={
                         <Show when={!projectController.selected()}>
@@ -114,8 +122,34 @@ export default function NewSessionPage() {
                       }
                     />
                     <Show when={projectController.selected()}>
-                      <div class="flex h-7 min-w-0 items-center gap-0 px-2">
-                        <PromptProjectSelector controller={projectController} />
+                      <div
+                        class="flex min-h-7 min-w-0 items-center gap-0 text-v2-text-text-faint"
+                        classList={{
+                          "flex-col justify-center sm:flex-row": showWorkspaceBar,
+                          "justify-start": !showWorkspaceBar,
+                        }}
+                      >
+                        <PromptProjectSelector
+                          controller={projectController}
+                          placement={showWorkspaceBar ? "bottom" : "bottom-start"}
+                        />
+                        <Show when={showWorkspaceBar}>
+                          <PromptWorkspaceSelector
+                            value={newSessionWorktree()}
+                            projectRoot={projectRoot()}
+                            workspaces={sync().project?.sandboxes ?? []}
+                            branch={selectedBranch()}
+                            onChange={(value) =>
+                              setStore(
+                                "worktree",
+                                value === "main" && sync().project?.worktree !== sdk().directory
+                                  ? sync().project?.worktree
+                                  : value,
+                              )
+                            }
+                            onDone={() => inputRef?.focus()}
+                          />
+                        </Show>
                       </div>
                     </Show>
                   </div>

packages/app/src/pages/session.tsx

@@ -908,7 +908,13 @@ export default function Page() {
   )
 
   const reviewPanel = () => (
-    <div class="flex flex-col h-full overflow-hidden bg-background-stronger contain-strict">
+    <div
+      classList={{
+        "flex flex-col h-full overflow-hidden contain-strict": true,
+        "bg-v2-background-bg-base": settings.general.newLayoutDesigns(),
+        "bg-background-stronger": !settings.general.newLayoutDesigns(),
+      }}
+    >
       <div class="relative pt-2 flex-1 min-h-0 overflow-hidden">
         {reviewContent({
           diffStyle: layout.review.diffStyle(),
@@ -1713,7 +1719,9 @@ export default function Page() {
         >
           <div
             classList={{
-              "flex-1 min-h-0 flex flex-col bg-background-stronger": true,
+              "flex-1 min-h-0 flex flex-col": true,
+              "bg-v2-background-bg-base": settings.general.newLayoutDesigns(),
+              "bg-background-stronger": !settings.general.newLayoutDesigns(),
               "rounded-[10px] overflow-hidden": settings.general.newLayoutDesigns(),
               "shadow-[var(--v2-elevation-raised)]": settings.general.newLayoutDesigns() && !!params.id,
             }}

packages/app/src/pages/session/composer/session-composer-region.tsx

@@ -1,5 +1,6 @@
 import { Show, type JSX } from "solid-js"
 import { useLanguage } from "@/context/language"
+import { useSettings } from "@/context/settings"
 import { SessionPermissionDock } from "@/pages/session/composer/session-permission-dock"
 import { SessionQuestionDock } from "@/pages/session/composer/session-question-dock"
 import { SessionFollowupDock } from "@/pages/session/composer/session-followup-dock"
@@ -13,6 +14,7 @@ export function SessionComposerRegion(props: {
 }) {
   const language = useLanguage()
   const controller = props.controller
+  const settings = useSettings()
   const rolled = () => {
     const revert = controller.revert()
     return revert?.items.length ? revert : undefined
@@ -22,7 +24,11 @@ export function SessionComposerRegion(props: {
     <div
       ref={controller.setDockRef}
       data-component="session-prompt-dock"
-      class="w-full shrink-0 flex flex-col justify-center items-center pb-3 bg-background-stronger pointer-events-none"
+      classList={{
+        "w-full shrink-0 flex flex-col justify-center items-center pb-3 pointer-events-none": true,
+        "bg-v2-background-bg-base": settings.general.newLayoutDesigns(),
+        "bg-background-stronger": !settings.general.newLayoutDesigns(),
+      }}
     >
       <div
         classList={{

packages/app/src/pages/session/timeline/message-timeline.tsx

@@ -1019,7 +1019,13 @@ export function MessageTimeline(props: {
                 <div class="flex w-max min-w-full justify-end gap-2">
                   <Index each={comments()}>
                     {(comment) => (
-                      <div class="shrink-0 max-w-[260px] rounded-[6px] border border-border-weak-base bg-background-stronger px-2.5 py-2">
+                      <div
+                        classList={{
+                          "shrink-0 max-w-[260px] rounded-[6px] border-border-weak-base bg-background-stronger px-2.5 py-2": true,
+                          "border-[0.5px]": settings.general.newLayoutDesigns(),
+                          border: !settings.general.newLayoutDesigns(),
+                        }}
+                      >
                         <div class="flex items-center gap-1.5 min-w-0 text-11-medium text-text-strong">
                           <FileIcon node={{ path: comment().path, type: "file" }} class="size-3.5 shrink-0" />
                           <span class="truncate">{getFilename(comment().path)}</span>
@@ -1288,7 +1294,11 @@ export function MessageTimeline(props: {
           <div
             data-session-title
             classList={{
-              "sticky top-0 z-30 bg-[linear-gradient(to_bottom,var(--background-stronger)_48px,transparent)]": true,
+              "sticky top-0 z-30": true,
+              "bg-[linear-gradient(to_bottom,var(--v2-background-bg-base)_48px,transparent)]":
+                settings.general.newLayoutDesigns(),
+              "bg-[linear-gradient(to_bottom,var(--background-stronger)_48px,transparent)]":
+                !settings.general.newLayoutDesigns(),
               "w-full": true,
               "pb-4": true,
               "pr-3": true,
@@ -1509,7 +1519,11 @@ export function MessageTimeline(props: {
                                       <Button
                                         size="large"
                                         variant="secondary"
-                                        class="w-full shadow-none border border-border-weak-base"
+                                        class={
+                                          settings.general.newLayoutDesigns()
+                                            ? "w-full shadow-none border-[0.5px] border-border-weak-base"
+                                            : "w-full shadow-none border border-border-weak-base"
+                                        }
                                         onClick={unshareSession}
                                         disabled={unshareMutation.isPending}
                                       >

packages/app/src/wsl/settings.tsx

@@ -1,7 +1,8 @@
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { Tag } from "@opencode-ai/ui/v2/badge-v2"
 import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
-import { Dialog } from "@opencode-ai/ui/v2/dialog-v2"
+import { Dialog, DialogBody, DialogHeader, DialogTitle } from "@opencode-ai/ui/v2/dialog-v2"
+import { DividerV2 } from "@opencode-ai/ui/v2/divider-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"
@@ -30,8 +31,14 @@ export function AddServerMenu(props: { onAddServer: () => void }) {
   const language = useLanguage()
   const openAddWsl = () => {
     dialog.push(() => (
-      <Dialog title={language.t("wsl.server.add")} size="large" fit class="settings-v2-wsl-dialog">
-        <DialogAddWslServer />
+      <Dialog size="large" fit class="settings-v2-wsl-dialog">
+        <DialogHeader hideClose={true}>
+          <DialogTitle>{language.t("wsl.server.add")}</DialogTitle>
+        </DialogHeader>
+        <DividerV2 />
+        <DialogBody>
+          <DialogAddWslServer />
+        </DialogBody>
       </Dialog>
     ))
   }

packages/client/script/build.ts

@@ -1,20 +1,29 @@
 import { NodeFileSystem } from "@effect/platform-node"
 import { compile, emitEffectImported, emitPromise, write } from "@opencode-ai/httpapi-codegen"
-import { Api } from "@opencode-ai/server/api"
+import { ClientApi } from "../src/contract"
 import { Effect } from "effect"
-import { HttpApi } from "effect/unstable/httpapi"
 import { fileURLToPath } from "url"
 
-const contract = compile(HttpApi.make("opencode-client").add(Api.groups["server.session"]), {
-  groupNames: { "server.session": "sessions" },
+const contract = compile(ClientApi, {
+  groupNames: { "server.session": "sessions", "server.event": "events" },
 })
 
 await Effect.runPromise(
   Effect.all(
     [
-      write(emitPromise(contract), fileURLToPath(new URL("../src/generated", import.meta.url))),
       write(
-        emitEffectImported(contract, { module: "../contract", group: "SessionGroup" }),
+        emitPromise(contract, {
+          outputTypes: {
+            "events.subscribe": {
+              name: "OpenCodeEventEncoded",
+              import: 'import type { OpenCodeEventEncoded } from "@opencode-ai/protocol/groups/event"',
+            },
+          },
+        }),
+        fileURLToPath(new URL("../src/generated", import.meta.url)),
+      ),
+      write(
+        emitEffectImported(contract, { module: "../contract", api: "ClientApi" }),
         fileURLToPath(new URL("../src/generated-effect", import.meta.url)),
       ),
     ],

packages/client/src/contract.ts

@@ -1,6 +1,6 @@
 import { makeDefaultApi } from "@opencode-ai/protocol/api"
 import { InvalidRequestError, SessionNotFoundError } from "@opencode-ai/protocol/errors"
-import { HttpApiMiddleware } from "effect/unstable/httpapi"
+import { HttpApi, HttpApiMiddleware } from "effect/unstable/httpapi"
 
 class LocationMiddleware extends HttpApiMiddleware.Service<LocationMiddleware>()(
   "@opencode-ai/client/LocationMiddleware",
@@ -17,3 +17,5 @@ const Api = makeDefaultApi({
 })
 
 export const SessionGroup = Api.groups["server.session"]
+export const EventGroup = Api.groups["server.event"]
+export const ClientApi = HttpApi.make("opencode-client").add(SessionGroup).add(EventGroup)

packages/client/src/effect.ts

@@ -10,3 +10,4 @@ export { Session } from "@opencode-ai/schema/session"
 export { SessionInput } from "@opencode-ai/schema/session-input"
 export { SessionMessage } from "@opencode-ai/schema/session-message"
 export { Prompt } from "@opencode-ai/schema/prompt"
+export type { OpenCodeEvent } from "@opencode-ai/protocol/groups/event"

packages/client/src/generated-effect/client.ts

@@ -2,13 +2,11 @@
 import { Effect, Stream, Schema } from "effect"
 import { Sse } from "effect/unstable/encoding"
 import { HttpClientError } from "effect/unstable/http"
-import { HttpApi, HttpApiClient } from "effect/unstable/httpapi"
-import { SessionGroup } from "../contract"
+import { HttpApiClient } from "effect/unstable/httpapi"
+import { ClientApi } from "../contract"
 import { ClientError } from "./client-error"
 
-const Api = HttpApi.make("generated").add(SessionGroup)
-
-type RawClient = HttpApiClient.ForApi<typeof Api>
+type RawClient = HttpApiClient.ForApi<typeof ClientApi>
 
 const mapClientError = <E>(error: E) =>
   HttpClientError.isHttpClientError(error) || Schema.isSchemaError(error) || Sse.Retry.is(error)
@@ -149,12 +147,24 @@ const Endpoint0_12 = (raw: RawClient["server.session"]) => (input: Endpoint0_12I
     Effect.map((value) => value.data),
   )
 
-type Endpoint0_13Request = Parameters<RawClient["server.session"]["session.events"]>[0]
+type Endpoint0_13Request = Parameters<RawClient["server.session"]["session.history"]>[0]
 type Endpoint0_13Input = {
   readonly sessionID: Endpoint0_13Request["params"]["sessionID"]
+  readonly limit?: Endpoint0_13Request["query"]["limit"]
   readonly after?: Endpoint0_13Request["query"]["after"]
 }
 const Endpoint0_13 = (raw: RawClient["server.session"]) => (input: Endpoint0_13Input) =>
+  raw["session.history"]({
+    params: { sessionID: input.sessionID },
+    query: { limit: input.limit, after: input.after },
+  }).pipe(Effect.mapError(mapClientError))
+
+type Endpoint0_14Request = Parameters<RawClient["server.session"]["session.events"]>[0]
+type Endpoint0_14Input = {
+  readonly sessionID: Endpoint0_14Request["params"]["sessionID"]
+  readonly after?: Endpoint0_14Request["query"]["after"]
+}
+const Endpoint0_14 = (raw: RawClient["server.session"]) => (input: Endpoint0_14Input) =>
   Stream.unwrap(
     raw["session.events"]({ params: { sessionID: input.sessionID }, query: { after: input.after } }).pipe(
       Effect.mapError(mapClientError),
@@ -162,17 +172,17 @@ const Endpoint0_13 = (raw: RawClient["server.session"]) => (input: Endpoint0_13I
     ),
   )
 
-type Endpoint0_14Request = Parameters<RawClient["server.session"]["session.interrupt"]>[0]
-type Endpoint0_14Input = { readonly sessionID: Endpoint0_14Request["params"]["sessionID"] }
-const Endpoint0_14 = (raw: RawClient["server.session"]) => (input: Endpoint0_14Input) =>
+type Endpoint0_15Request = Parameters<RawClient["server.session"]["session.interrupt"]>[0]
+type Endpoint0_15Input = { readonly sessionID: Endpoint0_15Request["params"]["sessionID"] }
+const Endpoint0_15 = (raw: RawClient["server.session"]) => (input: Endpoint0_15Input) =>
   raw["session.interrupt"]({ params: { sessionID: input.sessionID } }).pipe(Effect.mapError(mapClientError))
 
-type Endpoint0_15Request = Parameters<RawClient["server.session"]["session.message"]>[0]
-type Endpoint0_15Input = {
-  readonly sessionID: Endpoint0_15Request["params"]["sessionID"]
-  readonly messageID: Endpoint0_15Request["params"]["messageID"]
+type Endpoint0_16Request = Parameters<RawClient["server.session"]["session.message"]>[0]
+type Endpoint0_16Input = {
+  readonly sessionID: Endpoint0_16Request["params"]["sessionID"]
+  readonly messageID: Endpoint0_16Request["params"]["messageID"]
 }
-const Endpoint0_15 = (raw: RawClient["server.session"]) => (input: Endpoint0_15Input) =>
+const Endpoint0_16 = (raw: RawClient["server.session"]) => (input: Endpoint0_16Input) =>
   raw["session.message"]({ params: { sessionID: input.sessionID, messageID: input.messageID } }).pipe(
     Effect.mapError(mapClientError),
     Effect.map((value) => value.data),
@@ -192,12 +202,26 @@ const adaptGroup0 = (raw: RawClient["server.session"]) => ({
   clear: Endpoint0_10(raw),
   commit: Endpoint0_11(raw),
   context: Endpoint0_12(raw),
-  events: Endpoint0_13(raw),
-  interrupt: Endpoint0_14(raw),
-  message: Endpoint0_15(raw),
+  history: Endpoint0_13(raw),
+  events: Endpoint0_14(raw),
+  interrupt: Endpoint0_15(raw),
+  message: Endpoint0_16(raw),
 })
 
-const adaptClient = (raw: RawClient) => ({ sessions: adaptGroup0(raw["server.session"]) })
+const Endpoint1_0 = (raw: RawClient["server.event"]) => () =>
+  Stream.unwrap(
+    raw["event.subscribe"]({}).pipe(
+      Effect.mapError(mapClientError),
+      Effect.map((stream) => stream.pipe(Stream.mapError(mapClientError))),
+    ),
+  )
+
+const adaptGroup1 = (raw: RawClient["server.event"]) => ({ subscribe: Endpoint1_0(raw) })
+
+const adaptClient = (raw: RawClient) => ({
+  sessions: adaptGroup0(raw["server.session"]),
+  events: adaptGroup1(raw["server.event"]),
+})
 
 export const make = (options?: { readonly baseUrl?: URL | string }) =>
-  HttpApiClient.make(Api, options).pipe(Effect.map(adaptClient))
+  HttpApiClient.make(ClientApi, options).pipe(Effect.map(adaptClient))

packages/client/src/generated/client.ts

@@ -24,12 +24,15 @@ import type {
   SessionsCommitOutput,
   SessionsContextInput,
   SessionsContextOutput,
+  SessionsHistoryInput,
+  SessionsHistoryOutput,
   SessionsEventsInput,
   SessionsEventsOutput,
   SessionsInterruptInput,
   SessionsInterruptOutput,
   SessionsMessageInput,
   SessionsMessageOutput,
+  EventsSubscribeOutput,
 } from "./types"
 import { ClientError } from "./client-error"
 
@@ -324,6 +327,18 @@ export function make(options: ClientOptions) {
           },
           requestOptions,
         ).then((value) => value.data),
+      history: (input: SessionsHistoryInput, requestOptions?: RequestOptions) =>
+        request<SessionsHistoryOutput>(
+          {
+            method: "GET",
+            path: `/api/session/${encodeURIComponent(input.sessionID)}/history`,
+            query: { limit: input.limit, after: input.after },
+            successStatus: 200,
+            declaredStatuses: [404, 400, 401],
+            empty: false,
+          },
+          requestOptions,
+        ),
       events: (input: SessionsEventsInput, requestOptions?: RequestOptions): AsyncIterable<SessionsEventsOutput> =>
         sse<SessionsEventsOutput>(
           {
@@ -359,6 +374,13 @@ export function make(options: ClientOptions) {
           requestOptions,
         ).then((value) => value.data),
     },
+    events: {
+      subscribe: (requestOptions?: RequestOptions): AsyncIterable<EventsSubscribeOutput> =>
+        sse<EventsSubscribeOutput>(
+          { method: "GET", path: `/api/event`, successStatus: 200, declaredStatuses: [401, 400], empty: false },
+          requestOptions,
+        ),
+    },
   }
 }
 

packages/client/src/generated/types.ts

@@ -1,3 +1,5 @@
+import type { OpenCodeEventEncoded } from "@opencode-ai/protocol/groups/event"
+
 export type JsonValue =
   | null
   | boolean
@@ -67,7 +69,7 @@ export const isUnknownError = (value: unknown): value is UnknownError =>
 export type SessionsListInput = {
   readonly workspace?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -77,7 +79,7 @@ export type SessionsListInput = {
   }["workspace"]
   readonly limit?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -87,7 +89,7 @@ export type SessionsListInput = {
   }["limit"]
   readonly order?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -97,7 +99,7 @@ export type SessionsListInput = {
   }["order"]
   readonly search?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -107,7 +109,7 @@ export type SessionsListInput = {
   }["search"]
   readonly directory?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -117,7 +119,7 @@ export type SessionsListInput = {
   }["directory"]
   readonly project?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -127,7 +129,7 @@ export type SessionsListInput = {
   }["project"]
   readonly subpath?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -137,7 +139,7 @@ export type SessionsListInput = {
   }["subpath"]
   readonly cursor?: {
     readonly workspace?: string | undefined
-    readonly limit?: string | undefined
+    readonly limit?: number | undefined
     readonly order?: "asc" | "desc" | undefined
     readonly search?: string | undefined
     readonly directory?: string | undefined
@@ -305,7 +307,6 @@ export type SessionsPromptInput = {
       readonly text: string
       readonly files?: ReadonlyArray<{
         readonly uri: string
-        readonly mime: string
         readonly name?: string
         readonly description?: string
         readonly source?: { readonly start: number; readonly end: number; readonly text: string }
@@ -324,7 +325,6 @@ export type SessionsPromptInput = {
       readonly text: string
       readonly files?: ReadonlyArray<{
         readonly uri: string
-        readonly mime: string
         readonly name?: string
         readonly description?: string
         readonly source?: { readonly start: number; readonly end: number; readonly text: string }
@@ -343,7 +343,6 @@ export type SessionsPromptInput = {
       readonly text: string
       readonly files?: ReadonlyArray<{
         readonly uri: string
-        readonly mime: string
         readonly name?: string
         readonly description?: string
         readonly source?: { readonly start: number; readonly end: number; readonly text: string }
@@ -362,7 +361,6 @@ export type SessionsPromptInput = {
       readonly text: string
       readonly files?: ReadonlyArray<{
         readonly uri: string
-        readonly mime: string
         readonly name?: string
         readonly description?: string
         readonly source?: { readonly start: number; readonly end: number; readonly text: string }
@@ -581,26 +579,7 @@ export type SessionsContextOutput = {
           readonly reasoning: number
           readonly cache: { readonly read: number; readonly write: number }
         }
-        readonly error?:
-          | { readonly type: "unknown"; readonly message: string }
-          | {
-              readonly type: "provider"
-              readonly category:
-                | "invalid-request"
-                | "no-route"
-                | "authentication"
-                | "rate-limit"
-                | "quota-exceeded"
-                | "content-policy"
-                | "provider-internal"
-                | "transport"
-                | "invalid-provider-output"
-                | "unknown"
-              readonly message: string
-              readonly status?: number | null
-              readonly retryable: boolean
-              readonly retryAfterMs?: number | null
-            }
+        readonly error?: { readonly type: "unknown"; readonly message: string }
       }
     | {
         readonly type: "compaction"
@@ -614,9 +593,469 @@ export type SessionsContextOutput = {
   >
 }["data"]
 
+export type SessionsHistoryInput = {
+  readonly sessionID: { readonly sessionID: string }["sessionID"]
+  readonly limit?: { readonly limit?: number | undefined; readonly after?: number | undefined }["limit"]
+  readonly after?: { readonly limit?: number | undefined; readonly after?: number | undefined }["after"]
+}
+
+export type SessionsHistoryOutput = {
+  readonly data: ReadonlyArray<
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.agent.switched"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly agent: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.model.switched"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly model: { readonly id: string; readonly providerID: string; readonly variant?: string }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.moved"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly location: { readonly directory: string; readonly workspaceID?: string }
+          readonly subdirectory?: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.prompted"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly prompt: {
+            readonly text: string
+            readonly files?: ReadonlyArray<{
+              readonly uri: string
+              readonly mime: string
+              readonly name?: string
+              readonly description?: string
+              readonly source?: { readonly start: number; readonly end: number; readonly text: string }
+            }>
+            readonly agents?: ReadonlyArray<{
+              readonly name: string
+              readonly source?: { readonly start: number; readonly end: number; readonly text: string }
+            }>
+          }
+          readonly delivery: "steer" | "queue"
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.prompt.admitted"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly prompt: {
+            readonly text: string
+            readonly files?: ReadonlyArray<{
+              readonly uri: string
+              readonly mime: string
+              readonly name?: string
+              readonly description?: string
+              readonly source?: { readonly start: number; readonly end: number; readonly text: string }
+            }>
+            readonly agents?: ReadonlyArray<{
+              readonly name: string
+              readonly source?: { readonly start: number; readonly end: number; readonly text: string }
+            }>
+          }
+          readonly delivery: "steer" | "queue"
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.context.updated"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly text: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.synthetic"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly text: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.shell.started"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly callID: string
+          readonly command: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.shell.ended"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly callID: string
+          readonly output: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.step.started"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly agent: string
+          readonly model: { readonly id: string; readonly providerID: string; readonly variant?: string }
+          readonly snapshot?: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.step.ended"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly finish: string
+          readonly cost: number
+          readonly tokens: {
+            readonly input: number
+            readonly output: number
+            readonly reasoning: number
+            readonly cache: { readonly read: number; readonly write: number }
+          }
+          readonly snapshot?: string
+          readonly files?: ReadonlyArray<string>
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.step.failed"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly error: { readonly type: "unknown"; readonly message: string }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.text.started"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly textID: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.text.ended"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly textID: string
+          readonly text: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.tool.input.started"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly callID: string
+          readonly name: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.tool.input.ended"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly callID: string
+          readonly text: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.tool.called"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly callID: string
+          readonly tool: string
+          readonly input: { readonly [x: string]: JsonValue }
+          readonly provider: {
+            readonly executed: boolean
+            readonly metadata?: { readonly [x: string]: { readonly [x: string]: JsonValue } }
+          }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.tool.progress"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly callID: string
+          readonly structured: { readonly [x: string]: JsonValue }
+          readonly content: ReadonlyArray<
+            | { readonly type: "text"; readonly text: string }
+            | { readonly type: "file"; readonly uri: string; readonly mime: string; readonly name?: string }
+          >
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.tool.success"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly callID: string
+          readonly structured: { readonly [x: string]: JsonValue }
+          readonly content: ReadonlyArray<
+            | { readonly type: "text"; readonly text: string }
+            | { readonly type: "file"; readonly uri: string; readonly mime: string; readonly name?: string }
+          >
+          readonly outputPaths?: ReadonlyArray<string>
+          readonly result?: JsonValue
+          readonly provider: {
+            readonly executed: boolean
+            readonly metadata?: { readonly [x: string]: { readonly [x: string]: JsonValue } }
+          }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.tool.failed"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly callID: string
+          readonly error: { readonly type: "unknown"; readonly message: string }
+          readonly result?: JsonValue
+          readonly provider: {
+            readonly executed: boolean
+            readonly metadata?: { readonly [x: string]: { readonly [x: string]: JsonValue } }
+          }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.reasoning.started"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly reasoningID: string
+          readonly providerMetadata?: { readonly [x: string]: { readonly [x: string]: JsonValue } }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.reasoning.ended"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly assistantMessageID: string
+          readonly reasoningID: string
+          readonly text: string
+          readonly providerMetadata?: { readonly [x: string]: { readonly [x: string]: JsonValue } }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.retried"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly attempt: number
+          readonly error: {
+            readonly message: string
+            readonly statusCode?: number
+            readonly isRetryable: boolean
+            readonly responseHeaders?: { readonly [x: string]: string }
+            readonly responseBody?: string
+            readonly metadata?: { readonly [x: string]: string }
+          }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.compaction.started"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly reason: "auto" | "manual"
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.compaction.ended"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly messageID: string
+          readonly reason: "auto" | "manual"
+          readonly text: string
+          readonly recent: string
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.revert.staged"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: {
+          readonly timestamp: number
+          readonly sessionID: string
+          readonly revert: {
+            readonly messageID: string
+            readonly partID?: string
+            readonly snapshot?: string
+            readonly diff?: string
+            readonly files?: ReadonlyArray<{
+              readonly path: string
+              readonly status: "added" | "modified" | "deleted"
+              readonly additions: number
+              readonly deletions: number
+              readonly patch: string
+            }>
+          }
+        }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.revert.cleared"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: { readonly timestamp: number; readonly sessionID: string }
+      }
+    | {
+        readonly id: string
+        readonly metadata?: { readonly [x: string]: JsonValue }
+        readonly type: "session.next.revert.committed"
+        readonly durable?: { readonly aggregateID: string; readonly seq: number; readonly version: number }
+        readonly location?: { readonly directory: string; readonly workspaceID?: string }
+        readonly data: { readonly timestamp: number; readonly sessionID: string; readonly messageID: string }
+      }
+  >
+  readonly hasMore: boolean
+}
+
 export type SessionsEventsInput = {
   readonly sessionID: { readonly sessionID: string }["sessionID"]
-  readonly after?: { readonly after?: string | undefined }["after"]
+  readonly after?: { readonly after?: number | undefined }["after"]
 }
 
 export type SessionsEventsOutput =
@@ -813,26 +1252,7 @@ export type SessionsEventsOutput =
         readonly timestamp: number
         readonly sessionID: string
         readonly assistantMessageID: string
-        readonly error:
-          | { readonly type: "unknown"; readonly message: string }
-          | {
-              readonly type: "provider"
-              readonly category:
-                | "invalid-request"
-                | "no-route"
-                | "authentication"
-                | "rate-limit"
-                | "quota-exceeded"
-                | "content-policy"
-                | "provider-internal"
-                | "transport"
-                | "invalid-provider-output"
-                | "unknown"
-              readonly message: string
-              readonly status?: number | undefined
-              readonly retryable: boolean
-              readonly retryAfterMs?: number | undefined
-            }
+        readonly error: { readonly type: "unknown"; readonly message: string }
       }
     }
   | {
@@ -1236,26 +1656,7 @@ export type SessionsMessageOutput = {
           readonly reasoning: number
           readonly cache: { readonly read: number; readonly write: number }
         }
-        readonly error?:
-          | { readonly type: "unknown"; readonly message: string }
-          | {
-              readonly type: "provider"
-              readonly category:
-                | "invalid-request"
-                | "no-route"
-                | "authentication"
-                | "rate-limit"
-                | "quota-exceeded"
-                | "content-policy"
-                | "provider-internal"
-                | "transport"
-                | "invalid-provider-output"
-                | "unknown"
-              readonly message: string
-              readonly status?: number | null
-              readonly retryable: boolean
-              readonly retryAfterMs?: number | null
-            }
+        readonly error?: { readonly type: "unknown"; readonly message: string }
       }
     | {
         readonly type: "compaction"
@@ -1267,3 +1668,5 @@ export type SessionsMessageOutput = {
         readonly time: { readonly created: number }
       }
 }["data"]
+
+export type EventsSubscribeOutput = OpenCodeEventEncoded

packages/client/src/index.ts

@@ -1 +1,2 @@
 export * from "./generated/index"
+export type { EventsSubscribeOutput as OpenCodeEvent } from "./generated/types"

packages/client/test/contract-identity.test.ts

@@ -20,7 +20,7 @@ import { Workspace } from "@opencode-ai/schema/workspace"
 import { Api } from "@opencode-ai/server/api"
 import { compile, emitPromise } from "@opencode-ai/httpapi-codegen"
 import { HttpApi } from "effect/unstable/httpapi"
-import { SessionGroup } from "../src/contract"
+import { EventGroup, SessionGroup } from "../src/contract"
 
 test("Core and Server reuse the authoritative Schema and Protocol values", () => {
   expect(AgentV2.ID).toBe(Agent.ID)
@@ -32,6 +32,7 @@ test("Core and Server reuse the authoritative Schema and Protocol values", () =>
   expect(CorePrompt).toBe(Prompt)
   expect(Api.groups["server.session"].identifier).toBe("server.session")
   expect(SessionGroup.identifier).toBe(Api.groups["server.session"].identifier)
+  expect(EventGroup.identifier).toBe(Api.groups["server.event"].identifier)
   expect(Session.ID.create()).toStartWith("ses_")
   expect(Project.ID.global).toBe("global")
   expect(Provider.ID.anthropic).toBe("anthropic")

packages/client/test/effect.test.ts

@@ -15,7 +15,53 @@ test("sessions.get returns the decoded Effect projection", async () => {
   expect(DateTime.toEpochMillis(result.time.created)).toBe(1_717_171_717_000)
 })
 
+test("events.subscribe exposes and decodes the native Effect event stream", async () => {
+  const httpClient = HttpClient.make((request) =>
+    Effect.succeed(
+      HttpClientResponse.fromWeb(
+        request,
+        new Response(
+          `data: ${JSON.stringify({ id: "evt_connected", type: "server.connected", data: {} })}\n\n` +
+            `data: ${JSON.stringify(modelSwitchedEvent)}\n\n`,
+          { headers: { "content-type": "text/event-stream" } },
+        ),
+      ),
+    ),
+  )
+  const events = await Effect.gen(function* () {
+    const client = yield* OpenCode.make({ baseUrl: "http://localhost:3000" })
+    return yield* client.events.subscribe().pipe(Stream.runCollect)
+  }).pipe(Effect.provideService(HttpClient.HttpClient, httpClient), Effect.runPromise)
+
+  expect(Array.from(events).map((event) => event.type)).toEqual(["server.connected", "session.next.model.switched"])
+  const durable = events[1]
+  if (durable?.type !== "session.next.model.switched") throw new Error("Expected model event")
+  expect(DateTime.toEpochMillis(durable.data.timestamp)).toBe(1_717_171_717_000)
+  expect(durable.durable).toEqual({ aggregateID: "ses_test", seq: 1, version: 1 })
+})
+
+test("events.subscribe terminates on Effect protocol decode failures", async () => {
+  const httpClient = HttpClient.make((request) =>
+    Effect.succeed(
+      HttpClientResponse.fromWeb(
+        request,
+        new Response(`data: {"type":"server.connected"}\n\n`, {
+          headers: { "content-type": "text/event-stream" },
+        }),
+      ),
+    ),
+  )
+  const error = await Effect.gen(function* () {
+    const client = yield* OpenCode.make({ baseUrl: "http://localhost:3000" })
+    return yield* client.events.subscribe().pipe(Stream.runCollect, Effect.flip)
+  }).pipe(Effect.provideService(HttpClient.HttpClient, httpClient), Effect.runPromise)
+
+  expect(error._tag).toBe("ClientError")
+})
+
 test("session methods retain decoded Effect inputs and outputs", async () => {
+  const historyQueries: Array<Record<string, string>> = []
+  let historyPage = 0
   const httpClient = HttpClient.make((request) => {
     const url = request.url
     if (url.includes("/event")) {
@@ -28,6 +74,18 @@ test("session methods retain decoded Effect inputs and outputs", async () => {
         ),
       )
     }
+    if (url.includes("/history")) {
+      historyPage++
+      historyQueries.push(Object.fromEntries(request.urlParams.params))
+      return Effect.succeed(
+        HttpClientResponse.fromWeb(
+          request,
+          Response.json(
+            historyPage === 1 ? { data: [modelSwitchedEvent], hasMore: true } : { data: [], hasMore: false },
+          ),
+        ),
+      )
+    }
     if (url.includes("/prompt")) {
       return Effect.succeed(HttpClientResponse.fromWeb(request, Response.json(admission)))
     }
@@ -72,6 +130,18 @@ test("session methods retain decoded Effect inputs and outputs", async () => {
     yield* client.sessions.compact({ sessionID: Session.ID.make("ses_test") })
     yield* client.sessions.wait({ sessionID: Session.ID.make("ses_test") })
     const context = yield* client.sessions.context({ sessionID: Session.ID.make("ses_test") })
+    const history = yield* client.sessions.history({
+      sessionID: Session.ID.make("ses_test"),
+      after: 0,
+      limit: 1,
+    })
+    const historyNext = history.hasMore
+      ? yield* client.sessions.history({
+          sessionID: Session.ID.make("ses_test"),
+          after: history.data.at(-1)?.durable?.seq,
+          limit: 2,
+        })
+      : undefined
     const events = yield* client.sessions
       .events({ sessionID: Session.ID.make("ses_test"), after: 0 })
       .pipe(Stream.runCollect)
@@ -80,7 +150,7 @@ test("session methods retain decoded Effect inputs and outputs", async () => {
       sessionID: Session.ID.make("ses_test"),
       messageID: SessionMessage.ID.make("msg_model"),
     })
-    return { page, active, created, admitted, context, events, message }
+    return { page, active, created, admitted, context, history, historyNext, events, message }
   }).pipe(Effect.provideService(HttpClient.HttpClient, httpClient), Effect.runPromise)
 
   expect(DateTime.toEpochMillis(result.page.data[0].time.created)).toBe(1_717_171_717_000)
@@ -92,10 +162,39 @@ test("session methods retain decoded Effect inputs and outputs", async () => {
   expect(Object.getPrototypeOf(result.admitted.prompt)).toBe(Object.prototype)
   expect(DateTime.toEpochMillis(result.admitted.timeCreated)).toBe(1_717_171_717_000)
   expect(result.context).toEqual([])
+  expect(DateTime.toEpochMillis(result.history.data[0].data.timestamp)).toBe(1_717_171_717_000)
+  expect(result.history).toEqual(expect.objectContaining({ hasMore: true }))
+  expect(result.historyNext).toEqual({ data: [], hasMore: false })
+  expect(historyQueries[0]).toEqual({ limit: "1", after: "0" })
+  expect(historyQueries[1]).toEqual({ limit: "2", after: "1" })
   expect(DateTime.toEpochMillis(result.events[0].data.timestamp)).toBe(1_717_171_717_000)
   expect(result.message).toEqual(expect.objectContaining({ id: "msg_model", type: "model-switched" }))
 })
 
+test("sessions.history retains the typed SessionNotFoundError", async () => {
+  const httpClient = HttpClient.make((request) =>
+    Effect.succeed(
+      HttpClientResponse.fromWeb(
+        request,
+        Response.json(
+          { _tag: "SessionNotFoundError", sessionID: "ses_missing", message: "Session not found" },
+          { status: 404 },
+        ),
+      ),
+    ),
+  )
+  const error = await Effect.gen(function* () {
+    const client = yield* OpenCode.make({ baseUrl: "http://localhost:3000" })
+    return yield* client.sessions
+      .history({
+        sessionID: Session.ID.make("ses_missing"),
+      })
+      .pipe(Effect.flip)
+  }).pipe(Effect.provideService(HttpClient.HttpClient, httpClient), Effect.runPromise)
+
+  expect(error._tag).toBe("SessionNotFoundError")
+})
+
 const session = {
   data: {
     id: "ses_test",

packages/client/test/promise.test.ts

@@ -1,5 +1,5 @@
 import { expect, test } from "bun:test"
-import { isUnauthorizedError, OpenCode } from "../src"
+import { isSessionNotFoundError, isUnauthorizedError, OpenCode } from "../src"
 
 test("sessions.get returns the wire projection", async () => {
   const client = OpenCode.make({
@@ -17,8 +17,38 @@ test("sessions.get returns the wire projection", async () => {
   expect(result.time.created).toBe(1_717_171_717_000)
 })
 
+test("events.subscribe exposes the Promise event stream wire projection", async () => {
+  const client = OpenCode.make({
+    baseUrl: "http://localhost:3000",
+    fetch: async () =>
+      new Response(
+        `: heartbeat\n\ndata: ${JSON.stringify({ id: "evt_connected", type: "server.connected", data: {} })}\n\n` +
+          `data: ${JSON.stringify(modelSwitchedEvent)}\n\n`,
+        { headers: { "content-type": "text/event-stream" } },
+      ),
+  })
+  const events = []
+  for await (const event of client.events.subscribe()) events.push(event)
+
+  expect(events).toEqual([{ id: "evt_connected", type: "server.connected", data: {} }, modelSwitchedEvent])
+  expect(events[1]?.type === "session.next.model.switched" && events[1].data.timestamp).toBe(1_717_171_717_000)
+})
+
+test("events.subscribe terminates on malformed Promise SSE data", async () => {
+  const client = OpenCode.make({
+    baseUrl: "http://localhost:3000",
+    fetch: async () => new Response("data: {not-json}\n\n", { headers: { "content-type": "text/event-stream" } }),
+  })
+
+  await expect(client.events.subscribe()[Symbol.asyncIterator]().next()).rejects.toMatchObject({
+    name: "ClientError",
+    reason: "MalformedResponse",
+  })
+})
+
 test("session methods use the public HTTP contract", async () => {
   const requests: Array<{ url: string; init?: RequestInit }> = []
+  let historyPage = 0
   const client = OpenCode.make({
     baseUrl: "http://localhost:3000",
     fetch: async (input, init) => {
@@ -29,6 +59,12 @@ test("session methods use the public HTTP contract", async () => {
           headers: { "content-type": "text/event-stream" },
         })
       }
+      if (url.includes("/history")) {
+        historyPage++
+        return Response.json(
+          historyPage === 1 ? { data: [modelSwitchedEvent], hasMore: true } : { data: [], hasMore: false },
+        )
+      }
       if (url.includes("/prompt")) return Response.json(admission)
       if (url.includes("/context")) return Response.json({ data: [] })
       if (url.includes("/message/")) return Response.json({ data: modelSwitchedMessage })
@@ -39,7 +75,7 @@ test("session methods use the public HTTP contract", async () => {
     },
   })
 
-  const page = await client.sessions.list({ limit: "10", order: "desc" })
+  const page = await client.sessions.list({ limit: 10, order: "desc" })
   const active = await client.sessions.active()
   const created = await client.sessions.create({ location: { directory: "/tmp/project" } })
   await client.sessions.switchAgent({ sessionID: "ses_test", agent: "build" })
@@ -55,8 +91,13 @@ test("session methods use the public HTTP contract", async () => {
   await client.sessions.compact({ sessionID: "ses_test" })
   await client.sessions.wait({ sessionID: "ses_test" })
   const context = await client.sessions.context({ sessionID: "ses_test" })
+  const history = await client.sessions.history({ sessionID: "ses_test", after: 0, limit: 1 })
+  const historyAfter = history.data.at(-1)?.durable?.seq
+  const historyNext = history.hasMore
+    ? await client.sessions.history({ sessionID: "ses_test", after: historyAfter, limit: 2 })
+    : undefined
   const events = []
-  for await (const event of client.sessions.events({ sessionID: "ses_test", after: "0" })) events.push(event)
+  for await (const event of client.sessions.events({ sessionID: "ses_test", after: 0 })) events.push(event)
   await client.sessions.interrupt({ sessionID: "ses_test" })
   const message = await client.sessions.message({ sessionID: "ses_test", messageID: "msg_model" })
 
@@ -65,6 +106,8 @@ test("session methods use the public HTTP contract", async () => {
   expect(created.id).toBe("ses_test")
   expect(admitted.id).toBe("msg_test")
   expect(context).toEqual([])
+  expect(history).toEqual({ data: [modelSwitchedEvent], hasMore: true })
+  expect(historyNext).toEqual({ data: [], hasMore: false })
   expect(events).toEqual([modelSwitchedEvent])
   expect(message).toEqual(modelSwitchedMessage)
   expect(requests.map((request) => [request.init?.method, request.url])).toEqual([
@@ -77,6 +120,8 @@ test("session methods use the public HTTP contract", async () => {
     ["POST", "http://localhost:3000/api/session/ses_test/compact"],
     ["POST", "http://localhost:3000/api/session/ses_test/wait"],
     ["GET", "http://localhost:3000/api/session/ses_test/context"],
+    ["GET", "http://localhost:3000/api/session/ses_test/history?limit=1&after=0"],
+    ["GET", "http://localhost:3000/api/session/ses_test/history?limit=2&after=1"],
     ["GET", "http://localhost:3000/api/session/ses_test/event?after=0"],
     ["POST", "http://localhost:3000/api/session/ses_test/interrupt"],
     ["GET", "http://localhost:3000/api/session/ses_test/message/msg_model"],
@@ -104,6 +149,24 @@ test("middleware errors remain declared client errors", async () => {
   }
 })
 
+test("sessions.history decodes SessionNotFoundError", async () => {
+  const client = OpenCode.make({
+    baseUrl: "http://localhost:3000",
+    fetch: async () =>
+      Response.json(
+        { _tag: "SessionNotFoundError", sessionID: "ses_missing", message: "Session not found" },
+        { status: 404 },
+      ),
+  })
+
+  try {
+    await client.sessions.history({ sessionID: "ses_missing" })
+    throw new Error("Expected request to fail")
+  } catch (error) {
+    expect(isSessionNotFoundError(error)).toBe(true)
+  }
+})
+
 const session = {
   data: {
     id: "ses_test",

packages/console/app/src/lib/stats-proxy.ts

@@ -1,10 +1,15 @@
 import type { APIEvent } from "@solidjs/start/server"
 import { Resource } from "@opencode-ai/console-resource"
+import { LOCALE_HEADER, cookie, localeFromRequest, route, tag } from "~/lib/language"
 
 const dataPath = "/data"
 
 export async function statsProxy(evt: APIEvent) {
   const req = evt.request.clone()
+  const locale = localeFromRequest(req)
+  const redirect = redirectToLocalizedData(req, new URL(req.url), locale)
+  if (redirect) return redirect
+
   const targetUrl = new URL(req.url)
   targetUrl.protocol = "https:"
   targetUrl.hostname = Resource.App.stage === "production" ? "stats.opencode.ai" : "stats.dev.opencode.ai"
@@ -18,9 +23,13 @@ export async function statsProxy(evt: APIEvent) {
     targetUrl.pathname = targetUrl.pathname.slice(dataPath.length)
   }
 
+  const requestHeaders = new Headers(req.headers)
+  requestHeaders.set(LOCALE_HEADER, locale)
+  requestHeaders.set("accept-language", tag(locale))
+
   const response = await fetch(targetUrl, {
     method: req.method,
-    headers: req.headers,
+    headers: requestHeaders,
     body: req.body,
   })
 
@@ -30,6 +39,7 @@ export async function statsProxy(evt: APIEvent) {
   headers.delete("content-encoding")
   headers.delete("content-length")
   headers.delete("etag")
+  appendVary(headers, "Accept-Language", "Cookie")
 
   return new Response(rewriteStatsHtml(await response.text()), {
     status: response.status,
@@ -52,3 +62,60 @@ export function statsRedirect(evt: APIEvent) {
 function rewriteStatsHtml(html: string) {
   return html.replaceAll('"/_build/', `"${dataPath}/_build/`).replaceAll("'/_build/", `'${dataPath}/_build/`)
 }
+
+function redirectToLocalizedData(request: Request, url: URL, locale: ReturnType<typeof localeFromRequest>) {
+  if (locale === "en") return null
+  if (request.headers.get(LOCALE_HEADER)) return null
+  if (request.method !== "GET" && request.method !== "HEAD") return null
+  if (!acceptsHtml(request)) return null
+  if (!url.pathname.startsWith(`${dataPath}/`) && url.pathname !== dataPath) return null
+  if (isDataBypassPath(url.pathname)) return null
+
+  const next = new URL(url)
+  next.pathname = route(locale, url.pathname)
+
+  const headers = new Headers({
+    Location: next.toString(),
+  })
+  headers.append("set-cookie", cookie(locale))
+  appendVary(headers, "Accept-Language", "Cookie")
+
+  return new Response(null, {
+    status: 308,
+    headers,
+  })
+}
+
+function acceptsHtml(request: Request) {
+  const accept = request.headers.get("accept")
+  return !accept || accept.includes("text/html") || accept.includes("*/*")
+}
+
+function isDataBypassPath(pathname: string) {
+  return (
+    pathname.startsWith(`${dataPath}/_build/`) ||
+    pathname.startsWith(`${dataPath}/api/`) ||
+    pathname.startsWith(`${dataPath}/_server`) ||
+    pathname === `${dataPath}/banner.jpg` ||
+    pathname === `${dataPath}/banner.png`
+  )
+}
+
+function appendVary(headers: Headers, ...values: string[]) {
+  const existing = headers
+    .get("vary")
+    ?.split(",")
+    .map((value) => value.trim())
+    .filter(Boolean)
+
+  headers.set(
+    "vary",
+    values
+      .reduce(
+        (result, value) =>
+          result.some((item) => item.toLowerCase() === value.toLowerCase()) ? result : [...result, value],
+        existing ?? [],
+      )
+      .join(", "),
+  )
+}

packages/console/app/src/routes/zen/util/handler.ts

@@ -215,6 +215,16 @@ export async function handler(
         body: reqBody,
       })
 
+      if (providerInfo.id.startsWith("console.")) {
+        const resEndpointId = res.headers.get("x-opencode-endpoint-id")
+        const resEndpointModelId = res.headers.get("x-opencode-upstream-model-id")
+        if (resEndpointId && resEndpointModelId)
+          logger.metric({
+            provider: resEndpointId,
+            "provider.model": resEndpointModelId,
+          })
+      }
+
       if (res.status !== 200) {
         logger.metric({
           "llm.error.code": res.status,

packages/core/package.json

@@ -16,6 +16,8 @@
     "opencode": "./bin/opencode"
   },
   "exports": {
+    "./effect/layer-node": "./src/effect/layer-node/index.ts",
+    "./effect/node": "./src/effect/node.ts",
     "./session/runner": "./src/session/runner/index.ts",
     "./system-context": "./src/system-context/index.ts",
     "./*": "./src/*.ts"

packages/core/src/agent.ts

@@ -1,5 +1,6 @@
 export * as AgentV2 from "./agent"
 
+import { makeLocationNode } from "./effect/node"
 import { Array, Context, Effect, Layer, Types } from "effect"
 import { Agent } from "@opencode-ai/schema/agent"
 import { State } from "./state"
@@ -106,3 +107,5 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({ service: Service, layer, deps: [] })

packages/core/src/aisdk.ts

@@ -1,5 +1,6 @@
 export * as AISDK from "./aisdk"
 
+import { makeLocationNode } from "./effect/node"
 import type { LanguageModelV3 } from "@ai-sdk/provider"
 import { Cause, Context, Effect, Layer, Schema, Scope } from "effect"
 import { ModelV2 } from "./model"
@@ -231,4 +232,6 @@ export const locationLayer = Layer.effect(
   }),
 )
 
+export const node = makeLocationNode({ service: Service, layer: locationLayer, deps: [] })
+
 export const defaultLayer = locationLayer

packages/core/src/background-job.ts

@@ -2,6 +2,7 @@ export * as BackgroundJob from "./background-job"
 
 import { Cause, Clock, Context, Deferred, Effect, Exit, Layer, Scope, SynchronizedRef } from "effect"
 import { Identifier } from "./id/id"
+import { makeGlobalNode } from "./effect/node"
 
 export type Status = "running" | "completed" | "error" | "cancelled"
 
@@ -362,3 +363,5 @@ export const make = Effect.gen(function* () {
 export const layer = Layer.effect(Service, make)
 
 export const defaultLayer = layer
+
+export const node = makeGlobalNode({ service: Service, layer, deps: [] })

packages/core/src/catalog.ts

@@ -1,5 +1,6 @@
 export * as Catalog from "./catalog"
 
+import { makeLocationNode } from "./effect/node"
 import { Array, Context, Effect, Layer, Option, Order, pipe, Schema } from "effect"
 import { Catalog } from "@opencode-ai/schema/catalog"
 import { ModelV2 } from "./model"
@@ -296,3 +297,5 @@ export const locationLayer = layer.pipe(
   Layer.provideMerge(Integration.locationLayer),
   Layer.provideMerge(Policy.locationLayer),
 )
+
+export const node = makeLocationNode({ service: Service, layer, deps: [EventV2.node, Policy.node, Integration.node] })

packages/core/src/command.ts

@@ -1,5 +1,6 @@
 export * as CommandV2 from "./command"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Effect, Layer, Types } from "effect"
 import { Command } from "@opencode-ai/schema/command"
 import { State } from "./state"
@@ -59,3 +60,5 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({ service: Service, layer, deps: [] })

packages/core/src/config.ts

@@ -1,5 +1,6 @@
 export * as Config from "./config"
 
+import { makeLocationNode } from "./effect/node"
 import path from "path"
 import { type ParseError, parse } from "jsonc-parser"
 import { Context, Effect, Layer, Option, Schema } from "effect"
@@ -218,3 +219,9 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer.pipe(Layer.provideMerge(Policy.locationLayer))
+
+export const node = makeLocationNode({
+  service: Service,
+  layer,
+  deps: [FSUtil.node, Global.node, Location.node, Policy.node],
+})

packages/core/src/credential.ts

@@ -5,6 +5,7 @@ import { Context, Effect, Layer, Schema } from "effect"
 import { Credential } from "@opencode-ai/schema/credential"
 import { Integration } from "@opencode-ai/schema/integration"
 import { Database } from "./database/database"
+import { makeGlobalNode } from "./effect/node"
 import { CredentialTable } from "./credential/sql"
 
 export const ID = Credential.ID
@@ -135,3 +136,5 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(Database.defaultLayer))
+
+export const node = makeGlobalNode({ service: Service, layer, deps: [Database.node] })

packages/core/src/cross-spawn-spawner.ts

@@ -24,7 +24,7 @@ import {
 import * as NodeChildProcess from "node:child_process"
 import { PassThrough } from "node:stream"
 import launch from "cross-spawn"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { filesystem, path } from "./effect/layer-node-platform"
 
 const toError = (err: unknown): Error => (err instanceof globalThis.Error ? err : new globalThis.Error(String(err)))
@@ -503,6 +503,6 @@ export const layer: Layer.Layer<ChildProcessSpawner, never, FileSystem.FileSyste
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(NodeFileSystem.layer), Layer.provide(NodePath.layer))
-export const node = LayerNode.make({ service: ChildProcessSpawner, layer, deps: [filesystem, path] })
+export const node = makeGlobalNode({ service: ChildProcessSpawner, layer, deps: [filesystem, path] })
 
 export * as CrossSpawnSpawner from "./cross-spawn-spawner"

packages/core/src/database/database.ts

@@ -8,7 +8,7 @@ import { Flag } from "../flag/flag"
 import { isAbsolute, join } from "path"
 import { DatabaseMigration } from "./migration"
 import { InstallationChannel } from "../installation/version"
-import { LayerNode } from "../effect/layer-node"
+import { makeGlobalNode } from "../effect/node"
 
 const makeDatabase = EffectDrizzleSqlite.makeWithDefaults()
 type DatabaseShape = Effect.Success<typeof makeDatabase>
@@ -60,4 +60,4 @@ export const defaultLayer = Layer.unwrap(
   }),
 ).pipe(Layer.provide(Global.defaultLayer))
 
-export const node = LayerNode.make({ service: Service, layer: layerFromPath(path()), deps: [] })
+export const node = makeGlobalNode({ service: Service, layer: layerFromPath(path()), deps: [] })

packages/core/src/effect/layer-node-platform.ts

@@ -3,16 +3,16 @@ import { LLMClient, RequestExecutor } from "@opencode-ai/llm/route"
 import { FileSystem, Path } from "effect"
 import { FetchHttpClient } from "effect/unstable/http"
 import { HttpClient } from "effect/unstable/http"
-import { LayerNode } from "./layer-node"
+import { makeGlobalNode } from "./node"
 
-export const filesystem = LayerNode.make({ service: FileSystem.FileSystem, layer: NodeFileSystem.layer, deps: [] })
-export const path = LayerNode.make({ service: Path.Path, layer: NodePath.layer, deps: [] })
-export const httpClient = LayerNode.make({ service: HttpClient.HttpClient, layer: FetchHttpClient.layer, deps: [] })
-export const requestExecutor = LayerNode.make({
+export const filesystem = makeGlobalNode({ service: FileSystem.FileSystem, layer: NodeFileSystem.layer, deps: [] })
+export const path = makeGlobalNode({ service: Path.Path, layer: NodePath.layer, deps: [] })
+export const httpClient = makeGlobalNode({ service: HttpClient.HttpClient, layer: FetchHttpClient.layer, deps: [] })
+export const requestExecutor = makeGlobalNode({
   service: RequestExecutor.Service,
   layer: RequestExecutor.layer,
   deps: [httpClient],
 })
-export const llmClient = LayerNode.make({ service: LLMClient.Service, layer: LLMClient.layer, deps: [requestExecutor] })
+export const llmClient = makeGlobalNode({ service: LLMClient.Service, layer: LLMClient.layer, deps: [requestExecutor] })
 
 export * as LayerNodePlatform from "./layer-node-platform"

packages/core/src/effect/layer-node.ts

@@ -1,248 +0,0 @@
-import { Brand, Context, Layer } from "effect"
-
-type RuntimeLayer = Layer.Layer<never, unknown, unknown>
-type AnyNode = Node<unknown, unknown, any>
-type NodeList<Item extends AnyNode = AnyNode> = readonly [] | readonly [Item, ...Item[]]
-type Output<Item> = [Item] extends [never] ? never : Item extends Node<infer A, unknown, any> ? A : never
-type Error<Item> = [Item] extends [never] ? never : Item extends Node<unknown, infer E, any> ? E : never
-type Missing<Required, Dependencies extends NodeList> = Exclude<Required, Output<Dependencies[number]>>
-type CheckDependencies<Implementation extends Layer.Any, Dependencies extends NodeList> = [
-  Missing<Layer.Services<Implementation>, Dependencies>,
-] extends [never]
-  ? unknown
-  : { readonly "Missing dependencies": Missing<Layer.Services<Implementation>, Dependencies> }
-declare const $OutputType: unique symbol
-declare const $ErrorType: unique symbol
-
-export type Tier<Name extends string = string> = Name & Brand.Brand<"LayerNode.Tier">
-
-const makeTier = Brand.nominal<Tier>()
-
-export type Node<A, E = never, T extends Tier | undefined = undefined> = {
-  readonly kind: "layer" | "group"
-  readonly name: string
-  readonly service?: Context.Service.Any
-  readonly implementation?: Layer.Any
-  readonly dependencies: readonly AnyNode[]
-  readonly tier?: T
-  readonly [$OutputType]?: () => A
-  readonly [$ErrorType]?: () => E
-}
-
-type NodeIdentity =
-  | { readonly service: Context.Service.Any; readonly name?: never }
-  | { readonly name: string; readonly service?: never }
-type DistributiveOmit<A, K extends PropertyKey> = A extends unknown ? Omit<A, K> : never
-
-type NodeInput<
-  Implementation extends Layer.Any,
-  Items extends NodeList,
-  T extends Tier | undefined = undefined,
-> = NodeIdentity & {
-  readonly layer: Implementation
-  readonly deps: Items & CheckDependencies<Implementation, NoInfer<Items>>
-  readonly tier?: T
-}
-
-export function make<
-  const Implementation extends Layer.Any,
-  const Items extends NodeList,
-  const T extends Tier | undefined = undefined,
->(
-  input: NodeInput<Implementation, Items, T>,
-): Node<Layer.Success<Implementation>, Layer.Error<Implementation> | Error<Items[number]>, T> {
-  return {
-    kind: "layer",
-    name: input.service !== undefined ? input.service.key : input.name,
-    service: input.service,
-    implementation: input.layer,
-    dependencies: input.deps,
-    tier: input.tier,
-  }
-}
-
-export function group<const Items extends NodeList>(
-  dependencies: Items,
-): Node<Output<Items[number]>, Error<Items[number]>> {
-  return { kind: "group", name: "group", dependencies }
-}
-
-type AllowedTierNames<Names extends readonly string[], Name extends Names[number]> = Names extends readonly [
-  infer Head extends string,
-  ...infer Tail extends readonly string[],
-]
-  ? Head extends Name
-    ? Head | Tail[number]
-    : AllowedTierNames<Tail, Name>
-  : never
-
-type NodeInTiers<Names extends string> = Node<unknown, unknown, Tier<Names>>
-
-export interface Tiers<Names extends readonly [string, ...string[]]> {
-  readonly names: Names
-  readonly values: { readonly [K in Names[number]]: Tier<K> }
-  readonly make: <Name extends Names[number]>(
-    name: Name,
-  ) => <
-    const Implementation extends Layer.Any,
-    const Items extends NodeList<NodeInTiers<AllowedTierNames<Names, Name>>>,
-  >(
-    input: DistributiveOmit<NodeInput<Implementation, Items, Tier<Name>>, "tier">,
-  ) => Node<Layer.Success<Implementation>, Layer.Error<Implementation> | Error<Items[number]>, Tier<Name>>
-}
-
-export function tiers<const Names extends readonly [string, ...string[]]>(names: Names): Tiers<Names> {
-  const values = Object.fromEntries(names.map((name) => [name, makeTier(name)])) as Tiers<Names>["values"]
-  return {
-    names,
-    values,
-    make: ((name: Names[number]) => (input: DistributiveOmit<NodeInput<Layer.Any, NodeList, Tier>, "tier">) =>
-      make({ ...input, tier: values[name] })) as Tiers<Names>["make"],
-  }
-}
-
-const defaultTiers = tiers(["untiered"])
-const untiered = defaultTiers.values.untiered
-
-export type Replacement = {
-  readonly source: Layer.Any
-  readonly replacement: Layer.Any
-}
-
-type CheckReplacementErrors<SourceError, ReplacementError> = [Exclude<ReplacementError, SourceError>] extends [never]
-  ? unknown
-  : { readonly "New replacement errors": Exclude<ReplacementError, SourceError> }
-
-export function replace<A, E, R, E2>(
-  source: Layer.Layer<A, E, R>,
-  replacement: Layer.Layer<NoInfer<A>, E2, never> & CheckReplacementErrors<E, NoInfer<E2>>,
-): Replacement {
-  return { source, replacement }
-}
-
-export function buildLayer<
-  A,
-  E,
-  const Names extends readonly [string, ...string[]] = readonly ["untiered"],
-  const Built extends Layer.Any = Layer.Layer<never, never, never>,
->(
-  node: Node<A, E, any>,
-  options?: {
-    readonly tiers?: Tiers<Names>
-    readonly buildTier?: (tier: Names[number], layers: readonly Layer.Any[]) => Built
-    readonly replacements?: readonly Replacement[]
-  },
-): Layer.Layer<A | Layer.Success<Built>, E | Layer.Error<Built>, never> {
-  const tiers = options?.tiers ?? (defaultTiers as unknown as Tiers<Names>)
-  const replacementMap = new Map(options?.replacements?.map((item) => [item.source, item.replacement]))
-  const plans = plan(node, tiers, replacementMap)
-  const layers: RuntimeLayer[] = tiers.names.map((name) => {
-    const tier = tiers.values[name as Names[number]]
-    const layers = plans.get(tier) ?? []
-    return (options?.buildTier?.(name, layers) ?? combine(layers)) as RuntimeLayer
-  })
-  if (layers.length === 0) return Layer.empty as never
-  return layers.slice(1).reduce((result, layer) => result.pipe(Layer.provideMerge(layer)), layers[0]) as never
-}
-
-export function combine(layers: readonly Layer.Any[]): RuntimeLayer {
-  return layers.reduce<RuntimeLayer>(
-    (result, layer) => (layer as RuntimeLayer).pipe(Layer.provideMerge(result)),
-    Layer.empty as RuntimeLayer,
-  )
-}
-
-function plan(
-  root: AnyNode,
-  tiers: Tiers<readonly [string, ...string[]]>,
-  replacements: ReadonlyMap<Layer.Any, Layer.Any>,
-) {
-  const indexes = new Map(tiers.names.map((name, index) => [tiers.values[name], index]))
-  const plans = new Map<Tier, Layer.Any[]>()
-  const activeImplementations = new Map<Tier, Map<string, AnyNode>>()
-  const serviceTiers = new Map<string, Tier>()
-  const visiting = new Set<AnyNode>()
-  const stack: AnyNode[] = []
-  const boundaryVisited = new Map<AnyNode, Set<Tier>>()
-  const boundaryServices = new Map<Tier, Map<string, AnyNode>>()
-
-  const validateBoundary = (node: AnyNode, origin: Tier) => {
-    const checked = boundaryVisited.get(node) ?? new Set<Tier>()
-    boundaryVisited.set(node, checked)
-    if (checked.has(origin)) return false
-    checked.add(origin)
-    const services = boundaryServices.get(origin) ?? new Map<string, AnyNode>()
-    boundaryServices.set(origin, services)
-    const key = node.name
-    const existing = services.get(key)
-    if (existing && existing !== node) {
-      throw new Error(`Tier ${origin} has conflicting implementations for ${key}`)
-    }
-    services.set(key, node)
-    return true
-  }
-
-  const visit = (node: AnyNode, currentTier?: Tier, origins: readonly Tier[] = []) => {
-    if (node.kind === "group") {
-      node.dependencies.forEach((dependency) => visit(dependency, currentTier, origins))
-      return
-    }
-
-    const tier = node.tier ?? untiered
-    if (!indexes.has(tier)) throw new Error(`Node ${node.name} is not in the tier configuration`)
-    const key = node.name
-    const serviceTier = serviceTiers.get(key)
-    if (serviceTier && serviceTier !== tier) {
-      throw new Error(`Service ${key} belongs to both tier ${serviceTier} and tier ${tier}`)
-    }
-    serviceTiers.set(key, tier)
-    const nextOrigins = [...origins]
-    if (currentTier) {
-      const current = indexes.get(currentTier)!
-      const required = indexes.get(tier)!
-      if (required < current) {
-        throw new Error(`Tier ${currentTier} cannot depend on lower tier ${tier}`)
-      }
-      if (required > current) nextOrigins.push(currentTier)
-    }
-    const unseenOrigins = nextOrigins.filter((origin) => validateBoundary(node, origin))
-
-    // A node may need to be emitted more than once because the final output is a
-    // flat list of layers applied with Layer.provideMerge. If another node for
-    // the same service was emitted afterward, this node is no longer the active
-    // implementation for subsequent consumers. Re-emitting restores the intended
-    // implementation ordering while Effect memoization avoids reacquiring the layer.
-    const implementations = activeImplementations.get(tier) ?? new Map<string, AnyNode>()
-    activeImplementations.set(tier, implementations)
-    if (implementations.get(key) === node && unseenOrigins.length === 0) return
-
-    if (visiting.has(node)) {
-      const start = stack.indexOf(node)
-      throw new Error(
-        `Cycle detected in layer graph: ${[...stack.slice(start), node].map((item) => item.name).join(" -> ")}`,
-      )
-    }
-
-    visiting.add(node)
-    stack.push(node)
-    try {
-      node.dependencies.forEach((dependency) => visit(dependency, tier, unseenOrigins))
-      const layers = plans.get(tier) ?? []
-      plans.set(tier, layers)
-      layers.push(replacements.get(node.implementation!) ?? node.implementation!)
-      implementations.set(key, node)
-    } finally {
-      stack.pop()
-      visiting.delete(node)
-    }
-  }
-
-  visit(root)
-  return plans
-}
-
-function requireTier(node: AnyNode, indexes: ReadonlyMap<Tier, number>) {
-  if (!node.tier || !indexes.has(node.tier)) throw new Error(`Node ${node.name} is not in the tier configuration`)
-}
-
-export * as LayerNode from "./layer-node"

packages/core/src/effect/layer-node/index.ts

@@ -0,0 +1,2 @@
+export * from "./layer-node"
+export * as LayerNodeTree from "./layer-node-tree"

packages/core/src/effect/layer-node/layer-node-tree.ts

@@ -0,0 +1,118 @@
+import { Layer } from "effect"
+import { LayerNode } from "./layer-node"
+
+type AnyNode = LayerNode.Node<unknown, unknown, any>
+type RuntimeLayer = Layer.Layer<never, unknown, unknown>
+
+export function hoist<A, E, T extends LayerNode.Tag>(
+  root: LayerNode.Node<A, E, any>,
+  tag: T,
+): {
+  readonly node: LayerNode.Node<A, E>
+  readonly hoisted: LayerNode.Node<unknown, E>
+} {
+  const visited = new Map<AnyNode, AnyNode>()
+  const hoisted = new Map<string, AnyNode>()
+  const visiting = new Set<AnyNode>()
+  const stack: AnyNode[] = []
+
+  const visit = (node: AnyNode): AnyNode => {
+    if (node.kind === "group") {
+      return { ...node, dependencies: node.dependencies.map(visit) }
+    }
+
+    const existingNode = visited.get(node)
+    if (existingNode) return existingNode
+
+    if (node.tag === tag) {
+      const existing = hoisted.get(node.name)
+      if (existing && existing !== node) {
+        throw new Error(`Tag ${tag} has conflicting implementations for ${node.name}`)
+      }
+      hoisted.set(node.name, node)
+      const empty = LayerNode.group([])
+      visited.set(node, empty)
+      return empty
+    }
+    if (node.kind === "unbound") {
+      return node
+    }
+
+    if (visiting.has(node)) {
+      const start = stack.indexOf(node)
+      throw new Error(
+        `Cycle detected in layer tree: ${[...stack.slice(start), node].map((item) => item.name).join(" -> ")}`,
+      )
+    }
+    visiting.add(node)
+    stack.push(node)
+    try {
+      const dependencies = node.dependencies.map(visit)
+      const clone = { ...node, dependencies }
+      visited.set(node, clone)
+      return clone
+    } finally {
+      stack.pop()
+      visiting.delete(node)
+    }
+  }
+
+  return {
+    node: visit(root) as LayerNode.Node<A, E>,
+    hoisted: LayerNode.group(Array.from(hoisted.values())) as LayerNode.Node<unknown, E>,
+  }
+}
+
+export function compile<A, E>(
+  root: LayerNode.Node<A, E, any>,
+  replacements?: ReadonlyMap<Layer.Any, Layer.Any>,
+): Layer.Layer<A, E> {
+  const cache = new Map<AnyNode, RuntimeLayer>()
+  const compileNode = (node: AnyNode): RuntimeLayer => {
+    if (node.kind === "unbound") throw new Error(`Unbound layer node: ${node.name}`)
+    const cached = cache.get(node)
+    if (cached) return cached
+    const dependencies = node.dependencies.flatMap(flatten).map(compileNode)
+    const implementation = (replacements?.get(node.implementation!) ?? node.implementation!) as RuntimeLayer
+    const layer =
+      dependencies.length === 0
+        ? implementation
+        : implementation.pipe(Layer.provide(dependencies as [RuntimeLayer, ...RuntimeLayer[]]))
+    cache.set(node, layer)
+    return layer
+  }
+  const layers = flatten(root).map((node) => compileNode(node))
+  const layer = layers.reduce<RuntimeLayer>((result, layer) => layer.pipe(Layer.provideMerge(result)), Layer.empty)
+  return layer as Layer.Layer<A, E>
+}
+
+export function bind<A, E, T extends LayerNode.Tag | undefined>(
+  root: LayerNode.Node<A, E, T>,
+  source: AnyNode,
+  replacement: AnyNode,
+): LayerNode.Node<A, E, T> {
+  if (source.kind !== "unbound") throw new Error(`Cannot bind non-unbound layer node: ${source.name}`)
+  if (source.name !== replacement.name) {
+    throw new Error(`Cannot bind ${source.name} to ${replacement.name}`)
+  }
+  if (source.tag !== replacement.tag) {
+    throw new Error(`Cannot bind ${source.name} across tags`)
+  }
+  const visited = new Map<AnyNode, AnyNode>()
+  const visit = (node: AnyNode): AnyNode => {
+    if (node === source) return replacement
+    const existing = visited.get(node)
+    if (existing) return existing
+    if (node.kind === "unbound") return node
+    const clone = { ...node, dependencies: node.dependencies.map(visit) }
+    visited.set(node, clone)
+    return clone
+  }
+  return visit(root) as LayerNode.Node<A, E, T>
+}
+
+function flatten(node: AnyNode): readonly AnyNode[] {
+  return node.kind === "group" ? node.dependencies.flatMap(flatten) : [node]
+}
+
+export * as LayerNodeTree from "./layer-node-tree"

packages/core/src/effect/layer-node/layer-node.ts

@@ -0,0 +1,127 @@
+import { Brand, Context, Layer } from "effect"
+
+type AnyNode = Node<unknown, unknown, any>
+type NodeList<Item extends AnyNode = AnyNode> = readonly [] | readonly [Item, ...Item[]]
+export type Output<Item> = [Item] extends [never] ? never : Item extends Node<infer A, unknown, any> ? A : never
+export type Error<Item> = [Item] extends [never] ? never : Item extends Node<unknown, infer E, any> ? E : never
+type NodeTag<Item> = [Item] extends [never] ? undefined : Item extends Node<unknown, unknown, infer T> ? T : never
+type Missing<Required, Dependencies extends NodeList> = Exclude<Required, Output<Dependencies[number]>>
+type CheckDependencies<Implementation extends Layer.Any, Dependencies extends NodeList> = [
+  Missing<Layer.Services<Implementation>, Dependencies>,
+] extends [never]
+  ? unknown
+  : { readonly "Missing dependencies": Missing<Layer.Services<Implementation>, Dependencies> }
+declare const $OutputType: unique symbol
+declare const $ErrorType: unique symbol
+
+export type Tag<Name extends string = string> = Name & Brand.Brand<"LayerNode.Tag">
+
+const makeTag = Brand.nominal<Tag>()
+
+export interface Node<A, E = never, T extends Tag | undefined = undefined> {
+  readonly kind: "layer" | "unbound" | "group"
+  readonly name: string
+  readonly service?: Context.Service.Any
+  readonly implementation?: Layer.Any
+  readonly dependencies: readonly AnyNode[]
+  readonly tag?: T
+  readonly [$OutputType]?: () => A
+  readonly [$ErrorType]?: () => E
+}
+
+type NodeIdentity =
+  | { readonly service: Context.Service.Any; readonly name?: never }
+  | { readonly name: string; readonly service?: never }
+type DistributiveOmit<A, K extends PropertyKey> = A extends unknown ? Omit<A, K> : never
+
+type MakeInput<
+  Implementation extends Layer.Any,
+  Items extends NodeList,
+  T extends Tag | undefined = undefined,
+> = NodeIdentity & {
+  readonly layer: Implementation
+  readonly deps: Items & CheckDependencies<Implementation, NoInfer<Items>>
+  readonly tag?: T
+}
+
+export function make<
+  const Implementation extends Layer.Any,
+  const Items extends NodeList,
+  const T extends Tag | undefined = undefined,
+>(
+  input: MakeInput<Implementation, Items, T>,
+): Node<Layer.Success<Implementation>, Layer.Error<Implementation> | Error<Items[number]>, T> {
+  return {
+    kind: "layer",
+    name: input.service !== undefined ? input.service.key : input.name,
+    service: input.service,
+    implementation: input.layer,
+    dependencies: input.deps,
+    tag: input.tag,
+  }
+}
+
+export function unbound<R, Shape, const T extends Tag>(service: Context.Key<R, Shape>, tag: T): Node<R, never, T> {
+  return {
+    kind: "unbound",
+    name: service.key,
+    service,
+    dependencies: [],
+    tag,
+  }
+}
+
+export function group<const Items extends readonly AnyNode[]>(
+  dependencies: Items,
+): Node<Output<Items[number]>, Error<Items[number]>, NodeTag<Items[number]>> {
+  return { kind: "group", name: "group", dependencies }
+}
+
+export type TagConfig = Readonly<Record<string, readonly string[]>>
+type TagNames<Config extends TagConfig> = keyof Config & string
+type NodeInTags<Names extends string> = Node<unknown, unknown, Tag<Names> | undefined>
+type CheckTags<Items extends NodeList, Names extends string> = [Exclude<Items[number], NodeInTags<Names>>] extends [
+  never,
+]
+  ? unknown
+  : { readonly "Invalid tag dependencies": Exclude<Items[number], NodeInTags<Names>> }
+
+export interface Tags<Config extends TagConfig> {
+  readonly values: { readonly [Name in TagNames<Config>]: Tag<Name> }
+  readonly make: <Name extends TagNames<Config>>(
+    name: Name,
+  ) => <const Implementation extends Layer.Any, const Items extends NodeList>(
+    input: DistributiveOmit<MakeInput<Implementation, Items, Tag<Name>>, "tag"> &
+      CheckTags<Items, Name | Extract<Config[Name][number], string>>,
+  ) => Node<Layer.Success<Implementation>, Layer.Error<Implementation> | Error<Items[number]>, Tag<Name>>
+}
+
+export function tags<const Config extends { readonly [Name in keyof Config]: readonly (keyof Config & string)[] }>(
+  config: Config,
+): Tags<Config> {
+  const names = Object.keys(config) as TagNames<Config>[]
+  const values = Object.fromEntries(names.map((name) => [name, makeTag(name)])) as Tags<Config>["values"]
+  return {
+    values,
+    make: ((name: TagNames<Config>) => (input: DistributiveOmit<MakeInput<Layer.Any, NodeList, Tag>, "tag">) =>
+      make({ ...input, tag: values[name] })) as Tags<Config>["make"],
+  }
+}
+
+export type Replacement = {
+  readonly source: Layer.Any
+  readonly replacement: Layer.Any
+}
+
+type CheckReplacementErrors<SourceError, ReplacementError> = [Exclude<ReplacementError, SourceError>] extends [never]
+  ? unknown
+  : { readonly "New replacement errors": Exclude<ReplacementError, SourceError> }
+
+export function replace<A, E, R, E2>(
+  source: Layer.Layer<A, E, R>,
+  replacement: Layer.Layer<NoInfer<A>, E2, never> & CheckReplacementErrors<E, NoInfer<E2>>,
+): Replacement {
+  return { source, replacement }
+}
+
+export * as LayerNode from "./layer-node"

packages/core/src/effect/node-build.ts

@@ -0,0 +1,18 @@
+import { Layer } from "effect"
+import { buildLocationServiceMap } from "../location-services"
+import { LocationServiceMap } from "../location-service-map"
+import { LayerNode, LayerNodeTree } from "./layer-node"
+import { makeGlobalNode } from "./node"
+
+export function build<A, E>(root: LayerNode.Node<A, E, any>, replacements?: readonly LayerNode.Replacement[]) {
+  const replacementMap = new Map(replacements?.map((item) => [item.source, item.replacement]))
+
+  const locationMap = buildLocationServiceMap(replacementMap)
+  const locationMapNode = makeGlobalNode({ service: LocationServiceMap.Service, layer: locationMap, deps: [] })
+
+  const app = LayerNodeTree.bind(root, LocationServiceMap.node, locationMapNode)
+
+  return LayerNodeTree.compile(app, replacementMap)
+}
+
+export * as NodeBuild from "./node-build"

packages/core/src/effect/node.ts

@@ -0,0 +1,14 @@
+import { LayerNode } from "./layer-node"
+
+export const tags = LayerNode.tags({
+  location: ["global"],
+  global: [],
+})
+
+export type GlobalNode<A, E = never> = LayerNode.Node<A, E, (typeof tags.values)["global"]>
+export type LocationNode<A, E = never> = LayerNode.Node<A, E, (typeof tags.values)["location"]>
+
+export const makeGlobalNode = tags.make("global")
+export const makeLocationNode = tags.make("location")
+
+export * as Node from "./node"

packages/core/src/effect/scoped-node.ts

@@ -1,11 +0,0 @@
-import { LayerNode } from "./layer-node"
-
-export const tiers = LayerNode.tiers(["location", "global"])
-
-export type GlobalNode<A, E = never> = LayerNode.Node<A, E, (typeof tiers.values)["global"]>
-export type LocationNode<A, E = never> = LayerNode.Node<A, E, (typeof tiers.values)["location"]>
-
-export const makeGlobalNode = tiers.make("global")
-export const makeLocationNode = tiers.make("location")
-
-export * as ScopedNode from "./scoped-node"

packages/core/src/event.ts

@@ -1,13 +1,13 @@
 export * as EventV2 from "./event"
 
-import { Cause, Context, Effect, Layer, Option, PubSub, Schema, Stream } from "effect"
+import { Cause, Context, Effect, Layer, Option, PubSub, Queue, Schema, Stream } from "effect"
 import { Event } from "@opencode-ai/schema/event"
 import type { Data, Definition, Payload } from "@opencode-ai/schema/event"
-import { and, asc, eq, gt } from "drizzle-orm"
+import { and, asc, eq, gt, inArray } from "drizzle-orm"
 import { Database } from "./database/database"
 import { EventSequenceTable, EventTable } from "./event/sql"
 import { Location } from "./location"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { isDeepStrictEqual } from "node:util"
 import { Durable } from "@opencode-ai/schema/durable-event-manifest"
 
@@ -47,6 +47,71 @@ export class InvalidDurableEventError extends Schema.TaggedErrorClass<InvalidDur
   },
 ) {}
 
+const decodeSerializedEvent = (event: SerializedEvent): Payload => {
+  const definition = Durable.get(event.type)
+  if (!definition?.durable) {
+    throw new InvalidDurableEventError({ type: event.type, message: `Unknown durable event type ${event.type}` })
+  }
+  return {
+    id: event.id,
+    type: definition.type,
+    durable: { aggregateID: event.aggregateID, seq: event.seq, version: definition.durable.version },
+    data: Schema.decodeUnknownSync(definition.data)(event.data),
+  }
+}
+
+export const readAggregate = Effect.fn("EventV2.readAggregate")(function* <A>(
+  db: Database.Interface["db"],
+  input: {
+    readonly aggregateID: string
+    readonly after?: number
+    readonly limit: number
+    readonly manifest: {
+      readonly definitions: ReadonlyMap<string, Definition>
+      readonly schema: Schema.Decoder<A, never>
+    }
+  },
+) {
+  const after = input.after ?? -1
+  const rows = yield* db
+    .select()
+    .from(EventTable)
+    .where(
+      and(
+        eq(EventTable.aggregate_id, input.aggregateID),
+        gt(EventTable.seq, after),
+        inArray(EventTable.type, Array.from(input.manifest.definitions.keys())),
+      ),
+    )
+    .orderBy(asc(EventTable.seq))
+    .limit(input.limit + 1)
+    .all()
+    .pipe(Effect.orDie)
+  const page = rows.slice(0, input.limit)
+  const decode = Schema.decodeUnknownSync(input.manifest.schema)
+  const events = page.map((event) =>
+    decode({
+      id: event.id,
+      type: input.manifest.definitions.get(event.type)?.type ?? event.type,
+      durable: {
+        aggregateID: event.aggregate_id,
+        seq: event.seq,
+        version: input.manifest.definitions.get(event.type)?.durable?.version,
+      },
+      data: event.data,
+    }),
+  )
+  return {
+    events,
+    hasMore: rows.length > input.limit,
+  }
+})
+
+export class SubscriberOverflowError extends Schema.TaggedErrorClass<SubscriberOverflowError>()(
+  "EventV2.SubscriberOverflow",
+  { capacity: Schema.Int },
+) {}
+
 export const define = Event.define
 export const versionedType = Event.versionedType
 
@@ -84,6 +149,20 @@ export interface Interface {
 
 export class Service extends Context.Service<Service, Interface>()("@opencode/Event") {}
 
+export const allBounded = (events: Interface, capacity: number) =>
+  Effect.gen(function* () {
+    const queue = yield* Queue.dropping<Payload, SubscriberOverflowError>(capacity)
+    const unsubscribe = yield* events.listen((event) =>
+      Queue.offer(queue, event).pipe(
+        Effect.flatMap((accepted) =>
+          accepted ? Effect.void : Queue.fail(queue, new SubscriberOverflowError({ capacity })).pipe(Effect.asVoid),
+        ),
+      ),
+    )
+    yield* Effect.addFinalizer(() => unsubscribe.pipe(Effect.andThen(Queue.shutdown(queue)), Effect.asVoid))
+    return Stream.fromQueue(queue)
+  })
+
 export interface LayerOptions {
   readonly beforeAggregateRead?: (aggregateID: string) => Effect.Effect<void>
 }
@@ -459,19 +538,6 @@ export const layerWith = (options?: LayerOptions) =>
 
       const streamAll = (): Stream.Stream<Payload> => Stream.fromPubSub(pubsub.all)
 
-      const decodeSerializedEvent = (event: SerializedEvent) => {
-        const definition = Durable.get(event.type)
-        if (!definition?.durable) {
-          throw new InvalidDurableEventError({ type: event.type, message: `Unknown durable event type ${event.type}` })
-        }
-        return {
-          id: event.id,
-          type: definition.type,
-          durable: { aggregateID: event.aggregateID, seq: event.seq, version: definition.durable.version },
-          data: Schema.decodeUnknownSync(definition.data)(event.data),
-        }
-      }
-
       const readAfter = (aggregateID: string, after: number) =>
         (options?.beforeAggregateRead?.(aggregateID) ?? Effect.void).pipe(
           Effect.andThen(
@@ -569,6 +635,6 @@ export const layerWith = (options?: LayerOptions) =>
   )
 
 export const layer = layerWith()
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [Database.node] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [Database.node] })
 
 export const defaultLayer = layer.pipe(Layer.provide(Database.defaultLayer))

packages/core/src/file-mutation.ts

@@ -1,5 +1,6 @@
 export * as FileMutation from "./file-mutation"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Effect, Layer, Schema } from "effect"
 import { dirname } from "path"
 import { KeyedMutex } from "./effect/keyed-mutex"
@@ -192,6 +193,8 @@ function sameBytes(left: Uint8Array, right: Uint8Array) {
 
 export const locationLayer = layer
 
+export const node = makeLocationNode({ service: Service, layer, deps: [FSUtil.node] })
+
 /**
  * Deferred until the corresponding V2 integrations exist.
  */

packages/core/src/filesystem.ts

@@ -1,5 +1,6 @@
 export * as FileSystem from "./filesystem"
 
+import { makeLocationNode } from "./effect/node"
 import path from "path"
 import { Context, Effect, Layer, Schema } from "effect"
 import { FSUtil } from "./fs-util"
@@ -113,3 +114,9 @@ const baseLayer = Layer.effect(
 export const layer = baseLayer.pipe(Layer.provide(FileSystemSearch.locationLayer), Layer.provide(FSUtil.defaultLayer))
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({
+  service: Service,
+  layer: baseLayer,
+  deps: [FSUtil.node, Location.node, FileSystemSearch.node],
+})

packages/core/src/filesystem/search.ts

@@ -1,5 +1,6 @@
 export * as FileSystemSearch from "./search"
 
+import { makeLocationNode } from "../effect/node"
 import path from "path"
 import { Context, Effect, Layer, Scope } from "effect"
 import { Fff } from "#fff"
@@ -229,6 +230,8 @@ export const fffLayer = Layer.effect(
   }),
 )
 
-export const locationLayer = Layer.unwrap(
-  Effect.sync(() => (Flag.OPENCODE_DISABLE_FFF || !Fff.available() ? ripgrepLayer : fffLayer)),
-)
+const layer = Layer.unwrap(Effect.sync(() => (Flag.OPENCODE_DISABLE_FFF || !Fff.available() ? ripgrepLayer : fffLayer)))
+
+export const locationLayer = layer
+
+export const node = makeLocationNode({ service: Service, layer, deps: [FSUtil.node, Location.node, Ripgrep.node] })

packages/core/src/filesystem/watcher.ts

@@ -3,6 +3,7 @@ export * as Watcher from "./watcher"
 // @ts-ignore
 import { createWrapper } from "@parcel/watcher/wrapper"
 import type ParcelWatcher from "@parcel/watcher"
+import { makeLocationNode } from "../effect/node"
 import { Cause, Context, Effect, Layer } from "effect"
 import { FileSystemWatcher } from "@opencode-ai/schema/filesystem-watcher"
 import path from "path"
@@ -133,3 +134,9 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer.pipe(Layer.provide(Config.locationLayer), Layer.provide(Git.defaultLayer))
+
+export const node = makeLocationNode({
+  service: Service,
+  layer,
+  deps: [FSUtil.node, Location.node, Config.node, Git.node, EventV2.node],
+})

packages/core/src/fs-util.ts

@@ -7,7 +7,7 @@ import { Context, Effect, FileSystem, Layer, Schema } from "effect"
 import type { PlatformError } from "effect/PlatformError"
 import { Glob } from "./util/glob"
 import { serviceUse } from "./effect/service-use"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { filesystem } from "./effect/layer-node-platform"
 
 export namespace FSUtil {
@@ -201,7 +201,7 @@ export namespace FSUtil {
   )
 
   export const defaultLayer = layer.pipe(Layer.provide(NodeFileSystem.layer))
-  export const node = LayerNode.make({ service: Service, layer: layer, deps: [filesystem] })
+  export const node = makeGlobalNode({ service: Service, layer: layer, deps: [filesystem] })
 
   // Pure helpers that don't need Effect (path manipulation, sync operations)
   export function mimeType(p: string): string {

packages/core/src/git.ts

@@ -7,7 +7,7 @@ import { ChildProcess } from "effect/unstable/process"
 import { AbsolutePath, RelativePath } from "./schema"
 import { FSUtil } from "./fs-util"
 import { AppProcess } from "./process"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { File } from "./file"
 import { KeyedMutex } from "./effect/keyed-mutex"
 
@@ -944,7 +944,7 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(FSUtil.defaultLayer), Layer.provide(AppProcess.defaultLayer))
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [FSUtil.node, AppProcess.node] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [FSUtil.node, AppProcess.node] })
 
 interface Result {
   readonly exitCode: number

packages/core/src/global.ts

@@ -5,7 +5,7 @@ import os from "os"
 import { Context, Effect, Layer } from "effect"
 import { Flock } from "./util/flock"
 import { Flag } from "./flag/flag"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 
 const app = "opencode"
 const data = path.join(xdgData!, app)
@@ -77,7 +77,7 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [] })
 
 export const layerWith = (input: Partial<Interface>) =>
   Layer.effect(

packages/core/src/image.ts

@@ -1,5 +1,6 @@
 export * as Image from "./image"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Effect, Layer, Schema } from "effect"
 import { Config } from "./config"
 import { FileSystem } from "./filesystem"
@@ -76,3 +77,5 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer.pipe(Layer.provide(Config.locationLayer))
+
+export const node = makeLocationNode({ service: Service, layer, deps: [Config.node] })

packages/core/src/instruction-context.ts

@@ -9,6 +9,7 @@ import { Location } from "./location"
 import { AbsolutePath } from "./schema"
 import { SystemContext } from "./system-context/index"
 import { SystemContextRegistry } from "./system-context/registry"
+import { makeLocationNode } from "./effect/node"
 
 class File extends Schema.Class<File>("InstructionContext.File")({
   path: AbsolutePath,
@@ -87,6 +88,12 @@ export const layer = Layer.effectDiscard(
   }),
 )
 
+export const node = makeLocationNode({
+  name: "instruction-context",
+  layer,
+  deps: [FSUtil.node, Global.node, Location.node, SystemContextRegistry.node],
+})
+
 function render(files: ReadonlyArray<File>) {
   return files.map((file) => `Instructions from: ${file.path}\n${file.content}`).join("\n\n")
 }

packages/core/src/integration.ts

@@ -1,5 +1,6 @@
 export * as Integration from "./integration"
 
+import { makeLocationNode } from "./effect/node"
 import {
   Cause,
   Clock,
@@ -515,3 +516,5 @@ export const locationLayer = Layer.effect(
     })
   }),
 )
+
+export const node = makeLocationNode({ service: Service, layer: locationLayer, deps: [Credential.node, EventV2.node] })

packages/core/src/location-layer.ts

@@ -1,151 +0,0 @@
-import { Effect, Layer, LayerMap } from "effect"
-import { Location } from "./location"
-import { Policy } from "./policy"
-import { Config } from "./config"
-import { PluginV2 } from "./plugin"
-import { Catalog } from "./catalog"
-import { Integration } from "./integration"
-import { CommandV2 } from "./command"
-import { AgentV2 } from "./agent"
-import { PluginInternal } from "./plugin/internal"
-import { Project } from "./project"
-import { ProjectCopy } from "./project/copy"
-import { ProjectDirectories } from "./project/directories"
-import { EventV2 } from "./event"
-import { Credential } from "./credential"
-import { Npm } from "./npm"
-import { ModelsDev } from "./models-dev"
-import { FSUtil } from "./fs-util"
-import { Git } from "./git"
-import { Global } from "./global"
-import { Database } from "./database/database"
-import { PermissionV2 } from "./permission"
-import { PermissionSaved } from "./permission/saved"
-import { FileSystem } from "./filesystem"
-import { Ripgrep } from "./ripgrep"
-import { Watcher } from "./filesystem/watcher"
-import { LocationMutation } from "./location-mutation"
-import { FileMutation } from "./file-mutation"
-import { Reference } from "./reference"
-import { ReferenceGuidance } from "./reference/guidance"
-import { RepositoryCache } from "./repository-cache"
-import { Pty } from "./pty"
-import { SkillV2 } from "./skill"
-import { SkillGuidance } from "./skill/guidance"
-import { BuiltInTools } from "./tool/builtins"
-import { Image } from "./image"
-import { ToolRegistry } from "./tool/registry"
-import { ApplicationTools } from "./tool/application-tools"
-import { ToolOutputStore } from "./tool-output-store"
-import { AppProcess } from "./process"
-import { SessionStore } from "./session/store"
-import { SessionTodo } from "./session/todo"
-import { QuestionV2 } from "./question"
-import { LLMClient } from "@opencode-ai/llm"
-import { RequestExecutor } from "@opencode-ai/llm/route"
-import * as SessionRunnerLLM from "./session/runner/llm"
-import { SessionRunnerModel } from "./session/runner/model"
-import { SystemContextBuiltIns } from "./system-context/builtins"
-import { FetchHttpClient } from "effect/unstable/http"
-import { Snapshot } from "./snapshot"
-
-export class LocationServiceMap extends LayerMap.Service<LocationServiceMap>()("@opencode/example/LocationServiceMap", {
-  lookup: (ref: Location.Ref) => {
-    const boot = Layer.effectDiscard(
-      Effect.logInfo("booting location services", { directory: ref.directory, workspaceID: ref.workspaceID }),
-    )
-    const location = Location.layer(ref)
-    const systemContext = SystemContextBuiltIns.locationLayer
-    const base = Layer.mergeAll(
-      location,
-      Policy.locationLayer,
-      Config.locationLayer,
-      Reference.locationLayer,
-      PluginV2.locationLayer,
-      Catalog.locationLayer,
-      Integration.locationLayer,
-      CommandV2.locationLayer,
-      AgentV2.locationLayer,
-      PluginInternal.locationLayer,
-      ProjectCopy.locationLayer,
-      FileSystem.locationLayer,
-      Watcher.locationLayer,
-      Pty.locationLayer,
-      SkillV2.locationLayer,
-      systemContext,
-      LocationMutation.locationLayer.pipe(Layer.orDie),
-    ).pipe(Layer.provideMerge(location))
-    const resources = ToolOutputStore.layer.pipe(Layer.provide(base))
-    const permissionsAndTools = ToolRegistry.layer.pipe(
-      Layer.provideMerge(PermissionV2.locationLayer),
-      Layer.provide(resources),
-      Layer.provide(base),
-    )
-    const services = Layer.mergeAll(base, resources, permissionsAndTools)
-    const image = Image.layer.pipe(Layer.provide(services))
-    const mutation = FileMutation.locationLayer.pipe(Layer.provide(services))
-    const skillGuidance = SkillGuidance.locationLayer.pipe(Layer.provide(services))
-    const referenceGuidance = ReferenceGuidance.locationLayer.pipe(Layer.provide(services))
-    const todos = SessionTodo.layer.pipe(Layer.provide(services))
-    const questions = QuestionV2.locationLayer.pipe(Layer.provide(services))
-    const builtInTools = BuiltInTools.locationLayer.pipe(
-      Layer.provide(services),
-      Layer.provide(mutation),
-      Layer.provide(resources),
-      Layer.provide(todos),
-      Layer.provide(questions),
-      Layer.provide(image),
-    )
-    const model = SessionRunnerModel.locationLayer.pipe(Layer.provide(services))
-    const snapshot = Snapshot.locationLayer.pipe(Layer.provide(services))
-    const runner = SessionRunnerLLM.defaultLayer.pipe(
-      Layer.provide(services),
-      Layer.provide(model),
-      Layer.provide(skillGuidance),
-      Layer.provide(referenceGuidance),
-      Layer.provide(snapshot),
-    )
-
-    // Kick off a background project copy refresh to update locations now that we
-    // have a location
-    const projectCopyRefresh = Layer.effectDiscard(ProjectCopy.refreshAfterBoot).pipe(Layer.provide(services))
-
-    return Layer.mergeAll(
-      boot,
-      services,
-      image,
-      mutation,
-      resources,
-      todos,
-      questions,
-      model,
-      snapshot,
-      runner,
-      builtInTools,
-      referenceGuidance,
-      projectCopyRefresh,
-    ).pipe(Layer.fresh)
-  },
-  idleTimeToLive: "60 minutes",
-  dependencies: [
-    Project.defaultLayer,
-    EventV2.defaultLayer,
-    Credential.defaultLayer,
-    Npm.defaultLayer,
-    ModelsDev.defaultLayer,
-    FSUtil.defaultLayer,
-    Git.defaultLayer,
-    AppProcess.defaultLayer,
-    Global.defaultLayer,
-    Ripgrep.defaultLayer,
-    Database.defaultLayer,
-    ProjectDirectories.defaultLayer,
-    SessionStore.layer.pipe(Layer.provide(Database.defaultLayer)),
-    PermissionSaved.defaultLayer,
-    RepositoryCache.defaultLayer,
-    LLMClient.layer.pipe(Layer.provide(RequestExecutor.defaultLayer)),
-    FetchHttpClient.layer,
-    ToolOutputStore.defaultCleanupLayer,
-    ApplicationTools.layer,
-  ],
-}) {}

packages/core/src/location-mutation.ts

@@ -1,5 +1,6 @@
 export * as LocationMutation from "./location-mutation"
 
+import { makeLocationNode } from "./effect/node"
 import path from "path"
 import { Context, Effect, Layer, Schema } from "effect"
 import { FSUtil } from "./fs-util"
@@ -153,3 +154,9 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({
+  service: Service,
+  layer: layer.pipe(Layer.orDie),
+  deps: [FSUtil.node, Location.node],
+})

packages/core/src/location-service-map.ts

@@ -0,0 +1,18 @@
+import { Context, Effect, Layer, LayerMap } from "effect"
+import { LayerNode } from "./effect/layer-node"
+import { Node } from "./effect/node"
+import { Location } from "./location"
+import type { LocationError, LocationServices } from "./location-services"
+
+export class Service extends Context.Service<
+  Service,
+  LayerMap.LayerMap<Location.Ref, LocationServices, LocationError>
+>()("@opencode/example/LocationServiceMap") {
+  static get(ref: Location.Ref) {
+    return Layer.unwrap(Effect.map(Service, (locations) => locations.get(ref)))
+  }
+}
+
+export const node = LayerNode.unbound(Service, Node.tags.values.global)
+
+export * as LocationServiceMap from "./location-service-map"

packages/core/src/location-services.ts

@@ -0,0 +1,112 @@
+import { Effect, Layer, LayerMap } from "effect"
+import { AgentV2 } from "./agent"
+import { AISDK } from "./aisdk"
+import { Catalog } from "./catalog"
+import { CommandV2 } from "./command"
+import { Config } from "./config"
+import { LayerNode, LayerNodeTree } from "./effect/layer-node"
+import { Node } from "./effect/node"
+import { FileMutation } from "./file-mutation"
+import { FileSystem } from "./filesystem"
+import { FileSystemSearch } from "./filesystem/search"
+import { Watcher } from "./filesystem/watcher"
+import { Image } from "./image"
+import { Integration } from "./integration"
+import { Location } from "./location"
+import { LocationMutation } from "./location-mutation"
+import { LocationServiceMap } from "./location-service-map"
+import { PermissionV2 } from "./permission"
+import { PluginV2 } from "./plugin"
+import { PluginInternal } from "./plugin/internal"
+import { Policy } from "./policy"
+import { ProjectCopy } from "./project/copy"
+import { Pty } from "./pty"
+import { QuestionV2 } from "./question"
+import { Reference } from "./reference"
+import { ReferenceGuidance } from "./reference/guidance"
+import * as SessionRunnerLLM from "./session/runner/llm"
+import { SessionRunnerModel } from "./session/runner/model"
+import { SessionTodo } from "./session/todo"
+import { SkillV2 } from "./skill"
+import { SkillGuidance } from "./skill/guidance"
+import { Snapshot } from "./snapshot"
+import { SystemContextBuiltIns } from "./system-context/builtins"
+import { SystemContextRegistry } from "./system-context/registry"
+import { BuiltInTools } from "./tool/builtins"
+import { ReadToolFileSystem } from "./tool/read-filesystem"
+import { ToolRegistry } from "./tool/registry"
+import { ToolOutputStore } from "./tool-output-store"
+
+export { LocationServiceMap } from "./location-service-map"
+
+export const locationServices = LayerNode.group([
+  Location.node,
+  Policy.node,
+  Config.node,
+  AgentV2.node,
+  CommandV2.node,
+  Reference.node,
+  Integration.node,
+  Catalog.node,
+  AISDK.node,
+  PluginV2.node,
+  PluginInternal.node,
+  ProjectCopy.node,
+  ProjectCopy.refreshNode,
+  FileSystemSearch.node,
+  FileSystem.node,
+  Watcher.node,
+  Pty.node,
+  SkillV2.node,
+  SystemContextRegistry.node,
+  SystemContextBuiltIns.node,
+  LocationMutation.node,
+  FileMutation.node,
+  PermissionV2.node,
+  ToolOutputStore.node,
+  ToolRegistry.node,
+  ToolRegistry.toolsNode,
+  Image.node,
+  SkillGuidance.node,
+  ReferenceGuidance.node,
+  SessionTodo.node,
+  QuestionV2.node,
+  ReadToolFileSystem.node,
+  BuiltInTools.node,
+  SessionRunnerModel.node,
+  Snapshot.node,
+  SessionRunnerLLM.node,
+])
+
+export type LocationServices = LayerNode.Output<typeof locationServices>
+export type LocationError = LayerNode.Error<typeof locationServices>
+
+export function buildLocationServiceMap(
+  replacements?: ReadonlyMap<Layer.Any, Layer.Any>,
+): Layer.Layer<LocationServiceMap.Service> {
+  return Layer.effect(
+    LocationServiceMap.Service,
+    LayerMap.make(
+      (ref: Location.Ref) => {
+        const location = LayerNodeTree.hoist(
+          LayerNodeTree.bind(locationServices, Location.node, Location.boundNode(ref)),
+          Node.tags.values.global,
+        )
+        return LayerNodeTree.compile(location.node, replacements).pipe(
+          Layer.fresh,
+          Layer.tap(() =>
+            Effect.logInfo("booting location services", {
+              directory: ref.directory,
+              workspaceID: ref.workspaceID,
+            }),
+          ),
+          Layer.provide(LayerNodeTree.compile(location.hoisted, replacements)),
+        )
+      },
+      { idleTimeToLive: "60 minutes" },
+    ),
+  )
+}
+
+// This is temporary for backwards compatibility
+export const locationServiceMapLayer = buildLocationServiceMap()

packages/core/src/location.ts

@@ -1,6 +1,8 @@
 import { Context, Effect, Layer } from "effect"
 import { Info, Ref, response } from "@opencode-ai/schema/location"
 import { Project } from "./project"
+import { LayerNode } from "./effect/layer-node"
+import { makeLocationNode, tags } from "./effect/node"
 
 export * as Location from "./location"
 
@@ -12,6 +14,8 @@ export interface Interface extends Info {
 
 export class Service extends Context.Service<Service, Interface>()("@opencode/Location") {}
 
+export const node = LayerNode.unbound(Service, tags.values.location)
+
 export const layer = (ref: Ref) =>
   Layer.effect(
     Service,
@@ -26,3 +30,10 @@ export const layer = (ref: Ref) =>
       })
     }),
   )
+
+export const boundNode = (ref: Ref) =>
+  makeLocationNode({
+    service: Service,
+    layer: layer(ref),
+    deps: [Project.node],
+  })

packages/core/src/models-dev.ts

@@ -9,7 +9,7 @@ import { Hash } from "./util/hash"
 import { FSUtil } from "./fs-util"
 import { InstallationChannel, InstallationVersion } from "./installation/version"
 import { EventV2 } from "./event"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { httpClient } from "./effect/layer-node-platform"
 
 export const CatalogModelStatus = Schema.Literals(["alpha", "beta", "deprecated"])
@@ -244,6 +244,6 @@ export const defaultLayer = layer.pipe(
   Layer.provide(FSUtil.defaultLayer),
   Layer.provide(EventV2.defaultLayer),
 )
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [FSUtil.node, EventV2.node, httpClient] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [FSUtil.node, EventV2.node, httpClient] })
 
 export * as ModelsDev from "./models-dev"

packages/core/src/npm.ts

@@ -7,7 +7,7 @@ import { NodeFileSystem } from "@effect/platform-node"
 import { FSUtil } from "./fs-util"
 import { Global } from "./global"
 import { EffectFlock } from "./util/effect-flock"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { filesystem } from "./effect/layer-node-platform"
 import { makeRuntime } from "./effect/runtime"
 import { NpmConfig } from "./npm-config"
@@ -253,7 +253,7 @@ export const defaultLayer = layer.pipe(
   Layer.provide(Global.layer),
   Layer.provide(NodeFileSystem.layer),
 )
-export const node = LayerNode.make({
+export const node = makeGlobalNode({
   service: Service,
   layer: layer,
   deps: [FSUtil.node, Global.node, filesystem, EffectFlock.node],

packages/core/src/oauth/page.ts

@@ -0,0 +1,276 @@
+// Branded HTML pages for local OAuth callback servers.
+//
+// These are served by the loopback HTTP servers that finish an OAuth exchange
+// (MCP, Codex/ChatGPT, xAI, Snowflake, DigitalOcean, ...). The functions return
+// a fully self-contained HTML string with no external assets, so they work
+// offline and drop into any transport (`res.end(...)`, Effect `response.end`,
+// etc.).
+//
+// The visual language mirrors the OpenCode app: the design tokens are a curated
+// subset of the OC-2 semantic tokens in `packages/ui/src/styles/theme.css`, and
+// the wordmark is the same geometry as `packages/ui/src/components/logo.tsx`.
+// Keep this file in sync with those sources when the brand changes.
+
+export interface CallbackPageOptions {
+  /** Friendly integration name shown as a subtitle, e.g. "xAI", "Snowflake", "MCP". */
+  provider?: string
+  /** Attempt to close the window shortly after success. Defaults to true. */
+  autoClose?: boolean
+}
+
+export function success(options?: CallbackPageOptions) {
+  const provider = options?.provider
+  return renderDocument({
+    title: "Authorization successful",
+    body: renderCard({
+      status: "success",
+      headline: "Authorization successful",
+      message: provider ? `OpenCode is now connected to ${escapeHtml(provider)}.` : "OpenCode is now authorized.",
+      footnote: "You can close this window.",
+    }),
+    script: options?.autoClose === false ? undefined : AUTO_CLOSE_SCRIPT,
+  })
+}
+
+export function error(detail: string, options?: CallbackPageOptions) {
+  const provider = options?.provider
+  return renderDocument({
+    title: "Authorization failed",
+    body: renderCard({
+      status: "error",
+      headline: "Authorization failed",
+      message: provider
+        ? `OpenCode couldn't finish connecting to ${escapeHtml(provider)}.`
+        : "OpenCode couldn't complete authorization.",
+      detail,
+      footnote: "Close this window and try again from OpenCode.",
+    }),
+  })
+}
+
+export interface BootstrapOptions {
+  /** Same-origin path the in-browser script POSTs the parsed callback to. */
+  tokenPath: string
+  provider?: string
+}
+
+// For flows where the credential arrives in the URL fragment (implicit grant),
+// the browser must relay it back to the loopback server. This renders a pending
+// page whose script reads the fragment, POSTs it to `tokenPath`, then resolves
+// to the success or error state in place.
+export function bootstrap(options: BootstrapOptions) {
+  return renderDocument({
+    title: "Finishing sign-in",
+    body: renderCard({
+      status: "pending",
+      headline: "Finishing sign-in",
+      message: options.provider
+        ? `Completing your ${escapeHtml(options.provider)} authorization.`
+        : "Completing authorization.",
+      footnote: "You can close this window once sign-in finishes.",
+    }),
+    script: bootstrapScript(options),
+  })
+}
+
+export * as OauthCallbackPage from "./page"
+
+type Status = "pending" | "success" | "error"
+
+function renderCard(input: { status: Status; headline: string; message: string; detail?: string; footnote: string }) {
+  const detail = input.detail?.trim()
+  return `<main class="card" id="oc-card" data-status="${input.status}" role="status" aria-live="polite">
+      <div class="brand">${WORDMARK}</div>
+      <div class="status" aria-hidden="true">
+        <span class="icon icon-pending">${ICON_SPINNER}</span>
+        <span class="icon icon-success">${ICON_CHECK}</span>
+        <span class="icon icon-error">${ICON_CROSS}</span>
+      </div>
+      <h1 class="headline" id="oc-headline">${escapeHtml(input.headline)}</h1>
+      <p class="message" id="oc-message">${input.message}</p>
+      <pre class="detail" id="oc-detail"${detail ? "" : " hidden"}>${detail ? escapeHtml(detail) : ""}</pre>
+      <p class="footnote" id="oc-footnote">${escapeHtml(input.footnote)}</p>
+    </main>`
+}
+
+function renderDocument(input: { title: string; body: string; script?: string }) {
+  return `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="robots" content="noindex" />
+    <title>${escapeHtml(input.title)} · OpenCode</title>
+    <style>${STYLES}</style>
+  </head>
+  <body>
+    ${input.body}${input.script ? `\n    <script>${input.script}</script>` : ""}
+  </body>
+</html>`
+}
+
+const AUTO_CLOSE_SCRIPT = `setTimeout(function(){try{window.close()}catch(e){}},2500)`
+
+function bootstrapScript(options: BootstrapOptions) {
+  return `var PROVIDER=${scriptString(options.provider ?? "")};
+var TOKEN_URL=new URL(${scriptString(options.tokenPath)},window.location.origin).href;
+(function(){
+  var card=document.getElementById("oc-card"),headline=document.getElementById("oc-headline"),message=document.getElementById("oc-message"),detail=document.getElementById("oc-detail"),footnote=document.getElementById("oc-footnote");
+  function fail(text){card.dataset.status="error";headline.textContent="Authorization failed";message.textContent=PROVIDER?("OpenCode couldn't finish connecting to "+PROVIDER+"."):"OpenCode couldn't complete authorization.";if(text){detail.textContent=text;detail.hidden=false}footnote.textContent="Close this window and try again from OpenCode."}
+  function ok(){card.dataset.status="success";headline.textContent="Authorization successful";message.textContent=PROVIDER?("OpenCode is now connected to "+PROVIDER+"."):"OpenCode is now authorized.";detail.hidden=true;footnote.textContent="You can close this window.";setTimeout(function(){try{window.close()}catch(e){}},2500)}
+  try{
+    var hash=new URLSearchParams((window.location.hash||"").slice(1));
+    var search=new URLSearchParams(window.location.search||"");
+    var err=hash.get("error")||search.get("error");
+    var errDescription=hash.get("error_description")||search.get("error_description");
+    var body=err?{error:err,error_description:errDescription||""}:{access_token:hash.get("access_token")||"",expires_in:hash.get("expires_in")||"0",state:hash.get("state")||""};
+    fetch(TOKEN_URL,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(body)}).then(function(res){
+      if(!res.ok)return res.text().catch(function(){return""}).then(function(t){throw new Error(t||("callback failed ("+res.status+")"))});
+      if(err){fail(errDescription||err);return}
+      ok();
+    }).catch(function(e){fail(String(e&&e.message?e.message:e))});
+  }catch(e){fail(String(e&&e.message?e.message:e))}
+})()`
+}
+
+function scriptString(value: string) {
+  return JSON.stringify(value).replaceAll("<", "\\u003c")
+}
+
+function escapeHtml(value: string) {
+  return value
+    .replaceAll("&", "&amp;")
+    .replaceAll("<", "&lt;")
+    .replaceAll(">", "&gt;")
+    .replaceAll('"', "&quot;")
+    .replaceAll("'", "&#39;")
+}
+
+// Curated subset of OC-2 tokens (packages/ui/src/styles/theme.css). Default is
+// light; dark applies via prefers-color-scheme. The [data-theme] selectors let a
+// host force a scheme without changing the default.
+const LIGHT_VARS = `
+    --oc-bg: #f8f8f8;
+    --oc-card: #fcfcfc;
+    --oc-text-strong: #171717;
+    --oc-text-base: #6f6f6f;
+    --oc-text-weak: #8f8f8f;
+    --oc-border-weak: #e5e5e5;
+    --oc-icon-strong: #171717;
+    --oc-icon-base: #8f8f8f;
+    --oc-icon-weak: #dbdbdb;
+    --oc-success: #2dba26;
+    --oc-error: #ed4831;
+    --oc-detail-bg: #fff8f6;
+    --oc-detail-border: #fdc3b7;
+    --oc-shadow: 0 16px 48px -6px rgba(0,0,0,.10), 0 6px 12px -2px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.06);`
+
+const DARK_VARS = `
+    --oc-bg: #101010;
+    --oc-card: #161616;
+    --oc-text-strong: rgba(255,255,255,.936);
+    --oc-text-base: rgba(255,255,255,.618);
+    --oc-text-weak: rgba(255,255,255,.422);
+    --oc-border-weak: #282828;
+    --oc-icon-strong: #ededed;
+    --oc-icon-base: #7e7e7e;
+    --oc-icon-weak: #343434;
+    --oc-success: #12c905;
+    --oc-error: #fc533a;
+    --oc-detail-bg: #28110c;
+    --oc-detail-border: #6a1206;
+    --oc-shadow: 0 16px 48px -6px rgba(0,0,0,.55), 0 6px 12px -2px rgba(0,0,0,.35), 0 1px 2px rgba(0,0,0,.4);`
+
+const STYLES = `
+  :root { color-scheme: light dark;${LIGHT_VARS}
+    --oc-font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    --oc-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  }
+  @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {${DARK_VARS} } }
+  :root[data-theme="dark"] {${DARK_VARS} }
+  :root[data-theme="light"] {${LIGHT_VARS} }
+
+  * { box-sizing: border-box; }
+  html, body { margin: 0; height: 100%; }
+  body {
+    min-height: 100vh;
+    display: grid;
+    place-items: center;
+    padding: 24px;
+    background: var(--oc-bg);
+    color: var(--oc-text-base);
+    font-family: var(--oc-font-sans);
+    line-height: 1.5;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+  }
+  .card {
+    width: min(100%, 28rem);
+    padding: 2.25rem 2rem 1.75rem;
+    background: var(--oc-card);
+    border: 1px solid var(--oc-border-weak);
+    border-radius: 14px;
+    box-shadow: var(--oc-shadow);
+    text-align: center;
+  }
+  .brand { display: flex; justify-content: center; margin-bottom: 1.75rem; }
+  .brand svg { height: 19px; width: auto; }
+  .status { display: flex; justify-content: center; margin-bottom: 1.125rem; }
+  .icon { display: none; line-height: 0; }
+  .icon svg { display: block; }
+  .card[data-status="pending"] .icon-pending,
+  .card[data-status="success"] .icon-success,
+  .card[data-status="error"] .icon-error { display: block; }
+  .icon-success { color: var(--oc-success); }
+  .icon-error { color: var(--oc-error); }
+  .icon-pending { color: var(--oc-text-weak); }
+  .headline { margin: 0; font-size: 1.1875rem; font-weight: 500; line-height: 1.3; letter-spacing: -0.012em; color: var(--oc-text-strong); }
+  .message { margin: 0.5rem 0 0; font-size: 0.9375rem; color: var(--oc-text-base); }
+  .detail {
+    margin: 1.25rem 0 0;
+    padding: 0.75rem 0.875rem;
+    text-align: left;
+    font-family: var(--oc-font-mono);
+    font-size: 0.8125rem;
+    line-height: 1.55;
+    color: var(--oc-text-strong);
+    background: var(--oc-detail-bg);
+    border: 1px solid var(--oc-detail-border);
+    border-radius: 8px;
+    white-space: pre-wrap;
+    word-break: break-word;
+    max-height: 9.5rem;
+    overflow: auto;
+  }
+  .detail[hidden] { display: none; }
+  .footnote { margin: 1.5rem 0 0; font-size: 0.8125rem; color: var(--oc-text-weak); }
+  .spinner { animation: oc-spin 0.8s linear infinite; transform-origin: center; }
+  @keyframes oc-spin { to { transform: rotate(360deg); } }
+  @media (prefers-reduced-motion: reduce) { .spinner { animation: none; } }
+`
+
+// OpenCode wordmark — same path geometry as packages/ui/src/components/logo.tsx (Logo).
+const WORDMARK = `<svg class="wordmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234 42" fill="none" aria-label="OpenCode" role="img">
+        <path d="M18 30H6V18H18V30Z" fill="var(--oc-icon-weak)" />
+        <path d="M18 12H6V30H18V12ZM24 36H0V6H24V36Z" fill="var(--oc-icon-base)" />
+        <path d="M48 30H36V18H48V30Z" fill="var(--oc-icon-weak)" />
+        <path d="M36 30H48V12H36V30ZM54 36H36V42H30V6H54V36Z" fill="var(--oc-icon-base)" />
+        <path d="M84 24V30H66V24H84Z" fill="var(--oc-icon-weak)" />
+        <path d="M84 24H66V30H84V36H60V6H84V24ZM66 18H78V12H66V18Z" fill="var(--oc-icon-base)" />
+        <path d="M108 36H96V18H108V36Z" fill="var(--oc-icon-weak)" />
+        <path d="M108 12H96V36H90V6H108V12ZM114 36H108V12H114V36Z" fill="var(--oc-icon-base)" />
+        <path d="M144 30H126V18H144V30Z" fill="var(--oc-icon-weak)" />
+        <path d="M144 12H126V30H144V36H120V6H144V12Z" fill="var(--oc-icon-strong)" />
+        <path d="M168 30H156V18H168V30Z" fill="var(--oc-icon-weak)" />
+        <path d="M168 12H156V30H168V12ZM174 36H150V6H174V36Z" fill="var(--oc-icon-strong)" />
+        <path d="M198 30H186V18H198V30Z" fill="var(--oc-icon-weak)" />
+        <path d="M198 12H186V30H198V12ZM204 36H180V6H198V0H204V36Z" fill="var(--oc-icon-strong)" />
+        <path d="M234 24V30H216V24H234Z" fill="var(--oc-icon-weak)" />
+        <path d="M216 12V18H228V12H216ZM234 24H216V30H234V36H210V6H234V24Z" fill="var(--oc-icon-strong)" />
+      </svg>`
+
+const ICON_CHECK = `<svg viewBox="0 0 24 24" width="30" height="30" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9" /><path d="m8.5 12.5 2.4 2.4 4.6-5.4" /></svg>`
+
+const ICON_CROSS = `<svg viewBox="0 0 24 24" width="30" height="30" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9" /><path d="m9 9 6 6m0-6-6 6" /></svg>`
+
+const ICON_SPINNER = `<svg class="spinner" viewBox="0 0 24 24" width="30" height="30" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><circle cx="12" cy="12" r="9" opacity="0.2" /><path d="M21 12a9 9 0 0 0-9-9" /></svg>`

packages/core/src/permission.ts

@@ -1,5 +1,6 @@
 export * as PermissionV2 from "./permission"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Deferred, Effect as EffectRuntime, Layer, Schema } from "effect"
 import { Permission } from "@opencode-ai/schema/permission"
 import { EventV2 } from "./event"
@@ -300,3 +301,9 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer.pipe(Layer.provideMerge(AgentV2.locationLayer))
+
+export const node = makeLocationNode({
+  service: Service,
+  layer,
+  deps: [EventV2.node, Location.node, AgentV2.node, SessionStore.node, PermissionSaved.node],
+})

packages/core/src/permission/saved.ts

@@ -3,6 +3,7 @@ export * as PermissionSaved from "./saved"
 import { eq } from "drizzle-orm"
 import { Context, Effect, Layer, Schema } from "effect"
 import { Database } from "../database/database"
+import { makeGlobalNode } from "../effect/node"
 import { ProjectV2 } from "../project"
 import { PermissionTable } from "./sql"
 import { PermissionSaved } from "@opencode-ai/schema/permission-saved"
@@ -76,3 +77,5 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(Database.defaultLayer))
+
+export const node = makeGlobalNode({ service: Service, layer, deps: [Database.node] })

packages/core/src/plugin.ts

@@ -1,5 +1,6 @@
 export * as PluginV2 from "./plugin"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Deferred, Effect, Exit, Layer, Scope } from "effect"
 import type { Plugin as PluginRuntime } from "@opencode-ai/plugin/v2/effect"
 import { Plugin } from "@opencode-ai/schema/plugin"
@@ -150,3 +151,18 @@ export const locationLayer = layer.pipe(
   Layer.provideMerge(Reference.locationLayer),
   Layer.provideMerge(SkillV2.locationLayer),
 )
+
+export const node = makeLocationNode({
+  service: Service,
+  layer,
+  deps: [
+    EventV2.node,
+    AgentV2.node,
+    AISDK.node,
+    Catalog.node,
+    CommandV2.node,
+    Integration.node,
+    Reference.node,
+    SkillV2.node,
+  ],
+})

packages/core/src/plugin/internal.ts

@@ -1,5 +1,7 @@
 export * as PluginInternal from "./internal"
 
+import { makeLocationNode } from "../effect/node"
+import { httpClient } from "../effect/layer-node-platform"
 import type { PluginContext } from "@opencode-ai/plugin/v2/effect"
 import { Effect, Layer, Scope } from "effect"
 import { AgentV2 } from "../agent"
@@ -57,7 +59,7 @@ export function define<R>(plugin: Plugin<R>) {
   return plugin
 }
 
-export const locationLayer = Layer.effectDiscard(
+const layer = Layer.effectDiscard(
   Effect.gen(function* () {
     const catalog = yield* Catalog.Service
     const commands = yield* CommandV2.Service
@@ -117,9 +119,34 @@ export const locationLayer = Layer.effectDiscard(
       yield* add(VariantPlugin.Plugin)
     }).pipe(Effect.withSpan("PluginInternal.boot"), Effect.forkScoped({ startImmediately: true }))
   }),
-).pipe(
+)
+
+export const locationLayer = layer.pipe(
   Layer.provideMerge(PluginV2.locationLayer),
   Layer.provideMerge(Config.locationLayer),
   Layer.provideMerge(FileSystem.locationLayer),
   Layer.provideMerge(FetchHttpClient.layer),
 )
+
+export const node = makeLocationNode({
+  name: "plugin-internal",
+  layer,
+  deps: [
+    Catalog.node,
+    CommandV2.node,
+    PluginV2.node,
+    Integration.node,
+    AgentV2.node,
+    Config.node,
+    Location.node,
+    ModelsDev.node,
+    Npm.node,
+    EventV2.node,
+    FSUtil.node,
+    FileSystem.node,
+    Global.node,
+    httpClient,
+    SkillV2.node,
+    Reference.node,
+  ],
+})

packages/core/src/plugin/provider/openai.ts

@@ -7,6 +7,7 @@ import { Credential } from "../../credential"
 import { InstallationVersion } from "../../installation/version"
 import { Integration } from "../../integration"
 import { ModelV2 } from "../../model"
+import { OauthCallbackPage } from "../../oauth/page"
 import { ProviderV2 } from "../../provider"
 import type { PluginInternal } from "../internal"
 
@@ -58,17 +59,21 @@ const browser = {
         const value = url.searchParams.get("code")
         if (error) {
           Effect.runFork(Deferred.fail(code, new Error(error)))
-          response.writeHead(400, { "Content-Type": "text/html" }).end(errorPage(error))
+          response
+            .writeHead(400, { "Content-Type": "text/html" })
+            .end(OauthCallbackPage.error(error, { provider: "ChatGPT" }))
           return
         }
         if (!value || url.searchParams.get("state") !== state) {
           const message = value ? "Invalid OAuth state" : "Missing authorization code"
           Effect.runFork(Deferred.fail(code, new Error(message)))
-          response.writeHead(400, { "Content-Type": "text/html" }).end(errorPage(message))
+          response
+            .writeHead(400, { "Content-Type": "text/html" })
+            .end(OauthCallbackPage.error(message, { provider: "ChatGPT" }))
           return
         }
         Effect.runFork(Deferred.succeed(code, value))
-        response.writeHead(200, { "Content-Type": "text/html" }).end(successPage)
+        response.writeHead(200, { "Content-Type": "text/html" }).end(OauthCallbackPage.success({ provider: "ChatGPT" }))
       })
       yield* Effect.callback<void, Error>((resume) => {
         server.once("error", (error) => resume(Effect.fail(error)))
@@ -285,8 +290,3 @@ function claim(token: string) {
     return
   }
 }
-
-const successPage =
-  "<!doctype html><title>OpenCode</title><h1>Authorization successful</h1><p>You can close this window.</p>"
-const errorPage = (message: string) =>
-  `<!doctype html><title>OpenCode</title><h1>Authorization failed</h1><p>${message.replace(/[&<>"']/g, "")}</p>`

packages/core/src/policy.ts

@@ -1,5 +1,6 @@
 export * as Policy from "./policy"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Effect as EffectRuntime, Layer, Schema } from "effect"
 import { Wildcard } from "./util/wildcard"
 import { Location } from "./location"
@@ -44,3 +45,5 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({ service: Service, layer, deps: [Location.node] })

packages/core/src/process.ts

@@ -3,7 +3,7 @@ import type { PlatformError } from "effect/PlatformError"
 import { ChildProcess } from "effect/unstable/process"
 import { ChildProcessSpawner } from "effect/unstable/process/ChildProcessSpawner"
 import { CrossSpawnSpawner } from "./cross-spawn-spawner"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 
 export class AppProcessError extends Schema.TaggedErrorClass<AppProcessError>()("AppProcessError", {
   command: Schema.String,
@@ -238,6 +238,6 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(CrossSpawnSpawner.defaultLayer))
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [CrossSpawnSpawner.node] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [CrossSpawnSpawner.node] })
 
 export * as AppProcess from "./process"

packages/core/src/project.ts

@@ -6,7 +6,7 @@ import path from "path"
 import { AbsolutePath } from "./schema"
 import { FSUtil } from "./fs-util"
 import { Git } from "./git"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { Hash } from "./util/hash"
 import { ProjectDirectories } from "./project/directories"
 import { ProjectSchema } from "./project/schema"
@@ -134,7 +134,7 @@ export const defaultLayer = layer.pipe(
   Layer.provide(Git.defaultLayer),
   Layer.provideMerge(ProjectDirectories.defaultLayer),
 )
-export const node = LayerNode.make({
+export const node = makeGlobalNode({
   service: Service,
   layer: layer,
   deps: [FSUtil.node, Git.node, ProjectDirectories.node],

packages/core/src/project/copy.ts

@@ -5,7 +5,7 @@ import path from "path"
 import { AbsolutePath } from "../schema"
 import { FSUtil } from "../fs-util"
 import { Git } from "../git"
-import { LayerNode } from "../effect/layer-node"
+import { makeLocationNode } from "../effect/node"
 import { Project } from "../project"
 import { ProjectDirectories } from "./directories"
 import { makeGitWorktreeStrategy } from "./copy-strategies"
@@ -279,8 +279,14 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
-export const node = LayerNode.make({
+export const node = makeLocationNode({
   service: Service,
   layer: layer,
   deps: [FSUtil.node, Git.node, ProjectDirectories.node, EventV2.node, Database.node],
 })
+
+export const refreshNode = makeLocationNode({
+  name: "project-copy-refresh",
+  layer: Layer.effectDiscard(refreshAfterBoot),
+  deps: [node, Location.node],
+})

packages/core/src/project/directories.ts

@@ -3,7 +3,7 @@ export * as ProjectDirectories from "./directories"
 import { and, asc, desc, eq, isNotNull, isNull, ne, or } from "drizzle-orm"
 import { Context, Effect, Layer, Schema } from "effect"
 import { Database } from "../database/database"
-import { LayerNode } from "../effect/layer-node"
+import { makeGlobalNode } from "../effect/node"
 import { AbsolutePath, optional } from "../schema"
 import { ProjectSchema } from "./schema"
 import { ProjectDirectoryTable } from "./sql"
@@ -156,4 +156,4 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(Database.defaultLayer))
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [Database.node] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [Database.node] })

packages/core/src/pty.ts

@@ -1,5 +1,6 @@
 export * as Pty from "./pty"
 
+import { makeLocationNode } from "./effect/node"
 import type { Disp, Proc } from "#pty"
 import { Context, Effect, Layer, Schema, Types } from "effect"
 import { Pty } from "@opencode-ai/schema/pty"
@@ -313,3 +314,5 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer.pipe(Layer.provide(Config.locationLayer))
+
+export const node = makeLocationNode({ service: Service, layer, deps: [EventV2.node, Location.node, Config.node] })

packages/core/src/pty/ticket.ts

@@ -4,7 +4,7 @@ import { WorkspaceV2 } from "../workspace"
 import { PtyTicket } from "@opencode-ai/schema/pty-ticket"
 import { PtyID } from "./schema"
 import { Cache, Context, Duration, Effect, Layer } from "effect"
-import { LayerNode } from "../effect/layer-node"
+import { makeGlobalNode } from "../effect/node"
 
 const DEFAULT_TTL = Duration.seconds(60)
 const CAPACITY = 10_000
@@ -54,4 +54,4 @@ export const make = (ttl: Duration.Input = DEFAULT_TTL) =>
 export const layer = Layer.effect(Service, make())
 
 export const defaultLayer = layer
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [] })

packages/core/src/question.ts

@@ -1,5 +1,6 @@
 export * as QuestionV2 from "./question"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Deferred, Effect, Layer, Schema } from "effect"
 import { Question } from "@opencode-ai/schema/question"
 import { EventV2 } from "./event"
@@ -148,3 +149,5 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({ service: Service, layer, deps: [EventV2.node] })

packages/core/src/reference.ts

@@ -1,5 +1,6 @@
 export * as Reference from "./reference"
 
+import { makeLocationNode } from "./effect/node"
 import { Context, Effect, Layer, Scope, Types } from "effect"
 import { Reference } from "@opencode-ai/schema/reference"
 import { Global } from "./global"
@@ -120,3 +121,9 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({
+  service: Service,
+  layer,
+  deps: [Global.node, EventV2.node, RepositoryCache.node],
+})

packages/core/src/reference/guidance.ts

@@ -1,5 +1,6 @@
 export * as ReferenceGuidance from "./guidance"
 
+import { makeLocationNode } from "../effect/node"
 import { Context, Effect, Layer, Schema } from "effect"
 import { Reference } from "../reference"
 import { SystemContext } from "../system-context/index"
@@ -64,3 +65,5 @@ export const layer = Layer.effect(
 )
 
 export const locationLayer = layer
+
+export const node = makeLocationNode({ service: Service, layer, deps: [Reference.node] })

packages/core/src/repository-cache.ts

@@ -5,6 +5,7 @@ import { Git } from "./git"
 import { Global } from "./global"
 import { Repository } from "./repository"
 import { AbsolutePath } from "./schema"
+import { makeGlobalNode } from "./effect/node"
 import { EffectFlock } from "./util/effect-flock"
 
 export type Result = {
@@ -229,6 +230,12 @@ export const defaultLayer: Layer.Layer<Service> = layer.pipe(
   Layer.provide(Global.defaultLayer),
 )
 
+export const node = makeGlobalNode({
+  service: Service,
+  layer,
+  deps: [EffectFlock.node, FSUtil.node, Git.node, Global.node],
+})
+
 function statusForRepository(input: { reuse: boolean; refresh?: boolean; branchMatches?: boolean }) {
   if (!input.reuse) return "cloned" as const
   if (input.branchMatches === false || input.refresh) return "refreshed" as const

packages/core/src/ripgrep.ts

@@ -3,7 +3,7 @@ export * as Ripgrep from "./ripgrep"
 import { Context, Effect, Fiber, Layer, Schema, Stream } from "effect"
 import { ChildProcess } from "effect/unstable/process"
 import { Entry, Match } from "@opencode-ai/schema/filesystem"
-import { LayerNode } from "./effect/layer-node"
+import { makeGlobalNode } from "./effect/node"
 import { AppProcess, collectStream, waitForAbort } from "./process"
 import { NonNegativeInt, PositiveInt, RelativePath } from "./schema"
 import { RipgrepBinary } from "./ripgrep/binary"
@@ -279,4 +279,4 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(Layer.merge(RipgrepBinary.defaultLayer, AppProcess.defaultLayer)))
-export const node = LayerNode.make({ service: Service, layer: layer, deps: [RipgrepBinary.node, AppProcess.node] })
+export const node = makeGlobalNode({ service: Service, layer: layer, deps: [RipgrepBinary.node, AppProcess.node] })

packages/core/src/ripgrep/binary.ts

@@ -4,7 +4,7 @@ import { FetchHttpClient, HttpClient, HttpClientRequest } from "effect/unstable/
 import { ChildProcess } from "effect/unstable/process"
 import { ChildProcessSpawner } from "effect/unstable/process/ChildProcessSpawner"
 import { CrossSpawnSpawner } from "../cross-spawn-spawner"
-import { LayerNode } from "../effect/layer-node"
+import { makeGlobalNode } from "../effect/node"
 import { httpClient } from "../effect/layer-node-platform"
 import { FSUtil } from "../fs-util"
 import { Global } from "../global"
@@ -130,7 +130,7 @@ export namespace RipgrepBinary {
     Layer.provide(CrossSpawnSpawner.defaultLayer),
   )
 
-  export const node = LayerNode.make({
+  export const node = makeGlobalNode({
     service: Service,
     layer: layer,
     deps: [FSUtil.node, httpClient, CrossSpawnSpawner.node],

packages/core/src/session.ts

@@ -10,6 +10,7 @@ import { ModelV2 } from "./model"
 import { Location } from "./location"
 import { SessionMessage } from "./session/message"
 import { Prompt } from "./session/prompt"
+import { PromptInput } from "@opencode-ai/schema/prompt-input"
 import { EventV2 } from "./event"
 import { Database } from "./database/database"
 import { SessionProjector } from "./session/projector"
@@ -26,12 +27,16 @@ import { fromRow } from "./session/info"
 import { SessionRunner } from "./session/runner/index"
 import { SessionStore } from "./session/store"
 import { SessionExecution } from "./session/execution"
+import { makeGlobalNode } from "./effect/node"
+import { LocationServiceMap } from "./location-service-map"
 import { MessageDecodeError } from "./session/error"
 import { SessionEvent } from "./session/event"
 import { SessionInput } from "./session/input"
 import { Snapshot } from "./snapshot"
 import { SessionRevert } from "./session/revert"
 import { Revert } from "@opencode-ai/schema/revert"
+import { FSUtil } from "./fs-util"
+import { SessionDurable } from "@opencode-ai/schema/durable-event-manifest"
 
 export const RevertState = Revert.State
 export type RevertState = Revert.State
@@ -129,6 +134,11 @@ export interface Interface {
     sessionID: SessionSchema.ID
     after?: number
   }) => Stream.Stream<SessionEvent.DurableEvent, NotFoundError>
+  readonly history: (input: {
+    sessionID: SessionSchema.ID
+    after?: number
+    limit: number
+  }) => Effect.Effect<{ events: ReadonlyArray<SessionEvent.DurableEvent>; hasMore: boolean }, NotFoundError>
   readonly switchAgent: (input: { sessionID: SessionSchema.ID; agent: string }) => Effect.Effect<void, NotFoundError>
   readonly switchModel: (input: {
     sessionID: SessionSchema.ID
@@ -137,7 +147,7 @@ export interface Interface {
   readonly prompt: (input: {
     id?: SessionMessage.ID
     sessionID: SessionSchema.ID
-    prompt: Prompt
+    prompt: PromptInput.Prompt
     delivery?: SessionInput.Delivery
     resume?: boolean
   }) => Effect.Effect<SessionInput.Admitted, NotFoundError | PromptConflictError>
@@ -171,280 +181,277 @@ export interface Interface {
 
 export class Service extends Context.Service<Service, Interface>()("@opencode/v2/Session") {}
 
-export const layer = Layer.unwrap(
-  Effect.promise(() => import("./location-layer")).pipe(
-    Effect.map(({ LocationServiceMap }) =>
-      Layer.effect(
-        Service,
-        Effect.gen(function* () {
-          const database = yield* Database.Service
-          const db = database.db
-          const events = yield* EventV2.Service
-          const projects = yield* ProjectV2.Service
-          const execution = yield* SessionExecution.Service
-          const store = yield* SessionStore.Service
-          const locations = yield* LocationServiceMap
-          const decodeMessage = Schema.decodeUnknownEffect(SessionMessage.Message)
-          const isDurableSessionEvent = Schema.is(SessionEvent.Durable)
-          const decode = (row: typeof SessionMessageTable.$inferSelect) =>
-            decodeMessage({ ...row.data, id: row.id, type: row.type }).pipe(
-              Effect.mapError(
-                () =>
-                  new MessageDecodeError({
-                    sessionID: SessionSchema.ID.make(row.session_id),
-                    messageID: SessionMessage.ID.make(row.id),
-                  }),
+export const layer = Layer.effect(
+  Service,
+  Effect.gen(function* () {
+    const database = yield* Database.Service
+    const db = database.db
+    const events = yield* EventV2.Service
+    const projects = yield* ProjectV2.Service
+    const execution = yield* SessionExecution.Service
+    const store = yield* SessionStore.Service
+    const locations = yield* LocationServiceMap.Service
+    const decodeMessage = Schema.decodeUnknownEffect(SessionMessage.Message)
+    const isDurableSessionEvent = Schema.is(SessionEvent.Durable)
+    const decode = (row: typeof SessionMessageTable.$inferSelect) =>
+      decodeMessage({ ...row.data, id: row.id, type: row.type }).pipe(
+        Effect.mapError(
+          () =>
+            new MessageDecodeError({
+              sessionID: SessionSchema.ID.make(row.session_id),
+              messageID: SessionMessage.ID.make(row.id),
+            }),
+        ),
+      )
+
+    const result = Service.of({
+      create: Effect.fn("V2Session.create")(function* (input) {
+        const sessionID = input.id ?? SessionSchema.ID.create()
+        const recorded = yield* store.get(sessionID)
+        if (recorded) return recorded
+        const project = yield* projects.resolve(input.location.directory)
+        yield* db
+          .insert(ProjectTable)
+          .values({ id: project.id, worktree: project.directory, vcs: project.vcs?.type, sandboxes: [] })
+          .onConflictDoNothing()
+          .run()
+          .pipe(Effect.orDie)
+        const now = Date.now()
+        const info = SessionV1.SessionInfo.make({
+          id: sessionID,
+          slug: Slug.create(),
+          version: InstallationVersion,
+          projectID: project.id,
+          directory: input.location.directory,
+          path: path.relative(project.directory, input.location.directory).replaceAll("\\", "/"),
+          workspaceID: input.location.workspaceID ? WorkspaceV2.ID.make(input.location.workspaceID) : undefined,
+          title: `New session - ${new Date(now).toISOString()}`,
+          agent: input.agent,
+          model: input.model
+            ? {
+                id: ModelV2.ID.make(input.model.id),
+                providerID: input.model.providerID,
+                variant: input.model.variant,
+              }
+            : undefined,
+          cost: 0,
+          tokens: { input: 0, output: 0, reasoning: 0, cache: { read: 0, write: 0 } },
+          time: { created: now, updated: now },
+        })
+        const projected = yield* events
+          .publish(SessionV1.Event.Created, { sessionID, info }, { location: input.location })
+          .pipe(
+            Effect.as({ type: "created" } as const),
+            Effect.catchDefect((defect) => {
+              if (!(defect instanceof SessionProjector.SessionAlreadyProjected)) {
+                return Effect.die(defect)
+              }
+              // Concurrent creation lost the projection race. The existing Session identity wins.
+              return store
+                .get(sessionID)
+                .pipe(
+                  Effect.flatMap((session) =>
+                    session ? Effect.succeed({ type: "existing", session } as const) : Effect.die(defect),
+                  ),
+                )
+            }),
+          )
+        if (projected.type === "existing") return projected.session
+        // TODO: Restore recorded sessions onto replacement synchronized workspaces in a future API slice.
+        return yield* result.get(sessionID).pipe(Effect.orDie)
+      }),
+      get: Effect.fn("V2Session.get")(function* (sessionID) {
+        const session = yield* store.get(sessionID)
+        if (!session) return yield* new NotFoundError({ sessionID })
+        return session
+      }),
+      list: Effect.fn("V2Session.list")(function* (input = {}) {
+        const direction = input.anchor?.direction ?? "next"
+        const requestedOrder = input.order ?? "desc"
+        const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
+        const sortColumn = SessionTable.time_created
+        const conditions: SQL[] = []
+        if ("directory" in input) conditions.push(eq(SessionTable.directory, input.directory))
+        if (input.workspaceID) conditions.push(eq(SessionTable.workspace_id, input.workspaceID))
+        if ("project" in input) conditions.push(eq(SessionTable.project_id, input.project))
+        if (input.search) conditions.push(like(SessionTable.title, `%${input.search}%`))
+        if (input.anchor) {
+          conditions.push(
+            order === "asc"
+              ? or(
+                  gt(sortColumn, input.anchor.time),
+                  and(eq(sortColumn, input.anchor.time), gt(SessionTable.id, input.anchor.id)),
+                )!
+              : or(
+                  lt(sortColumn, input.anchor.time),
+                  and(eq(sortColumn, input.anchor.time), lt(SessionTable.id, input.anchor.id)),
+                )!,
+          )
+        }
+        const query = db
+          .select()
+          .from(SessionTable)
+          .where(conditions.length > 0 ? and(...conditions) : undefined)
+          .orderBy(
+            order === "asc" ? asc(sortColumn) : desc(sortColumn),
+            order === "asc" ? asc(SessionTable.id) : desc(SessionTable.id),
+          )
+        const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
+          Effect.orDie,
+        )
+        return (direction === "previous" ? rows.toReversed() : rows).map((row) => fromRow(row))
+      }),
+      messages: Effect.fn("V2Session.messages")(function* (input) {
+        yield* result.get(input.sessionID)
+        const direction = input.cursor?.direction ?? "next"
+        const requestedOrder = input.order ?? "desc"
+        const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
+        const anchor = input.cursor
+          ? yield* db
+              .select({ seq: SessionMessageTable.seq })
+              .from(SessionMessageTable)
+              .where(
+                and(eq(SessionMessageTable.session_id, input.sessionID), eq(SessionMessageTable.id, input.cursor.id)),
+              )
+              .get()
+              .pipe(Effect.orDie)
+          : undefined
+        if (input.cursor && !anchor) return []
+        const boundary = anchor
+          ? order === "asc"
+            ? gt(SessionMessageTable.seq, anchor.seq)
+            : lt(SessionMessageTable.seq, anchor.seq)
+          : undefined
+        const where = boundary
+          ? and(eq(SessionMessageTable.session_id, input.sessionID), boundary)
+          : eq(SessionMessageTable.session_id, input.sessionID)
+        const query = db
+          .select()
+          .from(SessionMessageTable)
+          .where(where)
+          .orderBy(order === "asc" ? asc(SessionMessageTable.seq) : desc(SessionMessageTable.seq))
+        const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
+          Effect.orDie,
+        )
+        return yield* Effect.forEach(direction === "previous" ? rows.toReversed() : rows, decode)
+      }),
+      message: Effect.fn("V2Session.message")(function* (input) {
+        const stored = yield* store.message(input.messageID)
+        return stored?.sessionID === input.sessionID ? stored.message : undefined
+      }),
+      context: Effect.fn("V2Session.context")(function* (sessionID) {
+        yield* result.get(sessionID)
+        return yield* store.context(sessionID)
+      }),
+      events: (input) =>
+        Stream.unwrap(
+          result
+            .get(input.sessionID)
+            .pipe(Effect.as(events.durable({ aggregateID: input.sessionID, after: input.after }))),
+        ).pipe(Stream.filter((event): event is SessionEvent.DurableEvent => isDurableSessionEvent(event))),
+      history: Effect.fn("V2Session.history")(function* (input) {
+        yield* result.get(input.sessionID)
+        return yield* EventV2.readAggregate(db, {
+          ...input,
+          aggregateID: input.sessionID,
+          manifest: SessionDurable,
+        })
+      }),
+      prompt: Effect.fn("V2Session.prompt")((input) =>
+        Effect.uninterruptible(
+          Effect.gen(function* () {
+            yield* result.get(input.sessionID)
+            const prompt = resolvePrompt(input.prompt)
+            const messageID = input.id ?? SessionMessage.ID.create()
+            const delivery = input.delivery ?? "steer"
+            const expected = { sessionID: input.sessionID, messageID, prompt, delivery }
+            const admitted = yield* SessionInput.admit(db, events, {
+              id: messageID,
+              sessionID: input.sessionID,
+              prompt,
+              delivery,
+            }).pipe(
+              Effect.catchDefect((defect) =>
+                defect instanceof SessionInput.LifecycleConflict
+                  ? new PromptConflictError({ sessionID: input.sessionID, messageID })
+                  : Effect.die(defect),
               ),
             )
-
-          const result = Service.of({
-            create: Effect.fn("V2Session.create")(function* (input) {
-              const sessionID = input.id ?? SessionSchema.ID.create()
-              const recorded = yield* store.get(sessionID)
-              if (recorded) return recorded
-              const project = yield* projects.resolve(input.location.directory)
-              yield* db
-                .insert(ProjectTable)
-                .values({ id: project.id, worktree: project.directory, vcs: project.vcs?.type, sandboxes: [] })
-                .onConflictDoNothing()
-                .run()
-                .pipe(Effect.orDie)
-              const now = Date.now()
-              const info = SessionV1.SessionInfo.make({
-                id: sessionID,
-                slug: Slug.create(),
-                version: InstallationVersion,
-                projectID: project.id,
-                directory: input.location.directory,
-                path: path.relative(project.directory, input.location.directory).replaceAll("\\", "/"),
-                workspaceID: input.location.workspaceID ? WorkspaceV2.ID.make(input.location.workspaceID) : undefined,
-                title: `New session - ${new Date(now).toISOString()}`,
-                agent: input.agent,
-                model: input.model
-                  ? {
-                      id: ModelV2.ID.make(input.model.id),
-                      providerID: input.model.providerID,
-                      variant: input.model.variant,
-                    }
-                  : undefined,
-                cost: 0,
-                tokens: { input: 0, output: 0, reasoning: 0, cache: { read: 0, write: 0 } },
-                time: { created: now, updated: now },
-              })
-              const projected = yield* events
-                .publish(SessionV1.Event.Created, { sessionID, info }, { location: input.location })
-                .pipe(
-                  Effect.as({ type: "created" } as const),
-                  Effect.catchDefect((defect) => {
-                    if (!(defect instanceof SessionProjector.SessionAlreadyProjected)) {
-                      return Effect.die(defect)
-                    }
-                    // Concurrent creation lost the projection race. The existing Session identity wins.
-                    return store
-                      .get(sessionID)
-                      .pipe(
-                        Effect.flatMap((session) =>
-                          session ? Effect.succeed({ type: "existing", session } as const) : Effect.die(defect),
-                        ),
-                      )
-                  }),
-                )
-              if (projected.type === "existing") return projected.session
-              // TODO: Restore recorded sessions onto replacement synchronized workspaces in a future API slice.
-              return yield* result.get(sessionID).pipe(Effect.orDie)
-            }),
-            get: Effect.fn("V2Session.get")(function* (sessionID) {
-              const session = yield* store.get(sessionID)
-              if (!session) return yield* new NotFoundError({ sessionID })
-              return session
-            }),
-            list: Effect.fn("V2Session.list")(function* (input = {}) {
-              const direction = input.anchor?.direction ?? "next"
-              const requestedOrder = input.order ?? "desc"
-              const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
-              const sortColumn = SessionTable.time_created
-              const conditions: SQL[] = []
-              if ("directory" in input) conditions.push(eq(SessionTable.directory, input.directory))
-              if (input.workspaceID) conditions.push(eq(SessionTable.workspace_id, input.workspaceID))
-              if ("project" in input) conditions.push(eq(SessionTable.project_id, input.project))
-              if (input.search) conditions.push(like(SessionTable.title, `%${input.search}%`))
-              if (input.anchor) {
-                conditions.push(
-                  order === "asc"
-                    ? or(
-                        gt(sortColumn, input.anchor.time),
-                        and(eq(sortColumn, input.anchor.time), gt(SessionTable.id, input.anchor.id)),
-                      )!
-                    : or(
-                        lt(sortColumn, input.anchor.time),
-                        and(eq(sortColumn, input.anchor.time), lt(SessionTable.id, input.anchor.id)),
-                      )!,
-                )
-              }
-              const query = db
-                .select()
-                .from(SessionTable)
-                .where(conditions.length > 0 ? and(...conditions) : undefined)
-                .orderBy(
-                  order === "asc" ? asc(sortColumn) : desc(sortColumn),
-                  order === "asc" ? asc(SessionTable.id) : desc(SessionTable.id),
-                )
-              const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
-                Effect.orDie,
-              )
-              return (direction === "previous" ? rows.toReversed() : rows).map((row) => fromRow(row))
-            }),
-            messages: Effect.fn("V2Session.messages")(function* (input) {
-              yield* result.get(input.sessionID)
-              const direction = input.cursor?.direction ?? "next"
-              const requestedOrder = input.order ?? "desc"
-              const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
-              const anchor = input.cursor
-                ? yield* db
-                    .select({ seq: SessionMessageTable.seq })
-                    .from(SessionMessageTable)
-                    .where(
-                      and(
-                        eq(SessionMessageTable.session_id, input.sessionID),
-                        eq(SessionMessageTable.id, input.cursor.id),
-                      ),
-                    )
-                    .get()
-                    .pipe(Effect.orDie)
-                : undefined
-              if (input.cursor && !anchor) return []
-              const boundary = anchor
-                ? order === "asc"
-                  ? gt(SessionMessageTable.seq, anchor.seq)
-                  : lt(SessionMessageTable.seq, anchor.seq)
-                : undefined
-              const where = boundary
-                ? and(eq(SessionMessageTable.session_id, input.sessionID), boundary)
-                : eq(SessionMessageTable.session_id, input.sessionID)
-              const query = db
-                .select()
-                .from(SessionMessageTable)
-                .where(where)
-                .orderBy(order === "asc" ? asc(SessionMessageTable.seq) : desc(SessionMessageTable.seq))
-              const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
-                Effect.orDie,
-              )
-              return yield* Effect.forEach(direction === "previous" ? rows.toReversed() : rows, decode)
-            }),
-            message: Effect.fn("V2Session.message")(function* (input) {
-              const stored = yield* store.message(input.messageID)
-              return stored?.sessionID === input.sessionID ? stored.message : undefined
-            }),
-            context: Effect.fn("V2Session.context")(function* (sessionID) {
-              yield* result.get(sessionID)
-              return yield* store.context(sessionID)
-            }),
-            events: (input) =>
-              Stream.unwrap(
-                result
-                  .get(input.sessionID)
-                  .pipe(Effect.as(events.durable({ aggregateID: input.sessionID, after: input.after }))),
-              ).pipe(Stream.filter((event): event is SessionEvent.DurableEvent => isDurableSessionEvent(event))),
-            prompt: Effect.fn("V2Session.prompt")((input) =>
-              Effect.uninterruptible(
-                Effect.gen(function* () {
-                  yield* result.get(input.sessionID)
-                  const messageID = input.id ?? SessionMessage.ID.create()
-                  const delivery = input.delivery ?? "steer"
-                  const expected = { sessionID: input.sessionID, messageID, prompt: input.prompt, delivery }
-                  const admitted = yield* SessionInput.admit(db, events, {
-                    id: messageID,
-                    sessionID: input.sessionID,
-                    prompt: input.prompt,
-                    delivery,
-                  }).pipe(
-                    Effect.catchDefect((defect) =>
-                      defect instanceof SessionInput.LifecycleConflict
-                        ? new PromptConflictError({ sessionID: input.sessionID, messageID })
-                        : Effect.die(defect),
-                    ),
-                  )
-                  if (!SessionInput.equivalent(admitted, expected))
-                    return yield* new PromptConflictError({ sessionID: input.sessionID, messageID })
-                  if (input.resume !== false) yield* execution.wake(admitted.sessionID)
-                  return admitted
-                }),
-              ),
-            ),
-            shell: Effect.fn("V2Session.shell")(function* () {
-              return yield* new OperationUnavailableError({ operation: "shell" })
-            }),
-            skill: Effect.fn("V2Session.skill")(function* () {
-              return yield* new OperationUnavailableError({ operation: "skill" })
-            }),
-            switchAgent: Effect.fn("V2Session.switchAgent")(function* (input) {
-              yield* result.get(input.sessionID)
-              yield* events.publish(SessionEvent.AgentSwitched, {
-                sessionID: input.sessionID,
-                messageID: SessionMessage.ID.create(),
-                timestamp: yield* DateTime.now,
-                agent: input.agent,
-              })
-            }),
-            switchModel: Effect.fn("V2Session.switchModel")(function* (input) {
-              yield* result.get(input.sessionID)
-              yield* events.publish(SessionEvent.ModelSwitched, {
-                sessionID: input.sessionID,
-                messageID: SessionMessage.ID.create(),
-                timestamp: yield* DateTime.now,
-                model: input.model,
-              })
-            }),
-            compact: Effect.fn("V2Session.compact")(function* (input) {
-              yield* result.get(input.sessionID)
-              return yield* new OperationUnavailableError({ operation: "compact" })
-            }),
-            wait: Effect.fn("V2Session.wait")(function* (sessionID) {
-              yield* result.get(sessionID)
-              return yield* new OperationUnavailableError({ operation: "wait" })
-            }),
-            active: execution.active,
-            resume: Effect.fn("V2Session.resume")(function* (sessionID) {
-              yield* result.get(sessionID)
-              yield* execution.resume(sessionID)
-            }),
-            interrupt: Effect.fn("V2Session.interrupt")((sessionID) =>
-              Effect.uninterruptible(execution.interrupt(sessionID)),
-            ),
-            revert: {
-              stage: Effect.fn("V2Session.revert.stage")(function* (input) {
-                const session = yield* result.get(input.sessionID)
-                return yield* SessionRevert.stage({ session, messageID: input.messageID, files: input.files }).pipe(
-                  Effect.provideService(Database.Service, database),
-                  Effect.provideService(EventV2.Service, events),
-                  Effect.provide(locations.get(session.location)),
-                )
-              }),
-              clear: Effect.fn("V2Session.revert.clear")(function* (sessionID) {
-                const session = yield* result.get(sessionID)
-                yield* SessionRevert.clear(session).pipe(
-                  Effect.provideService(EventV2.Service, events),
-                  Effect.provide(locations.get(session.location)),
-                )
-              }),
-              commit: Effect.fn("V2Session.revert.commit")(function* (sessionID) {
-                const session = yield* result.get(sessionID)
-                yield* SessionRevert.commit(session).pipe(Effect.provideService(EventV2.Service, events))
-              }),
-            },
-          })
-
-          return result
-        }),
+            if (!SessionInput.equivalent(admitted, expected))
+              return yield* new PromptConflictError({ sessionID: input.sessionID, messageID })
+            if (input.resume !== false) yield* execution.wake(admitted.sessionID)
+            return admitted
+          }),
+        ),
       ),
-    ),
-  ),
+      shell: Effect.fn("V2Session.shell")(function* () {
+        return yield* new OperationUnavailableError({ operation: "shell" })
+      }),
+      skill: Effect.fn("V2Session.skill")(function* () {
+        return yield* new OperationUnavailableError({ operation: "skill" })
+      }),
+      switchAgent: Effect.fn("V2Session.switchAgent")(function* (input) {
+        yield* result.get(input.sessionID)
+        yield* events.publish(SessionEvent.AgentSwitched, {
+          sessionID: input.sessionID,
+          messageID: SessionMessage.ID.create(),
+          timestamp: yield* DateTime.now,
+          agent: input.agent,
+        })
+      }),
+      switchModel: Effect.fn("V2Session.switchModel")(function* (input) {
+        yield* result.get(input.sessionID)
+        yield* events.publish(SessionEvent.ModelSwitched, {
+          sessionID: input.sessionID,
+          messageID: SessionMessage.ID.create(),
+          timestamp: yield* DateTime.now,
+          model: input.model,
+        })
+      }),
+      compact: Effect.fn("V2Session.compact")(function* (input) {
+        yield* result.get(input.sessionID)
+        return yield* new OperationUnavailableError({ operation: "compact" })
+      }),
+      wait: Effect.fn("V2Session.wait")(function* (sessionID) {
+        yield* result.get(sessionID)
+        return yield* new OperationUnavailableError({ operation: "wait" })
+      }),
+      active: execution.active,
+      resume: Effect.fn("V2Session.resume")(function* (sessionID) {
+        yield* result.get(sessionID)
+        yield* execution.resume(sessionID)
+      }),
+      interrupt: Effect.fn("V2Session.interrupt")((sessionID) =>
+        Effect.uninterruptible(execution.interrupt(sessionID)),
+      ),
+      revert: {
+        stage: Effect.fn("V2Session.revert.stage")(function* (input) {
+          const session = yield* result.get(input.sessionID)
+          return yield* SessionRevert.stage({ session, messageID: input.messageID, files: input.files }).pipe(
+            Effect.provideService(Database.Service, database),
+            Effect.provideService(EventV2.Service, events),
+            Effect.provide(locations.get(session.location)),
+          )
+        }),
+        clear: Effect.fn("V2Session.revert.clear")(function* (sessionID) {
+          const session = yield* result.get(sessionID)
+          yield* SessionRevert.clear(session).pipe(
+            Effect.provideService(EventV2.Service, events),
+            Effect.provide(locations.get(session.location)),
+          )
+        }),
+        commit: Effect.fn("V2Session.revert.commit")(function* (sessionID) {
+          const session = yield* result.get(sessionID)
+          yield* SessionRevert.commit(session).pipe(Effect.provideService(EventV2.Service, events))
+        }),
+      },
+    })
+
+    return result
+  }),
 )
 
 export const defaultLayer = layer.pipe(
-  Layer.provide(
-    Layer.unwrap(Effect.promise(() => import("./location-layer")).pipe(Effect.map((m) => m.LocationServiceMap.layer))),
-  ),
   Layer.provide(SessionStore.defaultLayer),
   Layer.provide(SessionProjector.defaultLayer),
   Layer.provide(EventV2.defaultLayer),
@@ -452,3 +459,31 @@ export const defaultLayer = layer.pipe(
   Layer.provide(ProjectV2.defaultLayer),
   Layer.orDie,
 )
+
+const resolvePrompt = (input: PromptInput.Prompt) =>
+  Prompt.make({
+    text: input.text,
+    agents: input.agents,
+    files: input.files?.map((file) => {
+      const dataMime = file.uri.match(/^data:([^;,]+)[;,]/i)?.[1]
+      const target = URL.canParse(file.uri) ? new URL(file.uri).pathname : (file.name ?? file.uri)
+      return {
+        ...file,
+        mime: dataMime ?? (target.endsWith("/") ? "application/x-directory" : FSUtil.mimeType(target)),
+      }
+    }),
+  })
+
+export const node = makeGlobalNode({
+  service: Service,
+  layer: layer.pipe(Layer.orDie),
+  deps: [
+    Database.node,
+    EventV2.node,
+    ProjectV2.node,
+    SessionExecution.node,
+    SessionStore.node,
+    LocationServiceMap.node,
+    SessionProjector.node,
+  ],
+})

packages/core/src/session/execution.ts

@@ -1,6 +1,8 @@
 export * as SessionExecution from "./execution"
 
 import { Context, Effect, Layer } from "effect"
+import { LayerNode } from "../effect/layer-node"
+import { Node } from "../effect/node"
 import { SessionRunner } from "./runner/index"
 import { SessionSchema } from "./schema"
 
@@ -18,6 +20,8 @@ export interface Interface {
 /** Routes execution from a Session ID to the runner owned by that Session's Location. */
 export class Service extends Context.Service<Service, Interface>()("@opencode/v2/SessionExecution") {}
 
+export const node = LayerNode.unbound(Service, Node.tags.values.global)
+
 /** Low-level compatibility layer for callers that only need durable Session recording. */
 export const noopLayer = Layer.succeed(
   Service,

packages/core/src/session/execution/local.ts

@@ -1,5 +1,6 @@
 import { Cause, Effect, Layer } from "effect"
-import { LocationServiceMap } from "../../location-layer"
+import { LocationServiceMap } from "../../location-service-map"
+import { makeGlobalNode } from "../../effect/node"
 import { SessionRunCoordinator } from "../run-coordinator"
 import { SessionRunner } from "../runner"
 import { SessionSchema } from "../schema"
@@ -11,7 +12,7 @@ export const layer = Layer.effect(
   SessionExecution.Service,
   Effect.gen(function* () {
     const store = yield* SessionStore.Service
-    const locations = yield* LocationServiceMap
+    const locations = yield* LocationServiceMap.Service
     const coordinator = yield* SessionRunCoordinator.make<SessionSchema.ID, SessionRunner.RunError>({
       drain: Effect.fnUntraced(function* (sessionID: SessionSchema.ID, force) {
         const session = yield* store.get(sessionID)
@@ -37,3 +38,11 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(SessionStore.defaultLayer))
+
+export const node = makeGlobalNode({
+  service: SessionExecution.Service,
+  layer,
+  deps: [SessionStore.node, LocationServiceMap.node],
+})
+
+export * as SessionExecutionLocal from "./local"

packages/core/src/session/projector.ts

@@ -4,7 +4,7 @@ import { and, desc, eq, gt, or, sql } from "drizzle-orm"
 import { DateTime, Effect, Layer, Schema } from "effect"
 import { Database } from "../database/database"
 import { EventV2 } from "../event"
-import { LayerNode } from "../effect/layer-node"
+import { makeGlobalNode } from "../effect/node"
 import { SessionEvent } from "./event"
 import { SessionV1 } from "../v1/session"
 import { WorkspaceTable } from "../control-plane/workspace.sql"
@@ -456,4 +456,4 @@ export const layer = Layer.effectDiscard(
 )
 
 export const defaultLayer = layer.pipe(Layer.provide(EventV2.defaultLayer), Layer.provide(Database.defaultLayer))
-export const node = LayerNode.make({ name: "session-projector", layer, deps: [EventV2.node, Database.node] })
+export const node = makeGlobalNode({ name: "session-projector", layer, deps: [EventV2.node, Database.node] })

packages/core/src/session/runner/llm.ts

@@ -6,7 +6,6 @@ import {
   Message,
   SystemPart,
   isContextOverflowFailure,
-  type LLMErrorReason,
   type ProviderErrorEvent,
 } from "@opencode-ai/llm"
 import { Cause, DateTime, Effect, FiberSet, Layer, Option, Semaphore, Stream } from "effect"
@@ -33,10 +32,12 @@ import { SessionSchema } from "../schema"
 import { SessionStore } from "../store"
 import { type RunError, Service } from "./index"
 import { SessionRunnerModel } from "./model"
-import { createLLMEventPublisher, providerError } from "./publish-llm-event"
+import { createLLMEventPublisher } from "./publish-llm-event"
 import { toLLMMessages } from "./to-llm-message"
 import { MAX_STEPS_PROMPT } from "./max-steps"
 import { Snapshot } from "../../snapshot"
+import { makeLocationNode } from "../../effect/node"
+import { llmClient } from "../../effect/layer-node-platform"
 
 /**
  * Runs one durable coding-agent Session until it settles.
@@ -88,29 +89,6 @@ import { Snapshot } from "../../snapshot"
  * explicit loop starts the next provider turn after local settlement. Configured agent step limits bound the loop.
  */
 
-const providerCategories = {
-  InvalidRequest: "invalid-request",
-  NoRoute: "no-route",
-  Authentication: "authentication",
-  RateLimit: "rate-limit",
-  QuotaExceeded: "quota-exceeded",
-  ContentPolicy: "content-policy",
-  ProviderInternal: "provider-internal",
-  Transport: "transport",
-  InvalidProviderOutput: "invalid-provider-output",
-  UnknownProvider: "unknown",
-} as const satisfies Record<LLMErrorReason["_tag"], Parameters<typeof providerError>[0]["category"]>
-
-const toSessionProviderError = (reason: LLMErrorReason) =>
-  providerError({
-    category: providerCategories[reason._tag],
-    status:
-      ("http" in reason ? reason.http?.response?.status : undefined) ??
-      ("status" in reason ? reason.status : undefined),
-    retryable: reason.retryable,
-    retryAfterMs: "retryAfterMs" in reason ? reason.retryAfterMs : undefined,
-  })
-
 export const layer = Layer.effect(
   Service,
   Effect.gen(function* () {
@@ -307,7 +285,7 @@ export const layer = Layer.effect(
           const llmFailure = failure instanceof LLMError ? failure : undefined
           if (llmFailure && !publisher.hasProviderError()) {
             yield* withPublication(publisher.failUnsettledTools("Provider did not return a tool result", true))
-            yield* withPublication(publisher.failAssistant(toSessionProviderError(llmFailure.reason)))
+            yield* withPublication(publisher.failAssistant(llmFailure.reason.message))
           }
           if (stream._tag === "Failure" && Cause.hasInterrupts(stream.cause)) yield* FiberSet.clear(toolFibers)
           const settled = yield* restore(awaitToolFibers(toolFibers)).pipe(Effect.exit)
@@ -323,7 +301,7 @@ export const layer = Layer.effect(
             yield* FiberSet.clear(toolFibers)
             yield* withPublication(publisher.failUnsettledTools("Tool execution interrupted"))
             if (publisher.hasActiveAssistant())
-              yield* withPublication(publisher.failAssistant({ type: "unknown", message: "Provider turn interrupted" }))
+              yield* withPublication(publisher.failAssistant("Provider turn interrupted"))
           }
           if (settled._tag === "Failure" && !Cause.hasInterrupts(settled.cause)) {
             const failure = Cause.squash(settled.cause)
@@ -428,3 +406,23 @@ export const layer = Layer.effect(
 )
 
 export const defaultLayer = layer
+
+export const node = makeLocationNode({
+  service: Service,
+  layer,
+  deps: [
+    EventV2.node,
+    llmClient,
+    AgentV2.node,
+    ToolRegistry.node,
+    SessionRunnerModel.node,
+    SessionStore.node,
+    Location.node,
+    SystemContextRegistry.node,
+    SkillGuidance.node,
+    ReferenceGuidance.node,
+    Config.node,
+    Snapshot.node,
+    Database.node,
+  ],
+})