wip

feat(tui): show idle session directory (#36457 )
Co-authored-by: Dax <mail@thdxr.com> Co-authored-by: opencode-agent[bot] <opencode-agent[bot]@users.noreply.github.com>
2026-07-12 12:25:34 -05:00 · 2026-07-11 20:31:57 +00:00 · 2026-07-11 19:12:58 +00:00 · 2026-07-10 14:13:46 -04:00 · 2026-07-10 12:42:04 -05:00 · 2026-07-10 12:09:56 -05:00
205 changed files with 8070 additions and 2053 deletions
@@ -1,4 +1,5 @@
 adamdotdevin
+arvsrn
 Brendonovich
 fwang
 Hona
@@ -7,11 +8,14 @@ jayair
 jlongster
 kitlangton
 kommander
+ludvigrask
 MrMushrooooom
 nexxeln
 R44VC0RP
 rekram1-node
 thdxr
 simonklee
+Slickstef11
+usrnk1
 vimtor
 starptech
@@ -0,0 +1,10 @@
+/* This file is auto-generated by SST. Do not edit. */
+/* tslint:disable */
+/* eslint-disable */
+/* deno-fmt-ignore-file */
+/* biome-ignore-all lint: auto-generated */
+
+/// <reference path="../../sst-env.d.ts" />
+
+import "sst"
+export {}
@@ -29,8 +29,9 @@
    },
    "packages/app": {
      "name": "@opencode-ai/app",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
+        "@corvu/drawer": "catalog:",
        "@dnd-kit/abstract": "0.5.0",
        "@dnd-kit/dom": "0.5.0",
        "@dnd-kit/helpers": "0.5.0",
@@ -72,6 +73,7 @@
        "shiki": "catalog:",
        "solid-js": "catalog:",
        "solid-list": "catalog:",
+        "solid-presence": "0.2.0",
        "tailwindcss": "catalog:",
      },
      "devDependencies": {
@@ -93,7 +95,7 @@
    },
    "packages/cli": {
      "name": "@opencode-ai/cli",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "bin": {
        "lildax": "./bin/lildax.cjs",
      },
@@ -141,7 +143,7 @@
    },
    "packages/codemode": {
      "name": "@opencode-ai/codemode",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "acorn": "8.15.0",
        "effect": "catalog:",
@@ -155,7 +157,7 @@
    },
    "packages/console/app": {
      "name": "@opencode-ai/console-app",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@cloudflare/vite-plugin": "1.15.2",
        "@ibm/plex": "6.4.1",
@@ -191,7 +193,7 @@
    },
    "packages/console/core": {
      "name": "@opencode-ai/console-core",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@aws-sdk/client-sts": "3.782.0",
        "@jsx-email/render": "1.1.1",
@@ -218,7 +220,7 @@
    },
    "packages/console/function": {
      "name": "@opencode-ai/console-function",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@ai-sdk/anthropic": "3.0.82",
        "@ai-sdk/openai": "3.0.48",
@@ -240,7 +242,7 @@
    },
    "packages/console/mail": {
      "name": "@opencode-ai/console-mail",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@jsx-email/all": "2.2.3",
        "@jsx-email/cli": "1.4.3",
@@ -264,7 +266,7 @@
    },
    "packages/console/support": {
      "name": "@opencode-ai/console-support",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@cloudflare/vite-plugin": "1.15.2",
        "@opencode-ai/console-core": "workspace:*",
@@ -284,7 +286,7 @@
    },
    "packages/core": {
      "name": "@opencode-ai/core",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "bin": {
        "opencode": "./bin/opencode",
      },
@@ -378,7 +380,7 @@
    },
    "packages/desktop": {
      "name": "@opencode-ai/desktop",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@zip.js/zip.js": "2.7.62",
        "effect": "catalog:",
@@ -432,7 +434,7 @@
    },
    "packages/effect-drizzle-sqlite": {
      "name": "@opencode-ai/effect-drizzle-sqlite",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "drizzle-orm": "catalog:",
        "effect": "catalog:",
@@ -446,7 +448,7 @@
    },
    "packages/effect-sqlite-node": {
      "name": "@opencode-ai/effect-sqlite-node",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "effect": "catalog:",
      },
@@ -458,7 +460,7 @@
    },
    "packages/enterprise": {
      "name": "@opencode-ai/enterprise",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@hono/standard-validator": "catalog:",
        "@opencode-ai/core": "workspace:*",
@@ -490,7 +492,7 @@
    },
    "packages/function": {
      "name": "@opencode-ai/function",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@octokit/auth-app": "8.0.1",
        "@octokit/rest": "catalog:",
@@ -506,7 +508,7 @@
    },
    "packages/http-recorder": {
      "name": "@opencode-ai/http-recorder",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@effect/platform-node": "4.0.0-beta.83",
        "@effect/platform-node-shared": "4.0.0-beta.83",
@@ -537,7 +539,7 @@
    },
    "packages/llm": {
      "name": "@opencode-ai/llm",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@opencode-ai/schema": "workspace:*",
        "@smithy/eventstream-codec": "4.2.14",
@@ -556,7 +558,7 @@
    },
    "packages/opencode": {
      "name": "opencode",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "bin": {
        "opencode": "./bin/opencode",
      },
@@ -687,7 +689,7 @@
    },
    "packages/plugin": {
      "name": "@opencode-ai/plugin",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@ai-sdk/provider": "3.0.8",
        "@opencode-ai/sdk": "workspace:*",
@@ -763,7 +765,7 @@
    },
    "packages/sdk/js": {
      "name": "@opencode-ai/sdk",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "cross-spawn": "catalog:",
      },
@@ -778,7 +780,7 @@
    },
    "packages/server": {
      "name": "@opencode-ai/server",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@opencode-ai/core": "workspace:*",
        "@opencode-ai/protocol": "workspace:*",
@@ -793,7 +795,7 @@
    },
    "packages/session-ui": {
      "name": "@opencode-ai/session-ui",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@kobalte/core": "catalog:",
        "@opencode-ai/core": "workspace:*",
@@ -837,7 +839,7 @@
    },
    "packages/slack": {
      "name": "@opencode-ai/slack",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@opencode-ai/sdk": "workspace:*",
        "@slack/bolt": "^3.17.1",
@@ -850,7 +852,7 @@
    },
    "packages/stats/app": {
      "name": "@opencode-ai/stats-app",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@ibm/plex": "6.4.1",
        "@opencode-ai/stats-core": "workspace:*",
@@ -883,7 +885,7 @@
    },
    "packages/stats/core": {
      "name": "@opencode-ai/stats-core",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@aws-sdk/client-athena": "3.933.0",
        "@planetscale/database": "1.19.0",
@@ -902,7 +904,7 @@
    },
    "packages/stats/server": {
      "name": "@opencode-ai/stats-server",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@aws-sdk/client-firehose": "3.933.0",
        "@effect/platform-node": "catalog:",
@@ -943,7 +945,7 @@
    },
    "packages/tui": {
      "name": "@opencode-ai/tui",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@opencode-ai/core": "workspace:*",
        "@opencode-ai/plugin": "workspace:*",
@@ -970,7 +972,7 @@
    },
    "packages/ui": {
      "name": "@opencode-ai/ui",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@kobalte/core": "catalog:",
        "@pierre/diffs": "catalog:",
@@ -1021,7 +1023,7 @@
    },
    "packages/web": {
      "name": "@opencode-ai/web",
-      "version": "1.17.15",
+      "version": "1.17.18",
      "dependencies": {
        "@astrojs/cloudflare": "12.6.3",
        "@astrojs/markdown-remark": "6.3.1",
@@ -1086,6 +1088,7 @@
  },
  "catalog": {
    "@cloudflare/workers-types": "4.20251008.0",
+    "@corvu/drawer": "0.2.4",
    "@effect/opentelemetry": "4.0.0-beta.83",
    "@effect/platform-node": "4.0.0-beta.83",
    "@effect/sql-sqlite-bun": "4.0.0-beta.83",
@@ -1467,6 +1470,10 @@

    "@cloudflare/workers-types": ["@cloudflare/workers-types@4.20251008.0", "", {}, "sha512-dZLkO4PbCL0qcCSKzuW7KE4GYe49lI12LCfQ5y9XeSwgYBoAUbwH4gmJ6A0qUIURiTJTkGkRkhVPqpq2XNgYRA=="],

+    "@corvu/dialog": ["@corvu/dialog@0.2.4", "", { "dependencies": { "@corvu/utils": "~0.4.2", "solid-dismissible": "~0.1.1", "solid-focus-trap": "~0.1.8", "solid-presence": "~0.2.0", "solid-prevent-scroll": "~0.1.10" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-n54vJq+fOy8GVrnYBdJpD6JXNuyx7LOeMrRxwzAvZnYGpW8+AA12tnb/P/2emJj/HjOO5otheGKb0breshdFlA=="],
+
+    "@corvu/drawer": ["@corvu/drawer@0.2.4", "", { "dependencies": { "@corvu/dialog": "~0.2.4", "@corvu/utils": "~0.4.2", "@solid-primitives/memo": "^1.4.1", "solid-transition-size": "~0.1.4" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-7jQoGZ8ROB9CmXam2nMY2wEskU3IoFwZQywkF/7vrBc/edGsPv7mOVQ1GN6G+4nd7nrMZ3UtqHAhmRh9V0azlw=="],
+
    "@corvu/utils": ["@corvu/utils@0.4.2", "", { "dependencies": { "@floating-ui/dom": "^1.6.11" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-Ox2kYyxy7NoXdKWdHeDEjZxClwzO4SKM8plAaVwmAJPxHMqA0rLOoAsa+hBDwRLpctf+ZRnAd/ykguuJidnaTA=="],

    "@cspotcode/source-map-support": ["@cspotcode/source-map-support@0.8.1", "", { "dependencies": { "@jridgewell/trace-mapping": "0.3.9" } }, "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw=="],
@@ -2667,6 +2674,8 @@

    "@solid-primitives/media": ["@solid-primitives/media@2.3.3", "", { "dependencies": { "@solid-primitives/event-listener": "^2.4.3", "@solid-primitives/rootless": "^1.5.2", "@solid-primitives/static-store": "^0.1.2", "@solid-primitives/utils": "^6.3.2" }, "peerDependencies": { "solid-js": "^1.6.12" } }, "sha512-hQ4hLOGvfbugQi5Eu1BFWAIJGIAzztq9x0h02xgBGl2l0Jaa3h7tg6bz5tV1NSuNYVGio4rPoa7zVQQLkkx9dA=="],

+    "@solid-primitives/memo": ["@solid-primitives/memo@1.5.0", "", { "dependencies": { "@solid-primitives/scheduled": "^1.5.3", "@solid-primitives/utils": "^6.4.0" }, "peerDependencies": { "solid-js": "^1.6.12" } }, "sha512-nSMHpFdnOMP88t7lqtktUXJlhQdJk0BQs2v3jUqcn+OtFwUm27Oa/coKl1BHDxL/65jR5drjqxxvuhaIpiUi0w=="],
+
    "@solid-primitives/props": ["@solid-primitives/props@3.2.3", "", { "dependencies": { "@solid-primitives/utils": "^6.4.0" }, "peerDependencies": { "solid-js": "^1.6.12" } }, "sha512-XzG6en9gSFwmvbKcATm2BxL63HegZ+BAG5fmHi8jyBppQHcaths7ffz+6vYvwYy3nlgLa20ufJLj7tst+PcHFA=="],

    "@solid-primitives/refs": ["@solid-primitives/refs@1.1.3", "", { "dependencies": { "@solid-primitives/utils": "^6.4.0" }, "peerDependencies": { "solid-js": "^1.6.12" } }, "sha512-aam02fjNKpBteewF/UliPSQCVJsIIGOLEWQOh+ll6R/QePzBOOBMcC4G+5jTaO75JuUS1d/14Q1YXT3X0Ow6iA=="],
@@ -5099,11 +5108,15 @@

    "socks-proxy-agent": ["socks-proxy-agent@8.0.5", "", { "dependencies": { "agent-base": "^7.1.2", "debug": "^4.3.4", "socks": "^2.8.3" } }, "sha512-HehCEsotFqbPW9sJ8WVYB6UbmIMv7kUUORIF2Nncq4VQvBfNBLibW9YZR5dlYCSUhwcD628pRllm7n+E+YTzJw=="],

+    "solid-dismissible": ["solid-dismissible@0.1.1", "", { "dependencies": { "@corvu/utils": "~0.4.1" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-9kcKBJIMdS+586cA1g63HYWxKh3h89leeNHbPZ1csYjuni+NvPBtNr11l0iEX2AKKEt6FHk6qNhc/gjoYAW1pA=="],
+
+    "solid-focus-trap": ["solid-focus-trap@0.1.9", "", { "dependencies": { "@corvu/utils": "~0.4.2" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-LTyNki6GUJPRLXV5uMWPkYClB07SUMubbr2EkAddiR0CJCF/I283txilMU9RURSr/P8EewMfXWu2o3aWrK7A5A=="],
+
    "solid-js": ["solid-js@1.9.10", "", { "dependencies": { "csstype": "^3.1.0", "seroval": "~1.3.0", "seroval-plugins": "~1.3.0" } }, "sha512-Coz956cos/EPDlhs6+jsdTxKuJDPT7B5SVIWgABwROyxjY7Xbr8wkzD68Et+NxnV7DLJ3nJdAC2r9InuV/4Jew=="],

    "solid-list": ["solid-list@0.3.0", "", { "dependencies": { "@corvu/utils": "~0.4.0" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-t4hx/F/l8Vmq+ib9HtZYl7Z9F1eKxq3eKJTXlvcm7P7yI4Z8O7QSOOEVHb/K6DD7M0RxzVRobK/BS5aSfLRwKg=="],

-    "solid-presence": ["solid-presence@0.1.8", "", { "dependencies": { "@corvu/utils": "~0.4.0" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-pWGtXUFWYYUZNbg5YpG5vkQJyOtzn2KXhxYaMx/4I+lylTLYkITOLevaCwMRN+liCVk0pqB6EayLWojNqBFECA=="],
+    "solid-presence": ["solid-presence@0.2.0", "", { "dependencies": { "@corvu/utils": "~0.4.2" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-YM92o+jvpzX3XGaD4rLYmq/Kc2ZVh47GSCLEufHBFQQIurvZTs8SoGJxO8BJGNDxBKdcS8F3dYhW1SDXp4BNjA=="],

    "solid-prevent-scroll": ["solid-prevent-scroll@0.1.10", "", { "dependencies": { "@corvu/utils": "~0.4.1" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-KplGPX2GHiWJLZ6AXYRql4M127PdYzfwvLJJXMkO+CMb8Np4VxqDAg5S8jLdwlEuBis/ia9DKw2M8dFx5u8Mhw=="],

@@ -5111,6 +5124,8 @@

    "solid-stripe": ["solid-stripe@0.8.1", "", { "peerDependencies": { "@stripe/stripe-js": ">=1.44.1 <8.0.0", "solid-js": "^1.6.0" } }, "sha512-l2SkWoe51rsvk9u1ILBRWyCHODZebChSGMR6zHYJTivTRC0XWrRnNNKs5x1PYXsaIU71KYI6ov5CZB5cOtGLWw=="],

+    "solid-transition-size": ["solid-transition-size@0.1.4", "", { "dependencies": { "@corvu/utils": "~0.3.2" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-ocHVnbfy23CgfaH4cEUR/AFg0Y3CEL8Oh3n9Qv8OHFJgPh+zkmERKZQfi/xH5XvxDCizg8VjPrVUhiHB1Gza8g=="],
+
    "solid-use": ["solid-use@0.9.1", "", { "peerDependencies": { "solid-js": "^1.7" } }, "sha512-UwvXDVPlrrbj/9ewG9ys5uL2IO4jSiwys2KPzK4zsnAcmEl7iDafZWW1Mo4BSEWOmQCGK6IvpmGHo1aou8iOFw=="],

    "sonic-boom": ["sonic-boom@4.2.1", "", { "dependencies": { "atomic-sleep": "^1.0.0" } }, "sha512-w6AxtubXa2wTXAUsZMMWERrsIRAdrK0Sc+FUytWvYAhBJLyuI4llrMIC1DtlNSdI99EI86KZum2MMq3EAZlF9Q=="],
@@ -5921,6 +5936,8 @@

    "@jsx-email/doiuse-email/htmlparser2": ["htmlparser2@9.1.0", "", { "dependencies": { "domelementtype": "^2.3.0", "domhandler": "^5.0.3", "domutils": "^3.1.0", "entities": "^4.5.0" } }, "sha512-5zfg6mHUoaer/97TxnGpxmbR7zJtPwIYFMZ/H5ucTlPZhKvtum05yiPK3Mgai3a0DyVxv7qYqoweaEd2nrYQzQ=="],

+    "@kobalte/core/solid-presence": ["solid-presence@0.1.8", "", { "dependencies": { "@corvu/utils": "~0.4.0" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-pWGtXUFWYYUZNbg5YpG5vkQJyOtzn2KXhxYaMx/4I+lylTLYkITOLevaCwMRN+liCVk0pqB6EayLWojNqBFECA=="],
+
    "@malept/flatpak-bundler/fs-extra": ["fs-extra@9.1.0", "", { "dependencies": { "at-least-node": "^1.0.0", "graceful-fs": "^4.2.0", "jsonfile": "^6.0.1", "universalify": "^2.0.0" } }, "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ=="],

    "@mdx-js/mdx/acorn": ["acorn@8.16.0", "", { "bin": { "acorn": "bin/acorn" } }, "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw=="],
@@ -6447,6 +6464,8 @@

    "slice-ansi/is-fullwidth-code-point": ["is-fullwidth-code-point@4.0.0", "", {}, "sha512-O4L094N2/dZ7xqVdrXhh9r1KODPJpFms8B5sGdJLPy664AgvXsreZUyCQQNItZRDlYug4xStLjNp/sz3HvBowQ=="],

+    "solid-transition-size/@corvu/utils": ["@corvu/utils@0.3.2", "", { "dependencies": { "@floating-ui/dom": "^1.6.7" }, "peerDependencies": { "solid-js": "^1.8" } }, "sha512-ZWlyWEE8qV9+CB9OAyo2bTrZGXQN9ZeM+JfYv89zoR+lRACKTDuoOZEdiyL8Uc7U5dUSH1uTqKhTTnaHWb+wZA=="],
+
    "sort-keys/is-plain-obj": ["is-plain-obj@1.1.0", "", {}, "sha512-yvkRyxmFKEOQ4pNXCmJG5AEQNlXJS5LaONXo5/cLdTZdWvsZ1ioJEonLGAosKlMWE8lwUy/bJzMjcw8az73+Fg=="],

    "sst/aws4fetch": ["aws4fetch@1.0.18", "", {}, "sha512-3Cf+YaUl07p24MoQ46rFwulAmiyCwH2+1zw1ZyPAX5OtJ34Hh185DwB8y/qRLb6cYYYtSFJ9pthyLc0MD4e8sQ=="],
@@ -67,6 +67,10 @@ const athenaWorkgroup = new aws.athena.Workgroup("LakeAthenaWorkgroup", {
  configuration: {
    enforceWorkgroupConfiguration: true,
    publishCloudwatchMetricsEnabled: true,
+    // Athena bills $5/TB scanned; kill any query that would scan more than 2 TB
+    // so a regression cannot silently burn money. Stats sync full passes scan
+    // ~250 GB as of 2026-07.
+    bytesScannedCutoffPerQuery: 2 * 1024 ** 4,
    resultConfiguration: {
      outputLocation: $interpolate`s3://${athenaResultsBucket.bucket}/`,
    },
@@ -185,7 +185,9 @@ export const statSync = new sst.aws.Service("StatsSyncService", {
  cluster: lakeCluster,
  architecture: "arm64",
  cpu: "0.25 vCPU",
-  memory: "0.5 GB",
+  // 0.5 GB caused an OOM crash loop: every restart immediately re-ran the 4 Athena
+  // stats queries (~$5/pass) every ~5 minutes instead of hourly.
+  memory: "2 GB",
  image: {
    context: ".",
    dockerfile: "packages/stats/server/Dockerfile",
@@ -1,8 +1,8 @@
 {
  "nodeModules": {
-    "x86_64-linux": "sha256-KTyd2ISQ4n1E3tm1LMEHtz+rKRZga+SONn5J6H0pheQ=",
-    "aarch64-linux": "sha256-ZIeaaqRr4JorEmmwFYuitxfYEAtrP8C6IlD+pmFRko0=",
-    "aarch64-darwin": "sha256-Po8FISoBzUMwJSn6nw243/hLT/gAQCrm5HbwXe2uA0g=",
-    "x86_64-darwin": "sha256-5TZzrCnvg1z00YP6O9U0SXjL04r+VmF7LVrqQ9BbSn4="
+    "x86_64-linux": "sha256-JTtn+wXTXg+yklvIMDLcGFaYhTU6ZrCgKT9JTNEQ3gA=",
+    "aarch64-linux": "sha256-gXU6zyhvAZrZirkL/PlHdkHtEof/7PVSPCaE34Jnd4U=",
+    "aarch64-darwin": "sha256-Q0oTG3uzOlD/X2kJingLle529lKFoTpyCW2rHXOZ6iE=",
+    "x86_64-darwin": "sha256-LINvKHxPibTlJeNzfACQx0x+Yj5oROT6Du3I5AtqqXk="
  }
 }
@@ -47,6 +47,7 @@
      "@shikijs/stream": "4.2.0",
      "ulid": "3.0.1",
      "@kobalte/core": "0.13.11",
+      "@corvu/drawer": "0.2.4",
      "@types/luxon": "3.7.1",
      "@types/node": "24.12.2",
      "@types/semver": "7.7.1",
@@ -0,0 +1,40 @@
+import { expect, test } from "@playwright/test"
+import { base64Encode } from "@opencode-ai/core/util/encode"
+import { mockOpenCodeServer } from "../utils/mock-server"
+
+const draftID = "draft_legacy_new_session"
+const directory = "C:/OpenCode/LegacyNewSession"
+const server = `http://${process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"}:${process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"}`
+
+test("redirects a draft to the legacy new-session route", async ({ page }) => {
+  await mockOpenCodeServer(page, {
+    directory,
+    project: {
+      id: "proj_legacy_new_session",
+      worktree: directory,
+      vcs: "git",
+      name: "legacy-new-session",
+      time: { created: 1700000000000, updated: 1700000000000 },
+      sandboxes: [],
+    },
+    provider: { all: [], connected: [], default: {} },
+    sessions: [],
+    pageMessages: () => ({ items: [] }),
+  })
+  await page.addInitScript(
+    ({ directory, draftID, server }) => {
+      localStorage.setItem("settings.v3", JSON.stringify({ general: { newLayoutDesigns: false } }))
+      localStorage.setItem(
+        "opencode.window.browser.dat:tabs",
+        JSON.stringify([{ type: "draft", draftID, server, directory }]),
+      )
+    },
+    { directory, draftID, server },
+  )
+
+  await page.goto(`/new-session?draftId=${draftID}`)
+
+  await expect(page).toHaveURL(`/${base64Encode(directory)}/session`)
+  await expect(page.locator("header[data-tauri-drag-region]")).toBeVisible()
+  await expect(page.locator('[data-component="prompt-input"]')).toBeVisible()
+})
@@ -0,0 +1,155 @@
+import { base64Encode } from "@opencode-ai/core/util/encode"
+import { expect, test } from "@playwright/test"
+import { mockOpenCodeServer } from "../utils/mock-server"
+import { expectSessionTitle } from "../utils/waits"
+
+const directory = "C:/OpenCode/ReviewOpenFile"
+const projectID = "proj_review_open_file"
+const sessionID = "ses_review_open_file"
+const title = "Review open file"
+const server = `http://${process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"}:${process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"}`
+
+test.use({ viewport: { width: 1440, height: 900 } })
+
+test("opens and searches project files inline", async ({ page }) => {
+  const searches: { query: string; dirs?: string; limit?: number }[] = []
+  await mockOpenCodeServer(page, {
+    directory,
+    project: {
+      id: projectID,
+      worktree: directory,
+      vcs: "git",
+      name: "open-file-project",
+      time: { created: 1700000000000, updated: 1700000000000 },
+      sandboxes: [],
+    },
+    provider: {
+      all: [
+        {
+          id: "opencode",
+          name: "OpenCode",
+          models: { test: { id: "test", name: "Test", limit: { context: 200_000 } } },
+        },
+      ],
+      connected: ["opencode"],
+      default: { providerID: "opencode", modelID: "test" },
+    },
+    sessions: [
+      {
+        id: sessionID,
+        slug: sessionID,
+        projectID,
+        directory,
+        title,
+        version: "dev",
+        time: { created: 1700000000000, updated: 1700000000000 },
+      },
+    ],
+    vcsDiff: [fileDiff("src/changed.ts")],
+    fileList: (path) => {
+      if (path) return []
+      return [
+        fileNode("README.md"),
+        { name: "src", path: "src", absolute: `${directory}/src`, type: "directory", ignored: false },
+      ]
+    },
+    fileContent: (path) => ({ type: "text", content: `contents:${path}` }),
+    findFiles: (input) => {
+      searches.push(input)
+      return input.query === "nested" ? ["src/nested.ts"] : []
+    },
+    pageMessages: () => ({ items: [] }),
+  })
+  await page.addInitScript(
+    ({ directory, server, sessionID }) => {
+      localStorage.setItem("settings.v3", JSON.stringify({ general: { newLayoutDesigns: true } }))
+      localStorage.setItem(
+        "opencode.global.dat:server",
+        JSON.stringify({
+          projects: { local: [{ worktree: directory, expanded: true }] },
+          lastProject: { local: directory },
+        }),
+      )
+      localStorage.setItem(
+        "opencode.global.dat:layout",
+        JSON.stringify({ review: { diffStyle: "split", panelOpened: true } }),
+      )
+      localStorage.setItem(
+        "opencode.global.dat:review-panel-v2",
+        JSON.stringify({ sidebarOpened: false, sidebarWidth: 240, expandMode: "collapse" }),
+      )
+      localStorage.setItem(
+        "opencode.window.browser.dat:tabs",
+        JSON.stringify([{ type: "session", server, sessionId: sessionID }]),
+      )
+    },
+    { directory, server, sessionID },
+  )
+
+  await page.goto(`/server/${base64Encode(server)}/session/${sessionID}`)
+  await expectSessionTitle(page, title)
+
+  const panel = page.locator("#review-panel")
+  const sidebar = panel.locator('[data-slot="session-review-v2-sidebar"]')
+  const contextButton = page.getByRole("button", { name: "View context usage" })
+  await contextButton.click()
+  await expect(panel.getByRole("tab", { name: "Context" })).toHaveAttribute("data-selected", "")
+  await panel.getByRole("button", { name: "Open file" }).click()
+  await expect(panel.getByRole("tab", { name: "Open file" })).toHaveAttribute("data-selected", "")
+  await expect(sidebar).toBeVisible()
+  await contextButton.click()
+  await expect(panel.getByRole("tab", { name: "Context" })).toHaveAttribute("data-selected", "")
+  await expect(sidebar).toHaveCount(0)
+  await panel.getByRole("button", { name: "Open file" }).click()
+  const filter = panel.getByRole("combobox", { name: "Filter files" })
+  await expect(filter).toBeFocused()
+  await expect(panel.getByRole("tab", { name: "Open file" })).toHaveAttribute("data-selected", "")
+  await expect(panel.getByText("open-file-project", { exact: true })).toBeVisible()
+
+  await panel.getByRole("button", { name: "README.md" }).click()
+  await expect(panel.getByRole("tab", { name: "README.md" })).toHaveAttribute("data-selected", "")
+  await expect(panel.getByText("contents:README.md", { exact: true })).toBeVisible()
+  await expect(sidebar).toHaveCount(0)
+
+  await panel.getByRole("button", { name: "Open file" }).click()
+  await expect(panel.getByRole("tab", { name: "README.md" })).toHaveCount(0)
+  await expect(sidebar).toBeVisible()
+  await filter.fill("nested")
+  const result = panel.getByRole("option", { name: /nested\.ts/ })
+  await expect(result).toBeVisible()
+  const resultID = await result.getAttribute("id")
+  expect(resultID).toBeTruthy()
+  await expect(filter).toHaveAttribute("aria-activedescendant", resultID!)
+  await filter.press("Enter")
+  await expect(panel.getByRole("tab", { name: "nested.ts" })).toHaveAttribute("data-selected", "")
+  await expect(panel.getByText("contents:src/nested.ts", { exact: true })).toBeVisible()
+  expect(searches).toContainEqual({ query: "nested", dirs: "false", limit: 200 })
+
+  await panel.getByRole("button", { name: "Open file" }).click()
+  await expect(panel.getByRole("tab", { name: "nested.ts" })).toHaveCount(1)
+  await expect(panel.getByRole("tab", { name: "Open file" })).toHaveAttribute("data-selected", "")
+  await page.keyboard.press("Control+w")
+  await expect(panel.getByRole("tab", { name: "Open file" })).toHaveCount(0)
+  await expect(panel.getByRole("tab", { name: "nested.ts" })).toHaveAttribute("data-selected", "")
+})
+
+function fileNode(path: string) {
+  return {
+    name: path,
+    path,
+    absolute: `${directory}/${path}`,
+    type: "file",
+    ignored: false,
+  }
+}
+
+function fileDiff(file: string) {
+  return {
+    file,
+    before: "before\n",
+    after: "after\n",
+    additions: 1,
+    deletions: 1,
+    status: "modified",
+  }
+}
@@ -0,0 +1,152 @@
+import { base64Encode } from "@opencode-ai/core/util/encode"
+import { expect, test, type Page } from "@playwright/test"
+import { mockOpenCodeServer } from "../utils/mock-server"
+import { expectSessionTitle } from "../utils/waits"
+
+const directory = "C:/OpenCode/ReviewStatePersistence"
+const projectID = "proj_review_state_persistence"
+const sessionA = "ses_review_state_a"
+const sessionB = "ses_review_state_b"
+const titleA = "Alpha review state"
+const titleB = "Beta review state"
+const server = `http://${process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"}:${process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"}`
+
+test.use({ viewport: { width: 1440, height: 900 } })
+
+test("restores review mode and selected file per session", async ({ page }) => {
+  await setup(page)
+  await page.goto(sessionHref(sessionA))
+  await expectSessionTitle(page, titleA)
+  await page.getByRole("button", { name: "Toggle review" }).click()
+
+  await selectMode(page, "Git changes", "Branch changes")
+  await selectFile(page, "beta.ts")
+
+  await switchSession(page, titleB)
+  await expect(page.getByRole("button", { name: "Git changes" })).toBeVisible()
+  await selectFile(page, "gamma.ts")
+
+  await switchSession(page, titleA)
+  await expect(page.getByRole("button", { name: "Branch changes" })).toBeVisible()
+  await expectSelectedFile(page, "beta.ts")
+  await selectMode(page, "Branch changes", "Git changes")
+  await expectSelectedFile(page, "alpha.ts")
+  await selectMode(page, "Git changes", "Branch changes")
+  await expectSelectedFile(page, "beta.ts")
+
+  await page.reload()
+  await expectSessionTitle(page, titleA)
+  await expect(page.getByRole("button", { name: "Branch changes" })).toBeVisible()
+  await expectSelectedFile(page, "beta.ts")
+
+  await switchSession(page, titleB)
+  await expect(page.getByRole("button", { name: "Git changes" })).toBeVisible()
+  await expectSelectedFile(page, "gamma.ts")
+})
+
+async function selectMode(page: Page, current: string, next: string) {
+  await page.getByRole("button", { name: current }).click()
+  await page.getByRole("option", { name: next }).click()
+}
+
+async function selectFile(page: Page, file: string) {
+  await page.getByRole("button", { name: file }).click()
+  await expectSelectedFile(page, file)
+}
+
+async function expectSelectedFile(page: Page, file: string) {
+  await expect(page.locator('[data-slot="session-review-v2-file-name"]')).toHaveText(file)
+}
+
+async function switchSession(page: Page, title: string) {
+  await page.locator("[data-titlebar-tab-slot]", { hasText: title }).click()
+  await expectSessionTitle(page, title)
+}
+
+async function setup(page: Page) {
+  await mockOpenCodeServer(page, {
+    directory,
+    project: {
+      id: projectID,
+      worktree: directory,
+      vcs: "git",
+      name: "review-state-persistence",
+      time: { created: 1700000000000, updated: 1700000000000 },
+      sandboxes: [],
+    },
+    provider: {
+      all: [
+        {
+          id: "opencode",
+          name: "OpenCode",
+          models: { test: { id: "test", name: "Test", limit: { context: 200_000 } } },
+        },
+      ],
+      connected: ["opencode"],
+      default: { providerID: "opencode", modelID: "test" },
+    },
+    sessions: [session(sessionA, titleA, 1700000000000), session(sessionB, titleB, 1700000001000)],
+    pageMessages: () => ({ items: [] }),
+  })
+  await page.route(/\/vcs(?:\?.*)?$/, (route) =>
+    route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify({ branch: "feature", default_branch: "dev" }),
+    }),
+  )
+  await page.route("**/vcs/diff**", (route) =>
+    route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify(
+        new URL(route.request().url()).searchParams.get("mode") === "branch"
+          ? [diff("src/alpha.ts"), diff("src/beta.ts")]
+          : [diff("src/alpha.ts"), diff("src/gamma.ts")],
+      ),
+    }),
+  )
+  await page.addInitScript(
+    ({ directory, server, sessions }) => {
+      localStorage.setItem("settings.v3", JSON.stringify({ general: { newLayoutDesigns: true } }))
+      localStorage.setItem(
+        "opencode.global.dat:server",
+        JSON.stringify({
+          projects: { local: [{ worktree: directory, expanded: true }] },
+          lastProject: { local: directory },
+        }),
+      )
+      localStorage.setItem(
+        "opencode.window.browser.dat:tabs",
+        JSON.stringify(sessions.map((sessionId: string) => ({ type: "session", server, sessionId }))),
+      )
+    },
+    { directory, server, sessions: [sessionA, sessionB] },
+  )
+}
+
+function session(id: string, title: string, created: number) {
+  return {
+    id,
+    slug: id,
+    projectID,
+    directory,
+    title,
+    version: "dev",
+    time: { created, updated: created },
+  }
+}
+
+function diff(file: string) {
+  return {
+    file,
+    additions: 1,
+    deletions: 1,
+    status: "modified",
+    patch: `diff --git a/${file} b/${file}\n--- a/${file}\n+++ b/${file}\n@@ -1 +1 @@\n-export const value = 'before'\n+export const value = 'after'\n`,
+  }
+}
+
+function sessionHref(sessionID: string) {
+  return `/server/${base64Encode(server)}/session/${sessionID}`
+}
@@ -9,12 +9,19 @@ const title = "Review terminal stacked"
 const branchDiffs = [
  fileDiff(".github/actions/setup-bun/action.yml", 7),
  ...Array.from({ length: 2_739 }, (_, index) =>
-    fileDiff(`src/branch/generated-${String(index).padStart(4, "0")}.ts`, 100),
+    fileDiff(
+      `src/branch/d${String(Math.floor(index / 100)).padStart(5, "0")}/generated-${String(index).padStart(4, "0")}.ts`,
+      100,
+      false,
+    ),
  ),
 ]

 test("keeps the review tree and terminal sized when both panels are open", async ({ page }) => {
  test.setTimeout(120_000)
+  const events: Array<{ directory: string; payload: Record<string, unknown> }> = []
+  let detailVersion = 1
+  let detailFailures = 1
  await page.setViewportSize({ width: 1400, height: 900 })
  await mockOpenCodeServer(page, {
    directory,
@@ -48,7 +55,10 @@ test("keeps the review tree and terminal sized when both panels are open", async
        time: { created: 1700000000000, updated: 1700000000000 },
      },
    ],
+    sessionStatus: { [sessionID]: { type: "idle" } },
    pageMessages: () => ({ items: [] }),
+    events: () => events.splice(0, 1),
+    eventRetry: 16,
  })
  await page.route(/\/vcs(?:\?.*)?$/, (route) =>
    route.fulfill({
@@ -57,17 +67,25 @@ test("keeps the review tree and terminal sized when both panels are open", async
      body: JSON.stringify({ branch: "review-pane-performance", default_branch: "dev" }),
    }),
  )
-  await page.route("**/vcs/diff**", (route) =>
-    route.fulfill({
+  await page.route("**/vcs/diff**", (route) => {
+    const url = new URL(route.request().url())
+    const scope = url.searchParams.get("directory")?.replaceAll("\\", "/")
+    const detail = scope?.endsWith("/src/branch/d00027")
+    if (detail && detailFailures-- > 0) return route.fulfill({ status: 500, body: "retry detail" })
+    return route.fulfill({
      status: 200,
      contentType: "application/json",
      body: JSON.stringify(
-        new URL(route.request().url()).searchParams.get("mode") === "branch"
-          ? branchDiffs
+        url.searchParams.get("mode") === "branch"
+          ? detail
+            ? branchDiffs
+                .filter((diff) => diff.file.startsWith("src/branch/d00027/"))
+                .map((diff) => fileDiff(diff.file, diff.additions, true, detailVersion))
+            : branchDiffs
          : Array.from({ length: 7 }, (_, index) => fileDiff(`src/git-${index}.ts`, 1)),
      ),
-    }),
-  )
+    })
+  })
  await page.route("**/pty", (route) =>
    route.fulfill({
      status: 200,
@@ -96,7 +114,7 @@ test("keeps the review tree and terminal sized when both panels are open", async
  await expect(page.getByRole("tab", { name: "Review 2740" })).toBeVisible()
  await page.keyboard.press("Control+Backquote")
  await expect(page.locator("#terminal-panel")).toBeVisible()
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")
  await expectStackGeometry(page)

  const treeViewport = page.locator('#review-panel [data-slot="session-review-v2-sidebar-tree"] .scroll-view__viewport')
@@ -113,41 +131,65 @@ test("keeps the review tree and terminal sized when both panels are open", async
  })
  expect(bottomGap).toBeGreaterThanOrEqual(0)
  expect(bottomGap).toBeLessThanOrEqual(16)
+  const lazyDiff = page.waitForRequest((request) => {
+    const url = new URL(request.url())
+    return (
+      url.pathname === "/vcs/diff" &&
+      url.searchParams.get("directory")?.replaceAll("\\", "/").endsWith("/src/branch/d00027") === true
+    )
+  })
+  await lastFile.click()
+  await lazyDiff
+  const preview = page.locator('[data-slot="session-review-v2-diff-scroll"]')
+  await expect(preview).toContainText("after-1")
+  detailVersion = 2
+  events.push(statusEvent("busy"))
+  await expect(page.getByRole("button", { name: "Stop" })).toBeVisible()
+  const refreshedDiff = page.waitForRequest((request) => {
+    const url = new URL(request.url())
+    return (
+      url.pathname === "/vcs/diff" &&
+      url.searchParams.get("directory")?.replaceAll("\\", "/").endsWith("/src/branch/d00027") === true
+    )
+  })
+  events.push(statusEvent("idle"))
+  await refreshedDiff
+  await expect(preview).toContainText("after-2")
  await selectMode(page, "Branch changes", "Git changes")
  await expectTree(page, 8, "git-0.ts")
+  await page.getByRole("button", { name: "git-0.ts" }).click()
  await selectMode(page, "Git changes", "Branch changes")
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")

  const filter = page.getByRole("searchbox", { name: "Filter files" })
  await filter.fill("generated-2738")
  await expectTree(page, 1, "generated-2738.ts")
  await filter.fill("")
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")

  await page.getByRole("button", { name: "Toggle file tree" }).click()
-  await expect(page.locator('[data-slot="session-review-v2-sidebar"]')).toHaveAttribute("aria-hidden", "true")
-  await expect(page.locator('#review-panel [data-component="file-tree-v2"]')).toHaveCount(1)
+  await expect(page.locator('[data-slot="session-review-v2-sidebar"]')).toHaveCount(0)
+  await expect(page.locator('#review-panel [data-component="file-tree-v2"]')).toHaveCount(0)
  await page.getByRole("button", { name: "Toggle file tree" }).click()
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")

  await page.keyboard.press("Control+Backquote")
  await expect(page.locator("#terminal-panel")).toHaveCount(0)
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")
  await page.keyboard.press("Control+Backquote")
  await expect(page.locator("#terminal-panel")).toBeVisible()
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")

  await page.getByRole("button", { name: "Toggle review" }).click()
-  await expect(page.locator("#review-panel")).toHaveAttribute("aria-hidden", "true")
-  await expect(page.locator('#review-panel [data-component="file-tree-v2"]')).toHaveCount(1)
+  await expect(page.locator("#review-panel")).toHaveCount(0)
  await page.getByRole("button", { name: "Toggle review" }).click()
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")
  await page.setViewportSize({ width: 1_000, height: 700 })
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")
  await expectStackGeometry(page)
  await page.setViewportSize({ width: 1_000, height: 120 })
  await page.setViewportSize({ width: 1_400, height: 900 })
-  await expectTree(page, 2_745, "action.yml")
+  await expectTree(page, 2_773, "action.yml")
  await expectStackGeometry(page)
 })

@@ -201,12 +243,21 @@ function base64Encode(value: string) {
  return Buffer.from(value, "utf8").toString("base64").replace(/\+/g, "-").replace(/\//g, "_").replace(/=/g, "")
 }

-function fileDiff(file: string, additions: number) {
+function statusEvent(type: "busy" | "idle") {
+  return {
+    directory,
+    payload: { type: "session.status", properties: { sessionID, status: { type } } },
+  }
+}
+
+function fileDiff(file: string, additions: number, loaded = true, version = 1) {
  return {
    file,
    additions,
    deletions: 0,
    status: "modified",
-    patch: `diff --git a/${file} b/${file}\n--- a/${file}\n+++ b/${file}\n@@ -1 +1 @@\n-export const value = 'before'\n+export const value = 'after'\n`,
+    patch: loaded
+      ? `diff --git a/${file} b/${file}\n--- a/${file}\n+++ b/${file}\n@@ -1 +1 @@\n-export const value = 'before'\n+export const value = 'after-${version}'\n`
+      : `diff --git a/${file} b/${file}\n--- a/${file}\n+++ b/${file}`,
  }
 }
@@ -0,0 +1,228 @@
+import { expect, test, type Locator, type Page } from "@playwright/test"
+import {
+  assistantMessage,
+  setupTimeline,
+  shell,
+  textPart,
+  toolPart,
+  userMessage,
+} from "../performance/timeline-stability/fixture"
+
+for (const deviceScaleFactor of [1.25, 1.5]) {
+  test(`keeps the shell outline inside a fractionally short virtual row at ${deviceScaleFactor}x`, async ({ page }) => {
+    const shellID = "prt_shell_outline"
+    const timeline = await setupTimeline(page, {
+      messages: [userMessage(), assistantMessage([shell(shellID, "completed", "shell output")])],
+      settings: { newLayoutDesigns: true, shellToolPartsExpanded: true },
+      reducedMotion: true,
+      deviceScaleFactor,
+    })
+    const part = page.locator(`[data-timeline-part-id="${shellID}"]`)
+    const output = part.locator('[data-component="bash-output"]')
+    const row = page.locator("[data-timeline-key]", { has: part })
+    await expect(output).toBeVisible()
+    await timeline.settle()
+
+    const geometry = await row.evaluate((element) => {
+      const output = element.querySelector<HTMLElement>('[data-component="bash-output"]')
+      if (!output) throw new Error("Shell output is unavailable")
+      const rowRect = element.getBoundingClientRect()
+      const outputRect = output.getBoundingClientRect()
+      // Match a rounded-down measurement at a fractional device-pixel phase.
+      element.style.height = `${outputRect.bottom - rowRect.top - 0.49}px`
+      element.style.transform = "translateY(0.25px)"
+      output.style.setProperty("--v2-border-border-base", "rgb(255, 0, 255)")
+      output.style.setProperty("background", "rgb(0, 0, 0)", "important")
+      const style = getComputedStyle(output)
+      return {
+        outputWidth: outputRect.width,
+        outputHeight: outputRect.height,
+        borderColor: style.borderTopColor,
+        boxShadow: style.boxShadow,
+        clipMargin: getComputedStyle(element).overflowClipMargin,
+      }
+    })
+    await timeline.settle()
+
+    const clipped = await row.evaluate((element) => {
+      const output = element.querySelector<HTMLElement>('[data-component="bash-output"]')!
+      return output.getBoundingClientRect().bottom - element.getBoundingClientRect().bottom
+    })
+    expect(clipped).toBeCloseTo(0.49, 1)
+
+    expect(await page.evaluate(() => devicePixelRatio)).toBe(deviceScaleFactor)
+    const edges = await captureCardEdges(page, output)
+
+    expect(edges.box.width).toBeCloseTo(geometry.outputWidth, 2)
+    expect(edges.box.height).toBeCloseTo(geometry.outputHeight, 2)
+    expect(geometry.borderColor).toBe("rgb(255, 0, 255)")
+    expect(geometry.boxShadow).toBe("none")
+    expect(geometry.clipMargin).toBe("0.5px")
+    expect(edges.magenta.top).toBeGreaterThan(0.75)
+    expect(edges.magenta.bottom).toBeGreaterThan(0.75)
+    expect(edges.magenta.vertical).toBeGreaterThanOrEqual(2)
+  })
+}
+
+test("keeps the patch card inside a fractionally short virtual row", async ({ page }) => {
+  const patchID = "prt_patch_outline"
+  const file = {
+    filePath: "src/outline.ts",
+    relativePath: "src/outline.ts",
+    type: "update",
+    additions: 1,
+    deletions: 1,
+    before: "const outline = false\n",
+    after: "const outline = true\n",
+  }
+  const timeline = await setupTimeline(page, {
+    messages: [
+      userMessage(),
+      assistantMessage([
+        toolPart(patchID, "apply_patch", "completed", { files: [file.filePath] }, { metadata: { files: [file] } }),
+      ]),
+    ],
+    settings: { editToolPartsExpanded: true, newLayoutDesigns: true },
+    reducedMotion: true,
+  })
+  const part = page.locator(`[data-timeline-part-id="${patchID}"]`)
+  const card = part.locator('[data-component="accordion"][data-scope="apply-patch"]')
+  const row = page.locator("[data-timeline-key]", { has: part })
+  await expect(card).toBeVisible()
+  await timeline.settle()
+
+  const geometry = await row.evaluate((element) => {
+    const card = element.querySelector<HTMLElement>('[data-component="accordion"][data-scope="apply-patch"]')
+    if (!card) throw new Error("Patch card is unavailable")
+    const rowRect = element.getBoundingClientRect()
+    const cardRect = card.getBoundingClientRect()
+    element.style.height = `${cardRect.bottom - rowRect.top - 0.49}px`
+    const clipMargin = getComputedStyle(element).overflowClipMargin
+    const bottom = element.getBoundingClientRect().bottom
+    return {
+      overflow: card.getBoundingClientRect().bottom - bottom,
+      paintOverflow: card.getBoundingClientRect().bottom - bottom - Number.parseFloat(clipMargin),
+      clipMargin,
+      cardWidth: cardRect.width,
+      cardHeight: cardRect.height,
+    }
+  })
+  await timeline.settle()
+
+  expect(geometry.overflow).toBeCloseTo(0.49, 1)
+  expect(geometry.paintOverflow).toBeLessThanOrEqual(0)
+  const edges = await captureCardEdges(page, card)
+  expect(edges.box.width).toBeCloseTo(geometry.cardWidth, 2)
+  expect(edges.box.height).toBeCloseTo(geometry.cardHeight, 2)
+  expect(edges.luminance.top).toBeLessThan(245)
+  expect(edges.luminance.bottom).toBeLessThan(245)
+  expect(Math.abs(edges.luminance.bottom - edges.luminance.top)).toBeLessThan(10)
+  expect(geometry.clipMargin).toBe("0.5px")
+})
+
+test("allows paint rounding for every framed row but not fixed turn gaps", async ({ page }) => {
+  const secondUserID = "msg_outline_second_user"
+  await setupTimeline(page, {
+    messages: [
+      userMessage(undefined, {
+        summary: {
+          diffs: [
+            {
+              file: "src/summary.ts",
+              additions: 1,
+              deletions: 1,
+              patch: "@@ -1 +1 @@\n-export const value = 1\n+export const value = 2",
+            },
+          ],
+        },
+      }),
+      assistantMessage([textPart("prt_outline_text", "Assistant text")]),
+      userMessage(undefined, { id: secondUserID, created: 1700000010000 }),
+      assistantMessage([], {
+        id: "msg_outline_second_assistant",
+        parentID: secondUserID,
+        created: 1700000011000,
+      }),
+    ],
+  })
+  await expect(page.locator('[data-timeline-row="DiffSummary"]')).toBeVisible()
+  await expect(page.locator('[data-timeline-row="TurnGap"]')).toBeVisible()
+
+  const rows = await page.locator("[data-timeline-key]").evaluateAll((elements) =>
+    elements.map((element) => ({
+      tag: element.querySelector<HTMLElement>("[data-timeline-row]")?.dataset.timelineRow,
+      clipMargin: getComputedStyle(element).overflowClipMargin,
+    })),
+  )
+  expect(rows.filter((row) => row.tag !== "TurnGap").every((row) => row.clipMargin === "0.5px")).toBe(true)
+  expect(rows.filter((row) => row.tag === "TurnGap")).toEqual([{ tag: "TurnGap", clipMargin: "0px" }])
+})
+
+async function captureCardEdges(page: Page, card: Locator) {
+  const box = await card.boundingBox()
+  if (!box) throw new Error("Tool card bounds are unavailable")
+  const viewport = page.viewportSize()
+  if (!viewport) throw new Error("Viewport bounds are unavailable")
+  const screenshot = await page.screenshot()
+  return page.evaluate(
+    async ({ source, box, viewport }) => {
+      const image = new Image()
+      image.src = source
+      await image.decode()
+      const canvas = document.createElement("canvas")
+      canvas.width = image.naturalWidth
+      canvas.height = image.naturalHeight
+      const context = canvas.getContext("2d")
+      if (!context) throw new Error("2D canvas is unavailable")
+      context.drawImage(image, 0, 0)
+      const scale = {
+        x: image.naturalWidth / viewport.width,
+        y: image.naturalHeight / viewport.height,
+      }
+      const rows = (candidates: number[]) => {
+        const left = Math.floor((box.x + 8) * scale.x)
+        const width = Math.floor((box.width - 16) * scale.x)
+        return candidates.map((row) => {
+          const pixels = context.getImageData(left, row, width, 1).data
+          const indexes = Array.from({ length: width }, (_, index) => index * 4)
+          return {
+            luminance:
+              indexes
+                .map((index) => (pixels[index]! + pixels[index + 1]! + pixels[index + 2]!) / 3)
+                .reduce((sum, value) => sum + value, 0) / width,
+            magenta:
+              indexes.filter((index) => pixels[index]! > 200 && pixels[index + 1]! < 180 && pixels[index + 2]! > 200)
+                .length / width,
+          }
+        })
+      }
+      const pixels = context.getImageData(0, 0, image.naturalWidth, image.naturalHeight).data
+      const columns = new Uint32Array(image.naturalWidth)
+      for (let index = 0; index < pixels.length; index += 4) {
+        if (pixels[index]! <= 200 || pixels[index + 1]! >= 180 || pixels[index + 2]! <= 200) continue
+        columns[(index / 4) % image.naturalWidth] = columns[(index / 4) % image.naturalWidth]! + 1
+      }
+      const top = box.y * scale.y
+      const bottom = (box.y + box.height) * scale.y
+      const topRows = rows([Math.floor(top) - 1, Math.floor(top), Math.ceil(top)])
+      const bottomRows = rows([Math.floor(bottom) - 2, Math.floor(bottom) - 1, Math.ceil(bottom) - 1])
+      return {
+        box,
+        luminance: {
+          top: Math.min(...topRows.map((row) => row.luminance)),
+          bottom: rows([Math.ceil(bottom) - 1])[0]!.luminance,
+        },
+        magenta: {
+          top: Math.max(...topRows.map((row) => row.magenta)),
+          bottom: Math.max(...bottomRows.map((row) => row.magenta)),
+          vertical: Array.from(columns).filter((count) => count > box.height * scale.y * 0.75).length,
+        },
+      }
+    },
+    {
+      source: `data:image/png;base64,${screenshot.toString("base64")}`,
+      viewport,
+      box,
+    },
+  )
+}
@@ -22,6 +22,7 @@ export interface MockServerConfig {
  questions?: unknown[] | (() => unknown[])
  fileList?: (path: string) => unknown | Promise<unknown>
  fileContent?: (path: string) => unknown | Promise<unknown>
+  findFiles?: (input: { query: string; dirs?: string; limit?: number }) => unknown
  sessionStatus?: unknown
 }

@@ -66,6 +67,15 @@ export async function mockOpenCodeServer(page: Page, config: MockServerConfig) {
      return json(route, await config.fileList(url.searchParams.get("path") ?? ""))
    if (path === "/file/content" && config.fileContent)
      return json(route, await config.fileContent(url.searchParams.get("path") ?? ""))
+    if (path === "/find/file" && config.findFiles)
+      return json(
+        route,
+        await config.findFiles({
+          query: url.searchParams.get("query") ?? "",
+          dirs: url.searchParams.get("dirs") ?? undefined,
+          limit: url.searchParams.has("limit") ? Number(url.searchParams.get("limit")) : undefined,
+        }),
+      )
    if (path === "/api/reference")
      return json(route, {
        location: {
@@ -1,6 +1,6 @@
 {
  "name": "@opencode-ai/app",
-  "version": "1.17.15",
+  "version": "1.17.18",
  "description": "",
  "type": "module",
  "exports": {
@@ -47,6 +47,7 @@
    "vite-plugin-solid": "catalog:"
  },
  "dependencies": {
+    "@corvu/drawer": "catalog:",
    "@dnd-kit/abstract": "0.5.0",
    "@dnd-kit/dom": "0.5.0",
    "@dnd-kit/helpers": "0.5.0",
@@ -88,6 +89,7 @@
    "shiki": "catalog:",
    "solid-js": "catalog:",
    "solid-list": "catalog:",
+    "solid-presence": "0.2.0",
    "tailwindcss": "catalog:"
  }
 }
@@ -12,6 +12,7 @@ import { MetaProvider } from "@solidjs/meta"
 import { type BaseRouterProps, Navigate, Route, Router, useNavigate, useParams, useSearchParams } from "@solidjs/router"
 import { QueryClient, QueryClientProvider } from "@tanstack/solid-query"
 import { Effect } from "effect"
+import { base64Encode } from "@opencode-ai/core/util/encode"
 import {
  type Component,
  createEffect,
@@ -174,6 +175,7 @@ function LegacyServerLayout(props: ParentProps<{ serverScoped?: JSX.Element }>)

 function DraftRoute() {
  const [search] = useSearchParams<{ draftId?: string }>()
+  const settings = useSettings()
  const tabs = useTabs()
  return (
    <Show when={tabs.ready()}>
@@ -182,7 +184,14 @@ function DraftRoute() {
        keyed
        fallback={<Navigate href="/" />}
      >
-        {(draft) => <ResolvedDraftRoute draft={draft} />}
+        {(draft) => (
+          <Show
+            when={settings.general.newLayoutDesigns()}
+            fallback={<Navigate href={`/${base64Encode(draft.directory)}/session`} />}
+          >
+            <ResolvedDraftRoute draft={draft} />
+          </Show>
+        )}
      </Show>
    </Show>
  )
@@ -20,14 +20,11 @@ import {
  uniqueCommandPaletteEntries,
  type CommandPaletteEntry,
 } from "./command-palette"
+import { DialogCommandPaletteV2 } from "./dialog-command-palette-v2"

 const DialogSelectFileV2 = lazy(() =>
  import("./dialog-select-directory-v2").then((module) => ({ default: module.DialogSelectDirectoryV2 })),
 )
-const DialogCommandPaletteV2 = lazy(() =>
-  import("./dialog-command-palette-v2").then((module) => ({ default: module.DialogCommandPaletteV2 })),
-)
-
 type DialogSelectFileMode = "all" | "files"

 export function DialogSelectFile(props: { mode?: DialogSelectFileMode; onOpenFile?: (path: string) => void }) {
@@ -0,0 +1,173 @@
+import { DialogBody, DialogHeader, DialogTitle, DialogV2 } from "@opencode-ai/ui/v2/dialog-v2"
+import { Icon } from "@opencode-ai/ui/v2/icon"
+import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
+import { ScrollView } from "@opencode-ai/ui/scroll-view"
+import { Tag } from "@opencode-ai/ui/v2/badge-v2"
+import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
+import { useDialog } from "@opencode-ai/ui/context/dialog"
+import { createMemo, onCleanup, onMount, type Component, For, Show } from "solid-js"
+import { useLocal } from "@/context/local"
+import { popularProviders, useProviders } from "@/hooks/use-providers"
+import { decode64 } from "@/utils/base64"
+import { useLanguage } from "@/context/language"
+import { ModelTooltip } from "./model-tooltip"
+
+type ModelState = ReturnType<typeof useLocal>["model"]
+
+export const DialogSelectModelUnpaidV2: Component<{ model?: ModelState }> = (props) => {
+  const local = useLocal()
+  const model = props.model ?? local.model
+  const dialog = useDialog()
+  const directory = () => decode64(local.slug())
+  const providers = useProviders(directory)
+  const language = useLanguage()
+  const modelKey = (item: ReturnType<ModelState["list"]>[number]) => `${item.provider.id}:${item.id}`
+  const currentKey = createMemo(() => {
+    const c = model.current()
+    return c ? `${c.provider.id}:${c.id}` : undefined
+  })
+  const isFree = (item: ReturnType<ModelState["list"]>[number]) =>
+    item.provider.id === "opencode" && (!item.cost || item.cost.input === 0)
+
+  const openProviders = (provider?: string) => {
+    void import("./dialog-connect-provider").then((x) => {
+      const controller = x.useProviderConnectController()
+      controller.select(provider)
+      void dialog.show(() => <x.DialogConnectProvider controller={controller} directory={directory} />)
+    })
+  }
+
+  const selectModel = (item: ReturnType<ModelState["list"]>[number]) => {
+    model.set({ modelID: item.id, providerID: item.provider.id }, { recent: true })
+    dialog.close()
+  }
+
+  // Focus starts on the dialog's close button, outside the list, so listen at the
+  // document level while the dialog is mounted instead of on the list container.
+  let listEl: HTMLDivElement | undefined
+  onMount(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key !== "ArrowDown" && e.key !== "ArrowUp") return
+      if (!listEl) return
+      const buttons = Array.from(listEl.querySelectorAll<HTMLButtonElement>("button"))
+      if (buttons.length === 0) return
+      const index = buttons.indexOf(document.activeElement as HTMLButtonElement)
+      const next =
+        index < 0 ? (e.key === "ArrowDown" ? 0 : buttons.length - 1) : index + (e.key === "ArrowDown" ? 1 : -1)
+      buttons[(next + buttons.length) % buttons.length]?.focus()
+      e.preventDefault()
+    }
+    document.addEventListener("keydown", handleKeyDown)
+    onCleanup(() => document.removeEventListener("keydown", handleKeyDown))
+  })
+
+  return (
+    <DialogV2 containerClass="!h-[min(calc(100vh_-_16px),480px)] !w-[min(calc(100vw_-_16px),560px)]">
+      <DialogHeader closeLabel={language.t("common.close")}>
+        <DialogTitle>{language.t("dialog.model.select.title")}</DialogTitle>
+      </DialogHeader>
+      <div class="h-px w-full shrink-0 bg-v2-border-border-muted" />
+      <DialogBody class="min-h-0 flex-1 gap-0">
+        <ScrollView class="min-h-0 flex-1 w-full">
+          <div ref={listEl} class="flex min-h-full flex-col">
+            <div class="flex h-fit w-full flex-col items-start gap-0.5 px-3.5 pb-3.5 pt-3">
+              <div class="flex h-8 w-full flex-none select-none flex-row items-center gap-2 self-stretch px-2.5 pb-2 pt-1">
+                <div class="flex h-5 flex-none flex-row items-center p-0 font-[440] text-[13px] leading-5 tracking-[-0.04px] text-v2-text-text-faint [font-family:Inter,var(--font-family-sans)] [font-variant-numeric:tabular-nums] [font-variation-settings:'slnt'_0]">
+                  {language.t("dialog.model.unpaid.freeModels.title")}
+                </div>
+              </div>
+              <For each={model.list()}>
+                {(item) => (
+                  <TooltipV2
+                    class="w-full"
+                    placement="right-start"
+                    gutter={6}
+                    openDelay={0}
+                    value={<ModelTooltip model={item} latest={item.latest} free={isFree(item)} v2 />}
+                  >
+                    <button
+                      type="button"
+                      class="flex w-full scroll-my-3.5 flex-row items-center gap-2 rounded-md px-2.5 py-2 text-left text-[13px] font-[530] leading-5 tracking-[-0.04px] text-v2-text-text-base [font-family:Inter,var(--font-family-sans)] [font-variation-settings:'slnt'_0] hover:bg-v2-overlay-simple-overlay-hover focus:bg-v2-overlay-simple-overlay-hover focus:outline-none"
+                      onClick={() => selectModel(item)}
+                    >
+                      <span class="min-w-0 truncate">{item.name}</span>
+                      <Show when={isFree(item)}>
+                        <Tag class="shrink-0">{language.t("model.tag.free")}</Tag>
+                      </Show>
+                      <Show when={item.latest}>
+                        <Tag class="shrink-0">{language.t("model.tag.latest")}</Tag>
+                      </Show>
+                      <Show when={currentKey() === modelKey(item)}>
+                        <Icon name="check" class="ml-auto size-4 shrink-0 text-v2-icon-icon-base" />
+                      </Show>
+                    </button>
+                  </TooltipV2>
+                )}
+              </For>
+            </div>
+
+            <div class="flex w-full flex-col p-2.5 pt-0">
+              <div class="flex h-fit w-full flex-none grow-0 flex-col items-start gap-0.5 self-stretch rounded-lg bg-v2-background-bg-layer-02 p-1 shadow-[var(--v2-elevation-switch-off)]">
+                <div class="flex h-8 w-full flex-none select-none flex-row items-center gap-2 self-stretch px-2.5 py-1.5">
+                  <div class="flex h-5 flex-none flex-row items-center p-0 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-faint [font-family:Inter,var(--font-family-sans)] [font-variant-numeric:tabular-nums] [font-variation-settings:'slnt'_0]">
+                    {language.t("dialog.model.unpaid.addMore.title")}
+                  </div>
+                </div>
+                <div class="flex w-full flex-col">
+                  <For
+                    each={[...providers.popular()].sort((a, b) => {
+                      if (popularProviders.includes(a.id) && popularProviders.includes(b.id)) {
+                        return popularProviders.indexOf(a.id) - popularProviders.indexOf(b.id)
+                      }
+                      return a.name.localeCompare(b.name)
+                    })}
+                  >
+                    {(provider) => (
+                      <button
+                        type="button"
+                        class="flex w-full scroll-my-3.5 flex-row items-center gap-2 rounded-[6px] px-2.5 py-2 text-left text-[13px] font-[530] leading-5 tracking-[-0.04px] text-v2-text-text-base [font-family:Inter,var(--font-family-sans)] [font-variation-settings:'slnt'_0] hover:bg-v2-overlay-simple-overlay-hover focus:bg-v2-overlay-simple-overlay-hover focus:outline-none"
+                        onClick={() => openProviders(provider.id)}
+                      >
+                        <ProviderIcon id={provider.id} class="size-4 shrink-0 text-v2-icon-icon-muted" />
+                        <span class="min-w-0 truncate">{provider.name}</span>
+                        <Show when={provider.id === "opencode"}>
+                          <span class="min-w-0 truncate text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-muted [font-family:Inter,var(--font-family-sans)] [font-variation-settings:'slnt'_0]">
+                            {language.t("dialog.provider.opencode.tagline")}
+                          </span>
+                          <Tag class="shrink-0">{language.t("dialog.provider.tag.recommended")}</Tag>
+                        </Show>
+                        <Show when={provider.id === "opencode-go"}>
+                          <span class="min-w-0 truncate text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-muted [font-family:Inter,var(--font-family-sans)] [font-variation-settings:'slnt'_0]">
+                            {language.t("dialog.provider.opencodeGo.tagline")}
+                          </span>
+                          <Tag class="shrink-0">{language.t("dialog.provider.tag.recommended")}</Tag>
+                        </Show>
+                        <Show when={provider.id === "anthropic"}>
+                          <span class="min-w-0 truncate text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-muted [font-family:Inter,var(--font-family-sans)] [font-variation-settings:'slnt'_0]">
+                            {language.t("dialog.provider.anthropic.note")}
+                          </span>
+                        </Show>
+                      </button>
+                    )}
+                  </For>
+                  <button
+                    type="button"
+                    class="flex h-9 w-full scroll-my-3.5 flex-row items-center justify-start gap-2 rounded-[6px] px-2.5 py-2 text-left text-[13px] font-[530] leading-5 tracking-[-0.04px] text-v2-text-text-base [font-family:Inter,var(--font-family-sans)] [font-variation-settings:'slnt'_0] hover:bg-v2-overlay-simple-overlay-hover focus:bg-v2-overlay-simple-overlay-hover focus:outline-none"
+                    onClick={() => openProviders()}
+                  >
+                    <span class="flex size-4 shrink-0 items-center justify-center text-v2-icon-icon-muted">
+                      <Icon name="dot-grid" size="small" />
+                    </span>
+                    <span class="min-w-0 truncate text-left text-[13px] font-[530] leading-5 tracking-[-0.04px] text-v2-text-text-base [font-family:Inter,var(--font-family-sans)] [font-variation-settings:'slnt'_0]">
+                      {language.t("dialog.provider.viewAll")}
+                    </span>
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </ScrollView>
+      </DialogBody>
+    </DialogV2>
+  )
+}
@@ -474,7 +474,7 @@ export function ModelSelectorPopoverV2(props: {
                                }}
                                onSelect={() => selectModel(item)}
                              >
-                                <span class="min-w-0 truncate">{item.name}</span>
+                                <span class="min-w-0 truncate leading-5">{item.name}</span>
                                <Show when={isFree(item.provider.id, item.cost)}>
                                  <TagV2 class="shrink-0">{language.t("model.tag.free")}</TagV2>
                                </Show>
@@ -201,6 +201,7 @@ export default function FileTree(props: {
  kinds?: ReadonlyMap<string, Kind>
  draggable?: boolean
  onFileClick?: (file: FileNode) => void
+  onFileDoubleClick?: (file: FileNode) => void

  _filter?: Filter
  _marks?: Set<string>
@@ -440,6 +441,7 @@ export default function FileTree(props: {
                        active={props.active}
                        draggable={props.draggable}
                        onFileClick={props.onFileClick}
+                        onFileDoubleClick={props.onFileDoubleClick}
                        _filter={filter()}
                        _marks={marks()}
                        _deeps={deeps()}
@@ -462,6 +464,7 @@ export default function FileTree(props: {
                  as="button"
                  type="button"
                  onClick={() => props.onFileClick?.(node)}
+                  onDblClick={() => props.onFileDoubleClick?.(node)}
                >
                  <div class="w-4 shrink-0" />
                  <Switch>
@@ -1,54 +1,144 @@
-import { Icon } from "@opencode-ai/ui/v2/icon"
-import { Popover } from "@opencode-ai/ui/popover"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
+import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
 import { createSignal, Show } from "solid-js"
 import { createStore } from "solid-js/store"
+import { Drawer, DrawerClose, DrawerContent } from "@/components/ui/drawer"
+import { usePlatform } from "@/context/platform"
+import introducingTabsVideo from "@/assets/help/introducing-tabs.mp4"
+import { Persist, persisted } from "@/utils/persist"
+
+const helpIcon = (
+  <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    aria-hidden="true"
+    data-slot="icon-svg"
+  >
+    <path
+      d="M6.94235 10.5714V10.4854C6.94617 9.76302 7.01879 9.18777 7.16022 8.75968C7.30546 8.33158 7.50804 7.98567 7.76796 7.72193C8.02787 7.45819 8.34321 7.21548 8.71397 6.99379C8.93948 6.85619 9.14206 6.69374 9.32171 6.50645C9.50518 6.31916 9.64851 6.10511 9.75171 5.86431C9.85874 5.62351 9.91225 5.35404 9.91225 5.0559C9.91225 4.69661 9.82625 4.38509 9.65424 4.12136C9.48607 3.85762 9.26055 3.65504 8.9777 3.51362C8.69486 3.36837 8.38143 3.29575 8.03743 3.29575C7.73165 3.29575 7.43733 3.35882 7.15448 3.48495C6.87546 3.61108 6.6423 3.80984 6.45501 4.08122C6.26772 4.3526 6.15878 4.70425 6.12821 5.13617H4.56299C4.59357 4.47109 4.76557 3.9054 5.07899 3.43908C5.39242 2.96894 5.80522 2.61156 6.31741 2.36694C6.83341 2.12231 7.40675 2 8.03743 2C8.72161 2 9.31789 2.13378 9.82625 2.40134C10.3384 2.66507 10.734 3.0301 11.0131 3.49642C11.2959 3.96273 11.4373 4.49976 11.4373 5.1075C11.4373 5.53177 11.3724 5.914 11.2424 6.25418C11.1124 6.59436 10.9251 6.89823 10.6805 7.16579C10.4397 7.43335 10.1492 7.67033 9.80905 7.87673C9.48033 8.08313 9.21468 8.301 9.0121 8.53034C8.80952 8.75585 8.66237 9.02341 8.57063 9.33302C8.4789 9.64262 8.42921 10.0268 8.42156 10.4854V10.5714H6.94235ZM7.72782 14C7.43351 14 7.17933 13.8949 6.96528 13.6847C6.75506 13.4744 6.64994 13.2203 6.64994 12.9221C6.64994 12.6278 6.75506 12.3755 6.96528 12.1653C7.17933 11.9551 7.43351 11.85 7.72782 11.85C8.02214 11.85 8.27441 11.9551 8.48463 12.1653C8.69868 12.3755 8.8057 12.6278 8.8057 12.9221C8.8057 13.1209 8.75601 13.3024 8.65663 13.4668C8.55726 13.6273 8.4273 13.7573 8.26676 13.8567C8.10623 13.9522 7.92658 14 7.72782 14Z"
+      fill="var(--v2-icon-icon-base)"
+    />
+  </svg>
+)
+
+const triggerClass =
+  "size-7 !rounded-full shrink-0 bg-v2-background-bg-base shadow-[var(--v2-elevation-button-neutral)]"
+
+// TODO: wire to changelog / seen-state when available
+const showPopover = () => true

 export function HelpButton() {
  if (import.meta.env.VITE_OPENCODE_CHANNEL !== "dev") return null

-  const [state, setState] = /* persisted(Persist.global("help-button"), */ createStore({ dismissed: false }) /* ) */
-  const [shown, setShown] = createSignal(false)
+  const platform = usePlatform()

  return (
-    <Show when={!state.dismissed}>
-      <div class="fixed bottom-4 right-4 z-50 hidden md:block">
-        <Popover
-          open={shown()}
-          onOpenChange={setShown}
-          triggerAs="button"
-          triggerProps={{
-            type: "button",
-            "aria-label": "Help",
-            class:
-              "size-7 rounded-full bg-background-base shadow-[var(--shadow-lg-border-base)] flex items-center justify-center text-text-base hover:text-text-strong transition-colors",
-          }}
-          trigger={<span aria-hidden="true">?</span>}
-          class="[&_[data-slot=popover-body]]:p-0 w-[320px] max-w-[calc(100vw-40px)] bg-transparent border-0 shadow-none rounded-xl"
-          gutter={8}
-          placement="top-end"
-        >
-          <Show when={shown()}>
-            <div class="relative flex flex-col gap-1 w-[320px] p-4 rounded-xl bg-background-strong shadow-[var(--shadow-lg-border-base)]">
-              <button
-                type="button"
-                aria-label="Close"
-                class="absolute top-3.5 right-3.5 size-6 rounded-md flex items-center justify-center text-text-base hover:text-text-strong hover:bg-surface-raised-base-hover transition-colors"
-                onClick={() => {
-                  setShown(false)
-                  setState("dismissed", true)
-                }}
-              >
-                <Icon name="xmark-small" />
-              </button>
-              <span class="text-14-regular text-text-strong">Lorem ipsum dolor sit amet</span>
-              <p class="text-12-regular text-text-weak">
-                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et
-                dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.
-              </p>
-            </div>
-          </Show>
-        </Popover>
-      </div>
-    </Show>
+    <a
+      href="https://opencode.ai"
+      aria-label="Open the OpenCode website"
+      data-component="icon-button-v2"
+      data-size="large"
+      class={`${triggerClass} fixed bottom-5 right-5 z-50 flex items-center justify-center`}
+      onClick={(event) => {
+        event.preventDefault()
+        platform.openLink(event.currentTarget.href)
+      }}
+    >
+      {helpIcon}
+    </a>
+  )
+}
+
+// can remove this after the tabs rollout has been out for a while
+export function TabsInfoPopup() {
+  if (import.meta.env.VITE_OPENCODE_CHANNEL !== "dev") return null
+
+  const [state, setState] = persisted(Persist.global("tabsInfoPopup"), createStore({ dismissed: false }))
+  // setState({ dismissed: false }) // for testing
+  const [drawerOpen, setDrawerOpen] = createSignal(false)
+
+  return (
+    <Drawer open={drawerOpen()} onOpenChange={setDrawerOpen} side="right">
+      <Show when={!state.dismissed}>
+        <div
+          class="fixed bottom-14 right-5 z-50 h-[240px] w-[192px] rounded-[8px] bg-v2-background-bg-base p-1 shadow-[var(--v2-elevation-floating)]"
+          aria-label="Introducing Tabs. A faster, more intuitive way to work."
+        >
+          <button
+            type="button"
+            aria-label="Dismiss Tabs information"
+            class="absolute top-3 right-3 z-10 size-5 flex items-center justify-center rounded-[4px] bg-[rgba(0,0,0,0.4)]"
+            onClick={() => setState("dismissed", true)}
+          >
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 16 16"
+              fill="none"
+              xmlns="http://www.w3.org/2000/svg"
+              aria-hidden="true"
+            >
+              <path d="M4.25 11.75L11.75 4.25M11.75 11.75L4.25 4.25" stroke="white" />
+            </svg>
+          </button>
+          <button
+            type="button"
+            class="relative block h-[232px] w-[184px] cursor-pointer overflow-hidden rounded-[4px] text-left"
+            onClick={() => {
+              setState("dismissed", true)
+              setDrawerOpen(true)
+            }}
+          >
+            <video
+              src={introducingTabsVideo}
+              class="absolute inset-0 h-full w-full object-cover"
+              loop
+              muted
+              autoplay
+              playsinline
+              aria-hidden="true"
+              onContextMenu={(event) => event.preventDefault()}
+            />
+            <div class="absolute inset-x-0 bottom-0 flex w-full flex-col items-start gap-1.5 bg-[linear-gradient(180deg,rgba(0,0,0,0)_0%,#000000_100%)] px-3 py-5">
+              <p class="w-full select-none text-[13px] font-[530] leading-none tracking-[-0.04px] text-[#FFFFFF]">
+                Introducing Tabs
+              </p>
+              <p class="w-full select-none text-[13px] font-[440] leading-[140%] tracking-[-0.04px] text-[#808080]">
+                A faster, more intuitive way to work.
+              </p>
+            </div>
+          </button>
+        </div>
+      </Show>
+      <DrawerContent>
+        <div class="flex h-[52px] w-full shrink-0 items-center gap-4 self-stretch border-b border-v2-border-border-muted p-4">
+          <p class="min-h-0 min-w-0 flex-1 text-[13px] font-[530] leading-5 tracking-[-0.04px] tabular-nums text-v2-text-text-muted">
+            June 16
+          </p>
+          <DrawerClose
+            as={IconButtonV2}
+            type="button"
+            size="small"
+            variant="ghost-muted"
+            aria-label="Close"
+            icon={<IconV2 name="xmark-small" />}
+          />
+        </div>
+        <div class="relative flex w-full flex-col items-start gap-6 p-8">
+          <p class="w-full shrink-0 self-stretch text-[21px] font-[610] leading-6 tracking-[-0.37px] tabular-nums text-v2-text-text-base">
+            Introducing Tabs Navigation.
+          </p>
+          <p class="w-full flex-1 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base">
+            We've introduced tabs as the primary navigation in OpenCode. Your most important session are now pinned at
+            the top of your screen at all times. No more hunting through menus or losing your place mid-session. Switch
+            contexts instantly, pick up exactly where you left off, and keep your focus where it belongs: on the
+            sessions.
+          </p>
+        </div>
+      </DrawerContent>
+    </Drawer>
  )
 }
@@ -36,6 +36,8 @@ import { Icon } from "@opencode-ai/ui/icon"
 import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
 import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
+import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
 import { KeybindV2 } from "@opencode-ai/ui/v2/keybind-v2"
 import { MenuV2 } from "@opencode-ai/ui/v2/menu-v2"
 import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
@@ -43,6 +45,8 @@ import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Select } from "@opencode-ai/ui/select"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { ModelSelectorPopover, ModelSelectorPopoverV2 } from "@/components/dialog-select-model"
+import { DialogSelectModelUnpaid } from "@/components/dialog-select-model-unpaid"
+import { DialogSelectModelUnpaidV2 } from "@/components/dialog-select-model-unpaid-v2"
 import { useCommand } from "@/context/command"
 import { Persist, persisted } from "@/utils/persist"
 import { usePermission } from "@/context/permission"
@@ -520,7 +524,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {

  const setMode = (mode: "normal" | "shell") => {
    setStore("mode", mode)
-    setStore("popover", null)
+    setStore({ popover: null, slashMenu: false, slashMenuQuery: "" })
    requestAnimationFrame(() => editorRef?.focus())
  }

@@ -554,7 +558,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
    },
  ])

-  const closePopover = () => setStore("popover", null)
+  const closePopover = () => setStore({ popover: null, slashMenu: false, slashMenuQuery: "" })

  const resetHistoryNavigation = (force = false) => {
    if (!force && (store.historyIndex < 0 || store.applyingHistory)) return
@@ -800,17 +804,30 @@ export const PromptInput: Component<PromptInputProps> = (props) => {

  const handleSlashSelect = (cmd: SlashCommand | undefined) => {
    if (!cmd) return
+    const menu = store.slashMenu
    closePopover()
    const images = imageAttachments()

    if (cmd.type === "custom") {
      const text = `/${cmd.trigger} `
+      if (menu) {
+        editorRef.focus()
+        setCursorPosition(editorRef, 0)
+        addPart({ type: "text", content: text, start: 0, end: text.length })
+        focusEditorEnd()
+        return
+      }
      setEditorText(text)
      prompt.set([{ type: "text", content: text, start: 0, end: text.length }, ...images], text.length)
      focusEditorEnd()
      return
    }

+    if (menu) {
+      command.trigger(cmd.id, "slash")
+      return
+    }
+
    clearEditor()
    prompt.set([...DEFAULT_PROMPT, ...images], 0)
    command.trigger(cmd.id, "slash")
@@ -1072,10 +1089,10 @@ export const PromptInput: Component<PromptInputProps> = (props) => {

      if (atMatch) {
        atOnInput(atMatch[1])
-        setStore("popover", "at")
+        setStore({ popover: "at", slashMenu: false, slashMenuQuery: "" })
      } else if (slashMatch) {
        slashOnInput(slashMatch[1])
-        setStore("popover", "slash")
+        setStore({ popover: "slash", slashMenu: false, slashMenuQuery: "" })
      } else {
        closePopover()
      }
@@ -1171,6 +1188,28 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
    return true
  }

+  const openCommands = () => {
+    const populated = prompt.dirty() || commentCount() > 0
+    requestAnimationFrame(() => {
+      if (!populated) {
+        if (!addPart({ type: "text", content: "/", start: 0, end: 0 })) return
+        slashOnInput("")
+        setStore({ popover: "slash", slashMenu: false, slashMenuQuery: "" })
+        return
+      }
+      slashOnInput("")
+      setStore({ popover: "slash", slashMenu: true, slashMenuQuery: "" })
+    })
+  }
+
+  const openContext = () => {
+    requestAnimationFrame(() => {
+      if (!addPart({ type: "text", content: "@", start: 0, end: 0 })) return
+      atOnInput("")
+      setStore({ popover: "at", slashMenu: false, slashMenuQuery: "" })
+    })
+  }
+
  const addToHistory = (prompt: Prompt, mode: "normal" | "shell") => {
    history.add(prompt, mode, mode === "shell" ? [] : historyComments())
  }
@@ -1199,7 +1238,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
        }

        setStore("mode", "normal")
-        setStore("popover", null)
+        closePopover()
        setStore("historyIndex", -1)
        setStore("savedPrompt", null)
        prompt.set(edit.prompt, promptLength(edit.prompt))
@@ -1286,13 +1325,17 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
        resetHistoryNavigation(true)
      },
      setMode: (mode) => setStore("mode", mode),
-      setPopover: (popover) => setStore("popover", popover),
+      setPopover: (popover) => {
+        if (!popover) return closePopover()
+        setStore({ popover, slashMenu: false, slashMenuQuery: "" })
+      },
      newSessionWorktree: () => props.newSessionWorktree,
      onNewSessionWorktreeReset: props.onNewSessionWorktreeReset,
      shouldQueue: props.shouldQueue,
      onQueue: props.onQueue,
      onAbort: props.onAbort,
      onSubmit: props.onSubmit,
+      model: props.controls.model.selection,
    })

  const handleKeyDown = (event: KeyboardEvent) => {
@@ -1325,7 +1368,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
      const cursorPosition = getCursorPosition(editorRef)
      if (cursorPosition === 0) {
        setStore("mode", "shell")
-        setStore("popover", null)
+        closePopover()
        event.preventDefault()
        return
      }
@@ -1460,6 +1503,29 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
    }
  }

+  const handleSlashMenuKeyDown = (event: KeyboardEvent) => {
+    if (event.key === "Escape") {
+      closePopover()
+      requestAnimationFrame(() => editorRef.focus())
+      event.preventDefault()
+      return
+    }
+
+    if (event.key === "Tab") {
+      selectPopoverActive()
+      event.preventDefault()
+      return
+    }
+
+    const ctrl = event.ctrlKey && !event.metaKey && !event.altKey && !event.shiftKey
+    const nav = event.key === "ArrowUp" || event.key === "ArrowDown" || event.key === "Enter"
+    const ctrlNav = ctrl && (event.key === "n" || event.key === "p")
+    if (!nav && !ctrlNav) return
+    slashOnKeyDown(event)
+    if (event.key === "ArrowUp" || event.key === "ArrowDown" || ctrlNav) scrollSlashActiveIntoView()
+    event.preventDefault()
+  }
+
  const agentsLoading = () => props.controls.agents.loading
  const agentsShouldFadeIn = createMemo<boolean>((prev) => prev ?? agentsLoading())
  const providersLoading = () => props.controls.model.loading
@@ -1488,9 +1554,11 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
    style: control(),
    onClose: restoreFocus,
    onUnpaidClick: () => {
-      void import("@/components/dialog-select-model-unpaid").then((x) => {
-        dialog.show(() => <x.DialogSelectModelUnpaid model={props.controls.model.selection} />)
-      })
+      if (props.controls.newLayoutDesigns) {
+        dialog.show(() => <DialogSelectModelUnpaidV2 model={props.controls.model.selection} />)
+        return
+      }
+      dialog.show(() => <DialogSelectModelUnpaid model={props.controls.model.selection} />)
    },
  }))

@@ -1527,6 +1595,13 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
        slashActive={slashActive() ?? undefined}
        setSlashActive={setSlashActive}
        onSlashSelect={handleSlashSelect}
+        slashMenu={store.slashMenu}
+        slashMenuQuery={store.slashMenuQuery}
+        onSlashMenuInput={(value) => {
+          setStore("slashMenuQuery", value)
+          slashOnInput(value)
+        }}
+        onSlashMenuKeyDown={handleSlashMenuKeyDown}
        commandKeybind={command.keybind}
        commandKeybindParts={command.keybindParts}
        newLayoutDesigns={props.controls.newLayoutDesigns}
@@ -1625,23 +1700,42 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                    placement="top"
                    value={
                      <>
-                        {language.t("prompt.action.attachFile")}
+                        {language.t("prompt.menu.addImagesAndFiles")}
                        <KeybindV2 keys={command.keybindParts("file.attach")} variant="neutral" />
                      </>
                    }
                  >
-                    <IconButton
-                      data-action="prompt-attach"
-                      type="button"
-                      icon="plus"
-                      variant="ghost"
-                      class="size-7 rounded-md p-[6px] text-v2-icon-icon-muted"
-                      style={buttons()}
-                      onClick={pick}
-                      disabled={store.mode !== "normal"}
-                      tabIndex={store.mode === "normal" ? undefined : -1}
-                      aria-label={language.t("prompt.action.attachFile")}
-                    />
+                    <MenuV2 gutter={6} modal={false} placement="top-start">
+                      <MenuV2.Trigger
+                        as={IconButtonV2}
+                        data-action="prompt-attach"
+                        type="button"
+                        icon={<IconV2 name="plus" />}
+                        variant="ghost-muted"
+                        size="large"
+                        style={buttons()}
+                        disabled={store.mode !== "normal"}
+                        tabIndex={store.mode === "normal" ? undefined : -1}
+                        aria-label={language.t("prompt.menu.addImagesAndFiles")}
+                      />
+                      <MenuV2.Portal>
+                        <MenuV2.Content style={{ "min-width": "180px" }}>
+                          <MenuV2.Item onSelect={pick} shortcut={command.keybind("file.attach")}>
+                            {language.t("prompt.menu.imagesAndFiles")}
+                          </MenuV2.Item>
+                          <MenuV2.Separator />
+                          <MenuV2.Item onSelect={openCommands} shortcut="/">
+                            {language.t("prompt.menu.commands")}
+                          </MenuV2.Item>
+                          <MenuV2.Item onSelect={openContext} shortcut="@">
+                            {language.t("prompt.menu.context")}
+                          </MenuV2.Item>
+                          <MenuV2.Item onSelect={() => setMode("shell")} shortcut="!">
+                            {language.t("prompt.menu.shellCommand")}
+                          </MenuV2.Item>
+                        </MenuV2.Content>
+                      </MenuV2.Portal>
+                    </MenuV2>
                  </TooltipV2>
                  <Show when={showAgentControl()}>
                    <ComposerAgentControl state={agentControlState()} />
@@ -1682,7 +1776,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                            class="max-w-[160px] justify-start capitalize"
                            style={control()}
                          >
-                            <span class="truncate">
+                            <span class="truncate leading-5">
                              {props.controls.model.selection.variant.current() ?? language.t("common.default")}
                            </span>
                            <span class="-ml-0.5 -mr-1 flex shrink-0">
@@ -1969,11 +2063,9 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                                  class="min-w-0 max-w-[320px] text-13-regular text-text-base group"
                                  style={control()}
                                  onClick={() => {
-                                    void import("@/components/dialog-select-model-unpaid").then((x) => {
-                                      dialog.show(() => (
-                                        <x.DialogSelectModelUnpaid model={props.controls.model.selection} />
-                                      ))
-                                    })
+                                    dialog.show(() => (
+                                      <DialogSelectModelUnpaid model={props.controls.model.selection} />
+                                    ))
                                  }}
                                >
                                  <Show when={props.controls.model.selection.current()?.provider?.id}>
@@ -2140,30 +2232,47 @@ function ComposerModelControl(props: { state: ComposerModelControlState }) {
              </>
            }
          >
-            <Button
-              data-action="prompt-model"
-              as="div"
-              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}
+            <Show
+              when={props.state.newLayoutDesigns}
+              fallback={
+                <Button
+                  data-action="prompt-model"
+                  as="div"
+                  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}
+                >
+                  <Show when={props.state.providerID}>
+                    {(providerID) => (
+                      <ProviderIcon
+                        id={providerID()}
+                        class="size-4 shrink-0 opacity-40 group-hover:opacity-100 transition-opacity duration-150"
+                        style={{ "will-change": "opacity", transform: "translateZ(0)" }}
+                      />
+                    )}
+                  </Show>
+                  <span class="truncate">{props.state.modelName}</span>
+                  <span class="-ml-1 shrink-0 flex size-fit">
+                    <Icon name="chevron-down" size="small" class="text-v2-icon-icon-muted" />
+                  </span>
+                </Button>
+              }
            >
-              <Show when={props.state.providerID}>
-                {(providerID) => (
-                  <ProviderIcon
-                    id={providerID()}
-                    class="size-4 shrink-0 opacity-40 group-hover:opacity-100 transition-opacity duration-150"
-                    style={{ "will-change": "opacity", transform: "translateZ(0)" }}
-                  />
-                )}
-              </Show>
-              <span class="truncate">{props.state.modelName}</span>
-              <span class="-ml-1 shrink-0 flex size-fit">
-                <Icon name="chevron-down" size="small" class="text-v2-icon-icon-muted" />
-              </span>
-            </Button>
+              <ButtonV2
+                data-action="prompt-model"
+                variant="ghost-muted"
+                size="normal"
+                class="min-w-0 max-w-[220px] justify-start ![font-weight:440] group"
+                classList={{ "animate-in fade-in": props.state.shouldAnimate }}
+                style={props.state.style}
+                onClick={props.state.onUnpaidClick}
+              >
+                <ModelControlContent state={props.state} v2 />
+              </ButtonV2>
+            </Show>
          </TooltipV2>
        }
      >
@@ -41,6 +41,10 @@ type PromptPopoverProps = {
  slashActive?: string
  setSlashActive: (id: string) => void
  onSlashSelect: (item: SlashCommand) => void
+  slashMenu: boolean
+  slashMenuQuery: string
+  onSlashMenuInput: (value: string) => void
+  onSlashMenuKeyDown: (event: KeyboardEvent) => void
  commandKeybind: (id: string) => string | undefined
  commandKeybindParts: (id: string) => string[]
  newLayoutDesigns: boolean
@@ -254,6 +258,20 @@ export const PromptPopover: Component<PromptPopoverProps> = (props) => {
            </Show>
          </Match>
          <Match when={props.popover === "slash"}>
+            <Show when={props.slashMenu}>
+              <div class="px-2 py-1">
+                <input
+                  ref={(el) => requestAnimationFrame(() => el.focus())}
+                  value={props.slashMenuQuery}
+                  onInput={(event) => props.onSlashMenuInput(event.currentTarget.value)}
+                  onKeyDown={props.onSlashMenuKeyDown}
+                  onMouseDown={(event) => event.stopPropagation()}
+                  aria-label={props.t("prompt.menu.commands")}
+                  placeholder="/"
+                  class="w-full bg-transparent outline-none text-[13px] leading-5 text-v2-text-text-base placeholder:text-v2-text-text-faint"
+                />
+              </div>
+            </Show>
            <Show
              when={props.slashFlat.length > 0}
              fallback={
@@ -1,5 +1,6 @@
 import { beforeAll, beforeEach, describe, expect, mock, test } from "bun:test"
 import type { Prompt } from "@/context/prompt"
+import type { ModelSelection } from "@/context/local"

 let createPromptSubmit: typeof import("./submit").createPromptSubmit

@@ -33,6 +34,10 @@ const prompt = {
  current: () => promptValue,
  cursor: () => 0,
  dirty: () => true,
+  model: {
+    current: () => undefined,
+    set: () => undefined,
+  },
  reset: () => undefined,
  set: () => undefined,
  context: {
@@ -378,6 +383,39 @@ describe("prompt submit worktree selection", () => {
    })
  })

+  test("uses an injected model selection", async () => {
+    params = { id: "session-1" }
+    const model = {
+      current: () => ({ id: "draft-model", provider: { id: "draft-provider" } }),
+      variant: { current: () => "draft-variant" },
+    } as unknown as ModelSelection
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => ({ id: "session-1" }),
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "normal",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      model,
+    })
+
+    await submit.handleSubmit({ preventDefault: () => undefined } as unknown as Event)
+
+    expect(optimistic[0]).toMatchObject({
+      message: {
+        model: { providerID: "draft-provider", modelID: "draft-model", variant: "draft-variant" },
+      },
+    })
+  })
+
  test("seeds new sessions before optimistic prompts are added", async () => {
    const submit = createPromptSubmit({
      prompt,
@@ -3,12 +3,12 @@ import { showToast } from "@/utils/toast"
 import { base64Encode } from "@opencode-ai/core/util/encode"
 import { Binary } from "@opencode-ai/core/util/binary"
 import { useNavigate, useParams, useSearchParams } from "@solidjs/router"
-import { batch, type Accessor } from "solid-js"
+import { batch, startTransition, type Accessor } from "solid-js"
 import { useTabs } from "@/context/tabs"
 import { useServerSync, type ServerSync } from "@/context/server-sync"
 import { useLanguage } from "@/context/language"
 import { useLayout } from "@/context/layout"
-import { useLocal } from "@/context/local"
+import { useLocal, type ModelSelection } from "@/context/local"
 import { usePermission } from "@/context/permission"
 import { type ContextItem, type ImageAttachmentPart, type Prompt, type usePrompt } from "@/context/prompt"
 import { useSDK, type DirectorySDK } from "@/context/sdk"
@@ -191,6 +191,7 @@ type PromptSubmitInput = {
  onQueue?: (draft: FollowupDraft) => void
  onAbort?: () => void
  onSubmit?: () => void
+  model?: ModelSelection
 }

 export function createPromptSubmit(input: PromptSubmitInput) {
@@ -298,9 +299,10 @@ export function createPromptSubmit(input: PromptSubmitInput) {
      return
    }

-    const currentModel = local.model.current()
+    const modelSelection = input.model ?? local.model
+    const currentModel = modelSelection.current()
    const currentAgent = local.agent.current()
-    const variant = local.model.variant.current()
+    const variant = modelSelection.variant.current()
    if (!currentModel || !currentAgent) {
      showToast({
        title: language.t("prompt.toast.modelAgentRequired.title"),
@@ -374,13 +376,20 @@ export function createPromptSubmit(input: PromptSubmitInput) {
      if (created) {
        seed(sessionDirectory, created)
        session = created
-        if (shouldAutoAccept) permission.enableAutoAccept(session.id, sessionDirectory)
-        local.session.promote(sessionDirectory, session.id)
-        layout.handoff.setTabs(base64Encode(sessionDirectory), session.id)
-        const draftID = search.draftId
-        if (draftID) tabs.promoteDraft(draftID, { server: tabs.draft(draftID).server, sessionId: session.id })
-        else navigate(`/${base64Encode(sessionDirectory)}/session/${session.id}`)
-        submission.retarget(prompt.capture({ dir: base64Encode(sessionDirectory), id: session.id }))
+        await startTransition(() => {
+          if (!session) return
+          if (shouldAutoAccept) permission.enableAutoAccept(session.id, sessionDirectory)
+          local.session.promote(sessionDirectory, session.id, {
+            agent: currentAgent.name,
+            model: { providerID: currentModel.provider.id, modelID: currentModel.id },
+            variant: variant ?? null,
+          })
+          layout.handoff.setTabs(base64Encode(sessionDirectory), session.id)
+          const draftID = search.draftId
+          if (draftID) tabs.promoteDraft(draftID, { server: tabs.draft(draftID).server, sessionId: session.id })
+          else navigate(`/${base64Encode(sessionDirectory)}/session/${session.id}`)
+          submission.retarget(prompt.capture({ dir: base64Encode(sessionDirectory), id: session.id }))
+        })
      }
    }
    if (!session) {
@@ -4,6 +4,8 @@ import type { PromptHistoryEntry } from "./history"

 export type PromptInputTransientState = {
  popover: "at" | "slash" | null
+  slashMenu: boolean
+  slashMenuQuery: string
  historyIndex: number
  savedPrompt: PromptHistoryEntry | null
  placeholder: number
@@ -16,6 +18,8 @@ export type PromptInputTransientState = {
 function resetPromptInputTransientState(setStore: SetStoreFunction<PromptInputTransientState>) {
  setStore({
    popover: null,
+    slashMenu: false,
+    slashMenuQuery: "",
    historyIndex: -1,
    savedPrompt: null,
    draggingType: null,
@@ -28,6 +32,8 @@ function resetPromptInputTransientState(setStore: SetStoreFunction<PromptInputTr
 export function createPromptInputTransientState(identity: Accessor<unknown>, placeholder: number) {
  const [store, setStore] = createStore<PromptInputTransientState>({
    popover: null,
+    slashMenu: false,
+    slashMenuQuery: "",
    historyIndex: -1,
    savedPrompt: null,
    placeholder,
@@ -4,6 +4,7 @@ import { ProgressCircleV2 } from "@opencode-ai/ui/v2/progress-circle-v2"
 import { Button } from "@opencode-ai/ui/button"
 import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
 import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
+import { createMediaQuery } from "@solid-primitives/media"

 import { useFile } from "@/context/file"
 import { useLayout } from "@/context/layout"
@@ -11,9 +12,10 @@ import { useSync } from "@/context/sync"
 import { useLanguage } from "@/context/language"
 import { useProviders } from "@/hooks/use-providers"
 import { useSDK } from "@/context/sdk"
-import { getSessionContext, getSessionTokenTotal } from "@/components/session/session-context-metrics"
+import { getSessionContext } from "@/components/session/session-context-metrics"
 import { useSessionLayout } from "@/pages/session/session-layout"
 import { createSessionTabs } from "@/pages/session/helpers"
+import { useSettings } from "@/context/settings"

 interface SessionContextUsageProps {
  variant?: "button" | "indicator"
@@ -47,8 +49,10 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
  const layout = useLayout()
  const language = useLanguage()
  const sdk = useSDK()
+  const settings = useSettings()
  const providers = useProviders(() => sdk().directory)
  const { params, tabs, view } = useSessionLayout()
+  const isDesktop = createMediaQuery("(min-width: 768px)")

  const variant = createMemo(() => props.variant ?? "button")
  const buttonAppearance = createMemo(() => props.buttonAppearance ?? "default")
@@ -56,6 +60,7 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
    tabs,
    pathFromTab: file.pathFromTab,
    normalizeTab: (tab) => (tab.startsWith("file://") ? file.tab(tab) : tab),
+    fileBrowser: () => settings.general.newLayoutDesigns() && isDesktop() && !!params.id,
  })
  const messages = createMemo(() => (params.id ? (sync().data.message[params.id] ?? []) : []))
  const info = createMemo(() => (params.id ? sync().session.get(params.id) : undefined))
@@ -69,7 +74,6 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
  )

  const context = createMemo(() => getSessionContext(messages(), [...providers.all().values()]))
-  const tokens = createMemo(() => info()?.tokens)
  const cost = createMemo(() => {
    return usd().format(info()?.cost ?? 0)
  })
@@ -127,7 +131,7 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
      <ContextTooltipRow name={language.t("context.usage.usage")} value={`${context()?.usage ?? 0}%`} />
      <ContextTooltipRow
        name={language.t("context.usage.tokens")}
-        value={getSessionTokenTotal(tokens())?.toLocaleString(language.intl()) ?? "0"}
+        value={context()?.total.toLocaleString(language.intl()) ?? "0"}
      />
    </div>
  )
@@ -1,6 +1,6 @@
 import { describe, expect, test } from "bun:test"
 import type { Message } from "@opencode-ai/sdk/v2/client"
-import { getSessionContext, getSessionTokenTotal } from "./session-context-metrics"
+import { getSessionContext } from "./session-context-metrics"

 const assistant = (
  id: string,
@@ -38,10 +38,10 @@ const user = (id: string) => {
 }

 describe("getSessionContext", () => {
-  test("computes usage from latest assistant with tokens", () => {
+  test("computes token totals and usage from latest assistant with tokens", () => {
    const messages = [
      user("u1"),
-      assistant("a1", { input: 0, output: 0, reasoning: 0, read: 0, write: 0 }, 0.5),
+      assistant("a1", { input: 600, output: 200, reasoning: 100, read: 50, write: 50 }, 0.5),
      assistant("a2", { input: 300, output: 100, reasoning: 50, read: 25, write: 25 }, 1.25),
    ]
    const providers = [
@@ -60,6 +60,8 @@ describe("getSessionContext", () => {
    const ctx = getSessionContext(messages, providers)

    expect(ctx?.message.id).toBe("a2")
+    expect(ctx?.total).toBe(500)
+    expect(ctx?.input).toBe(300)
    expect(ctx?.usage).toBe(50)
    expect(ctx?.providerLabel).toBe("OpenAI")
    expect(ctx?.modelLabel).toBe("GPT-4.1")
@@ -94,15 +96,4 @@ describe("getSessionContext", () => {

    expect(ctx).toBeUndefined()
  })
-
-  test("computes stored session token totals", () => {
-    expect(
-      getSessionTokenTotal({
-        input: 10,
-        output: 20,
-        reasoning: 30,
-        cache: { read: 40, write: 50 },
-      }),
-    ).toBe(150)
-  })
 })
@@ -1,4 +1,4 @@
-import type { AssistantMessage, Message, Session } from "@opencode-ai/sdk/v2/client"
+import type { AssistantMessage, Message } from "@opencode-ai/sdk/v2/client"

 type Provider = {
  id: string
@@ -21,6 +21,7 @@ type Context = {
  modelLabel: string
  limit: number | undefined
  input: number
+  total: number
  usage: number | null
 }

@@ -54,6 +55,7 @@ const build = (messages: Message[] = [], providers: Provider[] = []): Context |
    modelLabel: model?.name ?? message.modelID,
    limit,
    input: message.tokens.input,
+    total,
    usage: limit ? Math.round((total / limit) * 100) : null,
  }
 }
@@ -61,8 +63,3 @@ const build = (messages: Message[] = [], providers: Provider[] = []): Context |
 export function getSessionContext(messages: Message[] = [], providers: Provider[] = []) {
  return build(messages, providers)
 }
-
-export function getSessionTokenTotal(tokens: Session["tokens"] | undefined) {
-  if (!tokens) return undefined
-  return tokens.input + tokens.output + tokens.reasoning + tokens.cache.read + tokens.cache.write
-}
@@ -15,7 +15,7 @@ import { useLanguage } from "@/context/language"
 import { useProviders } from "@/hooks/use-providers"
 import { useSDK } from "@/context/sdk"
 import { useSessionLayout } from "@/pages/session/session-layout"
-import { getSessionContext, getSessionTokenTotal } from "./session-context-metrics"
+import { getSessionContext } from "./session-context-metrics"
 import { estimateSessionContextBreakdown, type SessionContextBreakdownKey } from "./session-context-breakdown"
 import { createSessionContextFormatter } from "./session-context-format"

@@ -135,7 +135,6 @@ export function SessionContextTab() {
  )

  const ctx = createMemo(() => getSessionContext(messages(), [...providers.all().values()]))
-  const tokens = createMemo(() => info()?.tokens)
  const formatter = createMemo(() => createSessionContextFormatter(language.intl()))

  const cost = createMemo(() => {
@@ -204,14 +203,15 @@ export function SessionContextTab() {
    { label: "context.stats.provider", value: providerLabel },
    { label: "context.stats.model", value: modelLabel },
    { label: "context.stats.limit", value: () => formatter().number(ctx()?.limit) },
-    { label: "context.stats.totalTokens", value: () => formatter().number(getSessionTokenTotal(tokens())) },
+    { label: "context.stats.totalTokens", value: () => formatter().number(ctx()?.total) },
    { label: "context.stats.usage", value: () => formatter().percent(ctx()?.usage) },
-    { label: "context.stats.inputTokens", value: () => formatter().number(tokens()?.input) },
-    { label: "context.stats.outputTokens", value: () => formatter().number(tokens()?.output) },
-    { label: "context.stats.reasoningTokens", value: () => formatter().number(tokens()?.reasoning) },
+    { label: "context.stats.inputTokens", value: () => formatter().number(ctx()?.input) },
+    { label: "context.stats.outputTokens", value: () => formatter().number(ctx()?.message.tokens.output) },
+    { label: "context.stats.reasoningTokens", value: () => formatter().number(ctx()?.message.tokens.reasoning) },
    {
      label: "context.stats.cacheTokens",
-      value: () => `${formatter().number(tokens()?.cache.read)} / ${formatter().number(tokens()?.cache.write)}`,
+      value: () =>
+        `${formatter().number(ctx()?.message.tokens.cache.read)} / ${formatter().number(ctx()?.message.tokens.cache.write)}`,
    },
    { label: "context.stats.userMessages", value: () => counts().user.toLocaleString(language.intl()) },
    { label: "context.stats.assistantMessages", value: () => counts().assistant.toLocaleString(language.intl()) },
@@ -24,6 +24,7 @@ import { focusTerminalById } from "@/pages/session/helpers"
 import { useSessionLayout } from "@/pages/session/session-layout"
 import { messageAgentColor } from "@/utils/agent"
 import { decode64 } from "@/utils/base64"
+import { fileManagerApp } from "@/utils/file-manager"
 import { Persist, persisted } from "@/utils/persist"
 import { StatusPopover, StatusPopoverV2 } from "../status-popover"
 import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
@@ -175,11 +176,7 @@ export function SessionHeader() {
    return LINUX_APPS
  })

-  const fileManager = createMemo(() => {
-    if (os() === "macos") return { label: "session.header.open.finder", icon: "finder" as const }
-    if (os() === "windows") return { label: "session.header.open.fileExplorer", icon: "file-explorer" as const }
-    return { label: "session.header.open.fileManager", icon: "finder" as const }
-  })
+  const fileManager = createMemo(() => fileManagerApp(os()))

  createEffect(() => {
    if (platform.platform !== "desktop") return
@@ -10,7 +10,7 @@ import { useFile } from "@/context/file"
 import { useLanguage } from "@/context/language"
 import { useCommand } from "@/context/command"

-export function FileVisual(props: { path: string; active?: boolean }): JSX.Element {
+export function FileVisual(props: { path: string; active?: boolean; temporary?: boolean }): JSX.Element {
  return (
    <div class="flex items-center gap-x-1.5 min-w-0">
      <Show
@@ -22,12 +22,19 @@ export function FileVisual(props: { path: string; active?: boolean }): JSX.Eleme
          <FileIcon node={{ path: props.path, type: "file" }} mono class="absolute inset-0 size-4 tab-fileicon-mono" />
        </span>
      </Show>
-      <span class="text-14-medium truncate">{getFilename(props.path)}</span>
+      <span class="text-14-medium truncate" classList={{ italic: props.temporary }}>
+        {getFilename(props.path)}
+      </span>
    </div>
  )
 }

-export function SortableTab(props: { tab: string; onTabClose: (tab: string) => void }): JSX.Element {
+export function SortableTab(props: {
+  tab: string
+  temporary?: boolean
+  onTabClose: (tab: string) => void
+  onTabDoubleClick?: (tab: string) => void
+}): JSX.Element {
  const file = useFile()
  const language = useLanguage()
  const command = useCommand()
@@ -36,7 +43,7 @@ export function SortableTab(props: { tab: string; onTabClose: (tab: string) => v
  const content = createMemo(() => {
    const value = path()
    if (!value) return
-    return <FileVisual path={value} />
+    return <FileVisual path={value} temporary={props.temporary} />
  })
  return (
    <div use:sortable class="h-full flex items-center" classList={{ "opacity-0": sortable.isActiveDraggable }}>
@@ -61,6 +68,7 @@ export function SortableTab(props: { tab: string; onTabClose: (tab: string) => v
          }
          hideCloseButton
          onMiddleClick={() => props.onTabClose(props.tab)}
+          onDblClick={() => props.onTabDoubleClick?.(props.tab)}
        >
          <Show when={content()}>{(value) => value()}</Show>
        </Tabs.Trigger>
@@ -211,7 +211,17 @@ export function SortableTerminalTabV2(props: {
          <MenuV2.Context.Trigger class="relative" as="div">
            <Tabs.Trigger
              value={props.terminal.id}
-              onClick={focus}
+              onMouseDown={(e) => {
+                // Switch on mousedown to shave the press-release delay off tab switches.
+                if (e.button !== 0) return
+                if (store.editing) return
+                focus()
+              }}
+              onClick={(e) => {
+                // Mouse navigation already happened on mousedown; detail 0 means keyboard activation.
+                if (e.detail > 0) return
+                focus()
+              }}
              closeButton={
                <IconButton
                  icon="close-small"
@@ -4,7 +4,7 @@ import { useCommand } from "@/context/command"
 import { useLanguage } from "@/context/language"
 import { useDialog } from "@opencode-ai/ui/context/dialog"

-export function useSettingsDialog() {
+export function useSettingsDialog(defaultValue?: string) {
  const dialog = useDialog()
  const params = useParams<{ id?: string }>()
  let run = 0
@@ -19,7 +19,7 @@ export function useSettingsDialog() {
    const sessionID = params.id
    void import("@/components/settings-v2").then((module) => {
      if (dead || run !== current) return
-      void dialog.show(() => <module.DialogSettings sessionID={sessionID} />)
+      void dialog.show(() => <module.DialogSettings sessionID={sessionID} defaultValue={defaultValue} />)
    })
  }
 }
@@ -20,6 +20,11 @@
  height: 100%;
  overflow-y: auto;
  scrollbar-width: none;
+  user-select: none;
+}
+
+.settings-v2-panel :is(input, textarea, [contenteditable="true"]) {
+  user-select: text;
 }

 .settings-v2-panel::-webkit-scrollbar {
@@ -181,6 +186,7 @@
  flex-direction: column;
  gap: 8px;
  padding: 4px 0 4px 4px;
+  user-select: none;
 }

 .settings-v2-nav-footer > span {
@@ -1,7 +1,8 @@
 import { withAlpha } from "@opencode-ai/ui/theme/color"
 import { useTheme } from "@opencode-ai/ui/theme/context"
 import { resolveThemeVariant } from "@opencode-ai/ui/theme/resolve"
-import type { HexColor } from "@opencode-ai/ui/theme/types"
+import { resolveThemeVariantV2 } from "@opencode-ai/ui/theme/v2/resolve"
+import type { HexColor, ResolvedV2Theme } from "@opencode-ai/ui/theme/types"
 import { showToast } from "@/utils/toast"
 import type { FitAddon, Ghostty, Terminal as Term } from "ghostty-web"
 import { type ComponentProps, createEffect, createMemo, onCleanup, onMount, splitProps } from "solid-js"
@@ -68,6 +69,19 @@ const debugTerminal = (...values: unknown[]) => {
  console.debug("[terminal]", ...values)
 }

+const resolveV2Token = (tokens: ResolvedV2Theme, key: string) => {
+  let current = tokens[key]
+  for (let i = 0; i < 8 && current; i++) {
+    const match = /^var\(--([^)]+)\)$/.exec(current.trim())
+    if (!match) {
+      const hex = current.trim()
+      if (/^#[0-9a-fA-F]{8}$/.test(hex)) return hex.slice(0, 7)
+      return hex
+    }
+    current = tokens[match[1]]
+  }
+}
+
 const useTerminalUiBindings = (input: {
  container: HTMLDivElement
  term: Term
@@ -238,7 +252,10 @@ export const Terminal = (props: TerminalProps) => {
    if (!variant?.seeds && !variant?.palette) return fallback
    const resolved = resolveThemeVariant(variant, mode === "dark")
    const text = resolved["text-stronger"] ?? fallback.foreground
-    const background = resolved["background-stronger"] ?? fallback.background
+    const background = settings.general.newLayoutDesigns()
+      ? (resolveV2Token(resolveThemeVariantV2(variant, mode === "dark"), "v2-background-bg-base") ??
+        fallback.background)
+      : (resolved["background-stronger"] ?? fallback.background)
    const alpha = mode === "dark" ? 0.25 : 0.2
    const base = text.startsWith("#") ? (text as HexColor) : (fallback.foreground as HexColor)
    const selectionBackground = withAlpha(base, alpha)
@@ -25,6 +25,7 @@ import { readSessionTabsRemovedDetail, SESSION_TABS_REMOVED_EVENT } from "@/comp
 import { useGlobal } from "@/context/global"
 import { ServerConnection, useServer } from "@/context/server"
 import { tabKey, useTabs } from "@/context/tabs"
+import type { PromptSession } from "@/context/prompt"
 import "./titlebar.css"
 import { newTabTooltipKeybind } from "./command-tooltip-keybind"

@@ -324,13 +325,20 @@ export function Titlebar(props: { update?: TitlebarUpdate }) {
              const route = layout.route()
              const activeSession = session()
              if (route.type === "session" && activeSession) {
-                tabs.newDraft({ server: route.server ?? server.key, directory: activeSession.directory }, "")
+                const sessionTab = {
+                  type: "session" as const,
+                  server: route.server ?? server.key,
+                  sessionId: activeSession.id,
+                }
+                const model = tabs.stateValue<PromptSession>(sessionTab, "prompt")?.model.current()
+                tabs.newDraft({ server: sessionTab.server, directory: activeSession.directory }, "", model)
                return
              }

              const activeTab = currentTab()
              if (activeTab?.type === "draft") {
-                tabs.newDraft({ server: activeTab.server, directory: activeTab.directory }, "")
+                const model = tabs.stateValue<PromptSession>(activeTab, "prompt")?.model.current()
+                tabs.newDraft({ server: activeTab.server, directory: activeTab.directory }, "", model)
                return
              }

@@ -0,0 +1,119 @@
+/**
+ * Taken from https://www.solid-ui.com/docs/components/drawer
+ * Only used in one place hence not a v2 component yet... can be promoted to ui/v2 later
+ */
+
+import type { Component, ComponentProps, JSX, ValidComponent } from "solid-js"
+import { splitProps } from "solid-js"
+import type { ContentProps, DescriptionProps, DynamicProps, LabelProps, OverlayProps } from "@corvu/drawer"
+import DrawerPrimitive from "@corvu/drawer"
+
+const Drawer = DrawerPrimitive
+
+const DrawerTrigger = DrawerPrimitive.Trigger
+
+const DrawerPortal = DrawerPrimitive.Portal
+
+const DrawerClose = DrawerPrimitive.Close
+
+type DrawerOverlayProps<T extends ValidComponent = "div"> = OverlayProps<T> & { class?: string }
+
+const DrawerOverlay = <T extends ValidComponent = "div">(props: DynamicProps<T, DrawerOverlayProps<T>>) => {
+  const [, rest] = splitProps(props as DrawerOverlayProps, ["class"])
+  const drawerContext = DrawerPrimitive.useContext()
+  const overlayStyle = () => {
+    const state = drawerContext.transitionState()
+    if (state === "opening" || state === "closing") return undefined
+    const open = drawerContext.openPercentage()
+    return {
+      opacity: open,
+      "backdrop-filter": `blur(${4 * open}px)`,
+    }
+  }
+  return (
+    <DrawerPrimitive.Overlay
+      class={props.class}
+      classList={{
+        "fixed inset-0 z-[100] bg-v2-overlay-simple-overlay-scrim opacity-0 backdrop-blur-none transition-[opacity,backdrop-filter] duration-300 data-[opening]:opacity-100 data-[opening]:backdrop-blur-[4px] data-[closing]:opacity-0 data-[closing]:backdrop-blur-none": true,
+      }}
+      style={overlayStyle()}
+      {...rest}
+    />
+  )
+}
+
+type DrawerContentProps<T extends ValidComponent = "div"> = ContentProps<T> & {
+  class?: string
+  children?: JSX.Element
+}
+
+const DrawerContent = <T extends ValidComponent = "div">(props: DynamicProps<T, DrawerContentProps<T>>) => {
+  const [, rest] = splitProps(props as DrawerContentProps, ["class", "children"])
+  return (
+    <DrawerPortal>
+      <DrawerOverlay />
+      <DrawerPrimitive.Content
+        class={props.class}
+        classList={{
+          "group/drawer-content fixed inset-y-[6px] right-[6px] left-auto z-[100] flex h-auto max-h-[calc(100vh-12px)] w-[560px] max-w-[calc(100vw-12px)] flex-col items-start rounded-[8px] bg-v2-background-bg-base p-0 shadow-[var(--v2-elevation-overlay)] data-[transitioning]:transition-transform data-[transitioning]:duration-300 md:select-none": true,
+        }}
+        {...rest}
+      >
+        {props.children}
+      </DrawerPrimitive.Content>
+    </DrawerPortal>
+  )
+}
+
+const DrawerHeader: Component<ComponentProps<"div">> = (props) => {
+  const [, rest] = splitProps(props, ["class"])
+  return <div class={props.class} classList={{ "grid gap-1.5 p-4 text-center sm:text-left": true }} {...rest} />
+}
+
+const DrawerFooter: Component<ComponentProps<"div">> = (props) => {
+  const [, rest] = splitProps(props, ["class"])
+  return <div class={props.class} classList={{ "mt-auto flex flex-col gap-2 p-4": true }} {...rest} />
+}
+
+type DrawerTitleProps<T extends ValidComponent = "div"> = LabelProps<T> & { class?: string }
+
+const DrawerTitle = <T extends ValidComponent = "div">(props: DynamicProps<T, DrawerTitleProps<T>>) => {
+  const [, rest] = splitProps(props as DrawerTitleProps, ["class"])
+  return (
+    <DrawerPrimitive.Label
+      class={props.class}
+      classList={{ "text-base font-[530] leading-none tracking-[-0.04px] text-v2-text-text-base": true }}
+      {...rest}
+    />
+  )
+}
+
+type DrawerDescriptionProps<T extends ValidComponent = "div"> = DescriptionProps<T> & {
+  class?: string
+}
+
+const DrawerDescription = <T extends ValidComponent = "div">(props: DynamicProps<T, DrawerDescriptionProps<T>>) => {
+  const [, rest] = splitProps(props as DrawerDescriptionProps, ["class"])
+  return (
+    <DrawerPrimitive.Description
+      class={props.class}
+      classList={{
+        "text-[13px] font-[440] leading-[140%] tracking-[-0.04px] text-v2-text-text-muted": true,
+      }}
+      {...rest}
+    />
+  )
+}
+
+export {
+  Drawer,
+  DrawerPortal,
+  DrawerOverlay,
+  DrawerTrigger,
+  DrawerClose,
+  DrawerContent,
+  DrawerHeader,
+  DrawerFooter,
+  DrawerTitle,
+  DrawerDescription,
+}
@@ -203,12 +203,15 @@ export const { use: useFile, provider: FileProvider } = createSimpleContext({
      return promise
    }

-    const search = (query: string, dirs: "true" | "false") =>
+    const search = (query: string, dirs: "true" | "false", options?: { limit?: number; signal?: AbortSignal }) =>
      sdk()
-        .client.find.files({ query, dirs })
+        .client.find.files({ query, dirs, limit: options?.limit }, { signal: options?.signal })
        .then(
          (x) => (x.data ?? []).map(path.normalize),
-          () => [],
+          (error) => {
+            if (options?.signal?.aborted) throw error
+            return []
+          },
        )

    const stop = sdk().event.listen((e) => {
@@ -284,7 +287,8 @@ export const { use: useFile, provider: FileProvider } = createSimpleContext({
      setScrollLeft,
      selectedLines,
      setSelectedLines,
-      searchFiles: (query: string) => search(query, "false"),
+      searchFiles: (query: string, options?: { limit?: number; signal?: AbortSignal }) =>
+        search(query, "false", options),
      searchFilesAndDirectories: (query: string) => search(query, "true"),
    }
  },
@@ -0,0 +1,82 @@
+import { describe, expect, test } from "bun:test"
+import {
+  SESSION_OPEN_FILE_TAB,
+  closeSessionTab,
+  openSessionTab,
+  previewSessionTab,
+  type SessionTabState,
+} from "./layout-tabs"
+
+const state = (all: string[], active?: string, preview?: string): SessionTabState => ({
+  tabs: { all, active },
+  preview,
+})
+
+describe("previewSessionTab", () => {
+  test("appends the Open File placeholder", () => {
+    expect(previewSessionTab(state(["file://a.ts"], "file://a.ts"), SESSION_OPEN_FILE_TAB)).toEqual(
+      state(["file://a.ts", SESSION_OPEN_FILE_TAB], SESSION_OPEN_FILE_TAB, SESSION_OPEN_FILE_TAB),
+    )
+  })
+
+  test("replaces the current preview in place", () => {
+    expect(
+      previewSessionTab(
+        state(["context", SESSION_OPEN_FILE_TAB, "file://b.ts"], SESSION_OPEN_FILE_TAB, SESSION_OPEN_FILE_TAB),
+        "file://a.ts",
+      ),
+    ).toEqual(state(["context", "file://a.ts", "file://b.ts"], "file://a.ts", "file://a.ts"))
+  })
+
+  test("activates a durable tab without duplicating it", () => {
+    expect(
+      previewSessionTab(
+        state(["file://a.ts", SESSION_OPEN_FILE_TAB, "file://b.ts"], SESSION_OPEN_FILE_TAB, SESSION_OPEN_FILE_TAB),
+        "file://b.ts",
+      ),
+    ).toEqual(state(["file://a.ts", "file://b.ts"], "file://b.ts"))
+  })
+
+  test("replaces a restored Open File placeholder", () => {
+    expect(
+      previewSessionTab(state(["file://a.ts", SESSION_OPEN_FILE_TAB], SESSION_OPEN_FILE_TAB), "file://b.ts"),
+    ).toEqual(state(["file://a.ts", "file://b.ts"], "file://b.ts", "file://b.ts"))
+  })
+})
+
+describe("openSessionTab", () => {
+  test("pins the current preview", () => {
+    expect(openSessionTab(state(["file://a.ts"], "file://a.ts", "file://a.ts"), "file://a.ts")).toEqual(
+      state(["file://a.ts"], "file://a.ts"),
+    )
+  })
+
+  test("replaces a preview with a directly opened file", () => {
+    expect(openSessionTab(state(["file://a.ts"], "file://a.ts", "file://a.ts"), "file://b.ts")).toEqual(
+      state(["file://b.ts"], "file://b.ts"),
+    )
+  })
+
+  test("keeps the preview when switching to Review", () => {
+    expect(openSessionTab(state(["file://a.ts"], "file://a.ts", "file://a.ts"), "review")).toEqual(
+      state(["file://a.ts"], "review", "file://a.ts"),
+    )
+  })
+
+  test("replaces a restored Open File placeholder with a direct open", () => {
+    expect(openSessionTab(state(["file://a.ts", SESSION_OPEN_FILE_TAB], SESSION_OPEN_FILE_TAB), "file://b.ts")).toEqual(
+      state(["file://a.ts", "file://b.ts"], "file://b.ts"),
+    )
+  })
+})
+
+describe("closeSessionTab", () => {
+  test("clears preview metadata and selects the left neighbor", () => {
+    expect(
+      closeSessionTab(
+        state(["file://a.ts", "file://b.ts", "file://c.ts"], "file://b.ts", "file://b.ts"),
+        "file://b.ts",
+      ),
+    ).toEqual(state(["file://a.ts", "file://c.ts"], "file://a.ts"))
+  })
+})
@@ -0,0 +1,103 @@
+export const SESSION_OPEN_FILE_TAB = "open-file"
+
+export type SessionTabs = {
+  active?: string
+  all: string[]
+}
+
+export type SessionTabState = {
+  tabs: SessionTabs
+  preview?: string
+}
+
+const sessionTabPreview = (current: SessionTabState) =>
+  current.preview ?? (current.tabs.all.includes(SESSION_OPEN_FILE_TAB) ? SESSION_OPEN_FILE_TAB : undefined)
+
+export function previewSessionTab(current: SessionTabState, tab: string): SessionTabState {
+  const preview = sessionTabPreview(current)
+  const previewIndex = preview ? current.tabs.all.indexOf(preview) : -1
+  const existingIndex = current.tabs.all.indexOf(tab)
+
+  if (existingIndex !== -1) {
+    if (previewIndex === -1 || preview === tab) {
+      return { tabs: { all: current.tabs.all, active: tab }, preview: preview === tab ? tab : undefined }
+    }
+    return {
+      tabs: { all: current.tabs.all.filter((item) => item !== preview), active: tab },
+    }
+  }
+
+  if (previewIndex === -1) {
+    return { tabs: { all: [...current.tabs.all, tab], active: tab }, preview: tab }
+  }
+
+  return {
+    tabs: {
+      all: current.tabs.all.map((item, index) => (index === previewIndex ? tab : item)),
+      active: tab,
+    },
+    preview: tab,
+  }
+}
+
+export function openSessionTab(current: SessionTabState, tab: string): SessionTabState {
+  const preview = sessionTabPreview(current)
+  if (tab === "review") {
+    return {
+      tabs: { all: current.tabs.all.filter((item) => item !== tab), active: tab },
+      preview,
+    }
+  }
+
+  if (tab === "context") {
+    return {
+      tabs: { all: [tab, ...current.tabs.all.filter((item) => item !== tab)], active: tab },
+      preview,
+    }
+  }
+
+  const previewIndex = preview ? current.tabs.all.indexOf(preview) : -1
+  const existingIndex = current.tabs.all.indexOf(tab)
+  if (existingIndex !== -1) {
+    if (previewIndex === -1 || preview === tab) {
+      return { tabs: { all: current.tabs.all, active: tab } }
+    }
+    return {
+      tabs: { all: current.tabs.all.filter((item) => item !== preview), active: tab },
+    }
+  }
+
+  if (previewIndex === -1) {
+    return { tabs: { all: [...current.tabs.all, tab], active: tab } }
+  }
+
+  return {
+    tabs: {
+      all: current.tabs.all.map((item, index) => (index === previewIndex ? tab : item)),
+      active: tab,
+    },
+  }
+}
+
+export function closeSessionTab(current: SessionTabState, tab: string): SessionTabState {
+  if (tab === "review") {
+    if (current.tabs.active !== tab) return current
+    return {
+      tabs: { all: current.tabs.all, active: current.tabs.all[0] },
+      preview: current.preview,
+    }
+  }
+
+  const all = current.tabs.all.filter((item) => item !== tab)
+  const preview = current.preview === tab ? undefined : current.preview
+  if (current.tabs.active !== tab) return { tabs: { ...current.tabs, all }, preview }
+
+  const index = current.tabs.all.indexOf(tab)
+  return {
+    tabs: {
+      all,
+      active: current.tabs.all[index - 1] ?? current.tabs.all[index + 1] ?? all[0],
+    },
+    preview,
+  }
+}
@@ -19,6 +19,7 @@ import { migrateLegacySessionStateKeys, ServerScope, SessionStateKey } from "@/u
 import { createSessionKeyReader, ensureSessionKey, pruneSessionKeys } from "./layout-helpers"
 import { requireServerKey } from "@/utils/session-route"
 import { type DraftTab, useTabs } from "./tabs"
+import { closeSessionTab, openSessionTab, previewSessionTab, type SessionTabs } from "./layout-tabs"

 export { createSessionKeyReader, ensureSessionKey, pruneSessionKeys }

@@ -55,14 +56,11 @@ export function getProjectAvatarVariant(key?: string): ProjectAvatarVariant {
  return "gray"
 }

-type SessionTabs = {
-  active?: string
-  all: string[]
-}
-
 type SessionView = {
  scroll: Record<string, SessionScroll>
  reviewOpen?: string[]
+  reviewMode?: ReviewChangeMode
+  reviewFile?: string
  pendingMessage?: string
  pendingMessageAt?: number
  todoCollapsed?: boolean
@@ -79,6 +77,7 @@ export type LocalProject = Partial<Project> & { worktree: string; expanded: bool
 export type HomeProjectSelection = { server: ServerConnection.Key; directory?: string }

 export type ReviewDiffStyle = "unified" | "split"
+export type ReviewChangeMode = "git" | "branch" | "turn"
 export type ReviewPanelSource = "context-button" | "other"

 export type LayoutRoute =
@@ -87,14 +86,6 @@ export type LayoutRoute =
  | { type: "dir-new-sesssion"; dir: string; dirBase64: string; server?: ServerConnection.Key }
  | { type: "session"; sessionId: string; server?: ServerConnection.Key }

-function nextSessionTabsForOpen(current: SessionTabs | undefined, tab: string): SessionTabs {
-  const all = current?.all ?? []
-  if (tab === "review") return { all: all.filter((x) => x !== "review"), active: tab }
-  if (tab === "context") return { all: [tab, ...all.filter((x) => x !== tab)], active: tab }
-  if (!all.includes(tab)) return { all: [...all, tab], active: tab }
-  return { all, active: tab }
-}
-
 const sessionPath = (key: string) => {
  const dir = SessionStateKey.route(key).split("/")[0]
  if (!dir) return
@@ -308,6 +299,7 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
    )
    const [ephemeral, setEphemeral] = createStore({
      reviewPanelSource: "other" as ReviewPanelSource,
+      sessionTabPreview: {} as Record<string, string | undefined>,
    })

    const MAX_SESSION_KEYS = 50
@@ -366,6 +358,12 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(

      scroll.drop(drop)
      dropSessionState(drop)
+      setEphemeral(
+        "sessionTabPreview",
+        produce((draft) => {
+          for (const key of drop) delete draft[key]
+        }),
+      )

      for (const key of drop) {
        usage.used.delete(key)
@@ -791,6 +789,14 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
      view(sessionKey: string | Accessor<string>) {
        const key = createSessionKeyReader(sessionKey, ensureKey)
        const s = createMemo(() => store.sessionView[key()] ?? { scroll: {} })
+        const reviewMode = createMemo(() => {
+          const mode = s().reviewMode
+          if (mode === "git" || mode === "branch" || mode === "turn") return mode
+        })
+        const reviewFile = createMemo(() => {
+          const file = s().reviewFile
+          if (typeof file === "string") return file
+        })
        const terminalOpened = createMemo(() => store.terminal?.opened ?? false)
        const reviewPanelOpened = createMemo(() => store.review?.panelOpened ?? DEFAULT_REVIEW_PANEL_OPENED)
        const reviewPanelSource = createMemo(() => (reviewPanelOpened() ? ephemeral.reviewPanelSource : "other"))
@@ -874,6 +880,32 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
            },
          },
          review: {
+            mode: reviewMode,
+            setMode(mode: ReviewChangeMode) {
+              const session = key()
+              const current = store.sessionView[session]
+              if (!current) {
+                setStore("sessionView", session, { scroll: {}, reviewMode: mode })
+                prune(session)
+                return
+              }
+              if (current.reviewMode === mode) return
+              setStore("sessionView", session, "reviewMode", mode)
+              prune(session)
+            },
+            file: reviewFile,
+            setFile(file: string) {
+              const session = key()
+              const current = store.sessionView[session]
+              if (!current) {
+                setStore("sessionView", session, { scroll: {}, reviewFile: file })
+                prune(session)
+                return
+              }
+              if (current.reviewFile === file) return
+              setStore("sessionView", session, "reviewFile", file)
+              prune(session)
+            },
            open: createMemo(() => s().reviewOpen ?? []),
            setOpen(open: string[]) {
              const session = key()
@@ -945,10 +977,17 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
        const tabs = createMemo(() => store.sessionTabs[key()] ?? { all: [] })
        const normalize = (tab: string) => normalizeSessionTab(path(), tab)
        const normalizeAll = (all: string[]) => normalizeSessionTabList(path(), all)
+        const apply = (session: string, next: ReturnType<typeof openSessionTab>) => {
+          batch(() => {
+            setStore("sessionTabs", session, next.tabs)
+            setEphemeral("sessionTabPreview", session, next.preview)
+          })
+        }
        return {
          tabs,
          active: createMemo(() => tabs().active),
          all: createMemo(() => tabs().all.filter((tab) => tab !== "review")),
+          preview: createMemo(() => ephemeral.sessionTabPreview[key()]),
          setActive(tab: string | undefined) {
            const session = key()
            const next = tab ? normalize(tab) : tab
@@ -961,40 +1000,44 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
          setAll(all: string[]) {
            const session = key()
            const next = normalizeAll(all).filter((tab) => tab !== "review")
-            if (!store.sessionTabs[session]) {
-              setStore("sessionTabs", session, { all: next, active: undefined })
-            } else {
-              setStore("sessionTabs", session, "all", next)
-            }
+            batch(() => {
+              if (!store.sessionTabs[session]) {
+                setStore("sessionTabs", session, { all: next, active: undefined })
+              } else {
+                setStore("sessionTabs", session, "all", next)
+              }
+              const preview = ephemeral.sessionTabPreview[session]
+              if (preview && !next.includes(preview)) setEphemeral("sessionTabPreview", session, undefined)
+            })
          },
          async open(tab: string) {
            const session = key()
-            const next = nextSessionTabsForOpen(store.sessionTabs[session], normalize(tab))
-            setStore("sessionTabs", session, next)
+            apply(
+              session,
+              openSessionTab(
+                { tabs: store.sessionTabs[session] ?? { all: [] }, preview: ephemeral.sessionTabPreview[session] },
+                normalize(tab),
+              ),
+            )
+          },
+          previewTab(tab: string) {
+            const session = key()
+            apply(
+              session,
+              previewSessionTab(
+                { tabs: store.sessionTabs[session] ?? { all: [] }, preview: ephemeral.sessionTabPreview[session] },
+                normalize(tab),
+              ),
+            )
          },
          close(tab: string) {
            const session = key()
            const current = store.sessionTabs[session]
            if (!current) return
-
-            if (tab === "review") {
-              if (current.active !== tab) return
-              setStore("sessionTabs", session, "active", current.all[0])
-              return
-            }
-
-            const all = current.all.filter((x) => x !== tab)
-            if (current.active !== tab) {
-              setStore("sessionTabs", session, "all", all)
-              return
-            }
-
-            const index = current.all.findIndex((f) => f === tab)
-            const next = current.all[index - 1] ?? current.all[index + 1] ?? all[0]
-            batch(() => {
-              setStore("sessionTabs", session, "all", all)
-              setStore("sessionTabs", session, "active", next)
-            })
+            apply(
+              session,
+              closeSessionTab({ tabs: current, preview: ephemeral.sessionTabPreview[session] }, normalize(tab)),
+            )
          },
          move(tab: string, to: number) {
            const session = key()
@@ -67,7 +67,7 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({
    const list = createMemo(() => sync().data.agent.filter((item) => item.mode !== "subagent" && !item.hidden))
    const connected = createMemo(() => new Set(providers.connected().map((item) => item.id)))

-    const [saved, setSaved] = persisted(
+    const [saved, setSaved, , savedReady] = persisted(
      {
        ...Persist.serverWorkspace(serverSDK().scope, sdk().directory, "model-selection", ["model-selection.v1"]),
        migrate,
@@ -375,11 +375,12 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({
      model,
      agent,
      session: {
+        ready: savedReady,
        reset() {
          setStore({ draft: undefined, promoting: undefined })
        },
-        promote(dir: string, session: string) {
-          const next = clone(snapshot())
+        promote(dir: string, session: string, state?: State) {
+          const next = clone(state ?? snapshot())
          if (!next) return
          const key = handoffKey(serverSDK().scope, dir, session)
          handoff.set(key, next)
@@ -409,3 +410,5 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({
    return result
  },
 })
+
+export type ModelSelection = ReturnType<typeof useLocal>["model"]
@@ -0,0 +1,29 @@
+import { describe, expect, test } from "bun:test"
+import { createRoot } from "solid-js"
+import { createPromptState, DEFAULT_PROMPT } from "./prompt-state"
+
+describe("prompt state initialization", () => {
+  test("initializes prompt text, cursor, and model together", () => {
+    createRoot((dispose) => {
+      const model = { providerID: "anthropic", modelID: "claude", variant: "high" }
+      const prompt = createPromptState({ prompt: "hello", model })
+
+      expect(prompt.current()).toEqual([{ type: "text", content: "hello", start: 0, end: 5 }])
+      expect(prompt.cursor()).toBe(5)
+      expect(prompt.model.current()).toEqual(model)
+      expect(prompt.model.current()).not.toBe(model)
+      dispose()
+    })
+  })
+
+  test("uses the default prompt without initial values", () => {
+    createRoot((dispose) => {
+      const prompt = createPromptState()
+
+      expect(prompt.current()).toEqual(DEFAULT_PROMPT)
+      expect(prompt.cursor()).toBeUndefined()
+      expect(prompt.model.current()).toBeUndefined()
+      dispose()
+    })
+  })
+})
@@ -0,0 +1,265 @@
+import { checksum } from "@opencode-ai/core/util/encode"
+import type { FilePartSource } from "@opencode-ai/sdk/v2/client"
+import { batch, createMemo, type Accessor } from "solid-js"
+import { createStore, type SetStoreFunction } from "solid-js/store"
+import type { FileSelection } from "@/context/file"
+import { Persist, persisted } from "@/utils/persist"
+import type { ServerScope } from "@/utils/server-scope"
+
+interface PartBase {
+  content: string
+  start: number
+  end: number
+}
+
+export interface TextPart extends PartBase {
+  type: "text"
+}
+
+export interface FileAttachmentPart extends PartBase {
+  type: "file"
+  path: string
+  selection?: FileSelection
+  mime?: string
+  filename?: string
+  url?: string
+  source?: FilePartSource
+}
+
+export interface AgentPart extends PartBase {
+  type: "agent"
+  name: string
+}
+
+export interface ImageAttachmentPart {
+  type: "image"
+  id: string
+  filename: string
+  sourcePath?: string
+  mime: string
+  dataUrl: string
+}
+
+export type ContentPart = TextPart | FileAttachmentPart | AgentPart | ImageAttachmentPart
+export type Prompt = ContentPart[]
+
+export type PromptModel = {
+  providerID: string
+  modelID: string
+  variant?: string | null
+}
+
+export type FileContextItem = {
+  type: "file"
+  path: string
+  selection?: FileSelection
+  comment?: string
+  commentID?: string
+  commentOrigin?: "review" | "file"
+  preview?: string
+}
+
+export type ContextItem = FileContextItem
+export type PromptScope = { draftID: string } | { dir: string; id?: string }
+
+export const DEFAULT_PROMPT: Prompt = [{ type: "text", content: "", start: 0, end: 0 }]
+
+type PromptStore = {
+  prompt: Prompt
+  cursor?: number
+  model?: PromptModel
+  context: {
+    items: (ContextItem & { key: string })[]
+  }
+}
+
+type InitialPrompt = {
+  prompt?: string
+  model?: PromptModel
+}
+
+function isSelectionEqual(a?: FileSelection, b?: FileSelection) {
+  if (!a && !b) return true
+  if (!a || !b) return false
+  return (
+    a.startLine === b.startLine && a.startChar === b.startChar && a.endLine === b.endLine && a.endChar === b.endChar
+  )
+}
+
+function isPartEqual(partA: ContentPart, partB: ContentPart) {
+  switch (partA.type) {
+    case "text":
+      return partB.type === "text" && partA.content === partB.content
+    case "file":
+      return (
+        partB.type === "file" &&
+        partA.path === partB.path &&
+        partA.mime === partB.mime &&
+        partA.filename === partB.filename &&
+        isSelectionEqual(partA.selection, partB.selection)
+      )
+    case "agent":
+      return partB.type === "agent" && partA.name === partB.name
+    case "image":
+      return partB.type === "image" && partA.id === partB.id
+  }
+}
+
+export function isPromptEqual(promptA: Prompt, promptB: Prompt): boolean {
+  if (promptA.length !== promptB.length) return false
+  for (let i = 0; i < promptA.length; i++) {
+    if (!isPartEqual(promptA[i], promptB[i])) return false
+  }
+  return true
+}
+
+function cloneSelection(selection?: FileSelection) {
+  if (!selection) return undefined
+  return { ...selection }
+}
+
+function clonePart(part: ContentPart): ContentPart {
+  if (part.type === "text") return { ...part }
+  if (part.type === "image") return { ...part }
+  if (part.type === "agent") return { ...part }
+  return {
+    ...part,
+    selection: cloneSelection(part.selection),
+  }
+}
+
+function clonePrompt(prompt: Prompt): Prompt {
+  return prompt.map(clonePart)
+}
+
+function contextItemKey(item: ContextItem) {
+  if (item.type !== "file") return item.type
+  const start = item.selection?.startLine
+  const end = item.selection?.endLine
+  const key = `${item.type}:${item.path}:${start}:${end}`
+
+  if (item.commentID) return `${key}:c=${item.commentID}`
+  const comment = item.comment?.trim()
+  if (!comment) return key
+  const digest = checksum(comment) ?? comment
+  return `${key}:c=${digest.slice(0, 8)}`
+}
+
+function isCommentItem(item: ContextItem | (ContextItem & { key: string })) {
+  return item.type === "file" && !!item.comment?.trim()
+}
+
+function createPromptActions(setStore: SetStoreFunction<PromptStore>) {
+  return {
+    set(prompt: Prompt, cursorPosition?: number) {
+      const next = clonePrompt(prompt)
+      batch(() => {
+        setStore("prompt", next)
+        if (cursorPosition !== undefined) setStore("cursor", cursorPosition)
+      })
+    },
+    reset() {
+      batch(() => {
+        setStore("prompt", clonePrompt(DEFAULT_PROMPT))
+        setStore("cursor", 0)
+      })
+    },
+  }
+}
+
+function promptTarget(serverScope: ServerScope, scope: PromptScope) {
+  if ("draftID" in scope) return Persist.draft(scope.draftID, "prompt")
+  const legacy = `${scope.dir}/prompt${scope.id ? "/" + scope.id : ""}.v2`
+  return Persist.serverScoped(serverScope, scope.dir, scope.id, "prompt", [legacy])
+}
+
+function promptStore(initial?: InitialPrompt): PromptStore {
+  const text = initial?.prompt
+  return {
+    prompt:
+      text === undefined ? clonePrompt(DEFAULT_PROMPT) : [{ type: "text", content: text, start: 0, end: text.length }],
+    cursor: text === undefined ? undefined : text.length,
+    model: initial?.model ? { ...initial.model } : undefined,
+    context: {
+      items: [],
+    },
+  }
+}
+
+function createPromptStateValue(store: PromptStore, setStore: SetStoreFunction<PromptStore>) {
+  const actions = createPromptActions(setStore)
+  const value = {
+    current: () => store.prompt,
+    cursor: createMemo(() => store.cursor),
+    dirty: () => !isPromptEqual(store.prompt, DEFAULT_PROMPT),
+    model: {
+      current: () => store.model,
+      set: (model: PromptModel | undefined) => setStore("model", model),
+    },
+    context: {
+      items: createMemo(() => store.context.items),
+      add(item: ContextItem) {
+        const key = contextItemKey(item)
+        if (store.context.items.find((x) => x.key === key)) return
+        setStore("context", "items", (items) => [...items, { key, ...item }])
+      },
+      remove(key: string) {
+        setStore("context", "items", (items) => items.filter((x) => x.key !== key))
+      },
+      removeComment(path: string, commentID: string) {
+        setStore("context", "items", (items) =>
+          items.filter((item) => !(item.type === "file" && item.path === path && item.commentID === commentID)),
+        )
+      },
+      updateComment(path: string, commentID: string, next: Partial<FileContextItem> & { comment?: string }) {
+        setStore("context", "items", (items) =>
+          items.map((item) => {
+            if (item.type !== "file" || item.path !== path || item.commentID !== commentID) return item
+            const value = { ...item, ...next }
+            return { ...value, key: contextItemKey(value) }
+          }),
+        )
+      },
+      replaceComments(items: FileContextItem[]) {
+        setStore("context", "items", (current) => [
+          ...current.filter((item) => !isCommentItem(item)),
+          ...items.map((item) => ({ ...item, key: contextItemKey(item) })),
+        ])
+      },
+    },
+    set: actions.set,
+    reset: actions.reset,
+    capture: () => value,
+  }
+  return value
+}
+
+function createPersistedPrompt(target: ReturnType<typeof promptTarget>, initial?: InitialPrompt) {
+  const [store, setStore, _, ready] = persisted(target, createStore<PromptStore>(promptStore(initial)))
+  return { ready, ...createPromptStateValue(store, setStore) }
+}
+
+export function createPromptSession(serverScope: ServerScope, scope: PromptScope, initial?: InitialPrompt) {
+  return createPersistedPrompt(promptTarget(serverScope, scope), initial)
+}
+
+export function createDraftPromptSession(draftID: string, initial?: InitialPrompt) {
+  return createPersistedPrompt(Persist.draft(draftID, "prompt"), initial)
+}
+
+export type PromptSession = ReturnType<typeof createPromptSession>
+
+export function createPromptReady(session: Accessor<PromptSession>) {
+  return Object.defineProperty(() => session().ready(), "promise", {
+    get: () => session().ready.promise,
+  }) as (() => boolean) & { readonly promise: Promise<unknown> | undefined }
+}
+
+export function createPromptState(initial?: InitialPrompt) {
+  const [store, setStore] = createStore<PromptStore>(promptStore(initial))
+  const ready = Object.assign(() => true, { promise: Promise.resolve(true) })
+  return {
+    ready,
+    ...createPromptStateValue(store, setStore),
+  }
+}
@@ -1,186 +1,49 @@
+import { base64Encode } from "@opencode-ai/core/util/encode"
 import { createSimpleContext } from "@opencode-ai/ui/context"
-import { base64Encode, checksum } from "@opencode-ai/core/util/encode"
 import { useParams, useSearchParams } from "@solidjs/router"
-import { batch, createMemo, createRoot, getOwner, onCleanup, type Accessor } from "solid-js"
-import { createStore, type SetStoreFunction } from "solid-js/store"
-import type { FileSelection } from "@/context/file"
-import { Persist, persisted } from "@/utils/persist"
+import { createMemo, createRoot, getOwner, onCleanup } from "solid-js"
+import { requireServerKey } from "@/utils/session-route"
+import { ServerConnection } from "./server"
 import { useServerSDK } from "./server-sdk"
-import type { ServerScope } from "@/utils/server-scope"
+import { useSettings } from "./settings"
 import { useSDK } from "./sdk"
 import { useTabs, type Tab } from "./tabs"
-import { ServerConnection } from "./server"
-import { requireServerKey } from "@/utils/session-route"
-import { useSettings } from "./settings"
-import type { FilePartSource } from "@opencode-ai/sdk/v2/client"
+import {
+  createPromptReady,
+  createPromptSession,
+  type ContextItem,
+  type FileContextItem,
+  type Prompt,
+  type PromptModel,
+  type PromptScope,
+  type PromptSession,
+} from "./prompt-state"

-interface PartBase {
-  content: string
-  start: number
-  end: number
-}
-
-export interface TextPart extends PartBase {
-  type: "text"
-}
-
-export interface FileAttachmentPart extends PartBase {
-  type: "file"
-  path: string
-  selection?: FileSelection
-  mime?: string
-  filename?: string
-  url?: string
-  source?: FilePartSource
-}
-
-export interface AgentPart extends PartBase {
-  type: "agent"
-  name: string
-}
-
-export interface ImageAttachmentPart {
-  type: "image"
-  id: string
-  filename: string
-  sourcePath?: string
-  mime: string
-  dataUrl: string
-}
-
-export type ContentPart = TextPart | FileAttachmentPart | AgentPart | ImageAttachmentPart
-export type Prompt = ContentPart[]
-
-export type FileContextItem = {
-  type: "file"
-  path: string
-  selection?: FileSelection
-  comment?: string
-  commentID?: string
-  commentOrigin?: "review" | "file"
-  preview?: string
-}
-
-export type ContextItem = FileContextItem
-
-export const DEFAULT_PROMPT: Prompt = [{ type: "text", content: "", start: 0, end: 0 }]
-
-function isSelectionEqual(a?: FileSelection, b?: FileSelection) {
-  if (!a && !b) return true
-  if (!a || !b) return false
-  return (
-    a.startLine === b.startLine && a.startChar === b.startChar && a.endLine === b.endLine && a.endChar === b.endChar
-  )
-}
-
-function isPartEqual(partA: ContentPart, partB: ContentPart) {
-  switch (partA.type) {
-    case "text":
-      return partB.type === "text" && partA.content === partB.content
-    case "file":
-      return (
-        partB.type === "file" &&
-        partA.path === partB.path &&
-        partA.mime === partB.mime &&
-        partA.filename === partB.filename &&
-        isSelectionEqual(partA.selection, partB.selection)
-      )
-    case "agent":
-      return partB.type === "agent" && partA.name === partB.name
-    case "image":
-      return partB.type === "image" && partA.id === partB.id
-  }
-}
-
-export function isPromptEqual(promptA: Prompt, promptB: Prompt): boolean {
-  if (promptA.length !== promptB.length) return false
-  for (let i = 0; i < promptA.length; i++) {
-    if (!isPartEqual(promptA[i], promptB[i])) return false
-  }
-  return true
-}
-
-function cloneSelection(selection?: FileSelection) {
-  if (!selection) return undefined
-  return { ...selection }
-}
-
-function clonePart(part: ContentPart): ContentPart {
-  if (part.type === "text") return { ...part }
-  if (part.type === "image") return { ...part }
-  if (part.type === "agent") return { ...part }
-  return {
-    ...part,
-    selection: cloneSelection(part.selection),
-  }
-}
-
-function clonePrompt(prompt: Prompt): Prompt {
-  return prompt.map(clonePart)
-}
-
-function contextItemKey(item: ContextItem) {
-  if (item.type !== "file") return item.type
-  const start = item.selection?.startLine
-  const end = item.selection?.endLine
-  const key = `${item.type}:${item.path}:${start}:${end}`
-
-  if (item.commentID) {
-    return `${key}:c=${item.commentID}`
-  }
-
-  const comment = item.comment?.trim()
-  if (!comment) return key
-  const digest = checksum(comment) ?? comment
-  return `${key}:c=${digest.slice(0, 8)}`
-}
-
-function isCommentItem(item: ContextItem | (ContextItem & { key: string })) {
-  return item.type === "file" && !!item.comment?.trim()
-}
-
-function createPromptActions(
-  setStore: SetStoreFunction<{
-    prompt: Prompt
-    cursor?: number
-    context: {
-      items: (ContextItem & { key: string })[]
-    }
-  }>,
-) {
-  return {
-    set(prompt: Prompt, cursorPosition?: number) {
-      const next = clonePrompt(prompt)
-      batch(() => {
-        setStore("prompt", next)
-        if (cursorPosition !== undefined) setStore("cursor", cursorPosition)
-      })
-    },
-    reset() {
-      batch(() => {
-        setStore("prompt", clonePrompt(DEFAULT_PROMPT))
-        setStore("cursor", 0)
-      })
-    },
-  }
-}
+export {
+  createPromptReady,
+  createPromptSession,
+  createPromptState,
+  DEFAULT_PROMPT,
+  isPromptEqual,
+} from "./prompt-state"
+export type {
+  AgentPart,
+  ContentPart,
+  ContextItem,
+  FileAttachmentPart,
+  FileContextItem,
+  ImageAttachmentPart,
+  Prompt,
+  PromptModel,
+  PromptScope,
+  PromptSession,
+  TextPart,
+} from "./prompt-state"

 const WORKSPACE_KEY = "__workspace__"
 const MAX_PROMPT_SESSIONS = 20

-type PromptSession = ReturnType<typeof createPromptSession>
-
-type PromptStore = {
-  prompt: Prompt
-  cursor?: number
-  context: {
-    items: (ContextItem & { key: string })[]
-  }
-}
-
-type Scope = { draftID: string } | { dir: string; id?: string }
-
-export function selectPromptTab(tabs: Tab[], scope: Scope, server: ServerConnection.Key) {
+export function selectPromptTab(tabs: Tab[], scope: PromptScope, server: ServerConnection.Key) {
  if ("draftID" in scope) return tabs.find((tab) => tab.type === "draft" && tab.draftID === scope.draftID)
  if (!scope.id) return
  return (
@@ -189,7 +52,7 @@ export function selectPromptTab(tabs: Tab[], scope: Scope, server: ServerConnect
  )
 }

-function scopeKey(scope: Scope) {
+function scopeKey(scope: PromptScope) {
  if ("draftID" in scope) return `draft:${scope.draftID}`
  return `${scope.dir}:${scope.id ?? WORKSPACE_KEY}`
 }
@@ -199,91 +62,6 @@ type PromptCacheEntry = {
  dispose: VoidFunction
 }

-function promptTarget(serverScope: ServerScope, scope: Scope) {
-  if ("draftID" in scope) return Persist.draft(scope.draftID, "prompt")
-  const legacy = `${scope.dir}/prompt${scope.id ? "/" + scope.id : ""}.v2`
-  return Persist.serverScoped(serverScope, scope.dir, scope.id, "prompt", [legacy])
-}
-
-export function createPromptSession(serverScope: ServerScope, scope: Scope) {
-  const [store, setStore, _, ready] = persisted(
-    promptTarget(serverScope, scope),
-    createStore<PromptStore>(promptStore()),
-  )
-
-  return { ready, ...createPromptStateValue(store, setStore) }
-}
-
-export function createPromptReady(session: Accessor<PromptSession>) {
-  return Object.defineProperty(() => session().ready(), "promise", {
-    get: () => session().ready.promise,
-  }) as (() => boolean) & { readonly promise: Promise<unknown> | undefined }
-}
-
-function promptStore(): PromptStore {
-  return {
-    prompt: clonePrompt(DEFAULT_PROMPT),
-    cursor: undefined,
-    context: {
-      items: [],
-    },
-  }
-}
-
-function createPromptStateValue(store: PromptStore, setStore: SetStoreFunction<PromptStore>) {
-  const actions = createPromptActions(setStore)
-
-  const value = {
-    current: () => store.prompt,
-    cursor: createMemo(() => store.cursor),
-    dirty: () => !isPromptEqual(store.prompt, DEFAULT_PROMPT),
-    context: {
-      items: createMemo(() => store.context.items),
-      add(item: ContextItem) {
-        const key = contextItemKey(item)
-        if (store.context.items.find((x) => x.key === key)) return
-        setStore("context", "items", (items) => [...items, { key, ...item }])
-      },
-      remove(key: string) {
-        setStore("context", "items", (items) => items.filter((x) => x.key !== key))
-      },
-      removeComment(path: string, commentID: string) {
-        setStore("context", "items", (items) =>
-          items.filter((item) => !(item.type === "file" && item.path === path && item.commentID === commentID)),
-        )
-      },
-      updateComment(path: string, commentID: string, next: Partial<FileContextItem> & { comment?: string }) {
-        setStore("context", "items", (items) =>
-          items.map((item) => {
-            if (item.type !== "file" || item.path !== path || item.commentID !== commentID) return item
-            const value = { ...item, ...next }
-            return { ...value, key: contextItemKey(value) }
-          }),
-        )
-      },
-      replaceComments(items: FileContextItem[]) {
-        setStore("context", "items", (current) => [
-          ...current.filter((item) => !isCommentItem(item)),
-          ...items.map((item) => ({ ...item, key: contextItemKey(item) })),
-        ])
-      },
-    },
-    set: actions.set,
-    reset: actions.reset,
-    capture: () => value,
-  }
-  return value
-}
-
-export function createPromptState() {
-  const [store, setStore] = createStore<PromptStore>(promptStore())
-  const ready = Object.assign(() => true, { promise: Promise.resolve(true) })
-  return {
-    ready,
-    ...createPromptStateValue(store, setStore),
-  }
-}
-
 export const createTabPromptState = (
  tabs: ReturnType<typeof useTabs>,
  tab: Tab,
@@ -303,9 +81,7 @@ export const { use: usePrompt, provider: PromptProvider } = createSimpleContext(
    const cache = new Map<string, PromptCacheEntry>()

    const disposeAll = () => {
-      for (const entry of cache.values()) {
-        entry.dispose()
-      }
+      for (const entry of cache.values()) entry.dispose()
      cache.clear()
    }

@@ -324,13 +100,11 @@ export const { use: usePrompt, provider: PromptProvider } = createSimpleContext(
    const owner = getOwner()
    const serverKey = () =>
      params.serverKey ? requireServerKey(params.serverKey) : ServerConnection.key(serverSDK().server)
-    const scope = () =>
+    const scope = (): PromptScope =>
      search.draftId ? { draftID: search.draftId } : { dir: base64Encode(sdk().directory), id: params.id }
-    const load = (scope: Scope) => {
+    const load = (scope: PromptScope) => {
      const current = settings.general.newLayoutDesigns() ? selectPromptTab(tabs.store, scope, serverKey()) : undefined
-      if (current) {
-        return createTabPromptState(tabs, current, serverSDK().scope, scope)
-      }
+      if (current) return createTabPromptState(tabs, current, serverSDK().scope, scope)

      const key = scopeKey(scope)
      const existing = cache.get(key)
@@ -354,15 +128,19 @@ export const { use: usePrompt, provider: PromptProvider } = createSimpleContext(
    }

    const session = createMemo(() => load(scope()))
-    const pick = (scope?: Scope) => (scope ? load(scope) : session())
+    const pick = (scope?: PromptScope) => (scope ? load(scope) : session())
    const ready = createPromptReady(session)

    return {
      ready,
-      capture: (scope?: Scope) => pick(scope).capture(),
+      capture: (scope?: PromptScope) => pick(scope).capture(),
      current: () => session().current(),
      cursor: () => session().cursor(),
      dirty: () => session().dirty(),
+      model: {
+        current: () => session().model.current(),
+        set: (model: PromptModel | undefined) => session().model.set(model),
+      },
      context: {
        items: () => session().context.items(),
        add: (item: ContextItem) => session().context.add(item),
@@ -372,8 +150,8 @@ export const { use: usePrompt, provider: PromptProvider } = createSimpleContext(
          session().context.updateComment(path, commentID, next),
        replaceComments: (items: FileContextItem[]) => session().context.replaceComments(items),
      },
-      set: (prompt: Prompt, cursorPosition?: number, scope?: Scope) => pick(scope).set(prompt, cursorPosition),
-      reset: (scope?: Scope) => pick(scope).reset(),
+      set: (prompt: Prompt, cursorPosition?: number, scope?: PromptScope) => pick(scope).set(prompt, cursorPosition),
+      reset: (scope?: PromptScope) => pick(scope).reset(),
    }
  },
 })
@@ -16,6 +16,9 @@ export function createTabMemory(owner: Owner | null) {
  }

  return {
+    get<T>(key: string, name: string) {
+      return entries.get(key)?.get(name)?.value as T | undefined
+    },
    ensure<T>(key: string, name: string, init: () => T) {
      const state = entries.get(key) ?? new Map<string, Entry>()
      if (!entries.has(key)) entries.set(key, state)
@@ -22,6 +22,8 @@ describe("tab memory", () => {
      })

      expect(memory.ensure("tab", "prompt", () => ({ value: "other" }))).toBe(first)
+      expect(memory.get<typeof first>("tab", "prompt")).toBe(first)
+      expect(memory.get("missing", "prompt")).toBeUndefined()
      expect(memory.ensure("other", "prompt", () => ({ value: "other" }))).not.toBe(first)

      memory.remove("tab")
@@ -11,6 +11,7 @@ import { SessionTabsRemovedDetail } from "@/components/titlebar-session-events"
 import { sessionHref } from "@/utils/session-route"
 import { createTabMemory } from "./tab-memory"
 import { nextTabAfterClose, pushClosedTab, removeClosedTabs, takeClosedTab, type ClosedTab } from "./closed-tabs"
+import { createDraftPromptSession, type PromptModel } from "./prompt-state"

 export type SessionTab = {
  type: "session"
@@ -207,15 +208,17 @@ export const { use: useTabs, provider: TabsProvider } = createSimpleContext({
        if (!tab || tab.type !== "draft") throw new Error(`Draft not found: ${draftID}`)
        return tab
      },
-      newDraft(draft: Omit<DraftTab, "type" | "draftID">, prompt?: string) {
+      newDraft(draft: Omit<DraftTab, "type" | "draftID">, prompt?: string, model?: PromptModel) {
        const draftID = uuid()
+        const tab = { type: "draft" as const, draftID, ...draft }
+        memory.ensure(tabKey(tab), "prompt", () => createDraftPromptSession(draftID, { prompt, model }))
        void startTransition(() => {
          setStore(
            produce((tabs) => {
-              tabs.push({ type: "draft", draftID, ...draft })
+              tabs.push(tab)
            }),
          )
-          navigate(prompt ? `${draftHref(draftID)}&prompt=${encodeURIComponent(prompt)}` : draftHref(draftID))
+          navigate(draftHref(draftID))
        })
      },
      updateDraft(draftID: string, draft: Partial<Omit<DraftTab, "type" | "draftID">>) {
@@ -373,6 +376,9 @@ export const { use: useTabs, provider: TabsProvider } = createSimpleContext({
      state<T>(tab: Tab, name: string, init: () => T) {
        return memory.ensure(tabKey(tab), name, init)
      },
+      stateValue<T>(tab: Tab, name: string) {
+        return memory.get<T>(tabKey(tab), name)
+      },
    }

    return { ...actions, store, info, ready, recentReady }
@@ -12,6 +12,16 @@ interface ImportMeta {
  readonly env: ImportMetaEnv
 }

+declare module "*.png" {
+  const src: string
+  export default src
+}
+
+declare module "*.mp4" {
+  const src: string
+  export default src
+}
+
 export declare module "solid-js" {
  namespace JSX {
    interface Directives {
@@ -267,6 +267,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "إزالة الملف النشط من السياق",
  "prompt.context.removeFile": "إزالة الملف من السياق",
  "prompt.action.attachFile": "إرفاق ملف",
+  "prompt.menu.addImagesAndFiles": "إضافة ملفات والمزيد",
+  "prompt.menu.imagesAndFiles": "الصور والملفات",
+  "prompt.menu.commands": "الأوامر",
+  "prompt.menu.context": "السياق",
+  "prompt.menu.shellCommand": "أمر shell",
  "prompt.attachment.remove": "إزالة المرفق",
  "prompt.action.send": "إرسال",
  "prompt.action.stop": "توقف",
@@ -548,6 +553,7 @@ export const dict = {
  "home.sessions.group.today": "اليوم",
  "home.sessions.group.yesterday": "أمس",
  "home.sessions.group.older": "الأقدم",
+  "home.providerTip": "اتصل بأكثر من 75 مزودًا لاستخدام نماذج أخرى، بما فيها Claude وGPT وGemini وغيرها",
  "session.tab.session": "جلسة",
  "session.tab.review": "مراجعة",
  "session.tab.context": "سياق",
@@ -267,6 +267,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Remover arquivo ativo do contexto",
  "prompt.context.removeFile": "Remover arquivo do contexto",
  "prompt.action.attachFile": "Anexar arquivo",
+  "prompt.menu.addImagesAndFiles": "Adicionar arquivos e mais",
+  "prompt.menu.imagesAndFiles": "Imagens e arquivos",
+  "prompt.menu.commands": "Comandos",
+  "prompt.menu.context": "Contexto",
+  "prompt.menu.shellCommand": "Comando shell",
  "prompt.attachment.remove": "Remover anexo",
  "prompt.action.send": "Enviar",
  "prompt.action.stop": "Parar",
@@ -552,6 +557,8 @@ export const dict = {
  "home.sessions.group.today": "Hoje",
  "home.sessions.group.yesterday": "Ontem",
  "home.sessions.group.older": "Mais antigas",
+  "home.providerTip":
+    "Conecte-se a mais de 75 provedores para usar outros modelos, incluindo Claude, GPT, Gemini e muito mais",
  "session.tab.session": "Sessão",
  "session.tab.review": "Revisão",
  "session.tab.context": "Contexto",
@@ -287,6 +287,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Ukloni aktivnu datoteku iz konteksta",
  "prompt.context.removeFile": "Ukloni datoteku iz konteksta",
  "prompt.action.attachFile": "Priloži datoteku",
+  "prompt.menu.addImagesAndFiles": "Dodaj datoteke i više",
+  "prompt.menu.imagesAndFiles": "Slike i datoteke",
+  "prompt.menu.commands": "Komande",
+  "prompt.menu.context": "Kontekst",
+  "prompt.menu.shellCommand": "Shell naredba",
  "prompt.attachment.remove": "Ukloni prilog",
  "prompt.action.send": "Pošalji",
  "prompt.action.stop": "Zaustavi",
@@ -603,6 +608,8 @@ export const dict = {
  "home.sessions.group.today": "Danas",
  "home.sessions.group.yesterday": "Jučer",
  "home.sessions.group.older": "Starije",
+  "home.providerTip":
+    "Povežite se s više od 75 pružalaca usluga kako biste koristili druge modele, uključujući Claude, GPT, Gemini i druge",

  "session.tab.session": "Sesija",
  "session.tab.review": "Pregled",
@@ -285,6 +285,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Fjern aktiv fil fra kontekst",
  "prompt.context.removeFile": "Fjern fil fra kontekst",
  "prompt.action.attachFile": "Vedhæft fil",
+  "prompt.menu.addImagesAndFiles": "Tilføj filer og mere",
+  "prompt.menu.imagesAndFiles": "Billeder og filer",
+  "prompt.menu.commands": "Kommandoer",
+  "prompt.menu.context": "Kontekst",
+  "prompt.menu.shellCommand": "Shell-kommando",
  "prompt.attachment.remove": "Fjern vedhæftning",
  "prompt.action.send": "Send",
  "prompt.action.stop": "Stop",
@@ -600,6 +605,8 @@ export const dict = {
  "home.sessions.group.today": "I dag",
  "home.sessions.group.yesterday": "I går",
  "home.sessions.group.older": "Ældre",
+  "home.providerTip":
+    "Opret forbindelse til mere end 75 udbydere for at bruge andre modeller, herunder Claude, GPT, Gemini og flere",

  "session.tab.session": "Session",
  "session.tab.review": "Gennemgang",
@@ -272,6 +272,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Aktive Datei aus dem Kontext entfernen",
  "prompt.context.removeFile": "Datei aus dem Kontext entfernen",
  "prompt.action.attachFile": "Datei anhängen",
+  "prompt.menu.addImagesAndFiles": "Dateien und mehr hinzufügen",
+  "prompt.menu.imagesAndFiles": "Bilder und Dateien",
+  "prompt.menu.commands": "Befehle",
+  "prompt.menu.context": "Kontext",
+  "prompt.menu.shellCommand": "Shell-Befehl",
  "prompt.attachment.remove": "Anhang entfernen",
  "prompt.action.send": "Senden",
  "prompt.action.stop": "Stopp",
@@ -560,6 +565,8 @@ export const dict = {
  "home.sessions.group.today": "Heute",
  "home.sessions.group.yesterday": "Gestern",
  "home.sessions.group.older": "Älter",
+  "home.providerTip":
+    "Verbinde dich mit über 75 Anbietern, um weitere Modelle wie Claude, GPT, Gemini und andere zu nutzen",
  "session.tab.session": "Sitzung",
  "session.tab.review": "Überprüfung",
  "session.tab.context": "Kontext",
@@ -287,6 +287,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Remove active file from context",
  "prompt.context.removeFile": "Remove file from context",
  "prompt.action.attachFile": "Add files",
+  "prompt.menu.addImagesAndFiles": "Add files and more",
+  "prompt.menu.imagesAndFiles": "Images and files",
+  "prompt.menu.commands": "Commands",
+  "prompt.menu.context": "Context",
+  "prompt.menu.shellCommand": "Shell command",
  "prompt.attachment.remove": "Remove attachment",
  "prompt.action.send": "Send",
  "prompt.action.stop": "Stop",
@@ -622,6 +627,7 @@ export const dict = {
  "home.sessions.group.today": "Today",
  "home.sessions.group.yesterday": "Yesterday",
  "home.sessions.group.older": "Older",
+  "home.providerTip": "Connect to 75+ providers to use other models, including Claude, GPT, Gemini, etc",

  "session.tab.session": "Session",
  "session.tab.review": "Review",
@@ -703,6 +709,9 @@ export const dict = {
  "session.header.open.finder": "Finder",
  "session.header.open.fileExplorer": "File Explorer",
  "session.header.open.fileManager": "File Manager",
+  "session.header.reveal.finder": "Reveal in Finder",
+  "session.header.reveal.fileExplorer": "Reveal in File Explorer",
+  "session.header.reveal.containingFolder": "Open containing folder",
  "session.header.open.app.vscode": "VS Code",
  "session.header.open.app.cursor": "Cursor",
  "session.header.open.app.zed": "Zed",
@@ -286,6 +286,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Eliminar archivo activo del contexto",
  "prompt.context.removeFile": "Eliminar archivo del contexto",
  "prompt.action.attachFile": "Adjuntar archivo",
+  "prompt.menu.addImagesAndFiles": "Añadir archivos y más",
+  "prompt.menu.imagesAndFiles": "Imágenes y archivos",
+  "prompt.menu.commands": "Comandos",
+  "prompt.menu.context": "Contexto",
+  "prompt.menu.shellCommand": "Comando de shell",
  "prompt.attachment.remove": "Eliminar adjunto",
  "prompt.action.send": "Enviar",
  "prompt.action.stop": "Detener",
@@ -604,6 +609,8 @@ export const dict = {
  "home.sessions.group.today": "Hoy",
  "home.sessions.group.yesterday": "Ayer",
  "home.sessions.group.older": "Anteriores",
+  "home.providerTip":
+    "Conéctate a más de 75 proveedores para usar otros modelos, como Claude, GPT, Gemini y muchos más",

  "session.tab.session": "Sesión",
  "session.tab.review": "Revisión",
@@ -267,6 +267,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Retirer le fichier actif du contexte",
  "prompt.context.removeFile": "Retirer le fichier du contexte",
  "prompt.action.attachFile": "Joindre un fichier",
+  "prompt.menu.addImagesAndFiles": "Ajouter des fichiers et plus encore",
+  "prompt.menu.imagesAndFiles": "Images et fichiers",
+  "prompt.menu.commands": "Commandes",
+  "prompt.menu.context": "Contexte",
+  "prompt.menu.shellCommand": "Commande shell",
  "prompt.attachment.remove": "Supprimer la pièce jointe",
  "prompt.action.send": "Envoyer",
  "prompt.action.stop": "Arrêter",
@@ -557,6 +562,8 @@ export const dict = {
  "home.sessions.group.today": "Aujourd'hui",
  "home.sessions.group.yesterday": "Hier",
  "home.sessions.group.older": "Plus anciennes",
+  "home.providerTip":
+    "Connectez-vous à plus de 75 fournisseurs pour utiliser d’autres modèles, notamment Claude, GPT, Gemini, etc.",
  "session.tab.session": "Session",
  "session.tab.review": "Revue",
  "session.tab.context": "Contexte",
@@ -266,6 +266,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "コンテキストからアクティブなファイルを削除",
  "prompt.context.removeFile": "コンテキストからファイルを削除",
  "prompt.action.attachFile": "ファイルを添付",
+  "prompt.menu.addImagesAndFiles": "ファイルなどを追加",
+  "prompt.menu.imagesAndFiles": "画像とファイル",
+  "prompt.menu.commands": "コマンド",
+  "prompt.menu.context": "コンテキスト",
+  "prompt.menu.shellCommand": "シェルコマンド",
  "prompt.attachment.remove": "添付ファイルを削除",
  "prompt.action.send": "送信",
  "prompt.action.stop": "停止",
@@ -550,6 +555,7 @@ export const dict = {
  "home.sessions.group.today": "今日",
  "home.sessions.group.yesterday": "昨日",
  "home.sessions.group.older": "それ以前",
+  "home.providerTip": "75以上のプロバイダーに接続して、Claude、GPT、Geminiなどの他のモデルを利用できます",
  "session.tab.session": "セッション",
  "session.tab.review": "レビュー",
  "session.tab.context": "コンテキスト",
@@ -254,6 +254,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "컨텍스트에서 활성 파일 제거",
  "prompt.context.removeFile": "컨텍스트에서 파일 제거",
  "prompt.action.attachFile": "파일 첨부",
+  "prompt.menu.addImagesAndFiles": "파일 및 기타 항목 추가",
+  "prompt.menu.imagesAndFiles": "이미지 및 파일",
+  "prompt.menu.commands": "명령어",
+  "prompt.menu.context": "컨텍스트",
+  "prompt.menu.shellCommand": "셸 명령",
  "prompt.attachment.remove": "첨부 파일 제거",
  "prompt.action.send": "전송",
  "prompt.action.stop": "중지",
@@ -950,6 +955,7 @@ export const dict = {
  "home.sessions.group.today": "오늘",
  "home.sessions.group.yesterday": "어제",
  "home.sessions.group.older": "이전",
+  "home.providerTip": "75개 이상의 제공업체에 연결하여 Claude, GPT, Gemini 등의 다른 모델을 사용하세요",

  "session.tab.unknown": "알 수 없는 세션",
  "session.error.notFound": "이 세션을 찾을 수 없습니다",
@@ -277,6 +277,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Fjern aktiv fil fra kontekst",
  "prompt.context.removeFile": "Fjern fil fra kontekst",
  "prompt.action.attachFile": "Legg ved fil",
+  "prompt.menu.addImagesAndFiles": "Legg til filer og mer",
+  "prompt.menu.imagesAndFiles": "Bilder og filer",
+  "prompt.menu.commands": "Kommandoer",
+  "prompt.menu.context": "Kontekst",
+  "prompt.menu.shellCommand": "Shell-kommando",
  "prompt.attachment.remove": "Fjern vedlegg",
  "prompt.action.send": "Send",
  "prompt.action.stop": "Stopp",
@@ -1043,6 +1048,8 @@ export const dict = {
  "home.sessions.group.today": "I dag",
  "home.sessions.group.yesterday": "I går",
  "home.sessions.group.older": "Eldre",
+  "home.providerTip":
+    "Koble til over 75 leverandører for å bruke andre modeller, inkludert Claude, GPT, Gemini og flere",

  "session.tab.unknown": "Ukjent sesjon",
  "session.error.notFound": "Denne sesjonen finnes ikke",
@@ -42,7 +42,7 @@ const domains = [
  },
 ] as const

-describe("i18n parity", () => {
+describe.skipIf(!!process.env.CI)("i18n parity", () => {
  test("non-English locales have every English key", async () => {
    for (const domain of domains) {
      const source = await dictionary(domain.source)
@@ -268,6 +268,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Usuń aktywny plik z kontekstu",
  "prompt.context.removeFile": "Usuń plik z kontekstu",
  "prompt.action.attachFile": "Załącz plik",
+  "prompt.menu.addImagesAndFiles": "Dodaj pliki i inne elementy",
+  "prompt.menu.imagesAndFiles": "Obrazy i pliki",
+  "prompt.menu.commands": "Polecenia",
+  "prompt.menu.context": "Kontekst",
+  "prompt.menu.shellCommand": "Polecenie powłoki",
  "prompt.attachment.remove": "Usuń załącznik",
  "prompt.action.send": "Wyślij",
  "prompt.action.stop": "Zatrzymaj",
@@ -553,6 +558,8 @@ export const dict = {
  "home.sessions.group.today": "Dzisiaj",
  "home.sessions.group.yesterday": "Wczoraj",
  "home.sessions.group.older": "Starsze",
+  "home.providerTip":
+    "Połącz się z ponad 75 dostawcami, aby korzystać z innych modeli, w tym Claude, GPT, Gemini i innych",
  "session.tab.session": "Sesja",
  "session.tab.review": "Przegląd",
  "session.tab.context": "Kontekst",
@@ -286,6 +286,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Удалить активный файл из контекста",
  "prompt.context.removeFile": "Удалить файл из контекста",
  "prompt.action.attachFile": "Прикрепить файл",
+  "prompt.menu.addImagesAndFiles": "Добавить файлы и другое",
+  "prompt.menu.imagesAndFiles": "Изображения и файлы",
+  "prompt.menu.commands": "Команды",
+  "prompt.menu.context": "Контекст",
+  "prompt.menu.shellCommand": "Команда оболочки",
  "prompt.attachment.remove": "Удалить вложение",
  "prompt.action.send": "Отправить",
  "prompt.action.stop": "Остановить",
@@ -604,6 +609,8 @@ export const dict = {
  "home.sessions.group.today": "Сегодня",
  "home.sessions.group.yesterday": "Вчера",
  "home.sessions.group.older": "Ранее",
+  "home.providerTip":
+    "Подключитесь к более чем 75 провайдерам, чтобы использовать другие модели, включая Claude, GPT, Gemini и другие",

  "session.tab.session": "Сессия",
  "session.tab.review": "Обзор",
@@ -286,6 +286,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "เอาไฟล์ที่ใช้งานอยู่ออกจากบริบท",
  "prompt.context.removeFile": "เอาไฟล์ออกจากบริบท",
  "prompt.action.attachFile": "แนบไฟล์",
+  "prompt.menu.addImagesAndFiles": "เพิ่มไฟล์และอื่น ๆ",
+  "prompt.menu.imagesAndFiles": "รูปภาพและไฟล์",
+  "prompt.menu.commands": "คำสั่ง",
+  "prompt.menu.context": "บริบท",
+  "prompt.menu.shellCommand": "คำสั่งเชลล์",
  "prompt.attachment.remove": "เอาไฟล์แนบออก",
  "prompt.action.send": "ส่ง",
  "prompt.action.stop": "หยุด",
@@ -599,6 +604,7 @@ export const dict = {
  "home.sessions.group.today": "วันนี้",
  "home.sessions.group.yesterday": "เมื่อวาน",
  "home.sessions.group.older": "ก่อนหน้านี้",
+  "home.providerTip": "เชื่อมต่อกับผู้ให้บริการกว่า 75 รายเพื่อใช้โมเดลอื่นๆ รวมถึง Claude, GPT, Gemini และอีกมากมาย",

  "session.tab.session": "เซสชัน",
  "session.tab.review": "ตรวจสอบ",
@@ -291,6 +291,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Aktif dosyayı bağlamdan çıkar",
  "prompt.context.removeFile": "Dosyayı bağlamdan çıkar",
  "prompt.action.attachFile": "Dosya ekle",
+  "prompt.menu.addImagesAndFiles": "Dosya ve daha fazlasını ekle",
+  "prompt.menu.imagesAndFiles": "Görseller ve dosyalar",
+  "prompt.menu.commands": "Komutlar",
+  "prompt.menu.context": "Bağlam",
+  "prompt.menu.shellCommand": "Kabuk komutu",
  "prompt.attachment.remove": "Eki kaldır",
  "prompt.action.send": "Gönder",
  "prompt.action.stop": "Durdur",
@@ -608,6 +613,7 @@ export const dict = {
  "home.sessions.group.today": "Bugün",
  "home.sessions.group.yesterday": "Dün",
  "home.sessions.group.older": "Daha eski",
+  "home.providerTip": "Claude, GPT, Gemini ve diğer modelleri kullanmak için 75'ten fazla sağlayıcıya bağlanın",

  "session.tab.session": "Oturum",
  "session.tab.review": "İnceleme",
@@ -288,6 +288,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "Видалити активний файл з контексту",
  "prompt.context.removeFile": "Видалити файл з контексту",
  "prompt.action.attachFile": "Додати файли",
+  "prompt.menu.addImagesAndFiles": "Додати файли та інше",
+  "prompt.menu.imagesAndFiles": "Зображення та файли",
+  "prompt.menu.commands": "Команди",
+  "prompt.menu.context": "Контекст",
+  "prompt.menu.shellCommand": "Команда оболонки",
  "prompt.attachment.remove": "Видалити вкладення",
  "prompt.action.send": "Надіслати",
  "prompt.action.stop": "Зупинити",
@@ -626,6 +631,8 @@ export const dict = {
  "home.sessions.group.today": "Сьогодні",
  "home.sessions.group.yesterday": "Учора",
  "home.sessions.group.older": "Раніше",
+  "home.providerTip":
+    "Підключіться до понад 75 провайдерів, щоб використовувати інші моделі, зокрема Claude, GPT, Gemini та інші",

  "session.tab.session": "Сесія",
  "session.tab.review": "Огляд",
@@ -306,6 +306,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "从上下文移除活动文件",
  "prompt.context.removeFile": "从上下文移除文件",
  "prompt.action.attachFile": "附加文件",
+  "prompt.menu.addImagesAndFiles": "添加文件及更多内容",
+  "prompt.menu.imagesAndFiles": "图片和文件",
+  "prompt.menu.commands": "命令",
+  "prompt.menu.context": "上下文",
+  "prompt.menu.shellCommand": "shell 命令",
  "prompt.attachment.remove": "移除附件",
  "prompt.action.send": "发送",
  "prompt.action.stop": "停止",
@@ -600,6 +605,7 @@ export const dict = {
  "home.sessions.group.today": "今天",
  "home.sessions.group.yesterday": "昨天",
  "home.sessions.group.older": "更早",
+  "home.providerTip": "连接 75 个以上的提供商，使用 Claude、GPT、Gemini 等其他模型",

  "session.tab.session": "会话",
  "session.tab.review": "审查",
@@ -286,6 +286,11 @@ export const dict = {
  "prompt.context.removeActiveFile": "從上下文移除目前檔案",
  "prompt.context.removeFile": "從上下文移除檔案",
  "prompt.action.attachFile": "附加檔案",
+  "prompt.menu.addImagesAndFiles": "新增檔案及更多內容",
+  "prompt.menu.imagesAndFiles": "圖片和檔案",
+  "prompt.menu.commands": "命令",
+  "prompt.menu.context": "上下文",
+  "prompt.menu.shellCommand": "shell 命令",
  "prompt.attachment.remove": "移除附件",
  "prompt.action.send": "傳送",
  "prompt.action.stop": "停止",
@@ -595,6 +600,7 @@ export const dict = {
  "home.sessions.group.today": "今天",
  "home.sessions.group.yesterday": "昨天",
  "home.sessions.group.older": "更早",
+  "home.providerTip": "連接 75 個以上的供應商，使用 Claude、GPT、Gemini 等其他模型",

  "session.tab.session": "工作階段",
  "session.tab.review": "審查",
@@ -68,6 +68,7 @@ import { preloadMarkdown } from "@opencode-ai/session-ui/markdown-cache"
 import { archiveHomeSession } from "./home-session-archive"
 import { shouldOpenSessionInBackground } from "./home-session-open"
 import { showToast } from "@/utils/toast"
+import { fileManagerApp } from "@/utils/file-manager"

 const HOME_SESSION_LIMIT = 64
 const HOME_SESSION_HEADER_STICKY_TOP = 12
@@ -1030,8 +1031,24 @@ function HomeProjectRow(props: {
  language: ReturnType<typeof useLanguage>
 }) {
  const global = useGlobal()
+  const platform = usePlatform()
  const serverUnreachable = () => global.servers.health[ServerConnection.key(props.server)]?.healthy === false
  const [state, setState] = createStore({ menuOpen: false })
+  const canRevealInFileManager = () =>
+    platform.platform === "desktop" && !!platform.openPath && ServerConnection.local(props.server)
+  const fileManagerActionLabel = () =>
+    props.language.t(
+      fileManagerApp(platform.platform === "desktop" ? (platform.os ?? "unknown") : "unknown").actionLabel,
+    )
+  const revealInFileManager = () => {
+    if (!platform.openPath) return
+    platform.openPath(props.project.worktree).catch((err: unknown) =>
+      showToast({
+        title: props.language.t("common.requestFailed"),
+        description: errorMessage(err, props.language.t("common.requestFailed")),
+      }),
+    )
+  }
  return (
    <div class="group/project relative flex h-7 min-w-0 items-center rounded-[6px]">
      <button
@@ -1073,6 +1090,9 @@ function HomeProjectRow(props: {
              <MenuV2.Item onSelect={() => props.editProject(props.server, props.project)}>
                {props.language.t("dialog.project.edit.title")}
              </MenuV2.Item>
+              <Show when={canRevealInFileManager()}>
+                <MenuV2.Item onSelect={revealInFileManager}>{fileManagerActionLabel()}</MenuV2.Item>
+              </Show>
              <MenuV2.Item
                disabled={props.unseenCount === 0}
                onSelect={() => props.clearNotifications(props.server, props.project)}
@@ -1,7 +1,7 @@
 import { createEffect, Suspense, type ParentProps } from "solid-js"
 import { useNavigate } from "@solidjs/router"
 import { DebugBar } from "@/components/debug-bar"
-import { HelpButton } from "@/components/help-button"
+import { HelpButton, TabsInfoPopup } from "@/components/help-button"
 import { Titlebar, type TitlebarUpdate } from "@/components/titlebar"
 import { usePlatform } from "@/context/platform"
 import { setNavigate } from "@/utils/notification-click"
@@ -39,6 +39,7 @@ export default function NewLayout(props: ParentProps) {
        <Suspense>{props.children}</Suspense>
      </main>
      {import.meta.env.DEV && <DebugBar inline />}
+      <TabsInfoPopup />
      <HelpButton />
      <ToastRegion v2 />
    </div>
@@ -54,7 +54,7 @@ import { useTheme, type ColorScheme } from "@opencode-ai/ui/theme/context"
 import { useCommand, type CommandOption } from "@/context/command"
 import { ConstrainDragXAxis, getDraggableId } from "@/utils/solid-dnd"
 import { DebugBar } from "@/components/debug-bar"
-import { HelpButton } from "@/components/help-button"
+import { HelpButton, TabsInfoPopup } from "@/components/help-button"
 import { Titlebar, type TitlebarUpdate } from "@/components/titlebar"
 import { useDirectoryPicker } from "@/components/directory-picker"
 import { ServerConnection, useServer } from "@/context/server"
@@ -2395,6 +2395,7 @@ export default function LegacyLayout(props: ParentProps) {
        </div>
        {import.meta.env.DEV && import.meta.env.VITE_DISABLE_DEBUG_BAR !== "1" && <DebugBar />}
      </div>
+      <TabsInfoPopup />
      <HelpButton />
      <ToastRegion v2={false} />
    </div>
@@ -1,8 +1,10 @@
-import { Show, createEffect, createMemo, createResource, untrack } from "solid-js"
+import { Show, createEffect, createMemo, createResource, createSignal, onCleanup, untrack } from "solid-js"
 import { createStore } from "solid-js/store"
 import { Portal } from "solid-js/web"
 import { useSearchParams } from "@solidjs/router"
 import { Tooltip } from "@opencode-ai/ui/tooltip"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
+import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
 import { NewSessionDesignView } from "@/components/session"
 import { PromptInput } from "@/components/prompt-input"
 import { StatusPopoverV2 } from "@/components/status-popover"
@@ -24,8 +26,17 @@ 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"
 import { useTitlebarRightMount } from "@/components/titlebar"
+import { useCommand } from "@/context/command"
+import { useProviders } from "@/hooks/use-providers"
+import { useSettingsDialog } from "@/components/settings-dialog"
+import { Persist, persisted } from "@/utils/persist"
+import createPresence from "solid-presence"
+import { useLocal } from "@/context/local"
+import { createPromptModelSelection } from "@/pages/session/composer/prompt-model-selection"

 const workspaceBarEnabled = import.meta.env.VITE_OPENCODE_CHANNEL !== "prod"
+const providerTipDismissalDuration = 30 * 24 * 60 * 60 * 1000
+const providerTipExitDuration = 250

 /**
 * The `/new-session` draft page. Unlike `session.tsx`, this only renders the prompt
@@ -40,10 +51,15 @@ export default function NewSessionPage() {
  const comments = useComments()
  const language = useLanguage()
  const settings = useSettings()
+  const command = useCommand()
+  const providers = useProviders(() => sdk().directory)
+  const openProviderSettings = useSettingsDialog("providers")
  const route = useSessionKey()
  const [searchParams, setSearchParams] = useSearchParams<{ draftId?: string; prompt?: string }>()
+  const local = useLocal()
+  const model = createPromptModelSelection({ agent: local.agent.current })

-  useComposerCommands()
+  useComposerCommands({ model })

  let inputRef: HTMLDivElement | undefined

@@ -51,6 +67,7 @@ export default function NewSessionPage() {
    sessionKey: route.sessionKey,
    sessionID: () => route.params.id,
    queryOptions: serverSync().queryOptions,
+    model,
  })
  const projectControls = createPromptProjectControls()
  const projectController = createPromptProjectController({
@@ -58,6 +75,16 @@ export default function NewSessionPage() {
    onDone: () => inputRef?.focus(),
  })

+  command.register("new-session", () => [
+    {
+      id: "input.focus",
+      title: language.t("command.input.focus"),
+      category: language.t("command.category.view"),
+      keybind: "ctrl+l",
+      onSelect: () => inputRef?.focus(),
+    },
+  ])
+
  const [store, setStore] = createStore<{ worktree?: string }>({})
  const rightMount = useTitlebarRightMount()

@@ -174,9 +201,81 @@ export default function NewSessionPage() {
                </Show>
              </div>
            </NewSessionDesignView>
+            <ProviderTip
+              ready={() => serverSync().child(sdk().directory)[0].provider_ready}
+              connected={() => providers.paid().length > 0}
+              openProviders={openProviderSettings}
+            />
          </div>
        </div>
      </div>
    </div>
  )
 }
+
+function ProviderTip(props: { ready: () => boolean; connected: () => boolean; openProviders: () => void }) {
+  const language = useLanguage()
+  const [persistedState, setPersistedState, , persistedReady] = persisted(
+    Persist.global("new-session.provider-tip"),
+    createStore({ dismissedAt: 0 }),
+  )
+  const visible = createMemo(
+    () =>
+      props.ready() &&
+      persistedReady() &&
+      !props.connected() &&
+      Date.now() - persistedState.dismissedAt >= providerTipDismissalDuration,
+  )
+
+  function dismiss() {
+    setPersistedState("dismissedAt", Date.now())
+  }
+
+  const [ref, setRef] = createSignal<HTMLDivElement>()
+  const presence = createPresence({
+    show: () => visible(),
+    element: () => ref() ?? null,
+  })
+
+  return (
+    <Show when={presence.present()}>
+      <div class="pointer-events-none absolute inset-x-0 bottom-4 flex justify-center px-10">
+        <div
+          ref={setRef}
+          data-component="provider-tip"
+          data-visible={visible()}
+          class="group/provider-tip pointer-events-auto relative flex h-6 max-w-full items-center transition-[opacity,transform] duration-[250ms] ease-[cubic-bezier(0.215,0.61,0.355,1)] motion-reduce:transition-none"
+          classList={{
+            "data-[visible=false]:animate-out fade-out slide-out-to-bottom-4": true,
+          }}
+        >
+          <button
+            type="button"
+            class="flex h-6 min-w-0 items-center rounded-[4px] pl-1.5 text-[13px] leading-none tracking-[-0.04px] text-v2-text-text-faint transition-[background-color,color] duration-150 ease-in-out hover:bg-v2-overlay-simple-overlay-hover hover:text-v2-text-text-muted focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:text-v2-text-text-muted focus-visible:outline-none"
+            onClick={props.openProviders}
+          >
+            <span class="truncate">{language.t("home.providerTip")}</span>
+            <span class="flex size-6 shrink-0 items-center justify-center" aria-hidden="true">
+              <IconV2 name="chevron-down" size="small" class="-rotate-90" />
+            </span>
+          </button>
+          <TooltipV2
+            class="hover-reveal absolute left-full top-0 flex h-6 w-7 items-center justify-end delay-0 duration-0 group-hover/provider-tip:delay-[250ms] group-hover/provider-tip:duration-150 group-hover/provider-tip:opacity-100 focus-within:delay-0 focus-within:duration-0 focus-within:opacity-100"
+            placement="top"
+            openDelay={1000}
+            value={language.t("common.dismiss")}
+          >
+            <button
+              type="button"
+              class="flex size-6 items-center justify-center rounded-[4px] text-v2-icon-icon-muted transition-[background-color,color] duration-150 ease-in-out hover:bg-v2-overlay-simple-overlay-hover hover:text-v2-icon-icon-base focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:text-v2-icon-icon-base focus-visible:outline-none"
+              aria-label={language.t("common.dismiss")}
+              onClick={dismiss}
+            >
+              <IconV2 name="xmark-small" />
+            </button>
+          </TooltipV2>
+        </div>
+      </div>
+    </Show>
+  )
+}
@@ -1,4 +1,4 @@
-import type { Project, UserMessage } from "@opencode-ai/sdk/v2"
+import type { Project, UserMessage, VcsFileDiff } from "@opencode-ai/sdk/v2"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { createQuery, skipToken, useMutation, useQueryClient } from "@tanstack/solid-query"
 import {
@@ -11,6 +11,7 @@ import {
  createMemo,
  createEffect,
  createComputed,
+  createSignal,
  on,
  onMount,
  type ParentProps,
@@ -68,13 +69,19 @@ import { MessageTimeline } from "@/pages/session/timeline/message-timeline"
 import { createTimelineModel } from "@/pages/session/timeline/model"
 import { type DiffStyle, SessionReviewTab, type SessionReviewTabProps } from "@/pages/session/review-tab"
 import { useSessionLayout } from "@/pages/session/session-layout"
-import { syncSessionModel } from "@/pages/session/session-model-helpers"
+import { restorePromptModel, syncPromptModel, syncSessionModel } from "@/pages/session/session-model-helpers"
+import {
+  clampSessionPanelWidth,
+  SESSION_PANEL_WIDTH_MIN,
+  sessionPanelWidthMax,
+} from "@/pages/session/session-panel-width"
 import { SessionSidePanel } from "@/pages/session/session-side-panel"
 import { sessionPanelLayout } from "@/pages/session/session-panel-layout"
 import { SessionReviewEmptyChangesV2 } from "@opencode-ai/session-ui/v2/session-review-empty-changes-v2"
 import { SessionReviewEmptyNoGitV2 } from "@opencode-ai/session-ui/v2/session-review-empty-no-git-v2"
 import { ReviewPanelV2 } from "@/pages/session/v2/review-panel-v2"
 import { createReviewPanelV2State } from "@/pages/session/v2/review-panel-v2-state"
+import { reviewDiffDirectory, reviewDiffNeedsLoad, reviewRootDirectory } from "@/pages/session/v2/review-diff-kinds"
 import { TerminalPanel } from "@/pages/session/terminal-panel"
 import { TerminalPanelV2 } from "@/pages/session/terminal-panel-v2"
 import { useComposerCommands } from "@/pages/session/use-composer-commands"
@@ -100,7 +107,6 @@ type VcsMode = "git" | "branch"
 const sessionViewState = () => ({
  messageId: undefined as string | undefined,
  mobileTab: "session" as "session" | "changes",
-  changes: "git" as ChangeMode,
 })

 function isCurrentSessionNotFoundError(error: unknown, sessionID: string | undefined) {
@@ -347,6 +353,8 @@ export default function Page() {
  const location = useLocation()
  const navigate = useNavigate()
  const { params, sessionKey, workspaceKey, tabs, view } = useSessionLayout()
+  const reviewMode = () => view().review.mode() ?? "git"
+  const reviewFile = () => view().review.file()
  const sessionOwnership = createSessionOwnership(sessionKey)
  const newSessionDesign = createMemo(() => settings.general.newLayoutDesigns())

@@ -440,12 +448,42 @@ export default function Page() {
    newSessionDesign() ? desktopV2ReviewOpen() || desktopTerminalOpen() : desktopReviewOpen(),
  )
  const desktopSidePanelOpen = createMemo(() => desktopSessionResizeOpen() || desktopFileTreeOpen())
+  let panelRow: HTMLDivElement | undefined
+  const [panelRowWidth, setPanelRowWidth] = createSignal<number>()
+  createResizeObserver(
+    () => panelRow,
+    ({ width }) => setPanelRowWidth(width),
+  )
+  const splitReview = createMemo(
+    () => (newSessionDesign() ? desktopV2ReviewOpen() : desktopReviewOpen()) && layout.review.diffStyle() === "split",
+  )
+  // The observer reports the content-box width, which already excludes the row
+  // padding; only the flex gap between the panels remains to subtract.
+  const sessionPanelAvailable = createMemo(() => {
+    const width = panelRowWidth()
+    if (width === undefined) return undefined
+    return width - (settings.general.newLayoutDesigns() ? 8 : 0)
+  })
+  const sessionPanelMax = createMemo(() => {
+    const available = sessionPanelAvailable()
+    if (available === undefined) return 1000
+    return sessionPanelWidthMax({ available, split: splitReview() })
+  })
+  // Clamp at render time so window or sidebar resizes squeeze the chat panel
+  // instead of the review pane, without overwriting the persisted width.
+  const sessionPanelResizedWidth = createMemo(() =>
+    clampSessionPanelWidth({
+      width: layout.session.width(),
+      available: sessionPanelAvailable(),
+      split: splitReview(),
+    }),
+  )
  const sessionPanelWidth = createMemo(() => {
    if (!desktopSidePanelOpen()) return "100%"
-    if (desktopSessionResizeOpen()) return `${layout.session.width()}px`
+    if (desktopSessionResizeOpen()) return `${sessionPanelResizedWidth()}px`
    return `calc(100% - ${layout.fileTree.width()}px)`
  })
-  const centered = createMemo(() => isDesktop() && !desktopReviewOpen())
+  const centered = createMemo(() => isDesktop() && (newSessionDesign() || !desktopReviewOpen()))
  const desktopV2PanelLayout = createMemo(() =>
    sessionPanelLayout({
      review: desktopV2ReviewOpen(),
@@ -519,6 +557,17 @@ export default function Page() {
    ),
  )

+  let restoredModelSession: string | undefined
+  createEffect(() => {
+    const id = params.id
+    if (!id || !prompt.ready() || !local.session.ready()) return
+    if (restoredModelSession !== id) {
+      restoredModelSession = id
+      if (restorePromptModel(local, prompt)) return
+    }
+    syncPromptModel(local, prompt)
+  })
+
  createEffect(
    on(
      () => ({ dir: sdk().directory, id: params.id }),
@@ -606,7 +655,8 @@ export default function Page() {
      : store.mobileTab === "changes",
  )
  const vcsMode = createMemo<VcsMode | undefined>(() => {
-    if (store.changes === "git" || store.changes === "branch") return store.changes
+    const mode = reviewMode()
+    if (mode === "git" || mode === "branch") return mode
  })
  const vcsKey = createMemo(
    () =>
@@ -633,17 +683,63 @@ export default function Page() {
  })
  const refreshVcs = debounce(() => void queryClient.invalidateQueries({ queryKey: vcsKey() }), 100)
  const reviewDiffs = () => {
-    if (store.changes === "git" || store.changes === "branch")
+    if (reviewMode() === "git" || reviewMode() === "branch")
      // avoids suspense
      return vcsQuery.isFetched ? (vcsQuery.data ?? []) : []
    return turnDiffs()
  }
+  const activeReviewFile = () => {
+    const diffs = reviewDiffs()
+    const selected = reviewFile()
+    if (selected && diffs.some((diff) => diff.file === selected)) return selected
+    return diffs[0]?.file
+  }
  const reviewCount = () => reviewDiffs().length
  const hasReview = () => reviewCount() > 0
  const reviewReady = () => {
-    if (store.changes === "git" || store.changes === "branch") return !vcsQuery.isPending
+    if (reviewMode() === "git" || reviewMode() === "branch") return !vcsQuery.isPending
    return true
  }
+  const loadReviewDiff = async (file: string, version?: number): Promise<VcsFileDiff | undefined> => {
+    const mode = vcsMode()
+    if (!mode) return
+    const root = reviewRootDirectory(sync().project?.worktree ?? sdk().directory)
+    const directory = reviewDiffDirectory(root, file)
+    const source = reviewDiffs().find((diff) => diff.file === file)
+    const valid = (diff: VcsFileDiff | undefined) => {
+      if (!diff || !source) return
+      if (diff.additions !== source.additions || diff.deletions !== source.deletions) return
+      if (reviewDiffNeedsLoad(diff)) return
+      return diff
+    }
+    const request = (scope: string, context?: number) =>
+      queryClient
+        .fetchQuery({
+          queryKey: [serverSDK().scope, ...vcsKey(), mode, "directory", scope, context, version] as const,
+          staleTime: Number.POSITIVE_INFINITY,
+          retry: 2,
+          queryFn: () =>
+            sdk()
+              .client.vcs.diff({ mode, directory: scope, context })
+              .then((result) => result.data ?? []),
+        })
+        .then((diffs) => diffs.find((diff) => diff.file === file))
+
+    if (directory !== root) {
+      try {
+        const scoped = valid(await request(directory))
+        if (scoped) return scoped
+      } catch (error) {
+        console.debug("[session-review] failed to load scoped vcs diff", { mode, file, directory, error })
+      }
+    }
+    try {
+      const bounded = valid(await request(root, 3))
+      if (bounded) return bounded
+    } catch (error) {
+      console.debug("[session-review] failed to load bounded vcs diff", { mode, file, root, error })
+    }
+  }

  const newSessionWorktree = createMemo(() => {
    if (store.newSessionWorktree === "create") return "create"
@@ -961,12 +1057,15 @@ export default function Page() {
  }

  createEffect(() => {
+    if (!layout.ready()) return
+    if (sync().status !== "complete") return
    if (!sync().project) return
    const list = changesOptions()
-    if (list.includes(store.changes)) return
+    const mode = reviewMode()
+    if (list.includes(mode)) return
    const next = list[0]
    if (!next) return
-    setStore("changes", next)
+    view().review.setMode(next)
  })

  createEffect(
@@ -986,7 +1085,6 @@ export default function Page() {
  const [tree, setTree] = createStore({
    reviewScroll: undefined as HTMLDivElement | undefined,
    pendingDiff: undefined as string | undefined,
-    activeDiff: undefined as string | undefined,
  })

  createEffect(
@@ -996,7 +1094,6 @@ export default function Page() {
        setTree({
          reviewScroll: undefined,
          pendingDiff: undefined,
-          activeDiff: undefined,
        })
      },
      { defer: true },
@@ -1019,6 +1116,7 @@ export default function Page() {
    setActiveMessage,
    focusInput,
    review: reviewTab,
+    fileBrowser: () => newSessionDesign() && isDesktop() && !!params.id,
  })

  const openReviewFile = createOpenReviewFile({
@@ -1043,9 +1141,9 @@ export default function Page() {
    return (
      <Select
        options={changesOptions()}
-        current={store.changes}
+        current={reviewMode()}
        label={changesLabel}
-        onSelect={(option) => option && setStore("changes", option)}
+        onSelect={(option) => option && view().review.setMode(option)}
        variant="ghost"
        size="small"
        valueClass="text-14-medium"
@@ -1062,11 +1160,11 @@ export default function Page() {
      <SelectV2
        appearance="inline"
        options={changesOptions()}
-        current={store.changes}
+        current={reviewMode()}
        label={changesLabel}
        placement="bottom-start"
        gutter={6}
-        onSelect={(option) => option && setStore("changes", option)}
+        onSelect={(option) => option && view().review.setMode(option)}
      />
    )
  }
@@ -1094,18 +1192,18 @@ export default function Page() {
  )

  const reviewEmptyText = createMemo(() => {
-    if (store.changes === "git") return language.t("session.review.noUncommittedChanges")
-    if (store.changes === "branch") return language.t("session.review.noBranchChanges")
+    if (reviewMode() === "git") return language.t("session.review.noUncommittedChanges")
+    if (reviewMode() === "branch") return language.t("session.review.noBranchChanges")
    return language.t("session.review.noChanges")
  })

  const reviewEmpty = (input: { loadingClass: string; emptyClass: string }) => {
-    if (store.changes === "git" || store.changes === "branch") {
+    if (reviewMode() === "git" || reviewMode() === "branch") {
      if (!reviewReady()) return <div class={input.loadingClass}>{language.t("session.review.loadingChanges")}</div>
      return empty(reviewEmptyText())
    }

-    if (store.changes === "turn") {
+    if (reviewMode() === "turn") {
      if (nogit()) return createGit(input)
      return empty(reviewEmptyText())
    }
@@ -1118,10 +1216,10 @@ export default function Page() {
  }

  const reviewEmptyV2 = () => {
-    if ((store.changes === "git" || store.changes === "branch") && !reviewReady()) {
+    if ((reviewMode() === "git" || reviewMode() === "branch") && !reviewReady()) {
      return <div class="px-6 py-4 text-text-weak">{language.t("session.review.loadingChanges")}</div>
    }
-    if (store.changes === "turn" && nogit()) {
+    if (reviewMode() === "turn" && nogit()) {
      return <SessionReviewEmptyNoGitV2 pending={gitMutation.isPending} onInitGit={initGit} />
    }
    return <SessionReviewEmptyChangesV2 />
@@ -1143,7 +1241,7 @@ export default function Page() {
        diffStyle={input.diffStyle}
        onDiffStyleChange={input.onDiffStyleChange}
        onScrollRef={(el) => setTree("reviewScroll", el)}
-        focusedFile={tree.activeDiff}
+        focusedFile={activeReviewFile()}
        onLineComment={(comment) => addCommentToContext({ ...comment, origin: "review" })}
        onLineCommentUpdate={updateCommentInContext}
        onLineCommentDelete={removeCommentFromContext}
@@ -1174,8 +1272,12 @@ export default function Page() {
    },
    diffs: reviewDiffs,
    diffsReady: reviewReady,
+    get diffVersion() {
+      return vcsQuery.dataUpdatedAt
+    },
+    loadDiff: loadReviewDiff,
    get activeFile() {
-      return tree.activeDiff
+      return activeReviewFile()
    },
    onSelectFile: focusReviewDiff,
    get diffStyle() {
@@ -1213,7 +1315,7 @@ export default function Page() {
  const reviewPanelV2Rendered = createMemo<boolean>((prev) => prev || !store.deferRender, false)

  const reviewPanelV2 = () => (
-    <div class="flex flex-col h-full overflow-hidden bg-background-stronger contain-strict">
+    <div class="flex flex-col h-full overflow-hidden bg-v2-background-bg-base contain-strict">
      <Show when={reviewPanelV2Rendered()}>
        <ReviewPanelV2 {...reviewPanelV2Props()} />
      </Show>
@@ -1288,7 +1390,8 @@ export default function Page() {
  const focusReviewDiff = (path: string) => {
    openReviewPanel()
    view().review.openPath(path)
-    setTree({ activeDiff: path, pendingDiff: path })
+    view().review.setFile(path)
+    setTree("pendingDiff", path)
  }

  createEffect(() => {
@@ -2092,6 +2195,7 @@ export default function Page() {
    <SessionRouteFrame>
      <SessionHeader />
      <div
+        ref={panelRow}
        class="flex-1 min-h-0 flex flex-col md:flex-row"
        classList={{
          "gap-2 p-2": settings.general.newLayoutDesigns(),
@@ -2130,9 +2234,9 @@ export default function Page() {
                  "-right-1": settings.general.newLayoutDesigns(),
                }}
                direction="horizontal"
-                size={layout.session.width()}
-                min={450}
-                max={typeof window === "undefined" ? 1000 : window.innerWidth * 0.45}
+                size={sessionPanelResizedWidth()}
+                min={SESSION_PANEL_WIDTH_MIN}
+                max={sessionPanelMax()}
                onResize={(width) => {
                  size.touch()
                  layout.session.resize(width)
@@ -2142,7 +2246,7 @@ export default function Page() {
          </Show>
        </div>

-        <Show when={!newSessionDesign()}>
+        <Show when={!newSessionDesign() && desktopSidePanelOpen()}>
          <SessionSidePanel
            canReview={canReview}
            diffs={reviewDiffs}
@@ -2152,7 +2256,7 @@ export default function Page() {
            reviewHasFocusableContent={hasReview}
            reviewCount={reviewCount}
            reviewPanel={reviewPanel}
-            activeDiff={tree.activeDiff}
+            activeDiff={activeReviewFile()}
            focusReviewDiff={focusReviewDiff}
            reviewSnap={ui.reviewSnap}
            size={size}
@@ -2161,13 +2265,8 @@ export default function Page() {
        <Show when={newSessionDesign()}>
          <Show when={isDesktop() ? desktopV2PanelLayout().visible : terminalOpen()}>
            <div class="min-w-0 h-full flex flex-1 flex-col">
-              <Show when={isDesktop()}>
-                <div
-                  classList={{
-                    "min-h-0 flex-1": desktopV2ReviewOpen() || desktopFileTreeOpen(),
-                    "size-0 shrink-0 overflow-hidden": !(desktopV2ReviewOpen() || desktopFileTreeOpen()),
-                  }}
-                >
+              <Show when={isDesktop() && (desktopV2ReviewOpen() || desktopFileTreeOpen())}>
+                <div class="min-h-0 flex-1">
                  <SessionSidePanel
                    canReview={canReview}
                    diffs={reviewDiffs}
@@ -2177,7 +2276,8 @@ export default function Page() {
                    reviewHasFocusableContent={() => hasReview() || reviewV2State.sidebarOpened()}
                    reviewCount={reviewCount}
                    reviewPanel={reviewPanelV2}
-                    activeDiff={tree.activeDiff}
+                    fileBrowserState={reviewV2State}
+                    activeDiff={activeReviewFile()}
                    focusReviewDiff={focusReviewDiff}
                    reviewSnap={ui.reviewSnap}
                    size={size}
@@ -0,0 +1,133 @@
+import { batch, createMemo, startTransition } from "solid-js"
+import { useModels } from "@/context/models"
+import type { ModelKey, ModelSelection } from "@/context/local"
+import { cycleModelVariant, getConfiguredAgentVariant, resolveModelVariant } from "@/context/model-variant"
+import { usePrompt } from "@/context/prompt"
+import { useSDK } from "@/context/sdk"
+import { useSync } from "@/context/sync"
+import { useProviders } from "@/hooks/use-providers"
+
+export function createPromptModelSelection(input: { agent: () => { model?: ModelKey; variant?: string } | undefined }) {
+  const sdk = useSDK()
+  const sync = useSync()
+  const models = useModels()
+  const prompt = usePrompt()
+  const providers = useProviders(() => sdk().directory)
+  const connected = createMemo(() => new Set(providers.connected().map((item) => item.id)))
+
+  const valid = (model: ModelKey) => {
+    const provider = providers.all().get(model.providerID)
+    return !!provider?.models[model.modelID] && connected().has(model.providerID)
+  }
+
+  const configured = () => {
+    const value = sync().data.config.model
+    if (!value) return
+    const [providerID, modelID] = value.split("/")
+    const model = { providerID, modelID }
+    if (valid(model)) return model
+  }
+
+  const recent = () => models.recent.list().find(valid)
+  const fallback = () => {
+    const defaults = providers.default()
+    return providers.connected().flatMap((provider) => {
+      const modelID = defaults[provider.id] ?? Object.values(provider.models)[0]?.id
+      return modelID ? [{ providerID: provider.id, modelID }] : []
+    })[0]
+  }
+
+  const current = () => {
+    const key = [prompt.model.current(), input.agent()?.model, configured(), recent(), fallback()].find(
+      (item): item is ModelKey => !!item && valid(item),
+    )
+    if (!key) return
+    return models.find(key)
+  }
+  const recentModels = createMemo(() =>
+    models.recent
+      .list()
+      .map(models.find)
+      .filter((item): item is NonNullable<typeof item> => !!item),
+  )
+
+  const selection = {
+    ready: models.ready,
+    current,
+    recent: recentModels,
+    list: models.list,
+    cycle(direction: 1 | -1) {
+      const items = recentModels()
+      const item = current()
+      if (!item) return
+      const index = items.findIndex((entry) => entry.provider.id === item.provider.id && entry.id === item.id)
+      if (index === -1) return
+      const next = items[(index + direction + items.length) % items.length]
+      if (next) selection.set({ providerID: next.provider.id, modelID: next.id })
+    },
+    set(item: ModelKey | undefined, options?: { recent?: boolean }) {
+      startTransition(() =>
+        batch(() => {
+          prompt.model.set(item ? { ...item, variant: prompt.model.current()?.variant } : undefined)
+          if (!item) return
+          models.setVisibility(item, true)
+          if (options?.recent) models.recent.push(item)
+        }),
+      )
+    },
+    visible: models.visible,
+    setVisibility: models.setVisibility,
+    variant: {
+      configured() {
+        const item = input.agent()
+        const model = current()
+        if (!item || !model) return
+        return getConfiguredAgentVariant({
+          agent: { model: item.model, variant: item.variant },
+          model: { providerID: model.provider.id, modelID: model.id, variants: model.variants },
+        })
+      },
+      selected() {
+        return prompt.model.current()?.variant
+      },
+      current() {
+        const resolved = resolveModelVariant({
+          variants: this.list(),
+          selected: this.selected(),
+          configured: this.configured(),
+        })
+        if (resolved) return resolved
+        const model = current()
+        if (!model) return
+        const saved = models.variant.get({ providerID: model.provider.id, modelID: model.id })
+        if (saved && this.list().includes(saved)) return saved
+      },
+      list() {
+        return Object.keys(current()?.variants ?? {})
+      },
+      set(value: string | undefined) {
+        startTransition(() =>
+          batch(() => {
+            const model = current()
+            if (!model) return
+            prompt.model.set({ providerID: model.provider.id, modelID: model.id, variant: value ?? null })
+            models.variant.set({ providerID: model.provider.id, modelID: model.id }, value)
+          }),
+        )
+      },
+      cycle() {
+        const variants = this.list()
+        if (variants.length === 0) return
+        this.set(
+          cycleModelVariant({
+            variants,
+            selected: this.selected(),
+            configured: this.configured(),
+          }),
+        )
+      },
+    },
+  } satisfies ModelSelection
+
+  return selection
+}
@@ -7,7 +7,7 @@ import type { PromptProjectControls } from "@/components/prompt-project-selector
 import { useDirectoryPicker } from "@/components/directory-picker"
 import { useGlobal } from "@/context/global"
 import { useLayout } from "@/context/layout"
-import { useLocal } from "@/context/local"
+import { useLocal, type ModelSelection } from "@/context/local"
 import type { QueryOptionsApi } from "@/context/server-sync"
 import { useServerSDK } from "@/context/server-sdk"
 import { serverName, ServerConnection, useServer } from "@/context/server"
@@ -22,6 +22,7 @@ export function createPromptInputController(input: {
  sessionKey: Accessor<string>
  sessionID: Accessor<string | undefined>
  queryOptions: Pick<QueryOptionsApi, "agents" | "providers">
+  model?: ModelSelection
 }) {
  const layout = useLayout()
  const local = useLocal()
@@ -44,7 +45,7 @@ export function createPromptInputController(input: {
      select: local.agent.set,
    },
    model: {
-      selection: local.model,
+      selection: input.model ?? local.model,
      paid: providers.paid().length > 0,
      loading: agentsQuery.isLoading || providersQuery.isLoading || globalProvidersQuery.isLoading,
    },
@@ -0,0 +1,118 @@
+import { For } from "solid-js"
+import { createStore } from "solid-js/store"
+import { SessionRevertDock } from "@/pages/session/composer/session-revert-dock"
+import { SettingsProvider, useSettings } from "@/context/settings"
+
+export default {
+  title: "Composer/Revert Dock",
+  id: "composer-revert-dock",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: `### Overview
+Real \`SessionRevertDock\` from app code, rendered above a mock composer card.
+
+### Source path
+- \`packages/app/src/pages/session/composer/session-revert-dock.tsx\`
+
+### Why the mock composer
+The live composer overlaps the dock's bottom by 18px (\`session-composer-region-controller.ts\` \`lift()\`).
+The card below reproduces that overlap so the collapsed/expanded cutoff behavior can be verified in isolation.
+
+### Layout split
+Use the **Layout** button to toggle \`newLayoutDesigns\` and preview both the v2 dock and the legacy (v1) \`DockTray\` fallback.
+
+### Notes
+- \`onRestore\` only mutates local story state, so nothing in the real session is affected.
+- Click the header to expand/collapse. Click "Restore message" to remove a row.`,
+      },
+    },
+  },
+}
+
+const messages = [
+  "update current branch with latest changes from dev and fix conflicts if any",
+  "investigate why the chat input loses focus after sending a message",
+  "Debug why streaming responses sometimes duplicate the last token",
+  "suggest a better title for this PR based on the diff",
+  "add a storybook story for the revert dock",
+  "reduce re-renders in the timeline component",
+]
+
+const btn = (accent?: boolean) =>
+  ({
+    padding: "6px 12px",
+    "border-radius": "6px",
+    border: "1px solid var(--v2-border-border-base, #0000001a)",
+    background: accent ? "var(--v2-background-bg-contrast, #242424)" : "var(--v2-background-bg-base, #fff)",
+    color: accent ? "var(--v2-text-text-contrast, #fafafa)" : "var(--v2-text-text-base, #161616)",
+    cursor: "pointer",
+    "font-size": "13px",
+  }) as const
+
+function Stage(props: { count: number }) {
+  const settings = useSettings()
+  const seed = () => messages.slice(0, props.count).map((text, index) => ({ id: `rolled-${index}`, text }))
+  const [store, setStore] = createStore({ items: seed() })
+
+  const v2 = () => settings.general.newLayoutDesigns()
+  const reset = () => setStore("items", seed())
+  const restore = (id: string) =>
+    setStore(
+      "items",
+      store.items.filter((item) => item.id !== id),
+    )
+
+  return (
+    <div style={{ display: "grid", gap: "16px", "max-width": "720px" }}>
+      <div style={{ display: "flex", gap: "8px" }}>
+        <button style={btn()} onClick={reset}>
+          Reset ({props.count})
+        </button>
+        <button style={btn(v2())} onClick={() => settings.general.setNewLayoutDesigns(!v2())}>
+          Layout: {v2() ? "v2" : "v1"}
+        </button>
+      </div>
+
+      {/* Reproduce the real composer stack: dock + card overlapping the dock's bottom by lift() = 18px */}
+      <div style={{ display: "flex", "flex-direction": "column" }}>
+        <SessionRevertDock items={store.items} onRestore={restore} />
+        <div
+          style={{ position: "relative", "z-index": 70, "margin-top": "-18px" }}
+          class="min-h-24 w-full rounded-[12px] border border-v2-border-border-base bg-v2-background-bg-base px-4 py-3 text-[13px] text-v2-text-text-faint"
+        >
+          Ask anything...
+        </div>
+      </div>
+
+      <div class="text-[12px] text-v2-text-text-faint">
+        Restored so far:{" "}
+        <For each={seed()}>
+          {(item) => <span>{store.items.some((current) => current.id === item.id) ? "" : `“${item.text}” `}</span>}
+        </For>
+      </div>
+    </div>
+  )
+}
+
+const story = (count: number) => () => (
+  <SettingsProvider>
+    <Stage count={count} />
+  </SettingsProvider>
+)
+
+export const OneMessage = {
+  name: "1 rolled back",
+  render: story(1),
+}
+
+export const ThreeMessages = {
+  name: "3 rolled back",
+  render: story(3),
+}
+
+export const ManyMessages = {
+  name: "6 rolled back (scrolls)",
+  render: story(6),
+}
@@ -3,7 +3,11 @@ import { createStore } from "solid-js/store"
 import { Button } from "@opencode-ai/ui/button"
 import { DockTray } from "@opencode-ai/ui/dock-surface"
 import { IconButton } from "@opencode-ai/ui/icon-button"
+import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
+import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
 import { useLanguage } from "@/context/language"
+import { useSettings } from "@/context/settings"

 export function SessionRevertDock(props: {
  items: { id: string; text: string }[]
@@ -12,6 +16,7 @@ export function SessionRevertDock(props: {
  onRestore: (id: string) => void
 }) {
  const language = useLanguage()
+  const settings = useSettings()
  const [store, setStore] = createStore({
    collapsed: true,
  })
@@ -31,69 +36,153 @@ export function SessionRevertDock(props: {
  )
  const preview = createMemo(() => props.items[0]?.text ?? "")

+  const onHeaderKeyDown = (event: KeyboardEvent) => {
+    if (event.key !== "Enter" && event.key !== " ") return
+    event.preventDefault()
+    toggle()
+  }
+
  return (
-    <DockTray data-component="session-revert-dock">
+    <Show
+      when={settings.general.newLayoutDesigns()}
+      fallback={
+        <DockTray data-component="session-revert-dock">
+          <div
+            class="pl-3 pr-2 py-2 flex items-center gap-2"
+            role="button"
+            tabIndex={0}
+            onClick={toggle}
+            onKeyDown={onHeaderKeyDown}
+          >
+            <span class="shrink-0 text-14-regular text-text-strong cursor-default">{label()}</span>
+            <Show when={store.collapsed && preview()}>
+              <span class="min-w-0 flex-1 truncate text-14-regular text-text-base cursor-default">{preview()}</span>
+            </Show>
+            <div class="ml-auto shrink-0">
+              <IconButton
+                icon="chevron-down"
+                size="normal"
+                variant="ghost"
+                style={{ transform: `rotate(${store.collapsed ? 180 : 0}deg)` }}
+                onMouseDown={(event) => {
+                  event.preventDefault()
+                  event.stopPropagation()
+                }}
+                onClick={(event) => {
+                  event.stopPropagation()
+                  toggle()
+                }}
+                aria-label={
+                  store.collapsed ? language.t("session.revertDock.expand") : language.t("session.revertDock.collapse")
+                }
+              />
+            </div>
+          </div>
+
+          <Show when={store.collapsed}>
+            <div class="h-5" aria-hidden="true" />
+          </Show>
+
+          <Show when={!store.collapsed}>
+            <div class="px-3 pb-7 flex flex-col gap-1.5 max-h-42 overflow-y-auto no-scrollbar">
+              <For each={props.items}>
+                {(item) => (
+                  <div class="flex items-center gap-2 min-w-0 py-1">
+                    <span class="min-w-0 flex-1 truncate text-13-regular text-text-strong">{item.text}</span>
+                    <Button
+                      size="small"
+                      variant="secondary"
+                      class="shrink-0"
+                      disabled={props.disabled || !!props.restoring}
+                      onClick={() => props.onRestore(item.id)}
+                    >
+                      {language.t("session.revertDock.restore")}
+                    </Button>
+                  </div>
+                )}
+              </For>
+            </div>
+          </Show>
+        </DockTray>
+      }
+    >
      <div
-        class="pl-3 pr-2 py-2 flex items-center gap-2"
-        role="button"
-        tabIndex={0}
-        onClick={toggle}
-        onKeyDown={(event) => {
-          if (event.key !== "Enter" && event.key !== " ") return
-          event.preventDefault()
-          toggle()
-        }}
+        data-component="session-revert-dock"
+        class="w-full overflow-hidden rounded-xl border-[0.5px] border-v2-border-border-base bg-v2-background-bg-layer-01"
      >
-        <span class="shrink-0 text-14-regular text-text-strong cursor-default">{label()}</span>
-        <Show when={store.collapsed && preview()}>
-          <span class="min-w-0 flex-1 truncate text-14-regular text-text-base cursor-default">{preview()}</span>
+        <div
+          class="flex h-[42px] items-center gap-2 pl-4 pr-2"
+          role="button"
+          tabIndex={0}
+          onClick={toggle}
+          onKeyDown={onHeaderKeyDown}
+        >
+          <IconV2 name="outline-reset" size="normal" class="text-v2-icon-icon-muted" />
+          <span
+            classList={{
+              "font-[440] shrink-0 cursor-default text-[13px] leading-5 tracking-[-0.04px]": true,
+              "text-v2-text-text-base": !store.collapsed,
+              "text-v2-text-text-muted": store.collapsed,
+            }}
+          >
+            {label()}
+          </span>
+          <Show when={store.collapsed && preview()}>
+            <span class="min-w-0 flex-1 truncate cursor-default text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-faint">
+              {preview()}
+            </span>
+          </Show>
+          <div class="ml-auto shrink-0">
+            <IconButtonV2
+              icon={<IconV2 name="outline-chevron-down" size="small" />}
+              size="large"
+              variant="ghost-muted"
+              style={{ transform: `rotate(${store.collapsed ? 180 : 0}deg)` }}
+              onMouseDown={(event) => {
+                event.preventDefault()
+                event.stopPropagation()
+              }}
+              onClick={(event) => {
+                event.stopPropagation()
+                toggle()
+              }}
+              aria-label={
+                store.collapsed ? language.t("session.revertDock.expand") : language.t("session.revertDock.collapse")
+              }
+            />
+          </div>
+        </div>
+
+        {/* Sacrificial space the composer overlaps via its negative lift (18px), so the header stays fully visible */}
+        <Show when={store.collapsed}>
+          <div class="h-[18px]" aria-hidden="true" />
+        </Show>
+
+        <Show when={!store.collapsed}>
+          {/* Scroll viewport ends above the composer; the 18px sacrificial below is what the composer overlaps */}
+          <div class="flex max-h-42 flex-col gap-2 overflow-y-auto px-4 pt-px pb-3 no-scrollbar">
+            <For each={props.items}>
+              {(item) => (
+                <div class="flex h-6 min-w-0 items-center gap-2">
+                  <span class="min-w-0 flex-1 truncate text-[13px] font-[400] leading-5 tracking-[-0.04px] text-v2-text-text-muted">
+                    {item.text}
+                  </span>
+                  <ButtonV2
+                    size="small"
+                    variant="neutral"
+                    class="shrink-0"
+                    disabled={props.disabled || !!props.restoring}
+                    onClick={() => props.onRestore(item.id)}
+                  >
+                    {language.t("session.revertDock.restore")}
+                  </ButtonV2>
+                </div>
+              )}
+            </For>
+          </div>
+          <div class="h-[18px]" aria-hidden="true" />
        </Show>
-        <div class="ml-auto shrink-0">
-          <IconButton
-            data-collapsed={store.collapsed ? "true" : "false"}
-            icon="chevron-down"
-            size="normal"
-            variant="ghost"
-            style={{ transform: `rotate(${store.collapsed ? 180 : 0}deg)` }}
-            onMouseDown={(event) => {
-              event.preventDefault()
-              event.stopPropagation()
-            }}
-            onClick={(event) => {
-              event.stopPropagation()
-              toggle()
-            }}
-            aria-label={
-              store.collapsed ? language.t("session.revertDock.expand") : language.t("session.revertDock.collapse")
-            }
-          />
-        </div>
      </div>
-
-      <Show when={store.collapsed}>
-        <div class="h-5" aria-hidden="true" />
-      </Show>
-
-      <Show when={!store.collapsed}>
-        <div class="px-3 pb-7 flex flex-col gap-1.5 max-h-42 overflow-y-auto no-scrollbar">
-          <For each={props.items}>
-            {(item) => (
-              <div class="flex items-center gap-2 min-w-0 py-1">
-                <span class="min-w-0 flex-1 truncate text-13-regular text-text-strong">{item.text}</span>
-                <Button
-                  size="small"
-                  variant="secondary"
-                  class="shrink-0"
-                  disabled={props.disabled || !!props.restoring}
-                  onClick={() => props.onRestore(item.id)}
-                >
-                  {language.t("session.revertDock.restore")}
-                </Button>
-              </div>
-            )}
-          </For>
-        </div>
-      </Show>
-    </DockTray>
+    </Show>
  )
 }
@@ -172,6 +172,14 @@ function createScrollSync(input: { tab: () => string; view: ReturnType<typeof us
 }

 export function FileTabContent(props: { tab: string }) {
+  return (
+    <Tabs.Content value={props.tab}>
+      <SessionFileView tab={props.tab} />
+    </Tabs.Content>
+  )
+}
+
+export function SessionFileView(props: { tab: string }) {
  const file = useFile()
  const comments = useComments()
  const language = useLanguage()
@@ -439,8 +447,8 @@ export function FileTabContent(props: { tab: string }) {
    </div>
  )

-  return (
-    <Tabs.Content value={props.tab} class="mt-3 relative h-full">
+  const content = () => (
+    <div class="mt-3 relative h-full min-h-0">
      <ScrollView class="h-full" viewportRef={scrollSync.setViewport} onScroll={scrollSync.handleScroll as any}>
        <Switch>
          <Match when={state()?.loaded}>{renderFile(contents())}</Match>
@@ -450,6 +458,8 @@ export function FileTabContent(props: { tab: string }) {
          <Match when={state()?.error}>{(err) => <div class="px-6 py-4 text-text-weak">{err()}</div>}</Match>
        </Switch>
      </ScrollView>
-    </Tabs.Content>
+    </div>
  )
+
+  return content()
 }
@@ -2,6 +2,7 @@ import { describe, expect, test } from "bun:test"
 import { createMemo, createRoot } from "solid-js"
 import { createStore } from "solid-js/store"
 import {
+  SESSION_OPEN_FILE_TAB,
  createOpenReviewFile,
  createOpenSessionFileTab,
  createSessionTabs,
@@ -165,4 +166,49 @@ describe("createSessionTabs", () => {
      dispose()
    })
  })
+
+  test("exposes the Open File tab without treating it as a file tab", () => {
+    createRoot((dispose) => {
+      const [state] = createStore({
+        active: SESSION_OPEN_FILE_TAB as string | undefined,
+        all: ["file://src/a.ts", SESSION_OPEN_FILE_TAB],
+      })
+      const tabs = createMemo(() => ({ active: () => state.active, all: () => state.all }))
+      const result = createSessionTabs({
+        tabs,
+        pathFromTab: (tab) => (tab.startsWith("file://") ? tab.slice("file://".length) : undefined),
+        normalizeTab: (tab) => tab,
+        fileBrowser: () => true,
+      })
+
+      expect(result.openFileOpen()).toBe(true)
+      expect(result.panelTabs()).toEqual(["file://src/a.ts", SESSION_OPEN_FILE_TAB])
+      expect(result.openedTabs()).toEqual(["file://src/a.ts"])
+      expect(result.activeTab()).toBe(SESSION_OPEN_FILE_TAB)
+      expect(result.activeFileTab()).toBeUndefined()
+      expect(result.closableTab()).toBe(SESSION_OPEN_FILE_TAB)
+      dispose()
+    })
+  })
+
+  test("hides the Open File placeholder when the file browser is unavailable", () => {
+    createRoot((dispose) => {
+      const [state] = createStore({
+        active: SESSION_OPEN_FILE_TAB as string | undefined,
+        all: ["file://src/a.ts", SESSION_OPEN_FILE_TAB],
+      })
+      const tabs = createMemo(() => ({ active: () => state.active, all: () => state.all }))
+      const result = createSessionTabs({
+        tabs,
+        pathFromTab: (tab) => (tab.startsWith("file://") ? tab.slice("file://".length) : undefined),
+        normalizeTab: (tab) => tab,
+        fileBrowser: () => false,
+      })
+
+      expect(result.openFileOpen()).toBe(false)
+      expect(result.panelTabs()).toEqual(["file://src/a.ts"])
+      expect(result.activeTab()).toBe("file://src/a.ts")
+      dispose()
+    })
+  })
 })
@@ -2,6 +2,9 @@ import { batch, createMemo, onCleanup, onMount, type Accessor } from "solid-js"
 import { createStore } from "solid-js/store"
 import { makeEventListener } from "@solid-primitives/event-listener"
 import { same } from "@/utils/same"
+import { SESSION_OPEN_FILE_TAB } from "@/context/layout-tabs"
+
+export { SESSION_OPEN_FILE_TAB } from "@/context/layout-tabs"

 const emptyTabs: string[] = []

@@ -16,6 +19,7 @@ type TabsInput = {
  normalizeTab: (tab: string) => string
  review?: Accessor<boolean>
  hasReview?: Accessor<boolean>
+  fileBrowser?: Accessor<boolean>
 }

 export const getSessionKey = (dir: string | undefined, id: string | undefined) => `${dir ?? ""}${id ? `/${id}` : ""}`
@@ -27,8 +31,14 @@ export function shouldShowFileTree(input: { visible: boolean; opened: boolean })
 export const createSessionTabs = (input: TabsInput) => {
  const review = input.review ?? (() => false)
  const hasReview = input.hasReview ?? (() => false)
+  const fileBrowser = input.fileBrowser ?? (() => false)
  const contextOpen = createMemo(() => input.tabs().active() === "context" || input.tabs().all().includes("context"))
-  const openedTabs = createMemo(
+  const openFileOpen = createMemo(
+    () =>
+      fileBrowser() &&
+      (input.tabs().active() === SESSION_OPEN_FILE_TAB || input.tabs().all().includes(SESSION_OPEN_FILE_TAB)),
+  )
+  const panelTabs = createMemo(
    () => {
      const seen = new Set<string>()
      return input
@@ -36,6 +46,7 @@ export const createSessionTabs = (input: TabsInput) => {
        .all()
        .flatMap((tab) => {
          if (tab === "context" || tab === "review") return []
+          if (tab === SESSION_OPEN_FILE_TAB && !fileBrowser()) return []
          const value = input.pathFromTab(tab) ? input.normalizeTab(tab) : tab
          if (seen.has(value)) return []
          seen.add(value)
@@ -45,9 +56,13 @@ export const createSessionTabs = (input: TabsInput) => {
    emptyTabs,
    { equals: same },
  )
+  const openedTabs = createMemo(() => panelTabs().filter((tab) => tab !== SESSION_OPEN_FILE_TAB), emptyTabs, {
+    equals: same,
+  })
  const activeTab = createMemo(() => {
    const active = input.tabs().active()
    if (active === "context") return active
+    if (active === SESSION_OPEN_FILE_TAB && openFileOpen()) return active
    if (active === "review" && review()) return active
    if (active && input.pathFromTab(active)) return input.normalizeTab(active)

@@ -65,12 +80,15 @@ export const createSessionTabs = (input: TabsInput) => {
  const closableTab = createMemo(() => {
    const active = activeTab()
    if (active === "context") return active
+    if (active === SESSION_OPEN_FILE_TAB && openFileOpen()) return active
    if (!openedTabs().includes(active)) return
    return active
  })

  return {
    contextOpen,
+    openFileOpen,
+    panelTabs,
    openedTabs,
    activeTab,
    activeFileTab,
@@ -1,6 +1,6 @@
 import { describe, expect, test } from "bun:test"
 import type { UserMessage } from "@opencode-ai/sdk/v2"
-import { resetSessionModel, syncSessionModel } from "./session-model-helpers"
+import { resetSessionModel, restorePromptModel, syncPromptModel, syncSessionModel } from "./session-model-helpers"

 const message = (input?: { agent?: string; model?: UserMessage["model"] }) =>
  ({
@@ -50,3 +50,102 @@ describe("resetSessionModel", () => {
    expect(calls).toEqual(["reset"])
  })
 })
+
+describe("syncPromptModel", () => {
+  test("stores the effective session model in prompt state", () => {
+    const calls: unknown[] = []
+
+    syncPromptModel(
+      {
+        model: {
+          current: () => ({ id: "claude-sonnet-4", provider: { id: "anthropic" } }),
+          set() {},
+          variant: { current: () => "high", set() {} },
+        },
+      },
+      {
+        model: {
+          current: () => undefined,
+          set: (model) => calls.push(model),
+        },
+      },
+    )
+
+    expect(calls).toEqual([{ providerID: "anthropic", modelID: "claude-sonnet-4", variant: "high" }])
+  })
+
+  test("does not rewrite an unchanged prompt model", () => {
+    const calls: unknown[] = []
+    const model = { providerID: "anthropic", modelID: "claude-sonnet-4", variant: "high" }
+
+    syncPromptModel(
+      {
+        model: {
+          current: () => ({ id: model.modelID, provider: { id: model.providerID } }),
+          set() {},
+          variant: { current: () => model.variant, set() {} },
+        },
+      },
+      {
+        model: {
+          current: () => model,
+          set: (value) => calls.push(value),
+        },
+      },
+    )
+
+    expect(calls).toEqual([])
+  })
+})
+
+describe("restorePromptModel", () => {
+  test("restores the persisted prompt model into session selection", () => {
+    const calls: unknown[] = []
+    const restored = restorePromptModel(
+      {
+        model: {
+          current: () => ({ id: "gpt", provider: { id: "openai" } }),
+          set: (model) => calls.push(model),
+          variant: {
+            current: () => undefined,
+            set: (variant) => calls.push(variant),
+          },
+        },
+      },
+      {
+        model: {
+          current: () => ({ providerID: "anthropic", modelID: "claude", variant: "high" }),
+          set() {},
+        },
+      },
+    )
+
+    expect(restored).toBe(true)
+    expect(calls).toEqual([{ providerID: "anthropic", modelID: "claude" }, "high"])
+  })
+
+  test("does nothing without a persisted prompt model", () => {
+    const calls: unknown[] = []
+    const restored = restorePromptModel(
+      {
+        model: {
+          current: () => ({ id: "gpt", provider: { id: "openai" } }),
+          set: (model) => calls.push(model),
+          variant: {
+            current: () => undefined,
+            set: (variant) => calls.push(variant),
+          },
+        },
+      },
+      {
+        model: {
+          current: () => undefined,
+          set() {},
+        },
+      },
+    )
+
+    expect(restored).toBe(false)
+    expect(calls).toEqual([])
+  })
+})
@@ -7,6 +7,24 @@ type Local = {
  }
 }

+type ModelSelection = {
+  model: {
+    current(): { id: string; provider: { id: string } } | undefined
+    set(model: { providerID: string; modelID: string }): void
+    variant: {
+      current(): string | undefined
+      set(variant: string | undefined): void
+    }
+  }
+}
+
+type PromptState = {
+  model: {
+    current(): { providerID: string; modelID: string; variant?: string | null } | undefined
+    set(model: { providerID: string; modelID: string; variant?: string | null }): void
+  }
+}
+
 export const resetSessionModel = (local: Local) => {
  local.session.reset()
 }
@@ -14,3 +32,32 @@ export const resetSessionModel = (local: Local) => {
 export const syncSessionModel = (local: Local, msg: UserMessage) => {
  local.session.restore(msg)
 }
+
+export const syncPromptModel = (local: ModelSelection, prompt: PromptState) => {
+  const model = local.model.current()
+  if (!model) return
+  const next = {
+    providerID: model.provider.id,
+    modelID: model.id,
+    variant: local.model.variant.current(),
+  }
+  const current = prompt.model.current()
+  if (current?.providerID === next.providerID && current.modelID === next.modelID && current.variant === next.variant)
+    return
+  prompt.model.set(next)
+}
+
+export const restorePromptModel = (local: ModelSelection, prompt: PromptState) => {
+  const model = prompt.model.current()
+  if (!model) return false
+  const current = local.model.current()
+  if (
+    current?.provider.id === model.providerID &&
+    current.id === model.modelID &&
+    local.model.variant.current() === (model.variant ?? undefined)
+  )
+    return true
+  local.model.set({ providerID: model.providerID, modelID: model.modelID })
+  local.model.variant.set(model.variant ?? undefined)
+  return true
+}
@@ -0,0 +1,52 @@
+import { describe, expect, test } from "bun:test"
+import {
+  clampSessionPanelWidth,
+  REVIEW_PANE_WIDTH_MIN,
+  REVIEW_PANE_WIDTH_MIN_SPLIT,
+  SESSION_PANEL_WIDTH_MIN,
+  sessionPanelWidthMax,
+} from "./session-panel-width"
+
+describe("sessionPanelWidthMax", () => {
+  test("reserves the unified review pane minimum", () => {
+    expect(sessionPanelWidthMax({ available: 1700, split: false })).toBe(1700 - REVIEW_PANE_WIDTH_MIN)
+  })
+
+  test("reserves a larger minimum for split diffs", () => {
+    expect(sessionPanelWidthMax({ available: 1700, split: true })).toBe(1700 - REVIEW_PANE_WIDTH_MIN_SPLIT)
+    expect(REVIEW_PANE_WIDTH_MIN_SPLIT).toBeGreaterThan(REVIEW_PANE_WIDTH_MIN)
+  })
+
+  test("lets the chat panel take everything beyond the review pane minimum", () => {
+    // Regression: the old cap was 45% of the window, forcing the review pane
+    // to at least 55% of the window regardless of content.
+    const available = 3440
+    expect(sessionPanelWidthMax({ available, split: false })).toBeGreaterThan(available * 0.45)
+  })
+
+  test("never drops below the chat panel minimum on small windows", () => {
+    expect(sessionPanelWidthMax({ available: 600, split: true })).toBe(SESSION_PANEL_WIDTH_MIN)
+    expect(sessionPanelWidthMax({ available: 0, split: false })).toBe(SESSION_PANEL_WIDTH_MIN)
+  })
+})
+
+describe("clampSessionPanelWidth", () => {
+  test("keeps widths already within the limit", () => {
+    expect(clampSessionPanelWidth({ width: 800, available: 1700, split: false })).toBe(800)
+  })
+
+  test("forces the width down when the window shrinks", () => {
+    expect(clampSessionPanelWidth({ width: 1600, available: 1700, split: false })).toBe(1700 - REVIEW_PANE_WIDTH_MIN)
+    expect(clampSessionPanelWidth({ width: 1600, available: 1700, split: true })).toBe(
+      1700 - REVIEW_PANE_WIDTH_MIN_SPLIT,
+    )
+  })
+
+  test("holds the chat panel minimum when there is no room for both", () => {
+    expect(clampSessionPanelWidth({ width: 1600, available: 700, split: true })).toBe(SESSION_PANEL_WIDTH_MIN)
+  })
+
+  test("skips clamping before the layout is measured", () => {
+    expect(clampSessionPanelWidth({ width: 1600, available: undefined, split: false })).toBe(1600)
+  })
+})
@@ -0,0 +1,19 @@
+// The review pane has no width of its own: it takes whatever the chat panel
+// leaves behind. Instead of capping the chat panel at a fraction of the window
+// (which forces the review pane to grow with the monitor), reserve a fixed
+// minimum for the review pane and let the chat panel take everything else.
+export const SESSION_PANEL_WIDTH_MIN = 450
+export const REVIEW_PANE_WIDTH_MIN = 480
+export const REVIEW_PANE_WIDTH_MIN_SPLIT = 800
+
+export function sessionPanelWidthMax(input: { available: number; split: boolean }) {
+  const pane = input.split ? REVIEW_PANE_WIDTH_MIN_SPLIT : REVIEW_PANE_WIDTH_MIN
+  return Math.max(SESSION_PANEL_WIDTH_MIN, input.available - pane)
+}
+
+// `available` is undefined until the layout row is first measured; render the
+// stored width untouched until then to avoid a first-frame snap.
+export function clampSessionPanelWidth(input: { width: number; available: number | undefined; split: boolean }) {
+  if (input.available === undefined) return input.width
+  return Math.min(input.width, sessionPanelWidthMax({ available: input.available, split: input.split }))
+}
@@ -3,6 +3,7 @@ import { createStore } from "solid-js/store"
 import { createMediaQuery } from "@solid-primitives/media"
 import { Tabs } from "@opencode-ai/ui/tabs"
 import { IconButton } from "@opencode-ai/ui/icon-button"
+import { Icon } from "@opencode-ai/ui/icon"
 import { TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { ResizeHandle } from "@opencode-ai/ui/resize-handle"
 import { Mark } from "@opencode-ai/ui/logo"
@@ -23,10 +24,10 @@ import { useFile, type SelectedLineRange } from "@/context/file"
 import { useLanguage } from "@/context/language"
 import { useLayout } from "@/context/layout"
 import { useSettings } from "@/context/settings"
-import { useSync } from "@/context/sync"
 import { createFileTabListSync } from "@/pages/session/file-tab-scroll"
 import { FileTabContent } from "@/pages/session/file-tabs"
 import {
+  SESSION_OPEN_FILE_TAB,
  createOpenSessionFileTab,
  createSessionTabs,
  getTabReorderIndex,
@@ -35,6 +36,7 @@ import {
 } from "@/pages/session/helpers"
 import { setSessionHandoff } from "@/pages/session/handoff"
 import { useSessionLayout } from "@/pages/session/session-layout"
+import { SessionFileBrowserTab, type SessionFileBrowserState } from "@/pages/session/v2/session-file-browser-tab"

 type RenderDiff = (SnapshotFileDiff & { file: string }) | VcsFileDiff

@@ -51,6 +53,7 @@ export function SessionSidePanel(props: {
  reviewHasFocusableContent: () => boolean
  reviewCount: () => number
  reviewPanel: () => JSX.Element
+  fileBrowserState?: SessionFileBrowserState
  activeDiff?: string
  focusReviewDiff: (path: string) => void
  reviewSnap: boolean
@@ -59,7 +62,6 @@ export function SessionSidePanel(props: {
 }) {
  const layout = useLayout()
  const settings = useSettings()
-  const sync = useSync()
  const file = useFile()
  const language = useLanguage()
  const command = useCommand()
@@ -79,7 +81,6 @@ export function SessionSidePanel(props: {
      }),
  )
  const open = createMemo(() => reviewOpen() || fileOpen())
-  const rendered = createMemo<boolean>((previous) => previous || open(), false)
  const reviewTab = createMemo(() => isDesktop())
  const panelWidth = createMemo(() => {
    if (!open()) return "0px"
@@ -155,15 +156,13 @@ export function SessionSidePanel(props: {
    normalizeTab,
    review: reviewTab,
    hasReview: props.canReview,
+    fileBrowser: () => !!props.fileBrowserState,
  })
  const contextOpen = tabState.contextOpen
+  const panelTabs = tabState.panelTabs
  const openedTabs = tabState.openedTabs
  const activeTab = tabState.activeTab
  const activeFileTab = tabState.activeFileTab
-  const reviewContentRendered = createMemo<boolean>(
-    (previous) => previous || (reviewOpen() && activeTab() === "review"),
-    false,
-  )

  const fileTreeTab = () => layout.fileTree.tab()

@@ -180,6 +179,33 @@ export function SessionSidePanel(props: {
  const [store, setStore] = createStore({
    activeDraggable: undefined as string | undefined,
  })
+  let fileFilter: HTMLInputElement | undefined
+  const temporaryTab = tabs().preview
+  const previewTab = (value: string) => {
+    const next = normalizeTab(value)
+    tabs().previewTab(next)
+    const path = file.pathFromTab(next)
+    if (path) void file.load(path)
+    openReviewPanel()
+    queueMicrotask(() => tabs().setActive(next))
+  }
+  const openFileBrowser = () => {
+    previewTab(SESSION_OPEN_FILE_TAB)
+    queueMicrotask(() => fileFilter?.focus())
+  }
+  const activateTab = (value: string) => {
+    const next = normalizeTab(value)
+    const path = file.pathFromTab(next)
+    if (path) void file.load(path)
+    openReviewPanel()
+    tabs().setActive(next)
+  }
+  const browserTab = createMemo(() => {
+    if (!props.fileBrowserState) return undefined
+    if (activeTab() === SESSION_OPEN_FILE_TAB) return SESSION_OPEN_FILE_TAB
+    return activeFileTab()
+  })
+  const browserKinds = createMemo(() => new Map([...kinds()].filter(([, kind]) => kind !== "mix")))

  const handleDragStart = (event: unknown) => {
    const id = getDraggableId(event)
@@ -229,8 +255,10 @@ export function SessionSidePanel(props: {
        aria-label={language.t("session.panel.reviewAndFiles")}
        aria-hidden={!open()}
        inert={!open()}
-        class="relative min-w-0 flex overflow-hidden bg-background-base"
+        class="relative min-w-0 flex overflow-hidden"
        classList={{
+          "bg-v2-background-bg-base": settings.general.newLayoutDesigns(),
+          "bg-background-base": !settings.general.newLayoutDesigns(),
          "h-full shrink-0": !props.stacked,
          "h-full min-h-0": props.stacked,
          "pointer-events-none": !open(),
@@ -241,173 +269,238 @@ export function SessionSidePanel(props: {
        }}
        style={{ width: panelWidth() }}
      >
-        <Show when={rendered()}>
+        <Show when={open()}>
          <div
            class="size-full flex"
            classList={{
              "border-l border-border-weaker-base": !settings.general.newLayoutDesigns(),
            }}
          >
-            <div
-              aria-hidden={!reviewOpen()}
-              inert={!reviewOpen()}
-              class="relative min-w-0 h-full flex-1 overflow-hidden bg-background-base"
-              classList={{
-                "pointer-events-none": !reviewOpen(),
-              }}
-            >
-              <div class="size-full min-w-0 h-full bg-background-base">
-                <DragDropProvider
-                  onDragStart={handleDragStart}
-                  onDragEnd={handleDragEnd}
-                  onDragOver={handleDragOver}
-                  collisionDetector={closestCenter}
+            <Show when={reviewOpen()}>
+              <div
+                class="relative min-w-0 h-full flex-1 overflow-hidden"
+                classList={{
+                  "bg-v2-background-bg-base": settings.general.newLayoutDesigns(),
+                  "bg-background-base": !settings.general.newLayoutDesigns(),
+                }}
+              >
+                <div
+                  class="size-full min-w-0 h-full"
+                  classList={{
+                    "bg-v2-background-bg-base": settings.general.newLayoutDesigns(),
+                    "bg-background-base": !settings.general.newLayoutDesigns(),
+                  }}
                >
-                  <DragDropSensors />
-                  <ConstrainDragYAxis />
-                  <Tabs value={activeTab()} onChange={openTab}>
-                    <div class="sticky top-0 shrink-0 flex">
-                      <Tabs.List
-                        ref={(el: HTMLDivElement) => {
-                          const stop = createFileTabListSync({ el, contextOpen })
-                          onCleanup(stop)
-                        }}
-                      >
-                        <Show when={reviewTab() && props.canReview()}>
-                          <Tabs.Trigger
-                            value="review"
-                            id={reviewTabID}
-                            aria-controls={activeTab() === "review" ? reviewTabPanelID : undefined}
+                  <DragDropProvider
+                    onDragStart={handleDragStart}
+                    onDragEnd={handleDragEnd}
+                    onDragOver={handleDragOver}
+                    collisionDetector={closestCenter}
+                  >
+                    <DragDropSensors />
+                    <ConstrainDragYAxis />
+                    <Tabs value={activeTab()} onChange={activateTab}>
+                      <div class="sticky top-0 shrink-0 flex">
+                        <Tabs.List
+                          ref={(el: HTMLDivElement) => {
+                            const stop = createFileTabListSync({ el, contextOpen })
+                            onCleanup(stop)
+                          }}
+                        >
+                          <Show when={reviewTab() && props.canReview()}>
+                            <Tabs.Trigger
+                              value="review"
+                              id={reviewTabID}
+                              aria-controls={activeTab() === "review" ? reviewTabPanelID : undefined}
+                            >
+                              <div class="flex items-center gap-1.5">
+                                <div>{language.t("session.tab.review")}</div>
+                                <Show when={props.hasReview()}>
+                                  <div>{props.reviewCount()}</div>
+                                </Show>
+                              </div>
+                            </Tabs.Trigger>
+                          </Show>
+                          <Show when={contextOpen()}>
+                            <Tabs.Trigger
+                              value="context"
+                              closeButton={
+                                <TooltipKeybind
+                                  title={language.t("common.closeTab")}
+                                  keybind={command.keybind("tab.close")}
+                                  placement="bottom"
+                                  gutter={10}
+                                >
+                                  <IconButton
+                                    icon="close-small"
+                                    variant="ghost"
+                                    class="h-5 w-5"
+                                    onClick={() => tabs().close("context")}
+                                    aria-label={language.t("common.closeTab")}
+                                  />
+                                </TooltipKeybind>
+                              }
+                              hideCloseButton
+                              onMiddleClick={() => tabs().close("context")}
+                            >
+                              <div class="flex items-center gap-2">
+                                <SessionContextUsage variant="indicator" />
+                                <div>{language.t("session.tab.context")}</div>
+                              </div>
+                            </Tabs.Trigger>
+                          </Show>
+                          <SortableProvider ids={openedTabs()}>
+                            <For each={panelTabs()}>
+                              {(tab) => (
+                                <Show
+                                  when={tab === SESSION_OPEN_FILE_TAB}
+                                  fallback={
+                                    <SortableTab
+                                      tab={tab}
+                                      temporary={temporaryTab() === tab}
+                                      onTabClose={tabs().close}
+                                      onTabDoubleClick={temporaryTab() === tab ? openTab : undefined}
+                                    />
+                                  }
+                                >
+                                  <Tabs.Trigger
+                                    value={SESSION_OPEN_FILE_TAB}
+                                    closeButton={
+                                      <TooltipKeybind
+                                        title={language.t("common.closeTab")}
+                                        keybind={command.keybind("tab.close")}
+                                        placement="bottom"
+                                        gutter={10}
+                                      >
+                                        <IconButton
+                                          icon="close-small"
+                                          variant="ghost"
+                                          class="h-5 w-5"
+                                          onClick={() => tabs().close(SESSION_OPEN_FILE_TAB)}
+                                          aria-label={language.t("common.closeTab")}
+                                        />
+                                      </TooltipKeybind>
+                                    }
+                                    hideCloseButton
+                                    onMiddleClick={() => tabs().close(SESSION_OPEN_FILE_TAB)}
+                                  >
+                                    <div class="flex items-center gap-1.5 italic">
+                                      <Icon name="open-file" size="small" />
+                                      <span>{language.t("command.file.open")}</span>
+                                    </div>
+                                  </Tabs.Trigger>
+                                </Show>
+                              )}
+                            </For>
+                          </SortableProvider>
+                          <div
+                            class="h-full shrink-0 sticky right-0 z-10 flex items-center justify-center pr-3"
+                            classList={{
+                              "bg-v2-background-bg-base": settings.general.newLayoutDesigns(),
+                              "bg-background-stronger": !settings.general.newLayoutDesigns(),
+                            }}
                          >
-                            <div class="flex items-center gap-1.5">
-                              <div>{language.t("session.tab.review")}</div>
-                              <Show when={props.hasReview()}>
-                                <div>{props.reviewCount()}</div>
-                              </Show>
-                            </div>
-                          </Tabs.Trigger>
-                        </Show>
-                        <Show when={contextOpen()}>
-                          <Tabs.Trigger
-                            value="context"
-                            closeButton={
-                              <TooltipKeybind
-                                title={language.t("common.closeTab")}
-                                keybind={command.keybind("tab.close")}
-                                placement="bottom"
-                                gutter={10}
-                              >
-                                <IconButton
-                                  icon="close-small"
-                                  variant="ghost"
-                                  class="h-5 w-5"
-                                  onClick={() => tabs().close("context")}
-                                  aria-label={language.t("common.closeTab")}
-                                />
-                              </TooltipKeybind>
-                            }
-                            hideCloseButton
-                            onMiddleClick={() => tabs().close("context")}
-                          >
-                            <div class="flex items-center gap-2">
-                              <SessionContextUsage variant="indicator" />
-                              <div>{language.t("session.tab.context")}</div>
-                            </div>
-                          </Tabs.Trigger>
-                        </Show>
-                        <SortableProvider ids={openedTabs()}>
-                          <For each={openedTabs()}>{(tab) => <SortableTab tab={tab} onTabClose={tabs().close} />}</For>
-                        </SortableProvider>
-                        <div class="bg-background-stronger h-full shrink-0 sticky right-0 z-10 flex items-center justify-center pr-3">
-                          <TooltipKeybind
-                            title={language.t("command.file.open")}
-                            keybind={command.keybind("file.open")}
-                            class="flex items-center"
-                          >
-                            <IconButton
-                              icon="plus-small"
-                              variant="ghost"
-                              iconSize="large"
-                              class="!rounded-md"
-                              onClick={() => {
-                                void import("@/components/dialog-select-file").then((x) => {
-                                  dialog.show(() => <x.DialogSelectFile mode="files" onOpenFile={showAllFiles} />)
-                                })
-                              }}
-                              aria-label={language.t("command.file.open")}
-                            />
-                          </TooltipKeybind>
-                        </div>
-                      </Tabs.List>
-                    </div>
-
-                    <Show when={reviewTab() && props.canReview() && reviewContentRendered()}>
-                      <div
-                        id={reviewTabPanelID}
-                        role="tabpanel"
-                        aria-labelledby={reviewTabID}
-                        aria-hidden={activeTab() !== "review"}
-                        inert={activeTab() !== "review"}
-                        tabIndex={props.reviewHasFocusableContent() ? undefined : 0}
-                        data-slot="tabs-content"
-                        class="flex flex-col h-full overflow-hidden contain-strict"
-                        classList={{ hidden: activeTab() !== "review" }}
-                      >
-                        {props.reviewPanel()}
-                      </div>
-                    </Show>
-
-                    <Tabs.Content value="empty" class="flex flex-col h-full overflow-hidden contain-strict">
-                      <Show when={activeTab() === "empty"}>
-                        <div class="relative pt-2 flex-1 min-h-0 overflow-hidden">
-                          <div class="h-full px-6 pb-42 -mt-4 flex flex-col items-center justify-center text-center gap-6">
-                            <Mark class="w-14 opacity-10" />
-                            <div class="text-14-regular text-text-weak max-w-56">
-                              {language.t("session.files.selectToOpen")}
-                            </div>
+                            <TooltipKeybind
+                              title={language.t("command.file.open")}
+                              keybind={command.keybind("file.open")}
+                              class="flex items-center"
+                            >
+                              <IconButton
+                                icon="plus-small"
+                                variant="ghost"
+                                iconSize="large"
+                                class="!rounded-md"
+                                onClick={() => {
+                                  if (props.fileBrowserState) {
+                                    openFileBrowser()
+                                    return
+                                  }
+                                  void import("@/components/dialog-select-file").then((x) => {
+                                    dialog.show(() => <x.DialogSelectFile mode="files" onOpenFile={showAllFiles} />)
+                                  })
+                                }}
+                                aria-label={language.t("command.file.open")}
+                              />
+                            </TooltipKeybind>
                          </div>
+                        </Tabs.List>
+                      </div>
+
+                      <Show when={reviewTab() && props.canReview() && activeTab() === "review"}>
+                        <div
+                          id={reviewTabPanelID}
+                          role="tabpanel"
+                          aria-labelledby={reviewTabID}
+                          tabIndex={props.reviewHasFocusableContent() ? undefined : 0}
+                          data-slot="tabs-content"
+                          class="flex flex-col h-full overflow-hidden contain-strict"
+                        >
+                          {props.reviewPanel()}
                        </div>
                      </Show>
-                    </Tabs.Content>

-                    <Show when={contextOpen()}>
-                      <Tabs.Content value="context" class="flex flex-col h-full overflow-hidden contain-strict">
-                        <Show when={activeTab() === "context"}>
+                      <Show when={activeTab() === "empty"}>
+                        <Tabs.Content value="empty" class="flex flex-col h-full overflow-hidden contain-strict">
+                          <div class="relative pt-2 flex-1 min-h-0 overflow-hidden">
+                            <div class="h-full px-6 pb-42 -mt-4 flex flex-col items-center justify-center text-center gap-6">
+                              <Mark class="w-14 opacity-10" />
+                              <div class="text-14-regular text-text-weak max-w-56">
+                                {language.t("session.files.selectToOpen")}
+                              </div>
+                            </div>
+                          </div>
+                        </Tabs.Content>
+                      </Show>
+
+                      <Show when={activeTab() === "context"}>
+                        <Tabs.Content value="context" class="flex flex-col h-full overflow-hidden contain-strict">
                          <div class="relative pt-2 flex-1 min-h-0 overflow-hidden">
                            <SessionContextTab />
                          </div>
-                        </Show>
-                      </Tabs.Content>
-                    </Show>
+                        </Tabs.Content>
+                      </Show>

-                    <Show when={activeFileTab()} keyed>
-                      {(tab) => <FileTabContent tab={tab} />}
-                    </Show>
-                  </Tabs>
-                  <DragOverlay>
-                    <Show when={store.activeDraggable} keyed>
-                      {(tab) => {
-                        const path = file.pathFromTab(tab)
-                        return (
-                          <div data-component="tabs-drag-preview">
-                            <Show when={path}>{(p) => <FileVisual active path={p()} />}</Show>
-                          </div>
-                        )
-                      }}
-                    </Show>
-                  </DragOverlay>
-                </DragDropProvider>
+                      <Show when={browserTab()}>
+                        <SessionFileBrowserTab
+                          tab={browserTab()!}
+                          placeholder={browserTab() === SESSION_OPEN_FILE_TAB}
+                          active={file.pathFromTab(browserTab()!)}
+                          kinds={browserKinds()}
+                          state={props.fileBrowserState!}
+                          onSelect={(path) => previewTab(file.tab(path))}
+                          onSelectPermanent={(path) => openTab(file.tab(path))}
+                          filterRef={(element) => (fileFilter = element)}
+                        />
+                      </Show>
+
+                      <Show when={!props.fileBrowserState && activeFileTab()} keyed>
+                        {(tab) => <FileTabContent tab={tab} />}
+                      </Show>
+                    </Tabs>
+                    <DragOverlay>
+                      <Show when={store.activeDraggable} keyed>
+                        {(tab) => {
+                          const path = file.pathFromTab(tab)
+                          return (
+                            <div data-component="tabs-drag-preview">
+                              <Show when={path}>
+                                {(p) => <FileVisual active path={p()} temporary={temporaryTab() === tab} />}
+                              </Show>
+                            </div>
+                          )
+                        }}
+                      </Show>
+                    </DragOverlay>
+                  </DragDropProvider>
+                </div>
              </div>
-            </div>
+            </Show>

-            <Show when={shown()}>
+            <Show when={fileOpen()}>
              <div
                id="file-tree-panel"
-                aria-hidden={!fileOpen()}
-                inert={!fileOpen()}
                class="relative min-w-0 h-full shrink-0 overflow-hidden"
                classList={{
-                  "pointer-events-none": !fileOpen(),
                  "transition-[width] duration-200 ease-[cubic-bezier(0.22,1,0.36,1)] will-change-[width] motion-reduce:transition-none":
                    !props.size.active(),
                }}
@@ -435,45 +528,49 @@ export function SessionSidePanel(props: {
                        {language.t("session.files.all")}
                      </Tabs.Trigger>
                    </Tabs.List>
-                    <Tabs.Content value="changes" class="bg-background-stronger px-3 py-0">
-                      <Switch>
-                        <Match when={props.hasReview() || !props.diffsReady()}>
-                          <Show
-                            when={props.diffsReady()}
-                            fallback={
-                              <div class="px-2 py-2 text-12-regular text-text-weak">
-                                {language.t("common.loading")}
-                                {language.t("common.loading.ellipsis")}
-                              </div>
-                            }
-                          >
+                    <Show when={fileTreeTab() === "changes"}>
+                      <Tabs.Content value="changes" class="bg-background-stronger px-3 py-0">
+                        <Switch>
+                          <Match when={props.hasReview() || !props.diffsReady()}>
+                            <Show
+                              when={props.diffsReady()}
+                              fallback={
+                                <div class="px-2 py-2 text-12-regular text-text-weak">
+                                  {language.t("common.loading")}
+                                  {language.t("common.loading.ellipsis")}
+                                </div>
+                              }
+                            >
+                              <FileTree
+                                path=""
+                                class="pt-3"
+                                allowed={diffFiles()}
+                                kinds={kinds()}
+                                draggable={false}
+                                active={props.activeDiff}
+                                onFileClick={(node) => props.focusReviewDiff(node.path)}
+                              />
+                            </Show>
+                          </Match>
+                        </Switch>
+                      </Tabs.Content>
+                    </Show>
+                    <Show when={fileTreeTab() === "all"}>
+                      <Tabs.Content value="all" class="bg-background-stronger px-3 py-0">
+                        <Switch>
+                          <Match when={nofiles()}>{empty(language.t("session.files.empty"))}</Match>
+                          <Match when={true}>
                            <FileTree
                              path=""
                              class="pt-3"
-                              allowed={diffFiles()}
+                              modified={diffFiles()}
                              kinds={kinds()}
-                              draggable={false}
-                              active={props.activeDiff}
-                              onFileClick={(node) => props.focusReviewDiff(node.path)}
+                              onFileClick={(node) => openTab(file.tab(node.path))}
                            />
-                          </Show>
-                        </Match>
-                      </Switch>
-                    </Tabs.Content>
-                    <Tabs.Content value="all" class="bg-background-stronger px-3 py-0">
-                      <Switch>
-                        <Match when={nofiles()}>{empty(language.t("session.files.empty"))}</Match>
-                        <Match when={true}>
-                          <FileTree
-                            path=""
-                            class="pt-3"
-                            modified={diffFiles()}
-                            kinds={kinds()}
-                            onFileClick={(node) => openTab(file.tab(node.path))}
-                          />
-                        </Match>
-                      </Switch>
-                    </Tabs.Content>
+                          </Match>
+                        </Switch>
+                      </Tabs.Content>
+                    </Show>
                  </Tabs>
                </div>
                <Show when={fileOpen()}>
@@ -195,7 +195,7 @@ export function TerminalPanelV2(props: { stacked?: boolean } = {}) {
      aria-label={language.t("terminal.title")}
      aria-hidden={!opened()}
      inert={!opened()}
-      class="relative shrink-0 overflow-hidden bg-background-stronger"
+      class="relative shrink-0 overflow-hidden bg-v2-background-bg-base"
      classList={{
        "w-full": !isDesktop() || stacked(),
        "min-w-0 h-full flex-1": isDesktop() && opened() && !stacked(),
@@ -237,7 +237,7 @@ export function TerminalPanelV2(props: { stacked?: boolean } = {}) {
          when={terminal.ready()}
          fallback={
            <div class="flex flex-col h-full pointer-events-none">
-              <div class="h-10 flex items-center gap-2 px-2 border-b border-border-weaker-base bg-background-stronger overflow-hidden">
+              <div class="h-10 flex items-center gap-2 px-2 border-b border-border-weaker-base bg-v2-background-bg-base overflow-hidden">
                <For each={handoff()}>
                  {(title) => (
                    <div class="px-2 py-1 rounded-md bg-surface-base text-14-regular text-text-weak truncate max-w-40">
@@ -1243,12 +1243,13 @@ export function MessageTimeline(props: {
    const initialRow = timelineRowByKey().get(props.rowKey)!
    const item = createMemo(() => virtualItemByKey().get(props.rowKey) ?? initialItem)
    const row = createMemo(() => timelineRowByKey().get(props.rowKey) ?? initialRow)
-    const asyncFile = () => {
+    const tool = () => {
      const value = row()
-      if (value._tag !== "AssistantPart" || value.group.type !== "part") return false
+      if (value._tag !== "AssistantPart" || value.group.type !== "part") return
      const part = getMsgPart(value.group.ref.messageID, value.group.ref.partID)
-      return part?.type === "tool" && ["edit", "write", "apply_patch"].includes(part.tool)
+      if (part?.type === "tool") return part
    }
+    const asyncFile = () => ["edit", "write", "apply_patch"].includes(tool()?.tool ?? "")
    const [ready, setReady] = createSignal(initialItem.size <= timelineFallbackItemSize || !asyncFile())
    let contentMeasureFrame: number | undefined

@@ -1278,6 +1279,8 @@ export function MessageTimeline(props: {
          width: "100%",
          height: `${item().size}px`,
          overflow: "clip",
+          // Rounded virtual measurements can otherwise clip a framed row's outer paint.
+          "overflow-clip-margin": row()._tag === "TurnGap" ? undefined : "0.5px",
        }}
      >
        <div
@@ -1383,7 +1386,7 @@ export function MessageTimeline(props: {
              "w-full": true,
              "pb-4": true,
              "pr-3": true,
-              "pl-2": settings.general.newLayoutDesigns(),
+              "pl-2.5": settings.general.newLayoutDesigns(),
              "pl-2 md:pl-4": !settings.general.newLayoutDesigns(),
              "md:max-w-200 md:mx-auto 2xl:max-w-[1000px]": props.centered && !settings.general.newLayoutDesigns(),
            }}
@@ -1,6 +1,6 @@
 import { useCommand, type CommandOption } from "@/context/command"
 import { useLanguage } from "@/context/language"
-import { useLocal } from "@/context/local"
+import { useLocal, type ModelSelection } from "@/context/local"
 import { useSettings } from "@/context/settings"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { getCursorPosition, setCursorPosition } from "@/components/prompt-input/editor-dom"
@@ -14,7 +14,7 @@ const withCategory = (category: string) => {
  })
 }

-export const useComposerCommands = () => {
+export const useComposerCommands = (input: { model?: ModelSelection } = {}) => {
  const command = useCommand()
  const dialog = useDialog()
  const language = useLanguage()
@@ -22,6 +22,7 @@ export const useComposerCommands = () => {
  const settings = useSettings()
  const { sessionKey } = useSessionLayout()
  const sessionOwnership = createSessionOwnership(sessionKey)
+  const model = input.model ?? local.model
  const modelCommand = withCategory(language.t("command.category.model"))
  const agentCommand = withCategory(language.t("command.category.agent"))

@@ -43,7 +44,7 @@ export const useComposerCommands = () => {
    }
    const { DialogSelectModel } = await import("@/components/dialog-select-model")
    owner.run(() => {
-      void dialog.show(() => <DialogSelectModel model={local.model} />, restoreComposer)
+      void dialog.show(() => <DialogSelectModel model={model} />, restoreComposer)
    })
  }

@@ -61,7 +62,7 @@ export const useComposerCommands = () => {
      title: language.t("command.model.variant.cycle"),
      description: language.t("command.model.variant.cycle.description"),
      keybind: "shift+mod+d",
-      onSelect: () => local.model.variant.cycle(),
+      onSelect: () => model.variant.cycle(),
    }),
    agentCommand({
      id: "agent.cycle",
@@ -25,6 +25,7 @@ export type SessionCommandContext = {
  setActiveMessage: (message: UserMessage | undefined) => void
  focusInput: () => void
  review?: () => boolean
+  fileBrowser?: () => boolean
 }

 const withCategory = (category: string) => {
@@ -83,6 +84,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
    normalizeTab,
    review: actions.review,
    hasReview,
+    fileBrowser: actions.fileBrowser,
  })
  const activeFileTab = tabState.activeFileTab
  const closableTab = tabState.closableTab
@@ -1,5 +1,5 @@
 import { describe, expect, test } from "bun:test"
-import { filterReviewFiles, reviewDiffKinds } from "./review-diff-kinds"
+import { filterReviewFiles, reviewDiffDirectory, reviewDiffKinds, reviewDiffNeedsLoad } from "./review-diff-kinds"

 describe("reviewDiffKinds", () => {
  test("maps file and directory kinds", () => {
@@ -28,3 +28,43 @@ describe("filterReviewFiles", () => {
    expect(filterReviewFiles(files, "")).toEqual(files)
  })
 })
+
+describe("reviewDiffNeedsLoad", () => {
+  test("loads changed files whose aggregate patch has no hunks", () => {
+    expect(
+      reviewDiffNeedsLoad({
+        file: "src/a.ts",
+        additions: 1,
+        deletions: 0,
+        patch: "diff --git a/src/a.ts b/src/a.ts\n--- a/src/a.ts\n+++ b/src/a.ts",
+      }),
+    ).toBe(true)
+  })
+
+  test("keeps complete patches and empty changes", () => {
+    expect(
+      reviewDiffNeedsLoad({
+        file: "src/a.ts",
+        additions: 1,
+        deletions: 0,
+        patch: "@@ -0,0 +1 @@\n+value",
+      }),
+    ).toBe(false)
+    expect(reviewDiffNeedsLoad({ file: "empty.txt", additions: 0, deletions: 0 })).toBe(false)
+  })
+})
+
+describe("reviewDiffDirectory", () => {
+  test("scopes nested files to their parent directory", () => {
+    expect(reviewDiffDirectory("/repo", "src/lib/a.ts")).toBe("/repo/src/lib")
+    expect(reviewDiffDirectory("C:\\repo", "src/lib/a.ts")).toBe("C:\\repo\\src\\lib")
+  })
+
+  test("does not rescope root files", () => {
+    expect(reviewDiffDirectory("/repo/", "README.md")).toBe("/repo")
+    expect(reviewDiffDirectory("/", "README.md")).toBe("/")
+    expect(reviewDiffDirectory("C:\\", "README.md")).toBe("C:\\")
+    expect(reviewDiffDirectory("/", "src/a.ts")).toBe("/src")
+    expect(reviewDiffDirectory("C:\\", "src/a.ts")).toBe("C:\\src")
+  })
+})
@@ -12,6 +12,24 @@ export function filterRenderableDiff(value: SnapshotFileDiff | VcsFileDiff): val
  return typeof value.file === "string"
 }

+export function reviewDiffNeedsLoad(diff: RenderDiff) {
+  if (diff.additions === 0 && diff.deletions === 0) return false
+  return !diff.patch || !/^@@ /m.test(diff.patch)
+}
+
+export function reviewRootDirectory(root: string) {
+  return root === "/" || /^[A-Za-z]:[/\\]?$/.test(root) ? root : root.replace(/[/\\]+$/, "")
+}
+
+export function reviewDiffDirectory(root: string, file: string) {
+  const path = normalizePath(file)
+  const index = path.lastIndexOf("/")
+  const separator = root.includes("\\") ? "\\" : "/"
+  const base = reviewRootDirectory(root)
+  if (index < 0) return base
+  return `${base.endsWith(separator) ? base : base + separator}${path.slice(0, index).replaceAll("/", separator)}`
+}
+
 export function reviewDiffKinds(diffs: RenderDiff[]) {
  const merge = (a: Kind | undefined, b: Kind) => {
    if (!a) return b
@@ -1,4 +1,4 @@
-import { createMemo, createSignal, Show, type JSX } from "solid-js"
+import { createMemo, createResource, createSignal, Show, type JSX } from "solid-js"
 import type { SnapshotFileDiff, VcsFileDiff } from "@opencode-ai/sdk/v2"
 import {
  SESSION_REVIEW_V2_SIDEBAR_WIDTH_MAX,
@@ -25,6 +25,7 @@ import {
  filterRenderableDiff,
  filterReviewFiles,
  reviewDiffKinds,
+  reviewDiffNeedsLoad,
  type RenderDiff,
 } from "@/pages/session/v2/review-diff-kinds"
 import type { ReviewPanelV2State } from "@/pages/session/v2/review-panel-v2-state"
@@ -37,6 +38,8 @@ export type ReviewPanelV2Props = {
  empty?: JSX.Element
  diffs: () => ReviewDiff[]
  diffsReady: () => boolean
+  diffVersion?: number
+  loadDiff?: (path: string, version?: number) => Promise<RenderDiff | undefined>
  activeFile?: string
  onSelectFile: (path: string) => void
  diffStyle: SessionReviewDiffStyle
@@ -74,7 +77,26 @@ export function ReviewPanelV2(props: ReviewPanelV2Props) {
    if (active && files.includes(active)) return active
    return files[0]
  })
-  const activeItem = createMemo(() => diffs().find((diff) => diff.file === activeDiff()))
+  const sourceActiveItem = createMemo(() => diffs().find((diff) => diff.file === activeDiff()))
+  const detailSource = createMemo(() => {
+    const diff = sourceActiveItem()
+    const load = props.loadDiff
+    if (!diff || !load || !reviewDiffNeedsLoad(diff)) return
+    return { diff, load, version: props.diffVersion }
+  })
+  const [loadedDiff] = createResource(detailSource, async ({ diff, load, version }) => {
+    const value = await load(diff.file, version)
+    if (value?.file !== diff.file) return
+    return { source: diff, version, value }
+  })
+
+  const activeItem = createMemo(() => {
+    const source = sourceActiveItem()
+    if (loadedDiff.state !== "ready") return source
+    const loaded = loadedDiff()
+    if (loaded && loaded.source === source && loaded.version === props.diffVersion) return loaded.value
+    return source
+  })

  const readFile = async (path: string) =>
    sdk()
@@ -0,0 +1,194 @@
+import { createMemo, createSignal, createUniqueId, Show } from "solid-js"
+import { createQuery } from "@tanstack/solid-query"
+import { Tabs } from "@opencode-ai/ui/tabs"
+import { Icon } from "@opencode-ai/ui/icon"
+import {
+  SessionFilePanelV2,
+  SessionFilePanelV2Empty,
+  SessionFilePanelV2Title,
+} from "@opencode-ai/session-ui/v2/session-file-panel-v2"
+import { SessionReviewV2Sidebar, SessionReviewV2SidebarToggle } from "@opencode-ai/session-ui/v2/session-review-v2"
+import FileTree, { type Kind } from "@/components/file-tree"
+import { useFile } from "@/context/file"
+import { useLanguage } from "@/context/language"
+import { useLayout } from "@/context/layout"
+import { useSDK } from "@/context/sdk"
+import { displayName } from "@/pages/layout/helpers"
+import { useSessionLayout } from "@/pages/session/session-layout"
+import { SessionFileView } from "@/pages/session/file-tabs"
+import { applyFileListKeyDown, SessionFileListV2 } from "@/pages/session/v2/session-file-list-v2"
+import { pathKey } from "@/utils/path-key"
+
+const emptyFiles: string[] = []
+
+export type SessionFileBrowserState = {
+  sidebarOpened: () => boolean
+  sidebarWidth: () => number
+  resizeSidebar: (width: number) => void
+  toggleSidebar: () => void
+}
+
+export function SessionFileBrowserTab(props: {
+  tab: string
+  placeholder: boolean
+  active?: string
+  kinds: ReadonlyMap<string, Kind>
+  state: SessionFileBrowserState
+  onSelect: (path: string) => void
+  onSelectPermanent: (path: string) => void
+  filterRef?: (element: HTMLInputElement) => void
+}) {
+  const file = useFile()
+  const language = useLanguage()
+  const layout = useLayout()
+  const sdk = useSDK()
+  const { workspaceKey } = useSessionLayout()
+  const resultsID = `session-file-browser-results-${createUniqueId()}`
+  const [filter, setFilter] = createSignal("")
+  const [explicitHighlight, setExplicitHighlight] = createSignal<string>()
+  const sidebarOpened = () => props.placeholder || props.state.sidebarOpened()
+  const query = createMemo(() => filter().trim())
+  const search = createQuery(() => {
+    const value = query()
+    return {
+      queryKey: ["session-open-file", workspaceKey(), value] as const,
+      enabled: value.length > 0,
+      queryFn: ({ signal }) => file.searchFiles(value, { limit: 200, signal }),
+    }
+  })
+  const files = createMemo(() => {
+    if (!query() || search.isPending) return emptyFiles
+    return [...new Set(search.data ?? emptyFiles)]
+  })
+  const highlighted = createMemo(() => {
+    const values = files()
+    if (values.length === 0) return undefined
+    const explicit = explicitHighlight()
+    if (explicit && values.includes(explicit)) return explicit
+    return values[0]
+  })
+  const loading = createMemo(() => query().length > 0 && search.isPending)
+  const project = createMemo(() => {
+    const directory = pathKey(sdk().directory)
+    return layout.projects
+      .list()
+      .find(
+        (item) =>
+          pathKey(item.worktree) === directory || item.sandboxes?.some((sandbox) => pathKey(sandbox) === directory),
+      )
+  })
+  const title = createMemo(() => displayName(project() ?? { worktree: sdk().directory }))
+  const optionID = (path: string) => `${resultsID}-option-${files().indexOf(path)}`
+
+  const onFilterKeyDown = (event: KeyboardEvent & { currentTarget: HTMLInputElement }) => {
+    if (event.key === "Escape" && query()) {
+      event.preventDefault()
+      setFilter("")
+      return
+    }
+    if (!query()) return
+    applyFileListKeyDown(event, files(), highlighted(), {
+      onHighlight: setExplicitHighlight,
+      onSelect: props.onSelectPermanent,
+    })
+  }
+
+  return (
+    <Tabs.Content value={props.tab} class="h-full min-h-0 overflow-hidden">
+      <SessionFilePanelV2
+        toolbar
+        toolbarStart={
+          <>
+            <SessionReviewV2SidebarToggle opened={sidebarOpened()} onToggle={props.state.toggleSidebar} />
+            <Show when={!sidebarOpened()}>
+              <SessionFilePanelV2Title>{title()}</SessionFilePanelV2Title>
+            </Show>
+          </>
+        }
+        sidebar={
+          <SessionReviewV2Sidebar
+            open={sidebarOpened()}
+            title={<span class="truncate">{title()}</span>}
+            filter={filter()}
+            onFilterChange={setFilter}
+            onFilterKeyDown={onFilterKeyDown}
+            filterAutofocus={props.placeholder}
+            filterRef={props.filterRef}
+            filterControls={resultsID}
+            filterActiveDescendant={highlighted() ? optionID(highlighted()!) : undefined}
+            filterExpanded={query().length > 0 && files().length > 0}
+            width={props.state.sidebarWidth()}
+            onWidthChange={props.state.resizeSidebar}
+          >
+            <Show
+              when={query()}
+              fallback={
+                <FileTree
+                  path=""
+                  class="pt-1"
+                  active={props.active}
+                  kinds={props.kinds}
+                  onFileClick={(node) => props.onSelect(node.path)}
+                  onFileDoubleClick={(node) => props.onSelectPermanent(node.path)}
+                />
+              }
+            >
+              <Show
+                when={!loading()}
+                fallback={
+                  <div role="status" class="px-2 py-2 text-12-regular text-text-weak">
+                    {language.t("common.loading")}
+                    {language.t("common.loading.ellipsis")}
+                  </div>
+                }
+              >
+                <Show
+                  when={files().length > 0}
+                  fallback={
+                    <div role="status" class="px-2 py-2 text-12-regular text-text-weak">
+                      {language.t("palette.empty")}
+                    </div>
+                  }
+                >
+                  <SessionFileListV2
+                    id={resultsID}
+                    role="listbox"
+                    optionID={optionID}
+                    files={files()}
+                    kinds={props.kinds}
+                    active={props.active}
+                    highlighted={highlighted()}
+                    onFileClick={(path) => {
+                      setExplicitHighlight(path)
+                      props.onSelect(path)
+                    }}
+                    onFileDoubleClick={props.onSelectPermanent}
+                  />
+                </Show>
+              </Show>
+            </Show>
+          </SessionReviewV2Sidebar>
+        }
+      >
+        <Show
+          when={!props.placeholder}
+          fallback={
+            <SessionFilePanelV2Empty>
+              <div class="flex flex-col items-center gap-3 text-center text-text-weak">
+                <Icon name="file-tree" size="large" />
+                <div class="text-14-medium text-text-strong">{language.t("command.file.open")}</div>
+                <div class="text-13-regular">{language.t("session.files.selectToOpen")}</div>
+              </div>
+            </SessionFilePanelV2Empty>
+          }
+        >
+          <div class="min-h-0 flex-1">
+            <Show when={props.tab} keyed>
+              {(tab) => <SessionFileView tab={tab} />}
+            </Show>
+          </div>
+        </Show>
+      </SessionFilePanelV2>
+    </Tabs.Content>
+  )
+}
@@ -43,7 +43,11 @@ export function SessionFileListV2(props: {
  active?: string
  highlighted?: string
  kinds?: ReadonlyMap<string, Kind>
+  id?: string
+  role?: "listbox"
+  optionID?: (path: string) => string
  onFileClick: (path: string) => void
+  onFileDoubleClick?: (path: string) => void
 }) {
  const active = () => normalizePath(props.active ?? "")
  const highlighted = () => normalizePath(props.highlighted ?? "")
@@ -88,6 +92,8 @@ export function SessionFileListV2(props: {
  return (
    <div
      ref={setRoot}
+      id={props.id}
+      role={props.role}
      data-component="file-tree-v2"
      data-total-rows={props.files.length}
      style={{ position: "relative", height: `${virtualizer.getTotalSize()}px` }}
@@ -116,6 +122,9 @@ export function SessionFileListV2(props: {
                >
                  <button
                    type="button"
+                    id={props.optionID?.(path)}
+                    role={props.role ? "option" : undefined}
+                    aria-selected={props.role ? selected() : undefined}
                    data-slot="file-tree-v2-row"
                    data-path={path}
                    data-selected={selected() ? "" : undefined}
@@ -124,6 +133,7 @@ export function SessionFileListV2(props: {
                    onFocus={() => setFocused(path)}
                    onBlur={() => setFocused(undefined)}
                    onClick={() => props.onFileClick(path)}
+                    onDblClick={() => props.onFileDoubleClick?.(path)}
                  >
                    <span class="filetree-iconpair size-4">
                      <FileIcon node={{ path, type: "file" }} class="size-4 filetree-icon filetree-icon--color" />
@@ -0,0 +1,24 @@
+export type FileManagerOS = "macos" | "windows" | "linux" | "unknown"
+
+export function fileManagerApp(os: FileManagerOS): {
+  label: "session.header.open.finder" | "session.header.open.fileExplorer" | "session.header.open.fileManager"
+  actionLabel:
+    | "session.header.reveal.finder"
+    | "session.header.reveal.fileExplorer"
+    | "session.header.reveal.containingFolder"
+  icon: "finder" | "file-explorer"
+} {
+  if (os === "macos")
+    return { label: "session.header.open.finder", actionLabel: "session.header.reveal.finder", icon: "finder" }
+  if (os === "windows")
+    return {
+      label: "session.header.open.fileExplorer",
+      actionLabel: "session.header.reveal.fileExplorer",
+      icon: "file-explorer",
+    }
+  return {
+    label: "session.header.open.fileManager",
+    actionLabel: "session.header.reveal.containingFolder",
+    icon: "finder",
+  }
+}
@@ -463,7 +463,7 @@ function localStorageDirect(): SyncStorage {
  }
 }

-const DRAFT_PERSISTED_KEYS = ["prompt", "comments", "model-selection", "file-view", "layout"]
+const DRAFT_PERSISTED_KEYS = ["prompt", "comments", "file-view", "layout"]

 export function draftPersistedKeys() {
  return DRAFT_PERSISTED_KEYS
@@ -8,6 +8,8 @@ test("resets transient prompt input state when the prompt session changes", () =
    const [state, setState] = createPromptInputTransientState(identity, 3)
    setState({
      popover: "slash",
+      slashMenu: true,
+      slashMenuQuery: "compact",
      historyIndex: 2,
      savedPrompt: {
        prompt: [{ type: "text", content: "draft-A", start: 0, end: 7 }],
@@ -23,6 +25,8 @@ test("resets transient prompt input state when the prompt session changes", () =

    expect(state).toMatchObject({
      popover: null,
+      slashMenu: false,
+      slashMenuQuery: "",
      historyIndex: -1,
      savedPrompt: null,
      placeholder: 3,
@@ -1,7 +1,7 @@
 {
  "$schema": "https://json.schemastore.org/package.json",
  "name": "@opencode-ai/cli",
-  "version": "1.17.15",
+  "version": "1.17.18",
  "type": "module",
  "license": "MIT",
  "bin": {
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Aiden Cline	22e797aa54	wip	2026-07-12 12:25:34 -05:00
opencode-agent[bot]	34e5809059	feat(tui): show idle session directory (#36457 ) deploy / deploy (push) Has been cancelled Details nix-eval / nix-eval (push) Has been cancelled Details publish / version (push) Has been cancelled Details publish / build-cli (push) Has been cancelled Details publish / sign-cli-windows (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=arm64 host:macos-26 platform_flag:--mac --arm64 target:aarch64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=x64 host:macos-26-intel platform_flag:--mac --x64 target:x86_64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404 platform_flag:--linux target:x86_64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404-arm platform_flag:--linux --arm64 target:aarch64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-windows-2025 platform_flag:--win target:x86_64-pc-windows-msvc]) (push) Has been cancelled Details publish / build-electron (map[host:windows-2025 platform_flag:--win --arm64 target:aarch64-pc-windows-msvc]) (push) Has been cancelled Details publish / publish (push) Has been cancelled Details generate / generate (push) Has been cancelled Details typecheck / typecheck (push) Has been cancelled Details Co-authored-by: Dax <mail@thdxr.com> Co-authored-by: opencode-agent[bot] <opencode-agent[bot]@users.noreply.github.com>	2026-07-11 20:31:57 +00:00
opencode-agent[bot]	2db96c9b7e	fix(core): disable unused fff content caches (#36453 ) Co-authored-by: Dax Raad <d@ironbay.co>	2026-07-11 19:12:58 +00:00
Frank	9976269ab1	docs: publish GPT 5.6 Sol, Terra, and Luna model availability and pricing across all language docs nix-eval / nix-eval (push) Has been cancelled Details publish / version (push) Has been cancelled Details publish / build-cli (push) Has been cancelled Details publish / sign-cli-windows (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=arm64 host:macos-26 platform_flag:--mac --arm64 target:aarch64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=x64 host:macos-26-intel platform_flag:--mac --x64 target:x86_64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404 platform_flag:--linux target:x86_64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404-arm platform_flag:--linux --arm64 target:aarch64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-windows-2025 platform_flag:--win target:x86_64-pc-windows-msvc]) (push) Has been cancelled Details publish / build-electron (map[host:windows-2025 platform_flag:--win --arm64 target:aarch64-pc-windows-msvc]) (push) Has been cancelled Details publish / publish (push) Has been cancelled Details docs-locale-sync / sync-locales (push) Has been cancelled Details generate / generate (push) Has been cancelled Details typecheck / typecheck (push) Has been cancelled Details deploy / deploy (push) Has been cancelled Details	2026-07-10 14:13:46 -04:00
Adam	5df822be11	fix(stats): polish comparison details	2026-07-10 12:42:04 -05:00
Adam	233f069070	feat(stats): add comparison seo pages	2026-07-10 12:09:56 -05:00
Adam	4a1982f5c9	feat(stats): add model comparison radar	2026-07-10 11:41:01 -05:00
Adam	1c7f65f105	fix(stats): stop comparison overscroll	2026-07-10 07:31:00 -05:00
Adam	a84151e482	fix(stats): restore sticky comparison header	2026-07-10 07:30:00 -05:00
Adam	0340a4ff77	fix(stats): restore native trackpad scrolling	2026-07-10 07:09:25 -05:00
Adam	f4faacbe87	feat(stats): unify comparison cards	2026-07-10 06:49:56 -05:00
opencode-agent[bot]	7dbfd0b934	chore: generate	2026-07-10 11:38:07 +00:00
Adam	08a2a623dc	fix(data): cut athena stats sync cost Compute all stat dimensions and both grains in one GROUPING SETS query so each sync pass scans the source table once instead of eight times. Hourly passes now only recompute the current ISO week; a daily full pass refreshes the whole display window. Restarted daemons resume the hourly cadence from the last completed sync instead of immediately re-running a pass, and the workgroup kills any query scanning more than 2 TB.	2026-07-10 06:36:26 -05:00
Adam	60c88336b9	feat(stats): update model comparison page	2026-07-10 05:53:31 -05:00
Brendan Allan	8a03fc265b	feat(app): extract prompt state and add composer model selection (#36227 )	2026-07-10 15:49:05 +08:00
Frank	d0ba538924	zen: track openai cache_write_tokens deploy / deploy (push) Has been cancelled Details nix-eval / nix-eval (push) Has been cancelled Details publish / version (push) Has been cancelled Details publish / build-cli (push) Has been cancelled Details publish / sign-cli-windows (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=arm64 host:macos-26 platform_flag:--mac --arm64 target:aarch64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=x64 host:macos-26-intel platform_flag:--mac --x64 target:x86_64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404 platform_flag:--linux target:x86_64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404-arm platform_flag:--linux --arm64 target:aarch64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-windows-2025 platform_flag:--win target:x86_64-pc-windows-msvc]) (push) Has been cancelled Details publish / build-electron (map[host:windows-2025 platform_flag:--win --arm64 target:aarch64-pc-windows-msvc]) (push) Has been cancelled Details publish / publish (push) Has been cancelled Details containers / build (push) Has been cancelled Details generate / generate (push) Has been cancelled Details nix-hashes / compute-hash (blacksmith-4vcpu-ubuntu-2404, x86_64-linux) (push) Has been cancelled Details nix-hashes / compute-hash (blacksmith-4vcpu-ubuntu-2404-arm, aarch64-linux) (push) Has been cancelled Details nix-hashes / compute-hash (macos-15-intel, x86_64-darwin) (push) Has been cancelled Details nix-hashes / compute-hash (macos-latest, aarch64-darwin) (push) Has been cancelled Details storybook / storybook build (push) Has been cancelled Details typecheck / typecheck (push) Has been cancelled Details nix-hashes / update-hashes (push) Has been cancelled Details	2026-07-10 01:48:51 -04:00
Aarav Sareen	772e976d80	fix(app): timeline width jumps around when review panel is open/closed (#36202 )	2026-07-10 03:59:03 +00:00
Aarav Sareen	c769380776	feat(app): visual improvements (#36073 )	2026-07-10 10:52:05 +08:00
opencode-agent[bot]	01131c75d8	fix(app): focus input on new session (#36077 ) Co-authored-by: Victor Navarro <vn4varro@gmail.com>	2026-07-10 10:41:54 +08:00
Brendan Allan	ea982c3832	fix(app): wrap session creation state updates in startTransition (#36182 )	2026-07-10 02:29:30 +00:00
opencode-agent[bot]	d09d5612f3	chore: generate	2026-07-10 00:55:59 +00:00
Adam	85ef35dd64	fix(data): oom crash in stats sync deploy / deploy (push) Has been cancelled Details	2026-07-09 19:53:56 -05:00
opencode-agent[bot]	251177d56c	fix(tui): forward environment to worker (#35925 ) Co-authored-by: Aiden Cline <rekram1-node@users.noreply.github.com>	2026-07-09 18:30:03 -05:00
opencode-agent[bot]	13b9e55c72	fix(ui): sometimes outlines get clipped (#33846 ) Co-authored-by: Luke Parker <10430890+Hona@users.noreply.github.com>	2026-07-10 09:13:34 +10:00
Luke Parker	b94e55c7c0	fix(app): align context tokens with usage (#36015 )	2026-07-10 09:12:54 +10:00
Luke Parker	9c6bb4ff72	fix(app): show tree while opening files (#36018 )	2026-07-10 09:12:20 +10:00
opencode	c2e019ba7d	sync release versions for v1.17.18	2026-07-09 18:51:42 +00:00
Aiden Cline	b8374b5a7c	fix(copilot): handle zero billing batch size (#36123 )	2026-07-09 13:14:33 -05:00
Aiden Cline	b4665a8bf8	feat: add meta muse system prompt (#36122 )	2026-07-09 13:00:39 -05:00
opencode	08096b5e61	sync release versions for v1.17.17	2026-07-09 15:03:10 +00:00
Aiden Cline	2e43d41af0	tweak: adjust variant logic for muse (#36079 )	2026-07-09 09:07:02 -05:00
Frank	518772c2ba	Merge branch 'dev' of github.com:anomalyco/opencode into dev	2026-07-09 08:03:18 -04:00
Frank	fc9021ccec	zen: retry on 529	2026-07-09 08:03:16 -04:00
opencode-agent[bot]	3bebfe6b1b	chore: update nix node_modules hashes	2026-07-09 11:41:13 +00:00
opencode-agent[bot]	3b18c64782	chore: generate	2026-07-09 11:26:18 +00:00
Brendan Allan	c6c599b872	feat(app): refactor help button and add tabs info popup persistence (#36066 ) Co-authored-by: Aarav Sareen <96787824+arvsrn@users.noreply.github.com>	2026-07-09 11:24:39 +00:00
opencode-agent[bot]	6b41ae910c	chore: generate	2026-07-09 08:08:24 +00:00
usrnk1	5c860d4142	feat(feat): align sub-agent task rows with v2 design (#35167 )	2026-07-09 16:07:02 +08:00
usrnk1	4f9207daac	feat(app): restyle revert dock for v2 (#35560 )	2026-07-09 16:06:00 +08:00
Aarav Sareen	ae7d63272c	feat(app): fix descender clipping (#35950 )	2026-07-09 15:09:04 +08:00
Aarav Sareen	5cc3a51357	feat(app): free model selector (#35707 ) Co-authored-by: Brendan Allan <git@brendonovich.dev>	2026-07-09 07:05:09 +00:00
opencode	e357c90212	sync release versions for v1.17.16 deploy / deploy (push) Has been cancelled Details nix-eval / nix-eval (push) Has been cancelled Details nix-hashes / compute-hash (blacksmith-4vcpu-ubuntu-2404, x86_64-linux) (push) Has been cancelled Details nix-hashes / compute-hash (blacksmith-4vcpu-ubuntu-2404-arm, aarch64-linux) (push) Has been cancelled Details nix-hashes / compute-hash (macos-15-intel, x86_64-darwin) (push) Has been cancelled Details nix-hashes / compute-hash (macos-latest, aarch64-darwin) (push) Has been cancelled Details nix-hashes / update-hashes (push) Has been cancelled Details publish / version (push) Has been cancelled Details publish / build-cli (push) Has been cancelled Details publish / sign-cli-windows (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=arm64 host:macos-26 platform_flag:--mac --arm64 target:aarch64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[bun_install_flags:--os=darwin --cpu=x64 host:macos-26-intel platform_flag:--mac --x64 target:x86_64-apple-darwin]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404 platform_flag:--linux target:x86_64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-ubuntu-2404-arm platform_flag:--linux --arm64 target:aarch64-unknown-linux-gnu]) (push) Has been cancelled Details publish / build-electron (map[host:blacksmith-4vcpu-windows-2025 platform_flag:--win target:x86_64-pc-windows-msvc]) (push) Has been cancelled Details publish / build-electron (map[host:windows-2025 platform_flag:--win --arm64 target:aarch64-pc-windows-msvc]) (push) Has been cancelled Details publish / publish (push) Has been cancelled Details storybook / storybook build (push) Has been cancelled Details containers / build (push) Has been cancelled Details docs-locale-sync / sync-locales (push) Has been cancelled Details generate / generate (push) Has been cancelled Details typecheck / typecheck (push) Has been cancelled Details	2026-07-09 06:35:57 +00:00
opencode-agent[bot]	fb1edc4918	chore: update nix node_modules hashes	2026-07-09 05:48:48 +00:00
opencode-agent[bot]	353e0eef8a	chore: generate	2026-07-09 05:43:07 +00:00
usrnk1	a4c17f08b1	feat(desktop): reveal projects in file manager (#35731 )	2026-07-09 13:41:56 +08:00
usrnk1	3cd9ee5a73	feat(app): add composer add menu with draft-preserving commands (#35711 )	2026-07-09 13:39:55 +08:00
opencode-agent[bot]	7c56319aa4	chore: generate	2026-07-09 05:28:34 +00:00
usrnk1	13fa4937b2	feat(desktop): add provider connection tip (#35948 ) Co-authored-by: Brendan Allan <git@brendonovich.dev>	2026-07-09 13:27:22 +08:00
Aiden Cline	1db5c2402c	fix(opencode): expose Grok reasoning variants (#36017 )	2026-07-09 00:13:10 -05:00
opencode-agent[bot]	0abbcddac2	chore: add missing team members (#35980 ) Co-authored-by: Luke Parker <10430890+Hona@users.noreply.github.com>	2026-07-09 09:53:05 +10:00
Luke Parker	dd25d143c5	fix(app): reserve review pane minimum instead of capping chat width at 45% (#35078 )	2026-07-09 09:47:46 +10:00
Luke Parker	d8a57ee15c	fix(app): unmount hidden session panes (#35628 )	2026-07-09 09:44:02 +10:00
Luke Parker	aa52d30d7f	feat(app): persist review state per session (#35488 )	2026-07-08 23:43:28 +00:00
Luke Parker	83d633fd13	fix(app): route legacy drafts to session page (#35808 )	2026-07-09 07:38:56 +08:00
Luke Parker	824455e2f1	fix(app): load capped review patches (#35633 )	2026-07-09 09:09:32 +10:00
Luke Parker	62de2b3695	feat(app): add inline file browser tabs (#35829 )	2026-07-09 09:09:21 +10:00
opencode-agent[bot]	7550aa4b89	chore: update nix node_modules hashes	2026-07-08 22:51:45 +00:00
opencode-agent[bot]	c33a2011c4	fix(app): prevent command palette first-open flash (#35858 )	2026-07-09 06:51:04 +08:00
David Hill	fff6764ed4	fix(console): update square avatar previews (#35975 )	2026-07-08 22:48:11 +00:00