release: v0.15.19

The mcp server support does not mean acp didn't allow u to use mcp servers previously, it means that now you can connect new servers via ACP instead of relying on the opencode defined ones

.github/workflows/publish-vscode.yml

@@ -24,6 +24,10 @@ jobs:
       - run: git fetch --force --tags
       - run: bun install -g @vscode/vsce
 
+      - name: Install extension dependencies
+        run: bun install
+        working-directory: ./sdks/vscode
+
       - name: Publish
         run: |
           ./script/publish

CONTRIBUTING.md

@@ -12,14 +12,10 @@ We want to make it easy for you to contribute to OpenCode. Here are the most com
 
 However, any UI or core product feature must go through a design review with the core team before implementation.
 
-> [!IMPORTANT]
-> We do not accept PRs for core features.
-
-Take a look at recent git history to understand what usually lands.
-
-If you are unsure if a PR would be accepted, feel free to ask a maintainer or look for issues with either of the following labels:
+If you are unsure if a PR would be accepted, feel free to ask a maintainer or look for issues with any of the following labels:
 
 - [`help wanted`](https://github.com/sst/opencode/issues?q=is%3Aissue%20state%3Aopen%20label%3Ahelp-wanted)
+- [`good first issue`](https://github.com/sst/opencode/issues?q=is%3Aissue%20state%3Aopen%20label%3A%22good%20first%20issue%22)
 - [`bug`](https://github.com/sst/opencode/issues?q=is%3Aissue%20state%3Aopen%20label%3Abug)
 
 > [!NOTE]

README.md

@@ -27,7 +27,7 @@ curl -fsSL https://opencode.ai/install | bash
 # Package managers
 npm i -g opencode-ai@latest        # or bun/pnpm/yarn
 scoop bucket add extras; scoop install extras/opencode  # Windows
-winget install opencode            # Windows
+choco install opencode             # Windows
 brew install sst/tap/opencode      # macOS and Linux
 paru -S opencode-bin               # Arch Linux
 ```

STATS.md

@@ -1,116 +1,123 @@
 # Download Stats
 
-| Date       | GitHub Downloads  | npm Downloads     | Total              |
-| ---------- | ----------------- | ----------------- | ------------------ |
-| 2025-06-29 | 18,789 (+0)       | 39,420 (+0)       | 58,209 (+0)        |
-| 2025-06-30 | 20,127 (+1,338)   | 41,059 (+1,639)   | 61,186 (+2,977)    |
-| 2025-07-01 | 22,108 (+1,981)   | 43,745 (+2,686)   | 65,853 (+4,667)    |
-| 2025-07-02 | 24,814 (+2,706)   | 46,168 (+2,423)   | 70,982 (+5,129)    |
-| 2025-07-03 | 27,834 (+3,020)   | 49,955 (+3,787)   | 77,789 (+6,807)    |
-| 2025-07-04 | 30,608 (+2,774)   | 54,758 (+4,803)   | 85,366 (+7,577)    |
-| 2025-07-05 | 32,524 (+1,916)   | 58,371 (+3,613)   | 90,895 (+5,529)    |
-| 2025-07-06 | 33,766 (+1,242)   | 59,694 (+1,323)   | 93,460 (+2,565)    |
-| 2025-07-08 | 38,052 (+4,286)   | 64,468 (+4,774)   | 102,520 (+9,060)   |
-| 2025-07-09 | 40,924 (+2,872)   | 67,935 (+3,467)   | 108,859 (+6,339)   |
-| 2025-07-10 | 43,796 (+2,872)   | 71,402 (+3,467)   | 115,198 (+6,339)   |
-| 2025-07-11 | 46,982 (+3,186)   | 77,462 (+6,060)   | 124,444 (+9,246)   |
-| 2025-07-12 | 49,302 (+2,320)   | 82,177 (+4,715)   | 131,479 (+7,035)   |
-| 2025-07-13 | 50,803 (+1,501)   | 86,394 (+4,217)   | 137,197 (+5,718)   |
-| 2025-07-14 | 53,283 (+2,480)   | 87,860 (+1,466)   | 141,143 (+3,946)   |
-| 2025-07-15 | 57,590 (+4,307)   | 91,036 (+3,176)   | 148,626 (+7,483)   |
-| 2025-07-16 | 62,313 (+4,723)   | 95,258 (+4,222)   | 157,571 (+8,945)   |
-| 2025-07-17 | 66,684 (+4,371)   | 100,048 (+4,790)  | 166,732 (+9,161)   |
-| 2025-07-18 | 70,379 (+3,695)   | 102,587 (+2,539)  | 172,966 (+6,234)   |
-| 2025-07-19 | 73,497 (+3,117)   | 105,904 (+3,317)  | 179,401 (+6,434)   |
-| 2025-07-20 | 76,453 (+2,956)   | 109,044 (+3,140)  | 185,497 (+6,096)   |
-| 2025-07-21 | 80,197 (+3,744)   | 113,537 (+4,493)  | 193,734 (+8,237)   |
-| 2025-07-22 | 84,251 (+4,054)   | 118,073 (+4,536)  | 202,324 (+8,590)   |
-| 2025-07-23 | 88,589 (+4,338)   | 121,436 (+3,363)  | 210,025 (+7,701)   |
-| 2025-07-24 | 92,469 (+3,880)   | 124,091 (+2,655)  | 216,560 (+6,535)   |
-| 2025-07-25 | 96,417 (+3,948)   | 126,985 (+2,894)  | 223,402 (+6,842)   |
-| 2025-07-26 | 100,646 (+4,229)  | 131,411 (+4,426)  | 232,057 (+8,655)   |
-| 2025-07-27 | 102,644 (+1,998)  | 134,736 (+3,325)  | 237,380 (+5,323)   |
-| 2025-07-28 | 105,446 (+2,802)  | 136,016 (+1,280)  | 241,462 (+4,082)   |
-| 2025-07-29 | 108,998 (+3,552)  | 137,542 (+1,526)  | 246,540 (+5,078)   |
-| 2025-07-30 | 113,544 (+4,546)  | 140,317 (+2,775)  | 253,861 (+7,321)   |
-| 2025-07-31 | 118,339 (+4,795)  | 143,344 (+3,027)  | 261,683 (+7,822)   |
-| 2025-08-01 | 123,539 (+5,200)  | 146,680 (+3,336)  | 270,219 (+8,536)   |
-| 2025-08-02 | 127,864 (+4,325)  | 149,236 (+2,556)  | 277,100 (+6,881)   |
-| 2025-08-03 | 131,397 (+3,533)  | 150,451 (+1,215)  | 281,848 (+4,748)   |
-| 2025-08-04 | 136,266 (+4,869)  | 153,260 (+2,809)  | 289,526 (+7,678)   |
-| 2025-08-05 | 141,596 (+5,330)  | 155,752 (+2,492)  | 297,348 (+7,822)   |
-| 2025-08-06 | 147,067 (+5,471)  | 158,309 (+2,557)  | 305,376 (+8,028)   |
-| 2025-08-07 | 152,591 (+5,524)  | 160,889 (+2,580)  | 313,480 (+8,104)   |
-| 2025-08-08 | 158,187 (+5,596)  | 163,448 (+2,559)  | 321,635 (+8,155)   |
-| 2025-08-09 | 162,770 (+4,583)  | 165,721 (+2,273)  | 328,491 (+6,856)   |
-| 2025-08-10 | 165,695 (+2,925)  | 167,109 (+1,388)  | 332,804 (+4,313)   |
-| 2025-08-11 | 169,297 (+3,602)  | 167,953 (+844)    | 337,250 (+4,446)   |
-| 2025-08-12 | 176,307 (+7,010)  | 171,876 (+3,923)  | 348,183 (+10,933)  |
-| 2025-08-13 | 182,997 (+6,690)  | 177,182 (+5,306)  | 360,179 (+11,996)  |
-| 2025-08-14 | 189,063 (+6,066)  | 179,741 (+2,559)  | 368,804 (+8,625)   |
-| 2025-08-15 | 193,608 (+4,545)  | 181,792 (+2,051)  | 375,400 (+6,596)   |
-| 2025-08-16 | 198,118 (+4,510)  | 184,558 (+2,766)  | 382,676 (+7,276)   |
-| 2025-08-17 | 201,299 (+3,181)  | 186,269 (+1,711)  | 387,568 (+4,892)   |
-| 2025-08-18 | 204,559 (+3,260)  | 187,399 (+1,130)  | 391,958 (+4,390)   |
-| 2025-08-19 | 209,814 (+5,255)  | 189,668 (+2,269)  | 399,482 (+7,524)   |
-| 2025-08-20 | 214,497 (+4,683)  | 191,481 (+1,813)  | 405,978 (+6,496)   |
-| 2025-08-21 | 220,465 (+5,968)  | 194,784 (+3,303)  | 415,249 (+9,271)   |
-| 2025-08-22 | 225,899 (+5,434)  | 197,204 (+2,420)  | 423,103 (+7,854)   |
-| 2025-08-23 | 229,005 (+3,106)  | 199,238 (+2,034)  | 428,243 (+5,140)   |
-| 2025-08-24 | 232,098 (+3,093)  | 201,157 (+1,919)  | 433,255 (+5,012)   |
-| 2025-08-25 | 236,607 (+4,509)  | 202,650 (+1,493)  | 439,257 (+6,002)   |
-| 2025-08-26 | 242,783 (+6,176)  | 205,242 (+2,592)  | 448,025 (+8,768)   |
-| 2025-08-27 | 248,409 (+5,626)  | 205,242 (+0)      | 453,651 (+5,626)   |
-| 2025-08-28 | 252,796 (+4,387)  | 205,242 (+0)      | 458,038 (+4,387)   |
-| 2025-08-29 | 256,045 (+3,249)  | 211,075 (+5,833)  | 467,120 (+9,082)   |
-| 2025-08-30 | 258,863 (+2,818)  | 212,397 (+1,322)  | 471,260 (+4,140)   |
-| 2025-08-31 | 262,004 (+3,141)  | 213,944 (+1,547)  | 475,948 (+4,688)   |
-| 2025-09-01 | 265,359 (+3,355)  | 215,115 (+1,171)  | 480,474 (+4,526)   |
-| 2025-09-02 | 270,483 (+5,124)  | 217,075 (+1,960)  | 487,558 (+7,084)   |
-| 2025-09-03 | 274,793 (+4,310)  | 219,755 (+2,680)  | 494,548 (+6,990)   |
-| 2025-09-04 | 280,430 (+5,637)  | 222,103 (+2,348)  | 502,533 (+7,985)   |
-| 2025-09-05 | 283,769 (+3,339)  | 223,793 (+1,690)  | 507,562 (+5,029)   |
-| 2025-09-06 | 286,245 (+2,476)  | 225,036 (+1,243)  | 511,281 (+3,719)   |
-| 2025-09-07 | 288,623 (+2,378)  | 225,866 (+830)    | 514,489 (+3,208)   |
-| 2025-09-08 | 293,341 (+4,718)  | 227,073 (+1,207)  | 520,414 (+5,925)   |
-| 2025-09-09 | 300,036 (+6,695)  | 229,788 (+2,715)  | 529,824 (+9,410)   |
-| 2025-09-10 | 307,287 (+7,251)  | 233,435 (+3,647)  | 540,722 (+10,898)  |
-| 2025-09-11 | 314,083 (+6,796)  | 237,356 (+3,921)  | 551,439 (+10,717)  |
-| 2025-09-12 | 321,046 (+6,963)  | 240,728 (+3,372)  | 561,774 (+10,335)  |
-| 2025-09-13 | 324,894 (+3,848)  | 245,539 (+4,811)  | 570,433 (+8,659)   |
-| 2025-09-14 | 328,876 (+3,982)  | 248,245 (+2,706)  | 577,121 (+6,688)   |
-| 2025-09-15 | 334,201 (+5,325)  | 250,983 (+2,738)  | 585,184 (+8,063)   |
-| 2025-09-16 | 342,609 (+8,408)  | 255,264 (+4,281)  | 597,873 (+12,689)  |
-| 2025-09-17 | 351,117 (+8,508)  | 260,970 (+5,706)  | 612,087 (+14,214)  |
-| 2025-09-18 | 358,717 (+7,600)  | 266,922 (+5,952)  | 625,639 (+13,552)  |
-| 2025-09-19 | 365,401 (+6,684)  | 271,859 (+4,937)  | 637,260 (+11,621)  |
-| 2025-09-20 | 372,092 (+6,691)  | 276,917 (+5,058)  | 649,009 (+11,749)  |
-| 2025-09-21 | 377,079 (+4,987)  | 280,261 (+3,344)  | 657,340 (+8,331)   |
-| 2025-09-22 | 382,492 (+5,413)  | 284,009 (+3,748)  | 666,501 (+9,161)   |
-| 2025-09-23 | 387,008 (+4,516)  | 289,129 (+5,120)  | 676,137 (+9,636)   |
-| 2025-09-24 | 393,325 (+6,317)  | 294,927 (+5,798)  | 688,252 (+12,115)  |
-| 2025-09-25 | 398,879 (+5,554)  | 301,663 (+6,736)  | 700,542 (+12,290)  |
-| 2025-09-26 | 404,334 (+5,455)  | 306,713 (+5,050)  | 711,047 (+10,505)  |
-| 2025-09-27 | 411,618 (+7,284)  | 317,763 (+11,050) | 729,381 (+18,334)  |
-| 2025-09-28 | 414,910 (+3,292)  | 322,522 (+4,759)  | 737,432 (+8,051)   |
-| 2025-09-29 | 419,919 (+5,009)  | 328,033 (+5,511)  | 747,952 (+10,520)  |
-| 2025-09-30 | 427,991 (+8,072)  | 336,472 (+8,439)  | 764,463 (+16,511)  |
-| 2025-10-01 | 433,591 (+5,600)  | 341,742 (+5,270)  | 775,333 (+10,870)  |
-| 2025-10-02 | 440,852 (+7,261)  | 348,099 (+6,357)  | 788,951 (+13,618)  |
-| 2025-10-03 | 446,829 (+5,977)  | 359,937 (+11,838) | 806,766 (+17,815)  |
-| 2025-10-04 | 452,561 (+5,732)  | 370,386 (+10,449) | 822,947 (+16,181)  |
-| 2025-10-05 | 455,559 (+2,998)  | 374,745 (+4,359)  | 830,304 (+7,357)   |
-| 2025-10-06 | 460,927 (+5,368)  | 379,489 (+4,744)  | 840,416 (+10,112)  |
-| 2025-10-07 | 467,336 (+6,409)  | 385,438 (+5,949)  | 852,774 (+12,358)  |
-| 2025-10-08 | 474,643 (+7,307)  | 394,139 (+8,701)  | 868,782 (+16,008)  |
-| 2025-10-09 | 479,203 (+4,560)  | 400,526 (+6,387)  | 879,729 (+10,947)  |
-| 2025-10-10 | 484,374 (+5,171)  | 406,015 (+5,489)  | 890,389 (+10,660)  |
-| 2025-10-11 | 488,427 (+4,053)  | 414,699 (+8,684)  | 903,126 (+12,737)  |
-| 2025-10-12 | 492,125 (+3,698)  | 418,745 (+4,046)  | 910,870 (+7,744)   |
-| 2025-10-14 | 505,130 (+13,005) | 429,286 (+10,541) | 934,416 (+23,546)  |
-| 2025-10-15 | 512,717 (+7,587)  | 439,290 (+10,004) | 952,007 (+17,591)  |
-| 2025-10-16 | 517,719 (+5,002)  | 447,137 (+7,847)  | 964,856 (+12,849)  |
-| 2025-10-17 | 526,239 (+8,520)  | 457,467 (+10,330) | 983,706 (+18,850)  |
-| 2025-10-18 | 531,564 (+5,325)  | 465,272 (+7,805)  | 996,836 (+13,130)  |
-| 2025-10-19 | 536,209 (+4,645)  | 469,078 (+3,806)  | 1,005,287 (+8,451) |
-| 2025-10-20 | 541,264 (+5,055)  | 472,952 (+3,874)  | 1,014,216 (+8,929) |
+| Date       | GitHub Downloads  | npm Downloads     | Total               |
+| ---------- | ----------------- | ----------------- | ------------------- |
+| 2025-06-29 | 18,789 (+0)       | 39,420 (+0)       | 58,209 (+0)         |
+| 2025-06-30 | 20,127 (+1,338)   | 41,059 (+1,639)   | 61,186 (+2,977)     |
+| 2025-07-01 | 22,108 (+1,981)   | 43,745 (+2,686)   | 65,853 (+4,667)     |
+| 2025-07-02 | 24,814 (+2,706)   | 46,168 (+2,423)   | 70,982 (+5,129)     |
+| 2025-07-03 | 27,834 (+3,020)   | 49,955 (+3,787)   | 77,789 (+6,807)     |
+| 2025-07-04 | 30,608 (+2,774)   | 54,758 (+4,803)   | 85,366 (+7,577)     |
+| 2025-07-05 | 32,524 (+1,916)   | 58,371 (+3,613)   | 90,895 (+5,529)     |
+| 2025-07-06 | 33,766 (+1,242)   | 59,694 (+1,323)   | 93,460 (+2,565)     |
+| 2025-07-08 | 38,052 (+4,286)   | 64,468 (+4,774)   | 102,520 (+9,060)    |
+| 2025-07-09 | 40,924 (+2,872)   | 67,935 (+3,467)   | 108,859 (+6,339)    |
+| 2025-07-10 | 43,796 (+2,872)   | 71,402 (+3,467)   | 115,198 (+6,339)    |
+| 2025-07-11 | 46,982 (+3,186)   | 77,462 (+6,060)   | 124,444 (+9,246)    |
+| 2025-07-12 | 49,302 (+2,320)   | 82,177 (+4,715)   | 131,479 (+7,035)    |
+| 2025-07-13 | 50,803 (+1,501)   | 86,394 (+4,217)   | 137,197 (+5,718)    |
+| 2025-07-14 | 53,283 (+2,480)   | 87,860 (+1,466)   | 141,143 (+3,946)    |
+| 2025-07-15 | 57,590 (+4,307)   | 91,036 (+3,176)   | 148,626 (+7,483)    |
+| 2025-07-16 | 62,313 (+4,723)   | 95,258 (+4,222)   | 157,571 (+8,945)    |
+| 2025-07-17 | 66,684 (+4,371)   | 100,048 (+4,790)  | 166,732 (+9,161)    |
+| 2025-07-18 | 70,379 (+3,695)   | 102,587 (+2,539)  | 172,966 (+6,234)    |
+| 2025-07-19 | 73,497 (+3,117)   | 105,904 (+3,317)  | 179,401 (+6,434)    |
+| 2025-07-20 | 76,453 (+2,956)   | 109,044 (+3,140)  | 185,497 (+6,096)    |
+| 2025-07-21 | 80,197 (+3,744)   | 113,537 (+4,493)  | 193,734 (+8,237)    |
+| 2025-07-22 | 84,251 (+4,054)   | 118,073 (+4,536)  | 202,324 (+8,590)    |
+| 2025-07-23 | 88,589 (+4,338)   | 121,436 (+3,363)  | 210,025 (+7,701)    |
+| 2025-07-24 | 92,469 (+3,880)   | 124,091 (+2,655)  | 216,560 (+6,535)    |
+| 2025-07-25 | 96,417 (+3,948)   | 126,985 (+2,894)  | 223,402 (+6,842)    |
+| 2025-07-26 | 100,646 (+4,229)  | 131,411 (+4,426)  | 232,057 (+8,655)    |
+| 2025-07-27 | 102,644 (+1,998)  | 134,736 (+3,325)  | 237,380 (+5,323)    |
+| 2025-07-28 | 105,446 (+2,802)  | 136,016 (+1,280)  | 241,462 (+4,082)    |
+| 2025-07-29 | 108,998 (+3,552)  | 137,542 (+1,526)  | 246,540 (+5,078)    |
+| 2025-07-30 | 113,544 (+4,546)  | 140,317 (+2,775)  | 253,861 (+7,321)    |
+| 2025-07-31 | 118,339 (+4,795)  | 143,344 (+3,027)  | 261,683 (+7,822)    |
+| 2025-08-01 | 123,539 (+5,200)  | 146,680 (+3,336)  | 270,219 (+8,536)    |
+| 2025-08-02 | 127,864 (+4,325)  | 149,236 (+2,556)  | 277,100 (+6,881)    |
+| 2025-08-03 | 131,397 (+3,533)  | 150,451 (+1,215)  | 281,848 (+4,748)    |
+| 2025-08-04 | 136,266 (+4,869)  | 153,260 (+2,809)  | 289,526 (+7,678)    |
+| 2025-08-05 | 141,596 (+5,330)  | 155,752 (+2,492)  | 297,348 (+7,822)    |
+| 2025-08-06 | 147,067 (+5,471)  | 158,309 (+2,557)  | 305,376 (+8,028)    |
+| 2025-08-07 | 152,591 (+5,524)  | 160,889 (+2,580)  | 313,480 (+8,104)    |
+| 2025-08-08 | 158,187 (+5,596)  | 163,448 (+2,559)  | 321,635 (+8,155)    |
+| 2025-08-09 | 162,770 (+4,583)  | 165,721 (+2,273)  | 328,491 (+6,856)    |
+| 2025-08-10 | 165,695 (+2,925)  | 167,109 (+1,388)  | 332,804 (+4,313)    |
+| 2025-08-11 | 169,297 (+3,602)  | 167,953 (+844)    | 337,250 (+4,446)    |
+| 2025-08-12 | 176,307 (+7,010)  | 171,876 (+3,923)  | 348,183 (+10,933)   |
+| 2025-08-13 | 182,997 (+6,690)  | 177,182 (+5,306)  | 360,179 (+11,996)   |
+| 2025-08-14 | 189,063 (+6,066)  | 179,741 (+2,559)  | 368,804 (+8,625)    |
+| 2025-08-15 | 193,608 (+4,545)  | 181,792 (+2,051)  | 375,400 (+6,596)    |
+| 2025-08-16 | 198,118 (+4,510)  | 184,558 (+2,766)  | 382,676 (+7,276)    |
+| 2025-08-17 | 201,299 (+3,181)  | 186,269 (+1,711)  | 387,568 (+4,892)    |
+| 2025-08-18 | 204,559 (+3,260)  | 187,399 (+1,130)  | 391,958 (+4,390)    |
+| 2025-08-19 | 209,814 (+5,255)  | 189,668 (+2,269)  | 399,482 (+7,524)    |
+| 2025-08-20 | 214,497 (+4,683)  | 191,481 (+1,813)  | 405,978 (+6,496)    |
+| 2025-08-21 | 220,465 (+5,968)  | 194,784 (+3,303)  | 415,249 (+9,271)    |
+| 2025-08-22 | 225,899 (+5,434)  | 197,204 (+2,420)  | 423,103 (+7,854)    |
+| 2025-08-23 | 229,005 (+3,106)  | 199,238 (+2,034)  | 428,243 (+5,140)    |
+| 2025-08-24 | 232,098 (+3,093)  | 201,157 (+1,919)  | 433,255 (+5,012)    |
+| 2025-08-25 | 236,607 (+4,509)  | 202,650 (+1,493)  | 439,257 (+6,002)    |
+| 2025-08-26 | 242,783 (+6,176)  | 205,242 (+2,592)  | 448,025 (+8,768)    |
+| 2025-08-27 | 248,409 (+5,626)  | 205,242 (+0)      | 453,651 (+5,626)    |
+| 2025-08-28 | 252,796 (+4,387)  | 205,242 (+0)      | 458,038 (+4,387)    |
+| 2025-08-29 | 256,045 (+3,249)  | 211,075 (+5,833)  | 467,120 (+9,082)    |
+| 2025-08-30 | 258,863 (+2,818)  | 212,397 (+1,322)  | 471,260 (+4,140)    |
+| 2025-08-31 | 262,004 (+3,141)  | 213,944 (+1,547)  | 475,948 (+4,688)    |
+| 2025-09-01 | 265,359 (+3,355)  | 215,115 (+1,171)  | 480,474 (+4,526)    |
+| 2025-09-02 | 270,483 (+5,124)  | 217,075 (+1,960)  | 487,558 (+7,084)    |
+| 2025-09-03 | 274,793 (+4,310)  | 219,755 (+2,680)  | 494,548 (+6,990)    |
+| 2025-09-04 | 280,430 (+5,637)  | 222,103 (+2,348)  | 502,533 (+7,985)    |
+| 2025-09-05 | 283,769 (+3,339)  | 223,793 (+1,690)  | 507,562 (+5,029)    |
+| 2025-09-06 | 286,245 (+2,476)  | 225,036 (+1,243)  | 511,281 (+3,719)    |
+| 2025-09-07 | 288,623 (+2,378)  | 225,866 (+830)    | 514,489 (+3,208)    |
+| 2025-09-08 | 293,341 (+4,718)  | 227,073 (+1,207)  | 520,414 (+5,925)    |
+| 2025-09-09 | 300,036 (+6,695)  | 229,788 (+2,715)  | 529,824 (+9,410)    |
+| 2025-09-10 | 307,287 (+7,251)  | 233,435 (+3,647)  | 540,722 (+10,898)   |
+| 2025-09-11 | 314,083 (+6,796)  | 237,356 (+3,921)  | 551,439 (+10,717)   |
+| 2025-09-12 | 321,046 (+6,963)  | 240,728 (+3,372)  | 561,774 (+10,335)   |
+| 2025-09-13 | 324,894 (+3,848)  | 245,539 (+4,811)  | 570,433 (+8,659)    |
+| 2025-09-14 | 328,876 (+3,982)  | 248,245 (+2,706)  | 577,121 (+6,688)    |
+| 2025-09-15 | 334,201 (+5,325)  | 250,983 (+2,738)  | 585,184 (+8,063)    |
+| 2025-09-16 | 342,609 (+8,408)  | 255,264 (+4,281)  | 597,873 (+12,689)   |
+| 2025-09-17 | 351,117 (+8,508)  | 260,970 (+5,706)  | 612,087 (+14,214)   |
+| 2025-09-18 | 358,717 (+7,600)  | 266,922 (+5,952)  | 625,639 (+13,552)   |
+| 2025-09-19 | 365,401 (+6,684)  | 271,859 (+4,937)  | 637,260 (+11,621)   |
+| 2025-09-20 | 372,092 (+6,691)  | 276,917 (+5,058)  | 649,009 (+11,749)   |
+| 2025-09-21 | 377,079 (+4,987)  | 280,261 (+3,344)  | 657,340 (+8,331)    |
+| 2025-09-22 | 382,492 (+5,413)  | 284,009 (+3,748)  | 666,501 (+9,161)    |
+| 2025-09-23 | 387,008 (+4,516)  | 289,129 (+5,120)  | 676,137 (+9,636)    |
+| 2025-09-24 | 393,325 (+6,317)  | 294,927 (+5,798)  | 688,252 (+12,115)   |
+| 2025-09-25 | 398,879 (+5,554)  | 301,663 (+6,736)  | 700,542 (+12,290)   |
+| 2025-09-26 | 404,334 (+5,455)  | 306,713 (+5,050)  | 711,047 (+10,505)   |
+| 2025-09-27 | 411,618 (+7,284)  | 317,763 (+11,050) | 729,381 (+18,334)   |
+| 2025-09-28 | 414,910 (+3,292)  | 322,522 (+4,759)  | 737,432 (+8,051)    |
+| 2025-09-29 | 419,919 (+5,009)  | 328,033 (+5,511)  | 747,952 (+10,520)   |
+| 2025-09-30 | 427,991 (+8,072)  | 336,472 (+8,439)  | 764,463 (+16,511)   |
+| 2025-10-01 | 433,591 (+5,600)  | 341,742 (+5,270)  | 775,333 (+10,870)   |
+| 2025-10-02 | 440,852 (+7,261)  | 348,099 (+6,357)  | 788,951 (+13,618)   |
+| 2025-10-03 | 446,829 (+5,977)  | 359,937 (+11,838) | 806,766 (+17,815)   |
+| 2025-10-04 | 452,561 (+5,732)  | 370,386 (+10,449) | 822,947 (+16,181)   |
+| 2025-10-05 | 455,559 (+2,998)  | 374,745 (+4,359)  | 830,304 (+7,357)    |
+| 2025-10-06 | 460,927 (+5,368)  | 379,489 (+4,744)  | 840,416 (+10,112)   |
+| 2025-10-07 | 467,336 (+6,409)  | 385,438 (+5,949)  | 852,774 (+12,358)   |
+| 2025-10-08 | 474,643 (+7,307)  | 394,139 (+8,701)  | 868,782 (+16,008)   |
+| 2025-10-09 | 479,203 (+4,560)  | 400,526 (+6,387)  | 879,729 (+10,947)   |
+| 2025-10-10 | 484,374 (+5,171)  | 406,015 (+5,489)  | 890,389 (+10,660)   |
+| 2025-10-11 | 488,427 (+4,053)  | 414,699 (+8,684)  | 903,126 (+12,737)   |
+| 2025-10-12 | 492,125 (+3,698)  | 418,745 (+4,046)  | 910,870 (+7,744)    |
+| 2025-10-14 | 505,130 (+13,005) | 429,286 (+10,541) | 934,416 (+23,546)   |
+| 2025-10-15 | 512,717 (+7,587)  | 439,290 (+10,004) | 952,007 (+17,591)   |
+| 2025-10-16 | 517,719 (+5,002)  | 447,137 (+7,847)  | 964,856 (+12,849)   |
+| 2025-10-17 | 526,239 (+8,520)  | 457,467 (+10,330) | 983,706 (+18,850)   |
+| 2025-10-18 | 531,564 (+5,325)  | 465,272 (+7,805)  | 996,836 (+13,130)   |
+| 2025-10-19 | 536,209 (+4,645)  | 469,078 (+3,806)  | 1,005,287 (+8,451)  |
+| 2025-10-20 | 541,264 (+5,055)  | 472,952 (+3,874)  | 1,014,216 (+8,929)  |
+| 2025-10-21 | 548,721 (+7,457)  | 479,703 (+6,751)  | 1,028,424 (+14,208) |
+| 2025-10-22 | 557,949 (+9,228)  | 491,395 (+11,692) | 1,049,344 (+20,920) |
+| 2025-10-23 | 564,716 (+6,767)  | 498,736 (+7,341)  | 1,063,452 (+14,108) |
+| 2025-10-24 | 572,692 (+7,976)  | 506,905 (+8,169)  | 1,079,597 (+16,145) |
+| 2025-10-25 | 578,927 (+6,235)  | 516,129 (+9,224)  | 1,095,056 (+15,459) |
+| 2025-10-26 | 584,409 (+5,482)  | 521,179 (+5,050)  | 1,105,588 (+10,532) |
+| 2025-10-27 | 589,999 (+5,590)  | 526,001 (+4,822)  | 1,116,000 (+10,412) |

github/README.md

@@ -104,7 +104,7 @@ To test locally:
    - `MODEL`: The model used by opencode. Same as the `MODEL` defined in the GitHub workflow.
    - `ANTHROPIC_API_KEY`: Your model provider API key. Same as the keys defined in the GitHub workflow.
    - `GITHUB_RUN_ID`: Dummy value to emulate GitHub action environment.
-   - `MOCK_TOKEN`: A GitHub persontal access token. This token is used to verify you have `admin` or `write` access to the test repo. Generate a token [here](https://github.com/settings/personal-access-tokens).
+   - `MOCK_TOKEN`: A GitHub personal access token. This token is used to verify you have `admin` or `write` access to the test repo. Generate a token [here](https://github.com/settings/personal-access-tokens).
    - `MOCK_EVENT`: Mock GitHub event payload (see templates below).
    - `/path/to/opencode`: Path to your cloned opencode repo. `bun /path/to/opencode/github/index.ts` runs your local version of `opencode`.
 
@@ -118,7 +118,7 @@ Replace:
 
 - `"owner":"sst"` with repo owner
 - `"repo":"hello-world"` with repo name
-- `"actor":"fwang"` with the GitHub username of commentor
+- `"actor":"fwang"` with the GitHub username of commenter
 - `"number":4` with the GitHub issue id
 - `"body":"hey opencode, summarize thread"` with comment body
 

package.json

@@ -25,6 +25,7 @@
       "@tsconfig/bun": "1.0.9",
       "@cloudflare/workers-types": "4.20251008.0",
       "@openauthjs/openauth": "0.0.0-20250322224806",
+      "@pierre/precision-diffs": "0.3.2",
       "@solidjs/meta": "0.29.4",
       "@tailwindcss/vite": "4.1.11",
       "diff": "8.0.2",
@@ -52,8 +53,8 @@
     "turbo": "2.5.6"
   },
   "dependencies": {
-    "@opencode-ai/sdk": "workspace:*",
-    "@opencode-ai/script": "workspace:*"
+    "@opencode-ai/script": "workspace:*",
+    "@opencode-ai/sdk": "workspace:*"
   },
   "repository": {
     "type": "git",

packages/console/app/package.json

@@ -7,7 +7,7 @@
     "dev:remote": "VITE_AUTH_URL=https://auth.dev.opencode.ai bun sst shell --stage=dev bun dev",
     "build": "vinxi build && ../../opencode/script/schema.ts ./.output/public/config.json",
     "start": "vinxi start",
-    "version": "0.15.9"
+    "version": "0.15.19"
   },
   "dependencies": {
     "@ibm/plex": "6.4.1",

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

@@ -0,0 +1,5 @@
+export class AuthError extends Error {}
+export class CreditsError extends Error {}
+export class MonthlyLimitError extends Error {}
+export class UserLimitError extends Error {}
+export class ModelError extends Error {}

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

@@ -0,0 +1 @@
+export type Format = "anthropic" | "openai" | "oa-compat"

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

@@ -1,67 +1,41 @@
-import { z } from "zod"
 import type { APIEvent } from "@solidjs/start/server"
-import path from "node:path"
 import { and, Database, eq, isNull, lt, or, sql } from "@opencode-ai/console-core/drizzle/index.js"
 import { KeyTable } from "@opencode-ai/console-core/schema/key.sql.js"
 import { BillingTable, UsageTable } from "@opencode-ai/console-core/schema/billing.sql.js"
 import { centsToMicroCents } from "@opencode-ai/console-core/util/price.js"
 import { Identifier } from "@opencode-ai/console-core/identifier.js"
-import { Resource } from "@opencode-ai/console-resource"
-import { Billing } from "../../../../core/src/billing"
+import { Billing } from "@opencode-ai/console-core/billing.js"
 import { Actor } from "@opencode-ai/console-core/actor.js"
 import { WorkspaceTable } from "@opencode-ai/console-core/schema/workspace.sql.js"
 import { ZenData } from "@opencode-ai/console-core/model.js"
 import { UserTable } from "@opencode-ai/console-core/schema/user.sql.js"
 import { ModelTable } from "@opencode-ai/console-core/schema/model.sql.js"
 import { ProviderTable } from "@opencode-ai/console-core/schema/provider.sql.js"
+import { logger } from "./logger"
+import { AuthError, CreditsError, MonthlyLimitError, UserLimitError, ModelError } from "./error"
+import { createBodyConverter, createStreamPartConverter, createResponseConverter } from "./provider/provider"
+import { Format } from "./format"
+import { anthropicHelper } from "./provider/anthropic"
+import { openaiHelper } from "./provider/openai"
+import { oaCompatHelper } from "./provider/openai-compatible"
+
+type ZenData = Awaited<ReturnType<typeof ZenData.list>>
+type Model = ZenData["models"][string]
 
 export async function handler(
   input: APIEvent,
   opts: {
-    modifyBody?: (body: any) => any
-    setAuthHeader: (headers: Headers, apiKey: string) => void
+    format: Format
     parseApiKey: (headers: Headers) => string | undefined
-    onStreamPart: (chunk: string) => void
-    getStreamUsage: () => any
-    normalizeUsage: (body: any) => {
-      inputTokens: number
-      outputTokens: number
-      reasoningTokens?: number
-      cacheReadTokens?: number
-      cacheWrite5mTokens?: number
-      cacheWrite1hTokens?: number
-    }
   },
 ) {
-  class AuthError extends Error {}
-  class CreditsError extends Error {}
-  class MonthlyLimitError extends Error {}
-  class UserLimitError extends Error {}
-  class ModelError extends Error {}
-
-  type ZenData = Awaited<ReturnType<typeof ZenData.list>>
-  type Model = ZenData["models"][string]
-
   const FREE_WORKSPACES = [
     "wrk_01K46JDFR0E75SG2Q8K172KF3Y", // frank
     "wrk_01K6W1A3VE0KMNVSCQT43BG2SX", // opencode bench
   ]
 
-  const logger = {
-    metric: (values: Record<string, any>) => {
-      console.log(`_metric:${JSON.stringify(values)}`)
-    },
-    log: console.log,
-    debug: (message: string) => {
-      if (Resource.App.stage === "production") return
-      console.debug(message)
-    },
-  }
-
   try {
-    const url = new URL(input.request.url)
     const body = await input.request.json()
-    logger.debug(JSON.stringify(body))
     logger.metric({
       is_tream: !!body.stream,
       session: input.request.headers.get("x-opencode-session"),
@@ -78,22 +52,28 @@ export async function handler(
 
     // Request to model provider
     const startTimestamp = Date.now()
-    const res = await fetch(path.posix.join(providerInfo.api, url.pathname.replace(/^\/zen\/v1/, "") + url.search), {
+    const reqUrl = providerInfo.modifyUrl(providerInfo.api)
+    const reqBody = JSON.stringify(
+      providerInfo.modifyBody({
+        ...createBodyConverter(opts.format, providerInfo.format)(body),
+        model: providerInfo.model,
+      }),
+    )
+    logger.debug("REQUEST URL: " + reqUrl)
+    logger.debug("REQUEST: " + reqBody)
+    const res = await fetch(reqUrl, {
       method: "POST",
       headers: (() => {
         const headers = input.request.headers
         headers.delete("host")
         headers.delete("content-length")
-        opts.setAuthHeader(headers, providerInfo.apiKey)
+        providerInfo.modifyHeaders(headers, body, providerInfo.apiKey)
         Object.entries(providerInfo.headerMappings ?? {}).forEach(([k, v]) => {
           headers.set(k, headers.get(v)!)
         })
         return headers
       })(),
-      body: JSON.stringify({
-        ...(opts.modifyBody?.(body) ?? body),
-        model: providerInfo.model,
-      }),
+      body: reqBody,
     })
 
     // Scrub response headers
@@ -104,14 +84,19 @@ export async function handler(
         resHeaders.set(k, v)
       }
     }
+    logger.debug("STATUS: " + res.status + " " + res.statusText)
+    if (res.status === 400 || res.status === 503) {
+      logger.debug("RESPONSE: " + (await res.text()))
+    }
 
     // Handle non-streaming response
     if (!body.stream) {
+      const responseConverter = createResponseConverter(providerInfo.format, opts.format)
       const json = await res.json()
-      const body = JSON.stringify(json)
+      const body = JSON.stringify(responseConverter(json))
       logger.metric({ response_length: body.length })
-      logger.debug(body)
-      await trackUsage(authInfo, modelInfo, providerInfo.id, json.usage)
+      logger.debug("RESPONSE: " + body)
+      await trackUsage(authInfo, modelInfo, providerInfo, json.usage)
       await reload(authInfo)
       return new Response(body, {
         status: res.status,
@@ -121,10 +106,13 @@ export async function handler(
     }
 
     // Handle streaming response
+    const streamConverter = createStreamPartConverter(providerInfo.format, opts.format)
+    const usageParser = providerInfo.createUsageParser()
     const stream = new ReadableStream({
       start(c) {
         const reader = res.body?.getReader()
         const decoder = new TextDecoder()
+        const encoder = new TextEncoder()
         let buffer = ""
         let responseLength = 0
 
@@ -136,9 +124,9 @@ export async function handler(
                   response_length: responseLength,
                   "timestamp.last_byte": Date.now(),
                 })
-                const usage = opts.getStreamUsage()
+                const usage = usageParser.retrieve()
                 if (usage) {
-                  await trackUsage(authInfo, modelInfo, providerInfo.id, usage)
+                  await trackUsage(authInfo, modelInfo, providerInfo, usage)
                   await reload(authInfo)
                 }
                 c.close()
@@ -158,12 +146,21 @@ export async function handler(
               const parts = buffer.split("\n\n")
               buffer = parts.pop() ?? ""
 
-              for (const part of parts) {
-                logger.debug(part)
-                opts.onStreamPart(part.trim())
+              for (let part of parts) {
+                logger.debug("PART: " + part)
+
+                part = part.trim()
+                usageParser.parse(part)
+
+                if (providerInfo.format !== opts.format) {
+                  part = streamConverter(part)
+                  c.enqueue(encoder.encode(part + "\n\n"))
+                }
               }
 
-              c.enqueue(value)
+              if (providerInfo.format === opts.format) {
+                c.enqueue(value)
+              }
 
               return pump()
             }) || Promise.resolve()
@@ -235,7 +232,11 @@ export async function handler(
       throw new ModelError(`Provider ${provider.id} not supported`)
     }
 
-    return { ...provider, ...zenData.providers[provider.id] }
+    return {
+      ...provider,
+      ...zenData.providers[provider.id],
+      ...(provider.id === "anthropic" ? anthropicHelper : provider.id === "openai" ? openaiHelper : oaCompatHelper),
+    }
   }
 
   async function authenticate(
@@ -356,11 +357,11 @@ export async function handler(
   async function trackUsage(
     authInfo: Awaited<ReturnType<typeof authenticate>>,
     modelInfo: ReturnType<typeof validateModel>,
-    providerId: string,
+    providerInfo: Awaited<ReturnType<typeof selectProvider>>,
     usage: any,
   ) {
     const { inputTokens, outputTokens, reasoningTokens, cacheReadTokens, cacheWrite5mTokens, cacheWrite1hTokens } =
-      opts.normalizeUsage(usage)
+      providerInfo.normalizeUsage(usage)
 
     const modelCost =
       modelInfo.cost200K &&
@@ -421,7 +422,7 @@ export async function handler(
         workspaceID: authInfo.workspaceID,
         id: Identifier.create("usage"),
         model: modelInfo.id,
-        provider: providerId,
+        provider: providerInfo.id,
         inputTokens,
         outputTokens,
         reasoningTokens,

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

@@ -0,0 +1,12 @@
+import { Resource } from "@opencode-ai/console-resource"
+
+export const logger = {
+  metric: (values: Record<string, any>) => {
+    console.log(`_metric:${JSON.stringify(values)}`)
+  },
+  log: console.log,
+  debug: (message: string) => {
+    if (Resource.App.stage === "production") return
+    console.debug(message)
+  },
+}

packages/console/app/src/routes/zen/util/provider/anthropic.ts

@@ -0,0 +1,621 @@
+import { ProviderHelper, CommonRequest, CommonResponse, CommonChunk } from "./provider"
+
+type Usage = {
+  cache_creation?: {
+    ephemeral_5m_input_tokens?: number
+    ephemeral_1h_input_tokens?: number
+  }
+  cache_creation_input_tokens?: number
+  cache_read_input_tokens?: number
+  input_tokens?: number
+  output_tokens?: number
+  server_tool_use?: {
+    web_search_requests?: number
+  }
+}
+
+export const anthropicHelper = {
+  format: "anthropic",
+  modifyUrl: (providerApi: string) => providerApi + "/messages",
+  modifyHeaders: (headers: Headers, body: Record<string, any>, apiKey: string) => {
+    headers.set("x-api-key", apiKey)
+    headers.set("anthropic-version", headers.get("anthropic-version") ?? "2023-06-01")
+    if (body.model.startsWith("claude-sonnet-")) {
+      headers.set("anthropic-beta", "context-1m-2025-08-07")
+    }
+  },
+  modifyBody: (body: Record<string, any>) => {
+    return {
+      ...body,
+      service_tier: "standard_only",
+    }
+  },
+  createUsageParser: () => {
+    let usage: Usage
+
+    return {
+      parse: (chunk: string) => {
+        const data = chunk.split("\n")[1]
+        if (!data.startsWith("data: ")) return
+
+        let json
+        try {
+          json = JSON.parse(data.slice(6))
+        } catch (e) {
+          return
+        }
+
+        const usageUpdate = json.usage ?? json.message?.usage
+        if (!usageUpdate) return
+        usage = {
+          ...usage,
+          ...usageUpdate,
+          cache_creation: {
+            ...usage?.cache_creation,
+            ...usageUpdate.cache_creation,
+          },
+          server_tool_use: {
+            ...usage?.server_tool_use,
+            ...usageUpdate.server_tool_use,
+          },
+        }
+      },
+      retrieve: () => usage,
+    }
+  },
+  normalizeUsage: (usage: Usage) => ({
+    inputTokens: usage.input_tokens ?? 0,
+    outputTokens: usage.output_tokens ?? 0,
+    reasoningTokens: undefined,
+    cacheReadTokens: usage.cache_read_input_tokens ?? undefined,
+    cacheWrite5mTokens: usage.cache_creation?.ephemeral_5m_input_tokens ?? undefined,
+    cacheWrite1hTokens: usage.cache_creation?.ephemeral_1h_input_tokens ?? undefined,
+  }),
+} satisfies ProviderHelper
+
+export function fromAnthropicRequest(body: any): CommonRequest {
+  if (!body || typeof body !== "object") return body
+
+  const msgs: any[] = []
+
+  const sys = Array.isArray(body.system) ? body.system : undefined
+  if (sys && sys.length > 0) {
+    for (const s of sys) {
+      if (!s) continue
+      if ((s as any).type !== "text") continue
+      if (typeof (s as any).text !== "string") continue
+      if ((s as any).text.length === 0) continue
+      msgs.push({ role: "system", content: (s as any).text })
+    }
+  }
+
+  const toImg = (src: any) => {
+    if (!src || typeof src !== "object") return undefined
+    if ((src as any).type === "url" && typeof (src as any).url === "string")
+      return { type: "image_url", image_url: { url: (src as any).url } }
+    if (
+      (src as any).type === "base64" &&
+      typeof (src as any).media_type === "string" &&
+      typeof (src as any).data === "string"
+    )
+      return { type: "image_url", image_url: { url: `data:${(src as any).media_type};base64,${(src as any).data}` } }
+    return undefined
+  }
+
+  const inMsgs = Array.isArray(body.messages) ? body.messages : []
+  for (const m of inMsgs) {
+    if (!m || !(m as any).role) continue
+
+    if ((m as any).role === "user") {
+      const partsIn = Array.isArray((m as any).content) ? (m as any).content : []
+      const partsOut: any[] = []
+      for (const p of partsIn) {
+        if (!p || !(p as any).type) continue
+        if ((p as any).type === "text" && typeof (p as any).text === "string")
+          partsOut.push({ type: "text", text: (p as any).text })
+        if ((p as any).type === "image") {
+          const ip = toImg((p as any).source)
+          if (ip) partsOut.push(ip)
+        }
+        if ((p as any).type === "tool_result") {
+          const id = (p as any).tool_use_id
+          const content =
+            typeof (p as any).content === "string" ? (p as any).content : JSON.stringify((p as any).content)
+          msgs.push({ role: "tool", tool_call_id: id, content })
+        }
+      }
+      if (partsOut.length > 0) {
+        if (partsOut.length === 1 && partsOut[0].type === "text") msgs.push({ role: "user", content: partsOut[0].text })
+        else msgs.push({ role: "user", content: partsOut })
+      }
+      continue
+    }
+
+    if ((m as any).role === "assistant") {
+      const partsIn = Array.isArray((m as any).content) ? (m as any).content : []
+      const texts: string[] = []
+      const tcs: any[] = []
+      for (const p of partsIn) {
+        if (!p || !(p as any).type) continue
+        if ((p as any).type === "text" && typeof (p as any).text === "string") texts.push((p as any).text)
+        if ((p as any).type === "tool_use") {
+          const name = (p as any).name
+          const id = (p as any).id
+          const inp = (p as any).input
+          const input = (() => {
+            if (typeof inp === "string") return inp
+            try {
+              return JSON.stringify(inp ?? {})
+            } catch {
+              return String(inp ?? "")
+            }
+          })()
+          tcs.push({ id, type: "function", function: { name, arguments: input } })
+        }
+      }
+      const out: any = { role: "assistant", content: texts.join("") }
+      if (tcs.length > 0) out.tool_calls = tcs
+      msgs.push(out)
+      continue
+    }
+  }
+
+  const tools = Array.isArray(body.tools)
+    ? body.tools
+        .filter((t: any) => t && typeof t === "object" && "input_schema" in t)
+        .map((t: any) => ({
+          type: "function",
+          function: { name: (t as any).name, description: (t as any).description, parameters: (t as any).input_schema },
+        }))
+    : undefined
+
+  const tcin = body.tool_choice
+  const tc = (() => {
+    if (!tcin) return undefined
+    if ((tcin as any).type === "auto") return "auto"
+    if ((tcin as any).type === "any") return "required"
+    if ((tcin as any).type === "tool" && typeof (tcin as any).name === "string")
+      return { type: "function" as const, function: { name: (tcin as any).name } }
+    return undefined
+  })()
+
+  const stop = (() => {
+    const v = body.stop_sequences
+    if (!v) return undefined
+    if (Array.isArray(v)) return v.length === 1 ? v[0] : v
+    if (typeof v === "string") return v
+    return undefined
+  })()
+
+  return {
+    max_tokens: body.max_tokens,
+    temperature: body.temperature,
+    top_p: body.top_p,
+    stop,
+    messages: msgs,
+    stream: !!body.stream,
+    tools,
+    tool_choice: tc,
+  }
+}
+
+export function toAnthropicRequest(body: CommonRequest) {
+  if (!body || typeof body !== "object") return body
+
+  const sysIn = Array.isArray(body.messages) ? body.messages.filter((m: any) => m && m.role === "system") : []
+  let ccCount = 0
+  const cc = () => {
+    ccCount++
+    return ccCount <= 4 ? { cache_control: { type: "ephemeral" } } : {}
+  }
+  const system = sysIn
+    .filter((m: any) => typeof m.content === "string" && m.content.length > 0)
+    .map((m: any) => ({ type: "text", text: m.content, ...cc() }))
+
+  const msgsIn = Array.isArray(body.messages) ? body.messages : []
+  const msgsOut: any[] = []
+
+  const toSrc = (p: any) => {
+    if (!p || typeof p !== "object") return undefined
+    if ((p as any).type === "image_url" && (p as any).image_url) {
+      const u = (p as any).image_url.url ?? (p as any).image_url
+      if (typeof u === "string" && u.startsWith("data:")) {
+        const m = u.match(/^data:([^;]+);base64,(.*)$/)
+        if (m) return { type: "base64", media_type: m[1], data: m[2] }
+      }
+      if (typeof u === "string") return { type: "url", url: u }
+    }
+    return undefined
+  }
+
+  for (const m of msgsIn) {
+    if (!m || !(m as any).role) continue
+
+    if ((m as any).role === "user") {
+      if (typeof (m as any).content === "string") {
+        msgsOut.push({
+          role: "user",
+          content: [{ type: "text", text: (m as any).content, ...cc() }],
+        })
+      } else if (Array.isArray((m as any).content)) {
+        const parts: any[] = []
+        for (const p of (m as any).content) {
+          if (!p || !(p as any).type) continue
+          if ((p as any).type === "text" && typeof (p as any).text === "string")
+            parts.push({ type: "text", text: (p as any).text, ...cc() })
+          if ((p as any).type === "image_url") {
+            const s = toSrc(p)
+            if (s) parts.push({ type: "image", source: s, ...cc() })
+          }
+        }
+        if (parts.length > 0) msgsOut.push({ role: "user", content: parts })
+      }
+      continue
+    }
+
+    if ((m as any).role === "assistant") {
+      const out: any = { role: "assistant", content: [] as any[] }
+      if (typeof (m as any).content === "string" && (m as any).content.length > 0) {
+        ;(out.content as any[]).push({ type: "text", text: (m as any).content, ...cc() })
+      }
+      if (Array.isArray((m as any).tool_calls)) {
+        for (const tc of (m as any).tool_calls) {
+          if ((tc as any).type === "function" && (tc as any).function) {
+            let input: any
+            const a = (tc as any).function.arguments
+            if (typeof a === "string") {
+              try {
+                input = JSON.parse(a)
+              } catch {
+                input = a
+              }
+            } else input = a
+            const id = (tc as any).id || `toolu_${Math.random().toString(36).slice(2)}`
+            ;(out.content as any[]).push({
+              type: "tool_use",
+              id,
+              name: (tc as any).function.name,
+              input,
+              ...cc(),
+            })
+          }
+        }
+      }
+      if ((out.content as any[]).length > 0) msgsOut.push(out)
+      continue
+    }
+
+    if ((m as any).role === "tool") {
+      msgsOut.push({
+        role: "user",
+        content: [
+          {
+            type: "tool_result",
+            tool_use_id: (m as any).tool_call_id,
+            content: (m as any).content,
+            ...cc(),
+          },
+        ],
+      })
+      continue
+    }
+  }
+
+  const tools = Array.isArray(body.tools)
+    ? body.tools
+        .filter((t: any) => t && typeof t === "object" && (t as any).type === "function")
+        .map((t: any) => ({
+          name: (t as any).function.name,
+          description: (t as any).function.description,
+          input_schema: (t as any).function.parameters,
+          ...cc(),
+        }))
+    : undefined
+
+  const tcIn = body.tool_choice
+  const tool_choice = (() => {
+    if (!tcIn) return undefined
+    if (tcIn === "auto") return { type: "auto" }
+    if (tcIn === "required") return { type: "any" }
+    if ((tcIn as any).type === "function" && (tcIn as any).function?.name)
+      return { type: "tool", name: (tcIn as any).function.name }
+    return undefined
+  })()
+
+  const stop_sequences = (() => {
+    const v = body.stop
+    if (!v) return undefined
+    if (Array.isArray(v)) return v
+    if (typeof v === "string") return [v]
+    return undefined
+  })()
+
+  return {
+    max_tokens: body.max_tokens ?? 32_000,
+    temperature: body.temperature,
+    top_p: body.top_p,
+    system: system.length > 0 ? system : undefined,
+    messages: msgsOut,
+    stream: !!body.stream,
+    tools,
+    tool_choice,
+    stop_sequences,
+  }
+}
+
+export function fromAnthropicResponse(resp: any): CommonResponse {
+  if (!resp || typeof resp !== "object") return resp
+
+  if (Array.isArray((resp as any).choices)) return resp
+
+  const isAnthropic = typeof (resp as any).type === "string" && (resp as any).type === "message"
+  if (!isAnthropic) return resp
+
+  const idIn = (resp as any).id
+  const id =
+    typeof idIn === "string" ? idIn.replace(/^msg_/, "chatcmpl_") : `chatcmpl_${Math.random().toString(36).slice(2)}`
+  const model = (resp as any).model
+
+  const blocks: any[] = Array.isArray((resp as any).content) ? (resp as any).content : []
+  const text = blocks
+    .filter((b) => b && b.type === "text" && typeof (b as any).text === "string")
+    .map((b: any) => b.text)
+    .join("")
+  const tcs = blocks
+    .filter((b) => b && b.type === "tool_use")
+    .map((b: any) => {
+      const name = (b as any).name
+      const args = (() => {
+        const inp = (b as any).input
+        if (typeof inp === "string") return inp
+        try {
+          return JSON.stringify(inp ?? {})
+        } catch {
+          return String(inp ?? "")
+        }
+      })()
+      const tid =
+        typeof (b as any).id === "string" && (b as any).id.length > 0
+          ? (b as any).id
+          : `toolu_${Math.random().toString(36).slice(2)}`
+      return { id: tid, type: "function" as const, function: { name, arguments: args } }
+    })
+
+  const finish = (r: string | null) => {
+    if (r === "end_turn") return "stop"
+    if (r === "tool_use") return "tool_calls"
+    if (r === "max_tokens") return "length"
+    if (r === "content_filter") return "content_filter"
+    return null
+  }
+
+  const u = (resp as any).usage
+  const usage = (() => {
+    if (!u) return undefined as any
+    const pt = typeof (u as any).input_tokens === "number" ? (u as any).input_tokens : undefined
+    const ct = typeof (u as any).output_tokens === "number" ? (u as any).output_tokens : undefined
+    const total = pt != null && ct != null ? pt + ct : undefined
+    const cached =
+      typeof (u as any).cache_read_input_tokens === "number" ? (u as any).cache_read_input_tokens : undefined
+    const details = cached != null ? { cached_tokens: cached } : undefined
+    return {
+      prompt_tokens: pt,
+      completion_tokens: ct,
+      total_tokens: total,
+      ...(details ? { prompt_tokens_details: details } : {}),
+    }
+  })()
+
+  return {
+    id,
+    object: "chat.completion",
+    created: Math.floor(Date.now() / 1000),
+    model,
+    choices: [
+      {
+        index: 0,
+        message: {
+          role: "assistant",
+          ...(text && text.length > 0 ? { content: text } : {}),
+          ...(tcs.length > 0 ? { tool_calls: tcs } : {}),
+        },
+        finish_reason: finish((resp as any).stop_reason ?? null),
+      },
+    ],
+    ...(usage ? { usage } : {}),
+  }
+}
+
+export function toAnthropicResponse(resp: CommonResponse) {
+  if (!resp || typeof resp !== "object") return resp
+
+  if (!Array.isArray((resp as any).choices)) return resp
+
+  const choice = (resp as any).choices[0]
+  if (!choice) return resp
+
+  const message = choice.message
+  if (!message) return resp
+
+  const content: any[] = []
+
+  if (typeof message.content === "string" && message.content.length > 0)
+    content.push({ type: "text", text: message.content })
+
+  if (Array.isArray(message.tool_calls)) {
+    for (const tc of message.tool_calls) {
+      if ((tc as any).type === "function" && (tc as any).function) {
+        let input: any
+        try {
+          input = JSON.parse((tc as any).function.arguments)
+        } catch {
+          input = (tc as any).function.arguments
+        }
+        content.push({ type: "tool_use", id: (tc as any).id, name: (tc as any).function.name, input })
+      }
+    }
+  }
+
+  const stop_reason = (() => {
+    const r = choice.finish_reason
+    if (r === "stop") return "end_turn"
+    if (r === "tool_calls") return "tool_use"
+    if (r === "length") return "max_tokens"
+    if (r === "content_filter") return "content_filter"
+    return null
+  })()
+
+  const usage = (() => {
+    const u = (resp as any).usage
+    if (!u) return undefined
+    return {
+      input_tokens: u.prompt_tokens,
+      output_tokens: u.completion_tokens,
+      cache_read_input_tokens: u.prompt_tokens_details?.cached_tokens,
+    }
+  })()
+
+  return {
+    id: (resp as any).id,
+    type: "message",
+    role: "assistant",
+    content: content.length > 0 ? content : [{ type: "text", text: "" }],
+    model: (resp as any).model,
+    stop_reason,
+    usage,
+  }
+}
+
+export function fromAnthropicChunk(chunk: string): CommonChunk | string {
+  // Anthropic sends two lines per part: "event: <type>\n" + "data: <json>"
+  const lines = chunk.split("\n")
+  const dataLine = lines.find((l) => l.startsWith("data: "))
+  if (!dataLine) return chunk
+
+  let json
+  try {
+    json = JSON.parse(dataLine.slice(6))
+  } catch {
+    return chunk
+  }
+
+  const out: CommonChunk = {
+    id: json.id ?? json.message?.id ?? "",
+    object: "chat.completion.chunk",
+    created: Math.floor(Date.now() / 1000),
+    model: json.model ?? json.message?.model ?? "",
+    choices: [],
+  }
+
+  if (json.type === "content_block_start") {
+    const cb = json.content_block
+    if (cb?.type === "text") {
+      out.choices.push({ index: json.index ?? 0, delta: { role: "assistant", content: "" }, finish_reason: null })
+    } else if (cb?.type === "tool_use") {
+      out.choices.push({
+        index: json.index ?? 0,
+        delta: {
+          tool_calls: [
+            { index: json.index ?? 0, id: cb.id, type: "function", function: { name: cb.name, arguments: "" } },
+          ],
+        },
+        finish_reason: null,
+      })
+    }
+  }
+
+  if (json.type === "content_block_delta") {
+    const d = json.delta
+    if (d?.type === "text_delta") {
+      out.choices.push({ index: json.index ?? 0, delta: { content: d.text }, finish_reason: null })
+    } else if (d?.type === "input_json_delta") {
+      out.choices.push({
+        index: json.index ?? 0,
+        delta: { tool_calls: [{ index: json.index ?? 0, function: { arguments: d.partial_json } }] },
+        finish_reason: null,
+      })
+    }
+  }
+
+  if (json.type === "message_delta") {
+    const d = json.delta
+    const finish_reason = (() => {
+      const r = d?.stop_reason
+      if (r === "end_turn") return "stop"
+      if (r === "tool_use") return "tool_calls"
+      if (r === "max_tokens") return "length"
+      if (r === "content_filter") return "content_filter"
+      return null
+    })()
+
+    out.choices.push({ index: 0, delta: {}, finish_reason })
+  }
+
+  if (json.usage) {
+    const u = json.usage
+    out.usage = {
+      prompt_tokens: u.input_tokens,
+      completion_tokens: u.output_tokens,
+      total_tokens: (u.input_tokens || 0) + (u.output_tokens || 0),
+      ...(u.cache_read_input_tokens ? { prompt_tokens_details: { cached_tokens: u.cache_read_input_tokens } } : {}),
+    }
+  }
+
+  return out
+}
+
+export function toAnthropicChunk(chunk: CommonChunk): string {
+  if (!chunk.choices || !Array.isArray(chunk.choices) || chunk.choices.length === 0) {
+    return JSON.stringify({})
+  }
+
+  const choice = chunk.choices[0]
+  const delta = choice.delta
+  if (!delta) return JSON.stringify({})
+
+  const result: any = {}
+
+  if (delta.content) {
+    result.type = "content_block_delta"
+    result.index = 0
+    result.delta = { type: "text_delta", text: delta.content }
+  }
+
+  if (delta.tool_calls) {
+    for (const tc of delta.tool_calls) {
+      if (tc.function?.name) {
+        result.type = "content_block_start"
+        result.index = tc.index ?? 0
+        result.content_block = { type: "tool_use", id: tc.id, name: tc.function.name, input: {} }
+      } else if (tc.function?.arguments) {
+        result.type = "content_block_delta"
+        result.index = tc.index ?? 0
+        result.delta = { type: "input_json_delta", partial_json: tc.function.arguments }
+      }
+    }
+  }
+
+  if (choice.finish_reason) {
+    const stop_reason = (() => {
+      const r = choice.finish_reason
+      if (r === "stop") return "end_turn"
+      if (r === "tool_calls") return "tool_use"
+      if (r === "length") return "max_tokens"
+      if (r === "content_filter") return "content_filter"
+      return null
+    })()
+    result.type = "message_delta"
+    result.delta = { stop_reason, stop_sequence: null }
+  }
+
+  if (chunk.usage) {
+    const u = chunk.usage
+    result.usage = {
+      input_tokens: u.prompt_tokens,
+      output_tokens: u.completion_tokens,
+      cache_read_input_tokens: u.prompt_tokens_details?.cached_tokens,
+    }
+  }
+
+  return JSON.stringify(result)
+}

packages/console/app/src/routes/zen/util/provider/openai-compatible.ts

@@ -0,0 +1,541 @@
+import { ProviderHelper, CommonRequest, CommonResponse, CommonChunk } from "./provider"
+
+type Usage = {
+  prompt_tokens?: number
+  completion_tokens?: number
+  total_tokens?: number
+  // used by moonshot
+  cached_tokens?: number
+  // used by xai
+  prompt_tokens_details?: {
+    text_tokens?: number
+    audio_tokens?: number
+    image_tokens?: number
+    cached_tokens?: number
+  }
+  completion_tokens_details?: {
+    reasoning_tokens?: number
+    audio_tokens?: number
+    accepted_prediction_tokens?: number
+    rejected_prediction_tokens?: number
+  }
+}
+
+export const oaCompatHelper = {
+  format: "oa-compat",
+  modifyUrl: (providerApi: string) => providerApi + "/chat/completions",
+  modifyHeaders: (headers: Headers, body: Record<string, any>, apiKey: string) => {
+    headers.set("authorization", `Bearer ${apiKey}`)
+  },
+  modifyBody: (body: Record<string, any>) => {
+    return {
+      ...body,
+      ...(body.stream ? { stream_options: { include_usage: true } } : {}),
+    }
+  },
+  createUsageParser: () => {
+    let usage: Usage
+
+    return {
+      parse: (chunk: string) => {
+        if (!chunk.startsWith("data: ")) return
+
+        let json
+        try {
+          json = JSON.parse(chunk.slice(6)) as { usage?: Usage }
+        } catch (e) {
+          return
+        }
+
+        if (!json.usage) return
+        usage = json.usage
+      },
+      retrieve: () => usage,
+    }
+  },
+  normalizeUsage: (usage: Usage) => {
+    const inputTokens = usage.prompt_tokens ?? 0
+    const outputTokens = usage.completion_tokens ?? 0
+    const reasoningTokens = usage.completion_tokens_details?.reasoning_tokens ?? undefined
+    const cacheReadTokens = usage.cached_tokens ?? usage.prompt_tokens_details?.cached_tokens ?? undefined
+    return {
+      inputTokens: inputTokens - (cacheReadTokens ?? 0),
+      outputTokens,
+      reasoningTokens,
+      cacheReadTokens,
+      cacheWrite5mTokens: undefined,
+      cacheWrite1hTokens: undefined,
+    }
+  },
+} satisfies ProviderHelper
+
+export function fromOaCompatibleRequest(body: any): CommonRequest {
+  if (!body || typeof body !== "object") return body
+
+  const msgsIn = Array.isArray(body.messages) ? body.messages : []
+  const msgsOut: any[] = []
+
+  for (const m of msgsIn) {
+    if (!m || !m.role) continue
+
+    if (m.role === "system") {
+      if (typeof m.content === "string" && m.content.length > 0) msgsOut.push({ role: "system", content: m.content })
+      continue
+    }
+
+    if (m.role === "user") {
+      if (typeof m.content === "string") {
+        msgsOut.push({ role: "user", content: m.content })
+      } else if (Array.isArray(m.content)) {
+        const parts: any[] = []
+        for (const p of m.content) {
+          if (!p || !p.type) continue
+          if (p.type === "text" && typeof p.text === "string") parts.push({ type: "text", text: p.text })
+          if (p.type === "image_url") parts.push({ type: "image_url", image_url: p.image_url })
+        }
+        if (parts.length === 1 && parts[0].type === "text") msgsOut.push({ role: "user", content: parts[0].text })
+        else if (parts.length > 0) msgsOut.push({ role: "user", content: parts })
+      }
+      continue
+    }
+
+    if (m.role === "assistant") {
+      const out: any = { role: "assistant" }
+      if (typeof m.content === "string") out.content = m.content
+      if (Array.isArray(m.tool_calls)) out.tool_calls = m.tool_calls
+      msgsOut.push(out)
+      continue
+    }
+
+    if (m.role === "tool") {
+      msgsOut.push({ role: "tool", tool_call_id: m.tool_call_id, content: m.content })
+      continue
+    }
+  }
+
+  return {
+    max_tokens: body.max_tokens,
+    temperature: body.temperature,
+    top_p: body.top_p,
+    stop: body.stop,
+    messages: msgsOut,
+    stream: !!body.stream,
+    tools: Array.isArray(body.tools) ? body.tools : undefined,
+    tool_choice: body.tool_choice,
+  }
+}
+
+export function toOaCompatibleRequest(body: CommonRequest) {
+  if (!body || typeof body !== "object") return body
+
+  const msgsIn = Array.isArray(body.messages) ? body.messages : []
+  const msgsOut: any[] = []
+
+  const toImg = (p: any) => {
+    if (!p || typeof p !== "object") return undefined
+    if (p.type === "image_url" && p.image_url) return { type: "image_url", image_url: p.image_url }
+    const s = (p as any).source
+    if (!s || typeof s !== "object") return undefined
+    if (s.type === "url" && typeof s.url === "string") return { type: "image_url", image_url: { url: s.url } }
+    if (s.type === "base64" && typeof s.media_type === "string" && typeof s.data === "string")
+      return { type: "image_url", image_url: { url: `data:${s.media_type};base64,${s.data}` } }
+    return undefined
+  }
+
+  for (const m of msgsIn) {
+    if (!m || !m.role) continue
+
+    if (m.role === "system") {
+      if (typeof m.content === "string" && m.content.length > 0) msgsOut.push({ role: "system", content: m.content })
+      continue
+    }
+
+    if (m.role === "user") {
+      if (typeof m.content === "string") {
+        msgsOut.push({ role: "user", content: m.content })
+        continue
+      }
+      if (Array.isArray(m.content)) {
+        const parts: any[] = []
+        for (const p of m.content) {
+          if (!p || !p.type) continue
+          if (p.type === "text" && typeof p.text === "string") parts.push({ type: "text", text: p.text })
+          const ip = toImg(p)
+          if (ip) parts.push(ip)
+        }
+        if (parts.length === 1 && parts[0].type === "text") msgsOut.push({ role: "user", content: parts[0].text })
+        else if (parts.length > 0) msgsOut.push({ role: "user", content: parts })
+      }
+      continue
+    }
+
+    if (m.role === "assistant") {
+      const out: any = { role: "assistant" }
+      if (typeof m.content === "string") out.content = m.content
+      if (Array.isArray(m.tool_calls)) out.tool_calls = m.tool_calls
+      msgsOut.push(out)
+      continue
+    }
+
+    if (m.role === "tool") {
+      msgsOut.push({ role: "tool", tool_call_id: m.tool_call_id, content: m.content })
+      continue
+    }
+  }
+
+  const tools = Array.isArray(body.tools)
+    ? body.tools.map((tool: any) => ({
+        type: "function",
+        function: {
+          name: tool.name,
+          description: tool.description,
+          parameters: tool.parameters,
+        },
+      }))
+    : undefined
+
+  return {
+    model: body.model,
+    max_tokens: body.max_tokens,
+    temperature: body.temperature,
+    top_p: body.top_p,
+    stop: body.stop,
+    messages: msgsOut,
+    stream: !!body.stream,
+    tools,
+    tool_choice: body.tool_choice,
+    response_format: (body as any).response_format,
+  }
+}
+
+export function fromOaCompatibleResponse(resp: any): CommonResponse {
+  if (!resp || typeof resp !== "object") return resp
+
+  if (!Array.isArray((resp as any).choices)) return resp
+
+  const choice = (resp as any).choices[0]
+  if (!choice) return resp
+
+  const message = choice.message
+  if (!message) return resp
+
+  const content: any[] = []
+
+  if (typeof message.content === "string" && message.content.length > 0) {
+    content.push({ type: "text", text: message.content })
+  }
+
+  if (Array.isArray(message.tool_calls)) {
+    for (const toolCall of message.tool_calls) {
+      if (toolCall.type === "function" && toolCall.function) {
+        let input
+        try {
+          input = JSON.parse(toolCall.function.arguments)
+        } catch {
+          input = toolCall.function.arguments
+        }
+        content.push({
+          type: "tool_use",
+          id: toolCall.id,
+          name: toolCall.function.name,
+          input,
+        })
+      }
+    }
+  }
+
+  const stopReason = (() => {
+    const reason = choice.finish_reason
+    if (reason === "stop") return "stop"
+    if (reason === "tool_calls") return "tool_calls"
+    if (reason === "length") return "length"
+    if (reason === "content_filter") return "content_filter"
+    return null
+  })()
+
+  const usage = (() => {
+    const u = (resp as any).usage
+    if (!u) return undefined
+    return {
+      prompt_tokens: u.prompt_tokens,
+      completion_tokens: u.completion_tokens,
+      total_tokens: u.total_tokens,
+      ...(u.prompt_tokens_details?.cached_tokens
+        ? { prompt_tokens_details: { cached_tokens: u.prompt_tokens_details.cached_tokens } }
+        : {}),
+    }
+  })()
+
+  return {
+    id: (resp as any).id,
+    object: "chat.completion" as const,
+    created: Math.floor(Date.now() / 1000),
+    model: (resp as any).model,
+    choices: [
+      {
+        index: 0,
+        message: {
+          role: "assistant" as const,
+          ...(content.length > 0 && content.some((c) => c.type === "text")
+            ? {
+                content: content
+                  .filter((c) => c.type === "text")
+                  .map((c: any) => c.text)
+                  .join(""),
+              }
+            : {}),
+          ...(content.length > 0 && content.some((c) => c.type === "tool_use")
+            ? {
+                tool_calls: content
+                  .filter((c) => c.type === "tool_use")
+                  .map((c: any) => ({
+                    id: c.id,
+                    type: "function" as const,
+                    function: {
+                      name: c.name,
+                      arguments: typeof c.input === "string" ? c.input : JSON.stringify(c.input),
+                    },
+                  })),
+              }
+            : {}),
+        },
+        finish_reason: stopReason,
+      },
+    ],
+    ...(usage ? { usage } : {}),
+  }
+}
+
+export function toOaCompatibleResponse(resp: CommonResponse) {
+  if (!resp || typeof resp !== "object") return resp
+
+  if (Array.isArray((resp as any).choices)) return resp
+
+  const isAnthropic = typeof (resp as any).type === "string" && (resp as any).type === "message"
+  if (!isAnthropic) return resp
+
+  const idIn = (resp as any).id
+  const id =
+    typeof idIn === "string" ? idIn.replace(/^msg_/, "chatcmpl_") : `chatcmpl_${Math.random().toString(36).slice(2)}`
+  const model = (resp as any).model
+
+  const blocks: any[] = Array.isArray((resp as any).content) ? (resp as any).content : []
+  const text = blocks
+    .filter((b) => b && b.type === "text" && typeof b.text === "string")
+    .map((b) => b.text)
+    .join("")
+  const tcs = blocks
+    .filter((b) => b && b.type === "tool_use")
+    .map((b) => {
+      const name = (b as any).name
+      const args = (() => {
+        const inp = (b as any).input
+        if (typeof inp === "string") return inp
+        try {
+          return JSON.stringify(inp ?? {})
+        } catch {
+          return String(inp ?? "")
+        }
+      })()
+      const tid =
+        typeof (b as any).id === "string" && (b as any).id.length > 0
+          ? (b as any).id
+          : `toolu_${Math.random().toString(36).slice(2)}`
+      return { id: tid, type: "function" as const, function: { name, arguments: args } }
+    })
+
+  const finish = (r: string | null) => {
+    if (r === "end_turn") return "stop"
+    if (r === "tool_use") return "tool_calls"
+    if (r === "max_tokens") return "length"
+    if (r === "content_filter") return "content_filter"
+    return null
+  }
+
+  const u = (resp as any).usage
+  const usage = (() => {
+    if (!u) return undefined as any
+    const pt = typeof u.input_tokens === "number" ? u.input_tokens : undefined
+    const ct = typeof u.output_tokens === "number" ? u.output_tokens : undefined
+    const total = pt != null && ct != null ? pt + ct : undefined
+    const cached = typeof u.cache_read_input_tokens === "number" ? u.cache_read_input_tokens : undefined
+    const details = cached != null ? { cached_tokens: cached } : undefined
+    return {
+      prompt_tokens: pt,
+      completion_tokens: ct,
+      total_tokens: total,
+      ...(details ? { prompt_tokens_details: details } : {}),
+    }
+  })()
+
+  return {
+    id,
+    object: "chat.completion",
+    created: Math.floor(Date.now() / 1000),
+    model,
+    choices: [
+      {
+        index: 0,
+        message: {
+          role: "assistant",
+          ...(text && text.length > 0 ? { content: text } : {}),
+          ...(tcs.length > 0 ? { tool_calls: tcs } : {}),
+        },
+        finish_reason: finish((resp as any).stop_reason ?? null),
+      },
+    ],
+    ...(usage ? { usage } : {}),
+  }
+}
+
+export function fromOaCompatibleChunk(chunk: string): CommonChunk | string {
+  if (!chunk.startsWith("data: ")) return chunk
+
+  let json
+  try {
+    json = JSON.parse(chunk.slice(6))
+  } catch {
+    return chunk
+  }
+
+  if (!json.choices || !Array.isArray(json.choices) || json.choices.length === 0) {
+    return chunk
+  }
+
+  const choice = json.choices[0]
+  const delta = choice.delta
+
+  if (!delta) return chunk
+
+  const result: CommonChunk = {
+    id: json.id ?? "",
+    object: "chat.completion.chunk",
+    created: json.created ?? Math.floor(Date.now() / 1000),
+    model: json.model ?? "",
+    choices: [],
+  }
+
+  if (delta.content) {
+    result.choices.push({
+      index: choice.index ?? 0,
+      delta: { content: delta.content },
+      finish_reason: null,
+    })
+  }
+
+  if (delta.tool_calls) {
+    for (const toolCall of delta.tool_calls) {
+      result.choices.push({
+        index: choice.index ?? 0,
+        delta: {
+          tool_calls: [
+            {
+              index: toolCall.index ?? 0,
+              id: toolCall.id,
+              type: toolCall.type ?? "function",
+              function: toolCall.function,
+            },
+          ],
+        },
+        finish_reason: null,
+      })
+    }
+  }
+
+  if (choice.finish_reason) {
+    result.choices.push({
+      index: choice.index ?? 0,
+      delta: {},
+      finish_reason: choice.finish_reason,
+    })
+  }
+
+  if (json.usage) {
+    const usage = json.usage
+    result.usage = {
+      prompt_tokens: usage.prompt_tokens,
+      completion_tokens: usage.completion_tokens,
+      total_tokens: usage.total_tokens,
+      ...(usage.prompt_tokens_details?.cached_tokens
+        ? { prompt_tokens_details: { cached_tokens: usage.prompt_tokens_details.cached_tokens } }
+        : {}),
+    }
+  }
+
+  return result
+}
+
+export function toOaCompatibleChunk(chunk: CommonChunk): string {
+  const result: any = {
+    id: chunk.id,
+    object: "chat.completion.chunk",
+    created: chunk.created,
+    model: chunk.model,
+    choices: [],
+  }
+
+  if (!chunk.choices || chunk.choices.length === 0) {
+    return `data: ${JSON.stringify(result)}`
+  }
+
+  const choice = chunk.choices[0]
+  const delta = choice.delta
+
+  if (delta?.role) {
+    result.choices.push({
+      index: choice.index,
+      delta: { role: delta.role },
+      finish_reason: null,
+    })
+  }
+
+  if (delta?.content) {
+    result.choices.push({
+      index: choice.index,
+      delta: { content: delta.content },
+      finish_reason: null,
+    })
+  }
+
+  if (delta?.tool_calls) {
+    for (const tc of delta.tool_calls) {
+      result.choices.push({
+        index: choice.index,
+        delta: {
+          tool_calls: [
+            {
+              index: tc.index,
+              id: tc.id,
+              type: tc.type,
+              function: tc.function,
+            },
+          ],
+        },
+        finish_reason: null,
+      })
+    }
+  }
+
+  if (choice.finish_reason) {
+    result.choices.push({
+      index: choice.index,
+      delta: {},
+      finish_reason: choice.finish_reason,
+    })
+  }
+
+  if (chunk.usage) {
+    result.usage = {
+      prompt_tokens: chunk.usage.prompt_tokens,
+      completion_tokens: chunk.usage.completion_tokens,
+      total_tokens: chunk.usage.total_tokens,
+      ...(chunk.usage.prompt_tokens_details?.cached_tokens
+        ? {
+            prompt_tokens_details: { cached_tokens: chunk.usage.prompt_tokens_details.cached_tokens },
+          }
+        : {}),
+    }
+  }
+
+  return `data: ${JSON.stringify(result)}`
+}

packages/console/app/src/routes/zen/util/provider/openai.ts

@@ -0,0 +1,600 @@
+import { ProviderHelper, CommonRequest, CommonResponse, CommonChunk } from "./provider"
+
+type Usage = {
+  input_tokens?: number
+  input_tokens_details?: {
+    cached_tokens?: number
+  }
+  output_tokens?: number
+  output_tokens_details?: {
+    reasoning_tokens?: number
+  }
+  total_tokens?: number
+}
+
+export const openaiHelper = {
+  format: "openai",
+  modifyUrl: (providerApi: string) => providerApi + "/responses",
+  modifyHeaders: (headers: Headers, body: Record<string, any>, apiKey: string) => {
+    headers.set("authorization", `Bearer ${apiKey}`)
+  },
+  modifyBody: (body: Record<string, any>) => {
+    return body
+  },
+  createUsageParser: () => {
+    let usage: Usage
+
+    return {
+      parse: (chunk: string) => {
+        const [event, data] = chunk.split("\n")
+        if (event !== "event: response.completed") return
+        if (!data.startsWith("data: ")) return
+
+        let json
+        try {
+          json = JSON.parse(data.slice(6)) as { response?: { usage?: Usage } }
+        } catch (e) {
+          return
+        }
+
+        if (!json.response?.usage) return
+        usage = json.response.usage
+      },
+      retrieve: () => usage,
+    }
+  },
+  normalizeUsage: (usage: Usage) => {
+    const inputTokens = usage.input_tokens ?? 0
+    const outputTokens = usage.output_tokens ?? 0
+    const reasoningTokens = usage.output_tokens_details?.reasoning_tokens ?? undefined
+    const cacheReadTokens = usage.input_tokens_details?.cached_tokens ?? undefined
+    return {
+      inputTokens: inputTokens - (cacheReadTokens ?? 0),
+      outputTokens: outputTokens - (reasoningTokens ?? 0),
+      reasoningTokens,
+      cacheReadTokens,
+      cacheWrite5mTokens: undefined,
+      cacheWrite1hTokens: undefined,
+    }
+  },
+} satisfies ProviderHelper
+
+export function fromOpenaiRequest(body: any): CommonRequest {
+  if (!body || typeof body !== "object") return body
+
+  const toImg = (p: any) => {
+    if (!p || typeof p !== "object") return undefined
+    if ((p as any).type === "image_url" && (p as any).image_url)
+      return { type: "image_url", image_url: (p as any).image_url }
+    if ((p as any).type === "input_image" && (p as any).image_url)
+      return { type: "image_url", image_url: (p as any).image_url }
+    const s = (p as any).source
+    if (!s || typeof s !== "object") return undefined
+    if ((s as any).type === "url" && typeof (s as any).url === "string")
+      return { type: "image_url", image_url: { url: (s as any).url } }
+    if (
+      (s as any).type === "base64" &&
+      typeof (s as any).media_type === "string" &&
+      typeof (s as any).data === "string"
+    )
+      return { type: "image_url", image_url: { url: `data:${(s as any).media_type};base64,${(s as any).data}` } }
+    return undefined
+  }
+
+  const msgs: any[] = []
+
+  const inMsgs = Array.isArray(body.input) ? body.input : Array.isArray(body.messages) ? body.messages : []
+
+  for (const m of inMsgs) {
+    if (!m) continue
+
+    // Responses API items without role:
+    if (!(m as any).role && (m as any).type) {
+      if ((m as any).type === "function_call") {
+        const name = (m as any).name
+        const a = (m as any).arguments
+        const args = typeof a === "string" ? a : JSON.stringify(a ?? {})
+        msgs.push({
+          role: "assistant",
+          tool_calls: [{ id: (m as any).id, type: "function", function: { name, arguments: args } }],
+        })
+      }
+      if ((m as any).type === "function_call_output") {
+        const id = (m as any).call_id
+        const out = (m as any).output
+        const content = typeof out === "string" ? out : JSON.stringify(out)
+        msgs.push({ role: "tool", tool_call_id: id, content })
+      }
+      continue
+    }
+
+    if ((m as any).role === "system" || (m as any).role === "developer") {
+      const c = (m as any).content
+      if (typeof c === "string" && c.length > 0) msgs.push({ role: "system", content: c })
+      if (Array.isArray(c)) {
+        const t = c.find((p: any) => p && typeof p.text === "string")
+        if (t && typeof t.text === "string" && t.text.length > 0) msgs.push({ role: "system", content: t.text })
+      }
+      continue
+    }
+
+    if ((m as any).role === "user") {
+      const c = (m as any).content
+      if (typeof c === "string") {
+        msgs.push({ role: "user", content: c })
+      } else if (Array.isArray(c)) {
+        const parts: any[] = []
+        for (const p of c) {
+          if (!p || !(p as any).type) continue
+          if (((p as any).type === "text" || (p as any).type === "input_text") && typeof (p as any).text === "string")
+            parts.push({ type: "text", text: (p as any).text })
+          const ip = toImg(p)
+          if (ip) parts.push(ip)
+          if ((p as any).type === "tool_result") {
+            const id = (p as any).tool_call_id
+            const content =
+              typeof (p as any).content === "string" ? (p as any).content : JSON.stringify((p as any).content)
+            msgs.push({ role: "tool", tool_call_id: id, content })
+          }
+        }
+        if (parts.length === 1 && parts[0].type === "text") msgs.push({ role: "user", content: parts[0].text })
+        else if (parts.length > 0) msgs.push({ role: "user", content: parts })
+      }
+      continue
+    }
+
+    if ((m as any).role === "assistant") {
+      const c = (m as any).content
+      const out: any = { role: "assistant" }
+      if (typeof c === "string" && c.length > 0) out.content = c
+      if (Array.isArray((m as any).tool_calls)) out.tool_calls = (m as any).tool_calls
+      msgs.push(out)
+      continue
+    }
+
+    if ((m as any).role === "tool") {
+      msgs.push({ role: "tool", tool_call_id: (m as any).tool_call_id, content: (m as any).content })
+      continue
+    }
+  }
+
+  const tcIn = body.tool_choice
+  const tc = (() => {
+    if (!tcIn) return undefined
+    if (tcIn === "auto") return "auto"
+    if (tcIn === "required") return "required"
+    if ((tcIn as any).type === "function" && (tcIn as any).function?.name)
+      return { type: "function" as const, function: { name: (tcIn as any).function.name } }
+    return undefined
+  })()
+
+  const stop = (() => {
+    const v = body.stop_sequences ?? body.stop
+    if (!v) return undefined
+    if (Array.isArray(v)) return v.length === 1 ? v[0] : v
+    if (typeof v === "string") return v
+    return undefined
+  })()
+
+  return {
+    max_tokens: body.max_output_tokens ?? body.max_tokens,
+    temperature: body.temperature,
+    top_p: body.top_p,
+    stop,
+    messages: msgs,
+    stream: !!body.stream,
+    tools: Array.isArray(body.tools) ? body.tools : undefined,
+    tool_choice: tc,
+  }
+}
+
+export function toOpenaiRequest(body: CommonRequest) {
+  if (!body || typeof body !== "object") return body
+
+  const msgsIn = Array.isArray(body.messages) ? body.messages : []
+  const input: any[] = []
+
+  const toPart = (p: any) => {
+    if (!p || typeof p !== "object") return undefined
+    if ((p as any).type === "text" && typeof (p as any).text === "string")
+      return { type: "input_text", text: (p as any).text }
+    if ((p as any).type === "image_url" && (p as any).image_url)
+      return { type: "input_image", image_url: (p as any).image_url }
+    const s = (p as any).source
+    if (!s || typeof s !== "object") return undefined
+    if ((s as any).type === "url" && typeof (s as any).url === "string")
+      return { type: "input_image", image_url: { url: (s as any).url } }
+    if (
+      (s as any).type === "base64" &&
+      typeof (s as any).media_type === "string" &&
+      typeof (s as any).data === "string"
+    )
+      return { type: "input_image", image_url: { url: `data:${(s as any).media_type};base64,${(s as any).data}` } }
+    return undefined
+  }
+
+  for (const m of msgsIn) {
+    if (!m || !(m as any).role) continue
+
+    if ((m as any).role === "system") {
+      const c = (m as any).content
+      if (typeof c === "string") input.push({ role: "system", content: c })
+      continue
+    }
+
+    if ((m as any).role === "user") {
+      const c = (m as any).content
+      if (typeof c === "string") {
+        input.push({ role: "user", content: [{ type: "input_text", text: c }] })
+      } else if (Array.isArray(c)) {
+        const parts: any[] = []
+        for (const p of c) {
+          const op = toPart(p)
+          if (op) parts.push(op)
+        }
+        if (parts.length > 0) input.push({ role: "user", content: parts })
+      }
+      continue
+    }
+
+    if ((m as any).role === "assistant") {
+      const c = (m as any).content
+      if (typeof c === "string" && c.length > 0) {
+        input.push({ role: "assistant", content: [{ type: "output_text", text: c }] })
+      }
+      if (Array.isArray((m as any).tool_calls)) {
+        for (const tc of (m as any).tool_calls) {
+          if ((tc as any).type === "function" && (tc as any).function) {
+            const name = (tc as any).function.name
+            const a = (tc as any).function.arguments
+            const args = typeof a === "string" ? a : JSON.stringify(a)
+            input.push({ type: "function_call", call_id: (tc as any).id, name, arguments: args })
+          }
+        }
+      }
+      continue
+    }
+
+    if ((m as any).role === "tool") {
+      const out = typeof (m as any).content === "string" ? (m as any).content : JSON.stringify((m as any).content)
+      input.push({ type: "function_call_output", call_id: (m as any).tool_call_id, output: out })
+      continue
+    }
+  }
+
+  const stop_sequences = (() => {
+    const v = body.stop
+    if (!v) return undefined
+    if (Array.isArray(v)) return v
+    if (typeof v === "string") return [v]
+    return undefined
+  })()
+
+  const tcIn = body.tool_choice
+  const tool_choice = (() => {
+    if (!tcIn) return undefined
+    if (tcIn === "auto") return "auto"
+    if (tcIn === "required") return "required"
+    if ((tcIn as any).type === "function" && (tcIn as any).function?.name)
+      return { type: "function", function: { name: (tcIn as any).function.name } }
+    return undefined
+  })()
+
+  const tools = (() => {
+    if (!Array.isArray(body.tools)) return undefined
+    return body.tools.map((tool: any) => {
+      if (tool.type === "function") {
+        return {
+          type: "function",
+          name: tool.function?.name,
+          description: tool.function?.description,
+          parameters: tool.function?.parameters,
+          strict: tool.function?.strict,
+        }
+      }
+      return tool
+    })
+  })()
+
+  return {
+    model: body.model,
+    input,
+    max_output_tokens: body.max_tokens,
+    top_p: body.top_p,
+    stop_sequences,
+    stream: !!body.stream,
+    tools,
+    tool_choice,
+    include: Array.isArray((body as any).include) ? (body as any).include : undefined,
+    truncation: (body as any).truncation,
+    metadata: (body as any).metadata,
+    store: (body as any).store,
+    user: (body as any).user,
+    text: { verbosity: "low" },
+    reasoning: { effort: "medium" },
+  }
+}
+
+export function fromOpenaiResponse(resp: any): CommonResponse {
+  if (!resp || typeof resp !== "object") return resp
+  if (Array.isArray((resp as any).choices)) return resp
+
+  const r = (resp as any).response ?? resp
+  if (!r || typeof r !== "object") return resp
+
+  const idIn = (r as any).id
+  const id =
+    typeof idIn === "string" ? idIn.replace(/^resp_/, "chatcmpl_") : `chatcmpl_${Math.random().toString(36).slice(2)}`
+  const model = (r as any).model ?? (resp as any).model
+
+  const out = Array.isArray((r as any).output) ? (r as any).output : []
+  const text = out
+    .filter((o: any) => o && o.type === "message" && Array.isArray((o as any).content))
+    .flatMap((o: any) => (o as any).content)
+    .filter((p: any) => p && p.type === "output_text" && typeof p.text === "string")
+    .map((p: any) => p.text)
+    .join("")
+
+  const tcs = out
+    .filter((o: any) => o && o.type === "function_call")
+    .map((o: any) => {
+      const name = (o as any).name
+      const a = (o as any).arguments
+      const args = typeof a === "string" ? a : JSON.stringify(a ?? {})
+      const tid =
+        typeof (o as any).id === "string" && (o as any).id.length > 0
+          ? (o as any).id
+          : `toolu_${Math.random().toString(36).slice(2)}`
+      return { id: tid, type: "function" as const, function: { name, arguments: args } }
+    })
+
+  const finish = (r: string | null) => {
+    if (r === "stop") return "stop"
+    if (r === "tool_call" || r === "tool_calls") return "tool_calls"
+    if (r === "length" || r === "max_output_tokens") return "length"
+    if (r === "content_filter") return "content_filter"
+    return null
+  }
+
+  const u = (r as any).usage ?? (resp as any).usage
+  const usage = (() => {
+    if (!u) return undefined as any
+    const pt = typeof (u as any).input_tokens === "number" ? (u as any).input_tokens : undefined
+    const ct = typeof (u as any).output_tokens === "number" ? (u as any).output_tokens : undefined
+    const total = pt != null && ct != null ? pt + ct : undefined
+    const cached = (u as any).input_tokens_details?.cached_tokens
+    const details = typeof cached === "number" ? { cached_tokens: cached } : undefined
+    return {
+      prompt_tokens: pt,
+      completion_tokens: ct,
+      total_tokens: total,
+      ...(details ? { prompt_tokens_details: details } : {}),
+    }
+  })()
+
+  return {
+    id,
+    object: "chat.completion",
+    created: Math.floor(Date.now() / 1000),
+    model,
+    choices: [
+      {
+        index: 0,
+        message: {
+          role: "assistant",
+          ...(text && text.length > 0 ? { content: text } : {}),
+          ...(tcs.length > 0 ? { tool_calls: tcs } : {}),
+        },
+        finish_reason: finish((r as any).stop_reason ?? null),
+      },
+    ],
+    ...(usage ? { usage } : {}),
+  }
+}
+
+export function toOpenaiResponse(resp: CommonResponse) {
+  if (!resp || typeof resp !== "object") return resp
+  if (!Array.isArray((resp as any).choices)) return resp
+
+  const choice = (resp as any).choices[0]
+  if (!choice) return resp
+
+  const msg = choice.message
+  if (!msg) return resp
+
+  const outputItems: any[] = []
+
+  if (typeof msg.content === "string" && msg.content.length > 0) {
+    outputItems.push({
+      id: `msg_${Math.random().toString(36).slice(2)}`,
+      type: "message",
+      status: "completed",
+      role: "assistant",
+      content: [{ type: "output_text", text: msg.content, annotations: [], logprobs: [] }],
+    })
+  }
+
+  if (Array.isArray(msg.tool_calls)) {
+    for (const tc of msg.tool_calls) {
+      if ((tc as any).type === "function" && (tc as any).function) {
+        outputItems.push({
+          id: (tc as any).id,
+          type: "function_call",
+          name: (tc as any).function.name,
+          call_id: (tc as any).id,
+          arguments: (tc as any).function.arguments,
+        })
+      }
+    }
+  }
+
+  const stop_reason = (() => {
+    const r = choice.finish_reason
+    if (r === "stop") return "stop"
+    if (r === "tool_calls") return "tool_call"
+    if (r === "length") return "max_output_tokens"
+    if (r === "content_filter") return "content_filter"
+    return null
+  })()
+
+  const usage = (() => {
+    const u = (resp as any).usage
+    if (!u) return undefined
+    return {
+      input_tokens: u.prompt_tokens,
+      output_tokens: u.completion_tokens,
+      total_tokens: u.total_tokens,
+      ...(u.prompt_tokens_details?.cached_tokens
+        ? { input_tokens_details: { cached_tokens: u.prompt_tokens_details.cached_tokens } }
+        : {}),
+    }
+  })()
+
+  return {
+    id: (resp as any).id?.replace(/^chatcmpl_/, "resp_") ?? `resp_${Math.random().toString(36).slice(2)}`,
+    object: "response",
+    model: (resp as any).model,
+    output: outputItems,
+    stop_reason,
+    usage,
+  }
+}
+
+export function fromOpenaiChunk(chunk: string): CommonChunk | string {
+  const lines = chunk.split("\n")
+  const ev = lines[0]
+  const dl = lines[1]
+  if (!ev || !dl || !dl.startsWith("data: ")) return chunk
+
+  let json: any
+  try {
+    json = JSON.parse(dl.slice(6))
+  } catch {
+    return chunk
+  }
+
+  const respObj = json.response ?? {}
+
+  const out: CommonChunk = {
+    id: respObj.id ?? json.id ?? "",
+    object: "chat.completion.chunk",
+    created: Math.floor(Date.now() / 1000),
+    model: respObj.model ?? json.model ?? "",
+    choices: [],
+  }
+
+  const e = ev.replace("event: ", "").trim()
+
+  if (e === "response.output_text.delta") {
+    const d = (json as any).delta ?? (json as any).text ?? (json as any).output_text_delta
+    if (typeof d === "string" && d.length > 0)
+      out.choices.push({ index: 0, delta: { content: d }, finish_reason: null })
+  }
+
+  if (e === "response.output_item.added" && (json as any).item?.type === "function_call") {
+    const name = (json as any).item?.name
+    const id = (json as any).item?.id
+    if (typeof name === "string" && name.length > 0) {
+      out.choices.push({
+        index: 0,
+        delta: { tool_calls: [{ index: 0, id, type: "function", function: { name, arguments: "" } }] },
+        finish_reason: null,
+      })
+    }
+  }
+
+  if (e === "response.function_call_arguments.delta") {
+    const a = (json as any).delta ?? (json as any).arguments_delta
+    if (typeof a === "string" && a.length > 0) {
+      out.choices.push({
+        index: 0,
+        delta: { tool_calls: [{ index: 0, function: { arguments: a } }] },
+        finish_reason: null,
+      })
+    }
+  }
+
+  if (e === "response.completed") {
+    const fr = (() => {
+      const sr = (respObj as any).stop_reason ?? (json as any).stop_reason
+      if (sr === "stop") return "stop"
+      if (sr === "tool_call" || sr === "tool_calls") return "tool_calls"
+      if (sr === "length" || sr === "max_output_tokens") return "length"
+      if (sr === "content_filter") return "content_filter"
+      return null
+    })()
+    out.choices.push({ index: 0, delta: {}, finish_reason: fr })
+
+    const u = (respObj as any).usage ?? (json as any).response?.usage
+    if (u) {
+      out.usage = {
+        prompt_tokens: u.input_tokens,
+        completion_tokens: u.output_tokens,
+        total_tokens: (u.input_tokens || 0) + (u.output_tokens || 0),
+        ...(u.input_tokens_details?.cached_tokens
+          ? { prompt_tokens_details: { cached_tokens: u.input_tokens_details.cached_tokens } }
+          : {}),
+      }
+    }
+  }
+
+  return out
+}
+
+export function toOpenaiChunk(chunk: CommonChunk): string {
+  if (!chunk.choices || !Array.isArray(chunk.choices) || chunk.choices.length === 0) {
+    return ""
+  }
+
+  const choice = chunk.choices[0]
+  const d = choice.delta
+  if (!d) return ""
+
+  const id = chunk.id
+  const model = chunk.model
+
+  if (d.content) {
+    const data = { id, type: "response.output_text.delta", delta: d.content, response: { id, model } }
+    return `event: response.output_text.delta\ndata: ${JSON.stringify(data)}`
+  }
+
+  if (d.tool_calls) {
+    for (const tc of d.tool_calls) {
+      if (tc.function?.name) {
+        const data = {
+          type: "response.output_item.added",
+          output_index: 0,
+          item: { id: tc.id, type: "function_call", name: tc.function.name, call_id: tc.id, arguments: "" },
+        }
+        return `event: response.output_item.added\ndata: ${JSON.stringify(data)}`
+      }
+      if (tc.function?.arguments) {
+        const data = {
+          type: "response.function_call_arguments.delta",
+          output_index: 0,
+          delta: tc.function.arguments,
+        }
+        return `event: response.function_call_arguments.delta\ndata: ${JSON.stringify(data)}`
+      }
+    }
+  }
+
+  if (choice.finish_reason) {
+    const u = chunk.usage
+    const usage = u
+      ? {
+          input_tokens: u.prompt_tokens,
+          output_tokens: u.completion_tokens,
+          total_tokens: u.total_tokens,
+          ...(u.prompt_tokens_details?.cached_tokens
+            ? { input_tokens_details: { cached_tokens: u.prompt_tokens_details.cached_tokens } }
+            : {}),
+        }
+      : undefined
+
+    const data: any = { id, type: "response.completed", response: { id, model, ...(usage ? { usage } : {}) } }
+    return `event: response.completed\ndata: ${JSON.stringify(data)}`
+  }
+
+  return ""
+}

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

@@ -0,0 +1,207 @@
+import { Format } from "../format"
+
+import {
+  fromAnthropicChunk,
+  fromAnthropicRequest,
+  fromAnthropicResponse,
+  toAnthropicChunk,
+  toAnthropicRequest,
+  toAnthropicResponse,
+} from "./anthropic"
+import {
+  fromOpenaiChunk,
+  fromOpenaiRequest,
+  fromOpenaiResponse,
+  toOpenaiChunk,
+  toOpenaiRequest,
+  toOpenaiResponse,
+} from "./openai"
+import {
+  fromOaCompatibleChunk,
+  fromOaCompatibleRequest,
+  fromOaCompatibleResponse,
+  toOaCompatibleChunk,
+  toOaCompatibleRequest,
+  toOaCompatibleResponse,
+} from "./openai-compatible"
+
+export type ProviderHelper = {
+  format: Format
+  modifyUrl: (providerApi: string) => string
+  modifyHeaders: (headers: Headers, body: Record<string, any>, apiKey: string) => void
+  modifyBody: (body: Record<string, any>) => Record<string, any>
+  createUsageParser: () => {
+    parse: (chunk: string) => void
+    retrieve: () => any
+  }
+  normalizeUsage: (usage: any) => {
+    inputTokens: number
+    outputTokens: number
+    reasoningTokens?: number
+    cacheReadTokens?: number
+    cacheWrite5mTokens?: number
+    cacheWrite1hTokens?: number
+  }
+}
+
+export interface CommonMessage {
+  role: "system" | "user" | "assistant" | "tool"
+  content?: string | Array<CommonContentPart>
+  tool_call_id?: string
+  tool_calls?: CommonToolCall[]
+}
+
+export interface CommonContentPart {
+  type: "text" | "image_url"
+  text?: string
+  image_url?: { url: string }
+}
+
+export interface CommonToolCall {
+  id: string
+  type: "function"
+  function: {
+    name: string
+    arguments: string
+  }
+}
+
+export interface CommonTool {
+  type: "function"
+  function: {
+    name: string
+    description?: string
+    parameters?: Record<string, any>
+  }
+}
+
+export interface CommonUsage {
+  input_tokens?: number
+  output_tokens?: number
+  total_tokens?: number
+  prompt_tokens?: number
+  completion_tokens?: number
+  cache_read_input_tokens?: number
+  cache_creation?: {
+    ephemeral_5m_input_tokens?: number
+    ephemeral_1h_input_tokens?: number
+  }
+  input_tokens_details?: {
+    cached_tokens?: number
+  }
+  output_tokens_details?: {
+    reasoning_tokens?: number
+  }
+}
+
+export interface CommonRequest {
+  model?: string
+  max_tokens?: number
+  temperature?: number
+  top_p?: number
+  stop?: string | string[]
+  messages: CommonMessage[]
+  stream?: boolean
+  tools?: CommonTool[]
+  tool_choice?: "auto" | "required" | { type: "function"; function: { name: string } }
+}
+
+export interface CommonResponse {
+  id: string
+  object: "chat.completion"
+  created: number
+  model: string
+  choices: Array<{
+    index: number
+    message: {
+      role: "assistant"
+      content?: string
+      tool_calls?: CommonToolCall[]
+    }
+    finish_reason: "stop" | "tool_calls" | "length" | "content_filter" | null
+  }>
+  usage?: {
+    prompt_tokens?: number
+    completion_tokens?: number
+    total_tokens?: number
+    prompt_tokens_details?: { cached_tokens?: number }
+  }
+}
+
+export interface CommonChunk {
+  id: string
+  object: "chat.completion.chunk"
+  created: number
+  model: string
+  choices: Array<{
+    index: number
+    delta: {
+      role?: "assistant"
+      content?: string
+      tool_calls?: Array<{
+        index: number
+        id?: string
+        type?: "function"
+        function?: {
+          name?: string
+          arguments?: string
+        }
+      }>
+    }
+    finish_reason: "stop" | "tool_calls" | "length" | "content_filter" | null
+  }>
+  usage?: {
+    prompt_tokens?: number
+    completion_tokens?: number
+    total_tokens?: number
+    prompt_tokens_details?: { cached_tokens?: number }
+  }
+}
+
+export function createBodyConverter(from: Format, to: Format) {
+  return (body: any): any => {
+    if (from === to) return body
+
+    let raw: CommonRequest
+    if (from === "anthropic") raw = fromAnthropicRequest(body)
+    else if (from === "openai") raw = fromOpenaiRequest(body)
+    else raw = fromOaCompatibleRequest(body)
+
+    if (to === "anthropic") return toAnthropicRequest(raw)
+    if (to === "openai") return toOpenaiRequest(raw)
+    if (to === "oa-compat") return toOaCompatibleRequest(raw)
+  }
+}
+
+export function createStreamPartConverter(from: Format, to: Format) {
+  return (part: any): any => {
+    if (from === to) return part
+
+    let raw: CommonChunk | string
+    if (from === "anthropic") raw = fromAnthropicChunk(part)
+    else if (from === "openai") raw = fromOpenaiChunk(part)
+    else raw = fromOaCompatibleChunk(part)
+
+    // If result is a string (error case), pass it through
+    if (typeof raw === "string") return raw
+
+    if (to === "anthropic") return toAnthropicChunk(raw)
+    if (to === "openai") return toOpenaiChunk(raw)
+    if (to === "oa-compat") return toOaCompatibleChunk(raw)
+  }
+}
+
+export function createResponseConverter(from: Format, to: Format) {
+  return (response: any): any => {
+    if (from === to) return response
+
+    let raw: CommonResponse
+    if (from === "anthropic") raw = fromAnthropicResponse(response)
+    else if (from === "openai") raw = fromOpenaiResponse(response)
+    else raw = fromOaCompatibleResponse(response)
+
+    if (to === "anthropic") return toAnthropicResponse(raw)
+    if (to === "openai") return toOpenaiResponse(raw)
+    if (to === "oa-compat") return toOaCompatibleResponse(raw)
+  }
+}

packages/console/app/src/routes/zen/v1/chat/completions.ts

@@ -1,63 +1,9 @@
 import type { APIEvent } from "@solidjs/start/server"
-import { handler } from "~/routes/zen/handler"
-
-type Usage = {
-  prompt_tokens?: number
-  completion_tokens?: number
-  total_tokens?: number
-  // used by moonshot
-  cached_tokens?: number
-  // used by xai
-  prompt_tokens_details?: {
-    text_tokens?: number
-    audio_tokens?: number
-    image_tokens?: number
-    cached_tokens?: number
-  }
-  completion_tokens_details?: {
-    reasoning_tokens?: number
-    audio_tokens?: number
-    accepted_prediction_tokens?: number
-    rejected_prediction_tokens?: number
-  }
-}
+import { handler } from "~/routes/zen/util/handler"
 
 export function POST(input: APIEvent) {
-  let usage: Usage
   return handler(input, {
-    modifyBody: (body: any) => ({
-      ...body,
-      ...(body.stream ? { stream_options: { include_usage: true } } : {}),
-    }),
-    setAuthHeader: (headers: Headers, apiKey: string) => {
-      headers.set("authorization", `Bearer ${apiKey}`)
-    },
+    format: "oa-compat",
     parseApiKey: (headers: Headers) => headers.get("authorization")?.split(" ")[1],
-    onStreamPart: (chunk: string) => {
-      if (!chunk.startsWith("data: ")) return
-
-      let json
-      try {
-        json = JSON.parse(chunk.slice(6)) as { usage?: Usage }
-      } catch (e) {
-        return
-      }
-
-      if (!json.usage) return
-      usage = json.usage
-    },
-    getStreamUsage: () => usage,
-    normalizeUsage: (usage: Usage) => {
-      const inputTokens = usage.prompt_tokens ?? 0
-      const outputTokens = usage.completion_tokens ?? 0
-      const reasoningTokens = usage.completion_tokens_details?.reasoning_tokens ?? undefined
-      const cacheReadTokens = usage.cached_tokens ?? usage.prompt_tokens_details?.cached_tokens ?? undefined
-      return {
-        inputTokens: inputTokens - (cacheReadTokens ?? 0),
-        outputTokens: outputTokens - (reasoningTokens ?? 0),
-        reasoningTokens,
-        cacheReadTokens,
-      }
-    },
   })
 }

packages/console/app/src/routes/zen/v1/messages.ts

@@ -1,64 +1,9 @@
 import type { APIEvent } from "@solidjs/start/server"
-import { handler } from "~/routes/zen/handler"
-
-type Usage = {
-  cache_creation?: {
-    ephemeral_5m_input_tokens?: number
-    ephemeral_1h_input_tokens?: number
-  }
-  cache_creation_input_tokens?: number
-  cache_read_input_tokens?: number
-  input_tokens?: number
-  output_tokens?: number
-  server_tool_use?: {
-    web_search_requests?: number
-  }
-}
+import { handler } from "~/routes/zen/util/handler"
 
 export function POST(input: APIEvent) {
-  let usage: Usage
   return handler(input, {
-    modifyBody: (body: any) => ({
-      ...body,
-      service_tier: "standard_only",
-    }),
-    setAuthHeader: (headers: Headers, apiKey: string) => headers.set("x-api-key", apiKey),
+    format: "anthropic",
     parseApiKey: (headers: Headers) => headers.get("x-api-key") ?? undefined,
-    onStreamPart: (chunk: string) => {
-      const data = chunk.split("\n")[1]
-      if (!data.startsWith("data: ")) return
-
-      let json
-      try {
-        json = JSON.parse(data.slice(6))
-      } catch (e) {
-        return
-      }
-
-      // ie. { type: "message_start"; message: { usage: Usage } }
-      // ie. { type: "message_delta"; usage: Usage }
-      const usageUpdate = json.usage ?? json.message?.usage
-      if (!usageUpdate) return
-      usage = {
-        ...usage,
-        ...usageUpdate,
-        cache_creation: {
-          ...usage?.cache_creation,
-          ...usageUpdate.cache_creation,
-        },
-        server_tool_use: {
-          ...usage?.server_tool_use,
-          ...usageUpdate.server_tool_use,
-        },
-      }
-    },
-    getStreamUsage: () => usage,
-    normalizeUsage: (usage: Usage) => ({
-      inputTokens: usage.input_tokens ?? 0,
-      outputTokens: usage.output_tokens ?? 0,
-      cacheReadTokens: usage.cache_read_input_tokens ?? undefined,
-      cacheWrite5mTokens: usage.cache_creation?.ephemeral_5m_input_tokens ?? undefined,
-      cacheWrite1hTokens: usage.cache_creation?.ephemeral_1h_input_tokens ?? undefined,
-    }),
   })
 }

packages/console/app/src/routes/zen/v1/models.ts

@@ -0,0 +1,60 @@
+import type { APIEvent } from "@solidjs/start/server"
+import { and, Database, eq, isNull } from "@opencode-ai/console-core/drizzle/index.js"
+import { KeyTable } from "@opencode-ai/console-core/schema/key.sql.js"
+import { WorkspaceTable } from "@opencode-ai/console-core/schema/workspace.sql.js"
+import { ModelTable } from "@opencode-ai/console-core/schema/model.sql.js"
+import { ZenData } from "@opencode-ai/console-core/model.js"
+
+export async function OPTIONS(input: APIEvent) {
+  return new Response(null, {
+    status: 200,
+    headers: {
+      "Access-Control-Allow-Origin": "*",
+      "Access-Control-Allow-Methods": "GET, POST, OPTIONS",
+      "Access-Control-Allow-Headers": "Content-Type, Authorization",
+    },
+  })
+}
+
+export async function GET(input: APIEvent) {
+  const zenData = ZenData.list()
+  const disabledModels = await authenticate()
+
+  return new Response(
+    JSON.stringify({
+      object: "list",
+      data: Object.entries(zenData.models)
+        .filter(([id]) => !disabledModels.includes(id))
+        .map(([id, model]) => ({
+          id: `opencode/${id}`,
+          object: "model",
+          created: Math.floor(Date.now() / 1000),
+          owned_by: "opencode",
+        })),
+    }),
+    {
+      headers: {
+        "Content-Type": "application/json",
+      },
+    },
+  )
+
+  async function authenticate() {
+    const apiKey = input.request.headers.get("authorization")?.split(" ")[1]
+    if (!apiKey) return []
+
+    const disabledModels = await Database.use((tx) =>
+      tx
+        .select({
+          model: ModelTable.model,
+        })
+        .from(KeyTable)
+        .innerJoin(WorkspaceTable, eq(WorkspaceTable.id, KeyTable.workspaceID))
+        .leftJoin(ModelTable, and(eq(ModelTable.workspaceID, KeyTable.workspaceID), isNull(ModelTable.timeDeleted)))
+        .where(and(eq(KeyTable.key, apiKey), isNull(KeyTable.timeDeleted)))
+        .then((rows) => rows.map((row) => row.model)),
+    )
+
+    return disabledModels
+  }
+}

packages/console/app/src/routes/zen/v1/responses.ts

@@ -1,52 +1,9 @@
 import type { APIEvent } from "@solidjs/start/server"
-import { handler } from "~/routes/zen/handler"
-
-type Usage = {
-  input_tokens?: number
-  input_tokens_details?: {
-    cached_tokens?: number
-  }
-  output_tokens?: number
-  output_tokens_details?: {
-    reasoning_tokens?: number
-  }
-  total_tokens?: number
-}
+import { handler } from "~/routes/zen/util/handler"
 
 export function POST(input: APIEvent) {
-  let usage: Usage
   return handler(input, {
-    setAuthHeader: (headers: Headers, apiKey: string) => {
-      headers.set("authorization", `Bearer ${apiKey}`)
-    },
+    format: "openai",
     parseApiKey: (headers: Headers) => headers.get("authorization")?.split(" ")[1],
-    onStreamPart: (chunk: string) => {
-      const [event, data] = chunk.split("\n")
-      if (event !== "event: response.completed") return
-      if (!data.startsWith("data: ")) return
-
-      let json
-      try {
-        json = JSON.parse(data.slice(6)) as { response?: { usage?: Usage } }
-      } catch (e) {
-        return
-      }
-
-      if (!json.response?.usage) return
-      usage = json.response.usage
-    },
-    getStreamUsage: () => usage,
-    normalizeUsage: (usage: Usage) => {
-      const inputTokens = usage.input_tokens ?? 0
-      const outputTokens = usage.output_tokens ?? 0
-      const reasoningTokens = usage.output_tokens_details?.reasoning_tokens ?? undefined
-      const cacheReadTokens = usage.input_tokens_details?.cached_tokens ?? undefined
-      return {
-        inputTokens: inputTokens - (cacheReadTokens ?? 0),
-        outputTokens: outputTokens - (reasoningTokens ?? 0),
-        reasoningTokens,
-        cacheReadTokens,
-      }
-    },
   })
 }

packages/console/core/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "@opencode-ai/console-core",
-  "version": "0.15.9",
+  "version": "0.15.19",
   "private": true,
   "type": "module",
   "dependencies": {

packages/console/function/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/console-function",
-  "version": "0.15.9",
+  "version": "0.15.19",
   "$schema": "https://json.schemastore.org/package.json",
   "private": true,
   "type": "module",

packages/console/mail/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/console-mail",
-  "version": "0.15.9",
+  "version": "0.15.19",
   "dependencies": {
     "@jsx-email/all": "2.2.3",
     "@jsx-email/cli": "1.4.3",

packages/desktop/package.json

@@ -1,23 +1,23 @@
 {
   "name": "@opencode-ai/desktop",
-  "version": "0.15.9",
+  "version": "0.15.19",
   "description": "",
   "type": "module",
   "scripts": {
     "start": "vite",
     "dev": "vite",
     "build": "vite build",
-    "serve": "vite preview",
-    "typecheck": "tsgo --noEmit"
+    "serve": "vite preview"
   },
   "license": "MIT",
   "devDependencies": {
+    "opencode": "workspace:*",
     "@tailwindcss/vite": "catalog:",
     "@tsconfig/bun": "1.0.9",
     "@types/luxon": "3.7.1",
     "@types/node": "catalog:",
-    "typescript": "catalog:",
     "@typescript/native-preview": "catalog:",
+    "typescript": "catalog:",
     "vite": "catalog:",
     "vite-plugin-icons-spritesheet": "3.0.1",
     "vite-plugin-solid": "catalog:"
@@ -25,7 +25,10 @@
   "dependencies": {
     "@kobalte/core": "catalog:",
     "@opencode-ai/sdk": "workspace:*",
+    "@opencode-ai/ui": "workspace:*",
+    "@pierre/precision-diffs": "0.3.5",
     "@shikijs/transformers": "3.9.2",
+    "@solid-primitives/active-element": "2.1.3",
     "@solid-primitives/event-bus": "1.1.2",
     "@solid-primitives/resize-observer": "2.1.3",
     "@solid-primitives/scroll": "2.1.3",
@@ -33,14 +36,13 @@
     "@solidjs/router": "0.15.3",
     "@thisbeyond/solid-dnd": "0.7.5",
     "diff": "catalog:",
-    "@opencode-ai/ui": "workspace:*",
     "fuzzysort": "catalog:",
     "luxon": "catalog:",
     "marked": "16.2.0",
     "marked-shiki": "1.2.1",
     "remeda": "catalog:",
-    "solid-js": "catalog:",
     "shiki": "3.9.2",
+    "solid-js": "catalog:",
     "solid-list": "catalog:",
     "tailwindcss": "catalog:",
     "virtua": "catalog:"

packages/desktop/src/components/assistant-message.tsx

@@ -0,0 +1,362 @@
+import type { Part, AssistantMessage, ReasoningPart, TextPart, ToolPart } from "@opencode-ai/sdk"
+import type { Tool } from "opencode/tool/tool"
+import type { ReadTool } from "opencode/tool/read"
+import { children, Component, createMemo, For, Match, Show, Switch, type JSX } from "solid-js"
+import { Dynamic } from "solid-js/web"
+import { Markdown } from "./markdown"
+import { Collapsible, Icon, IconProps } from "@opencode-ai/ui"
+import { getDirectory, getFilename } from "@/utils"
+import type { ListTool } from "opencode/tool/ls"
+import type { GlobTool } from "opencode/tool/glob"
+import type { GrepTool } from "opencode/tool/grep"
+import type { WebFetchTool } from "opencode/tool/webfetch"
+import type { TaskTool } from "opencode/tool/task"
+import type { BashTool } from "opencode/tool/bash"
+import type { EditTool } from "opencode/tool/edit"
+import type { WriteTool } from "opencode/tool/write"
+import { DiffChanges } from "./diff-changes"
+
+export function AssistantMessage(props: { message: AssistantMessage; parts: Part[] }) {
+  return (
+    <div class="w-full flex flex-col items-start gap-4">
+      <For each={props.parts}>
+        {(part) => {
+          const component = createMemo(() => PART_MAPPING[part.type as keyof typeof PART_MAPPING])
+          return (
+            <Show when={component()}>
+              <Dynamic component={component()} part={part as any} message={props.message} />
+            </Show>
+          )
+        }}
+      </For>
+    </div>
+  )
+}
+
+const PART_MAPPING = {
+  text: TextPart,
+  tool: ToolPart,
+  reasoning: ReasoningPart,
+}
+
+function ReasoningPart(props: { part: ReasoningPart; message: AssistantMessage }) {
+  return null
+  // return (
+  //   <Show when={props.part.text.trim()}>
+  //     <div>{props.part.text}</div>
+  //   </Show>
+  // )
+}
+
+function TextPart(props: { part: TextPart; message: AssistantMessage }) {
+  return (
+    <Show when={props.part.text.trim()}>
+      <Markdown text={props.part.text.trim()} />
+    </Show>
+  )
+}
+
+function ToolPart(props: { part: ToolPart; message: AssistantMessage }) {
+  // const sync = useSync()
+
+  const component = createMemo(() => {
+    const render = ToolRegistry.render(props.part.tool) ?? GenericTool
+
+    const metadata = props.part.state.status === "pending" ? {} : (props.part.state.metadata ?? {})
+    const input = props.part.state.status === "completed" ? props.part.state.input : {}
+    // const permissions = sync.data.permission[props.message.sessionID] ?? []
+    // const permissionIndex = permissions.findIndex((x) => x.callID === props.part.callID)
+    // const permission = permissions[permissionIndex]
+
+    return (
+      <>
+        <Dynamic
+          component={render}
+          input={input}
+          tool={props.part.tool}
+          metadata={metadata}
+          // permission={permission?.metadata ?? {}}
+          output={props.part.state.status === "completed" ? props.part.state.output : undefined}
+        />
+        {/* <Show when={props.part.state.status === "error"}>{props.part.state.error.replace("Error: ", "")}</Show> */}
+      </>
+    )
+  })
+
+  return <Show when={component()}>{component()}</Show>
+}
+
+type TriggerTitle = {
+  title: string
+  subtitle?: string
+  args?: string[]
+  action?: JSX.Element
+}
+
+const isTriggerTitle = (val: any): val is TriggerTitle => {
+  return typeof val === "object" && val !== null && "title" in val && !(val instanceof Node)
+}
+
+function BasicTool(props: { icon: IconProps["name"]; trigger: TriggerTitle | JSX.Element; children?: JSX.Element }) {
+  const resolved = children(() => props.children)
+
+  return (
+    <Collapsible>
+      <Collapsible.Trigger>
+        <div class="w-full flex items-center self-stretch gap-5 justify-between">
+          <div class="w-full flex items-center self-stretch gap-5">
+            <Icon name={props.icon} size="small" />
+            <Switch>
+              <Match when={isTriggerTitle(props.trigger)}>
+                <div class="w-full flex items-center gap-2 justify-between">
+                  <div class="flex items-center gap-2">
+                    <span class="text-12-medium text-text-base capitalize">
+                      {(props.trigger as TriggerTitle).title}
+                    </span>
+                    <Show when={(props.trigger as TriggerTitle).subtitle}>
+                      <span class="text-12-medium text-text-weak">{(props.trigger as TriggerTitle).subtitle}</span>
+                    </Show>
+                    <Show when={(props.trigger as TriggerTitle).args?.length}>
+                      <For each={(props.trigger as TriggerTitle).args}>
+                        {(arg) => <span class="text-12-regular text-text-weaker">{arg}</span>}
+                      </For>
+                    </Show>
+                  </div>
+                  <Show when={(props.trigger as TriggerTitle).action}>{(props.trigger as TriggerTitle).action}</Show>
+                </div>
+              </Match>
+              <Match when={true}>{props.trigger as JSX.Element}</Match>
+            </Switch>
+          </div>
+          <Show when={resolved()}>
+            <Collapsible.Arrow />
+          </Show>
+        </div>
+      </Collapsible.Trigger>
+      <Show when={props.children}>
+        <Collapsible.Content>{props.children}</Collapsible.Content>
+      </Show>
+    </Collapsible>
+  )
+}
+
+function GenericTool(props: ToolProps<any>) {
+  return <BasicTool icon="mcp" trigger={{ title: props.tool }} />
+}
+
+type ToolProps<T extends Tool.Info> = {
+  input: Partial<Tool.InferParameters<T>>
+  metadata: Partial<Tool.InferMetadata<T>>
+  // permission: Record<string, any>
+  tool: string
+  output?: string
+}
+
+const ToolRegistry = (() => {
+  const state: Record<
+    string,
+    {
+      name: string
+      render?: Component<ToolProps<any>>
+    }
+  > = {}
+  function register<T extends Tool.Info>(input: { name: string; render?: Component<ToolProps<T>> }) {
+    state[input.name] = input
+    return input
+  }
+  return {
+    register,
+    render(name: string) {
+      return state[name]?.render
+    },
+  }
+})()
+
+ToolRegistry.register<typeof ReadTool>({
+  name: "read",
+  render(props) {
+    return (
+      <BasicTool
+        icon="glasses"
+        trigger={{ title: props.tool, subtitle: props.input.filePath ? getFilename(props.input.filePath) : "" }}
+      />
+    )
+  },
+})
+
+ToolRegistry.register<typeof ListTool>({
+  name: "list",
+  render(props) {
+    return (
+      <BasicTool icon="bullet-list" trigger={{ title: props.tool, subtitle: props.input.path || "/" }}>
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})
+
+ToolRegistry.register<typeof GlobTool>({
+  name: "glob",
+  render(props) {
+    return (
+      <BasicTool
+        icon="magnifying-glass-menu"
+        trigger={{
+          title: props.tool,
+          subtitle: props.input.path || "/",
+          args: props.input.pattern ? ["pattern=" + props.input.pattern] : [],
+        }}
+      >
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})
+
+ToolRegistry.register<typeof GrepTool>({
+  name: "grep",
+  render(props) {
+    const args = []
+    if (props.input.pattern) args.push("pattern=" + props.input.pattern)
+    if (props.input.include) args.push("include=" + props.input.include)
+    return (
+      <BasicTool
+        icon="magnifying-glass-menu"
+        trigger={{
+          title: props.tool,
+          subtitle: props.input.path || "/",
+          args,
+        }}
+      >
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})
+
+ToolRegistry.register<typeof WebFetchTool>({
+  name: "webfetch",
+  render(props) {
+    return (
+      <BasicTool
+        icon="window-cursor"
+        trigger={{
+          title: props.tool,
+          subtitle: props.input.url || "",
+          args: props.input.format ? ["format=" + props.input.format] : [],
+          action: (
+            <div class="size-6 flex items-center justify-center">
+              <Icon name="square-arrow-top-right" size="small" />
+            </div>
+          ),
+        }}
+      >
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})
+
+ToolRegistry.register<typeof TaskTool>({
+  name: "task",
+  render(props) {
+    return (
+      <BasicTool
+        icon="task"
+        trigger={{
+          title: `${props.input.subagent_type || props.tool} Agent`,
+          subtitle: props.input.description,
+        }}
+      >
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})
+
+ToolRegistry.register<typeof BashTool>({
+  name: "bash",
+  render(props) {
+    return (
+      <BasicTool
+        icon="console"
+        trigger={{
+          title: "Shell",
+          subtitle: "Ran " + props.input.command,
+        }}
+      >
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})
+
+ToolRegistry.register<typeof EditTool>({
+  name: "edit",
+  render(props) {
+    return (
+      <BasicTool
+        icon="code-lines"
+        trigger={
+          <div class="flex items-center justify-between w-full">
+            <div class="flex items-center gap-5">
+              <div class="text-12-medium text-text-base capitalize">Edit</div>
+              <div class="flex">
+                <Show when={props.input.filePath?.includes("/")}>
+                  <span class="text-text-weak">{getDirectory(props.input.filePath!)}/</span>
+                </Show>
+                <span class="text-text-strong">{getFilename(props.input.filePath ?? "")}</span>
+              </div>
+            </div>
+            <div class="flex gap-4 items-center justify-end">{/* <DiffChanges diff={diff} /> */}</div>
+          </div>
+        }
+      >
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})
+
+ToolRegistry.register<typeof WriteTool>({
+  name: "write",
+  render(props) {
+    return (
+      <BasicTool
+        icon="code-lines"
+        trigger={
+          <div class="flex items-center justify-between w-full">
+            <div class="flex items-center gap-5">
+              <div class="text-12-medium text-text-base capitalize">Write</div>
+              <div class="flex">
+                <Show when={props.input.filePath?.includes("/")}>
+                  <span class="text-text-weak">{getDirectory(props.input.filePath!)}/</span>
+                </Show>
+                <span class="text-text-strong">{getFilename(props.input.filePath ?? "")}</span>
+              </div>
+            </div>
+            <div class="flex gap-4 items-center justify-end">{/* <DiffChanges diff={diff} /> */}</div>
+          </div>
+        }
+      >
+        <Show when={false && props.output}>
+          <div class="whitespace-pre">{props.output}</div>
+        </Show>
+      </BasicTool>
+    )
+  },
+})

packages/desktop/src/components/code.tsx

@@ -1,8 +1,8 @@
 import { bundledLanguages, type BundledLanguage, type ShikiTransformer } from "shiki"
 import { splitProps, type ComponentProps, createEffect, onMount, onCleanup, createMemo, createResource } from "solid-js"
-import { useLocal, useShiki } from "@/context"
-import type { TextSelection } from "@/context/local"
+import { useLocal, type TextSelection } from "@/context/local"
 import { getFileExtension, getNodeOffsetInLine, getSelectionInContainer } from "@/utils"
+import { useShiki } from "@/context/shiki"
 
 type DefinedSelection = Exclude<TextSelection, undefined>
 
@@ -394,7 +394,7 @@ export function Code(props: Props) {
           [&_.diff-blank_.diff-oldln]:bg-background-element
           [&_.diff-blank_.diff-newln]:bg-background-element
           [&_.diff-collapsed]:block! [&_.diff-collapsed]:w-full [&_.diff-collapsed]:relative
-          [&_.diff-collapsed]:cursor-pointer [&_.diff-collapsed]:select-none
+          [&_.diff-collapsed]:select-none
           [&_.diff-collapsed]:bg-info/20 [&_.diff-collapsed]:hover:bg-info/40!
           [&_.diff-collapsed]:text-info/80 [&_.diff-collapsed]:hover:text-info
           [&_.diff-collapsed]:text-xs

packages/desktop/src/components/diff-changes.tsx

@@ -0,0 +1,20 @@
+import { FileDiff } from "@opencode-ai/sdk"
+import { createMemo, Show } from "solid-js"
+
+export function DiffChanges(props: { diff: FileDiff | FileDiff[] }) {
+  const additions = createMemo(() =>
+    Array.isArray(props.diff) ? props.diff.reduce((acc, diff) => acc + (diff.additions ?? 0), 0) : props.diff.additions,
+  )
+  const deletions = createMemo(() =>
+    Array.isArray(props.diff) ? props.diff.reduce((acc, diff) => acc + (diff.deletions ?? 0), 0) : props.diff.deletions,
+  )
+  const total = createMemo(() => additions() + deletions())
+  return (
+    <Show when={total() > 0}>
+      <div class="flex gap-2 justify-end items-center">
+        <span class="text-12-mono text-right text-text-diff-add-base">{`+${additions()}`}</span>
+        <span class="text-12-mono text-right text-text-diff-delete-base">{`-${deletions()}`}</span>
+      </div>
+    </Show>
+  )
+}

packages/desktop/src/components/diff.tsx

@@ -0,0 +1,176 @@
+import {
+  type FileContents,
+  FileDiff,
+  type DiffLineAnnotation,
+  type HunkData,
+  DiffFileRendererOptions,
+  // registerCustomTheme,
+} from "@pierre/precision-diffs"
+import { ComponentProps, createEffect, splitProps } from "solid-js"
+
+export type DiffProps<T = {}> = Omit<DiffFileRendererOptions<T>, "themes"> & {
+  before: FileContents
+  after: FileContents
+  annotations?: DiffLineAnnotation<T>[]
+  class?: string
+  classList?: ComponentProps<"div">["classList"]
+}
+
+// registerCustomTheme("opencode", () => import("./theme.json"))
+
+// interface ThreadMetadata {
+//   threadId: string
+// }
+
+export function Diff<T>(props: DiffProps<T>) {
+  let container!: HTMLDivElement
+  const [local, others] = splitProps(props, ["before", "after", "class", "classList", "annotations"])
+
+  // const lineAnnotations: DiffLineAnnotation<ThreadMetadata>[] = [
+  //   {
+  //     side: "additions",
+  //     // The line number specified for an annotation is the visual line number
+  //     // you see in the number column of a diff
+  //     lineNumber: 16,
+  //     metadata: { threadId: "68b329da9893e34099c7d8ad5cb9c940" },
+  //   },
+  // ]
+
+  // If you ever want to update the options for an instance, simple call
+  // 'setOptions' with the new options. Bear in mind, this does NOT merge
+  // existing properties, it's a full replace
+  // instance.setOptions({
+  //   ...instance.options,
+  //   theme: "pierre-dark",
+  //   themes: undefined,
+  // })
+
+  // When ready to render, simply call .render with old/new file, optional
+  // annotations and a container element to hold the diff
+  createEffect(() => {
+    const instance = new FileDiff<T>({
+      theme: "pierre-light",
+      // Or can also provide a 'themes' prop, which allows the code to adapt
+      // to your OS light or dark theme
+      // themes: { dark: 'pierre-night', light: 'pierre-light' },
+      // When using the 'themes' prop, 'themeType' allows you to force 'dark'
+      // or 'light' theme, or inherit from the OS ('system') theme.
+      themeType: "system",
+      // Disable the line numbers for your diffs, generally not recommended
+      disableLineNumbers: false,
+      // Whether code should 'wrap' with long lines or 'scroll'.
+      overflow: "scroll",
+      // Normally you shouldn't need this prop, but if you don't provide a
+      // valid filename or your file doesn't have an extension you may want to
+      // override the automatic detection. You can specify that language here:
+      // https://shiki.style/languages
+      // lang?: SupportedLanguages;
+      // 'diffStyle' controls whether the diff is presented side by side or
+      // in a unified (single column) view
+      diffStyle: "unified",
+      // Line decorators to help highlight changes.
+      // 'bars' (default):
+      // Shows some red-ish or green-ish (theme dependent) bars on the left
+      // edge of relevant lines
+      //
+      // 'classic':
+      // shows '+' characters on additions and '-' characters on deletions
+      //
+      // 'none':
+      // No special diff indicators are shown
+      diffIndicators: "bars",
+      // By default green-ish or red-ish background are shown on added and
+      // deleted lines respectively. Disable that feature here
+      disableBackground: false,
+      // Diffs are split up into hunks, this setting customizes what to show
+      // between each hunk.
+      //
+      // 'line-info' (default):
+      // Shows a bar that tells you how many lines are collapsed. If you are
+      // using the oldFile/newFile API then you can click those bars to
+      // expand the content between them
+      //
+      // 'metadata':
+      // Shows the content you'd see in a normal patch file, usually in some
+      // format like '@@ -60,6 +60,22 @@'. You cannot use these to expand
+      // hidden content
+      //
+      // 'simple':
+      // Just a subtle bar separator between each hunk
+      hunkSeparators: "line-info",
+      // hunkSeparators(hunkData: HunkData) {
+      //   const fragment = document.createDocumentFragment()
+      //   const numCol = document.createElement("div")
+      //   numCol.textContent = `${hunkData.lines}`
+      //   numCol.style.position = "sticky"
+      //   numCol.style.left = "0"
+      //   numCol.style.backgroundColor = "var(--pjs-bg)"
+      //   numCol.style.zIndex = "2"
+      //   fragment.appendChild(numCol)
+      //   const contentCol = document.createElement("div")
+      //   contentCol.textContent = "unmodified lines"
+      //   contentCol.style.position = "sticky"
+      //   contentCol.style.width = "var(--pjs-column-content-width)"
+      //   contentCol.style.left = "var(--pjs-column-number-width)"
+      //   fragment.appendChild(contentCol)
+      //   return fragment
+      // },
+      // On lines that have both additions and deletions, we can run a
+      // separate diff check to mark parts of the lines that change.
+      // 'none':
+      // Do not show these secondary highlights
+      //
+      // 'char':
+      // Show changes at a per character granularity
+      //
+      // 'word':
+      // Show changes but rounded up to word boundaries
+      //
+      // 'word-alt' (default):
+      // Similar to 'word', however we attempt to minimize single character
+      // gaps between highlighted changes
+      lineDiffType: "word-alt",
+      // If lines exceed these character lengths then we won't perform the
+      // line lineDiffType check
+      maxLineDiffLength: 1000,
+      // If any line in the diff exceeds this value then we won't attempt to
+      // syntax highlight the diff
+      maxLineLengthForHighlighting: 1000,
+      // Enabling this property will hide the file header with file name and
+      // diff stats.
+      disableFileHeader: true,
+      // You can optionally pass a render function for rendering out line
+      // annotations.  Just return the dom node to render
+      // renderAnnotation(annotation: DiffLineAnnotation<T>): HTMLElement {
+      //   // Despite the diff itself being rendered in the shadow dom,
+      //   // annotations are inserted via the web components 'slots' api and you
+      //   // can use all your normal normal css and styling for them
+      //   const element = document.createElement("div")
+      //   element.innerText = annotation.metadata.threadId
+      //   return element
+      // },
+      ...others,
+    })
+
+    instance.render({
+      oldFile: local.before,
+      newFile: local.after,
+      lineAnnotations: local.annotations,
+      containerWrapper: container,
+    })
+  })
+
+  return (
+    <div
+      style={{
+        "--pjs-font-family": "var(--font-family-mono)",
+        "--pjs-font-size": "var(--font-size-small)",
+        "--pjs-line-height": "24px",
+        "--pjs-tab-size": 4,
+        "--pjs-font-features": "var(--font-family-mono--font-feature-settings)",
+        "--pjs-header-font-family": "var(--font-family-sans)",
+      }}
+      ref={container}
+    />
+  )
+}

packages/desktop/src/components/editor-pane.tsx

@@ -1,265 +0,0 @@
-import { For, Match, Show, Switch, createSignal, splitProps } from "solid-js"
-import { Tabs, Tooltip } from "@opencode-ai/ui"
-import { Icon } from "@opencode-ai/ui"
-import { FileIcon, IconButton } from "@/ui"
-import {
-  DragDropProvider,
-  DragDropSensors,
-  DragOverlay,
-  SortableProvider,
-  closestCenter,
-  createSortable,
-  useDragDropContext,
-} from "@thisbeyond/solid-dnd"
-import type { DragEvent, Transformer } from "@thisbeyond/solid-dnd"
-import type { LocalFile } from "@/context/local"
-import { Code } from "@/components/code"
-import { useLocal } from "@/context"
-import type { JSX } from "solid-js"
-
-interface EditorPaneProps {
-  onFileClick: (file: LocalFile) => void
-}
-
-export default function EditorPane(props: EditorPaneProps): JSX.Element {
-  const [localProps] = splitProps(props, ["onFileClick"])
-  const local = useLocal()
-  const [activeItem, setActiveItem] = createSignal<string | undefined>(undefined)
-
-  const navigateChange = (dir: 1 | -1) => {
-    const active = local.file.active()
-    if (!active) return
-    const current = local.file.changeIndex(active.path)
-    const next = current === undefined ? (dir === 1 ? 0 : -1) : current + dir
-    local.file.setChangeIndex(active.path, next)
-  }
-
-  const handleTabChange = (path: string) => {
-    local.file.open(path)
-  }
-
-  const handleTabClose = (file: LocalFile) => {
-    local.file.close(file.path)
-  }
-
-  const handleDragStart = (event: unknown) => {
-    const id = getDraggableId(event)
-    if (!id) return
-    setActiveItem(id)
-  }
-
-  const handleDragOver = (event: DragEvent) => {
-    const { draggable, droppable } = event
-    if (draggable && droppable) {
-      const currentFiles = local.file.opened().map((file) => file.path)
-      const fromIndex = currentFiles.indexOf(draggable.id.toString())
-      const toIndex = currentFiles.indexOf(droppable.id.toString())
-      if (fromIndex !== toIndex) {
-        local.file.move(draggable.id.toString(), toIndex)
-      }
-    }
-  }
-
-  const handleDragEnd = () => {
-    setActiveItem(undefined)
-  }
-
-  return (
-    <DragDropProvider
-      onDragStart={handleDragStart}
-      onDragEnd={handleDragEnd}
-      onDragOver={handleDragOver}
-      collisionDetector={closestCenter}
-    >
-      <DragDropSensors />
-      <ConstrainDragYAxis />
-      <Tabs value={local.file.active()?.path} onChange={handleTabChange}>
-        <div class="sticky top-0 shrink-0 flex">
-          <Tabs.List>
-            <SortableProvider ids={local.file.opened().map((file) => file.path)}>
-              <For each={local.file.opened()}>
-                {(file) => <SortableTab file={file} onTabClick={localProps.onFileClick} onTabClose={handleTabClose} />}
-              </For>
-            </SortableProvider>
-          </Tabs.List>
-          <div class="hidden shrink-0 h-full _flex items-center gap-1 px-2 border-b border-border-subtle/40">
-            <Show when={local.file.active() && local.file.active()!.content?.diff}>
-              {(() => {
-                const activeFile = local.file.active()!
-                const view = local.file.view(activeFile.path)
-                return (
-                  <div class="flex items-center gap-1">
-                    <Show when={view !== "raw"}>
-                      <div class="mr-1 flex items-center gap-1">
-                        <Tooltip value="Previous change" placement="bottom">
-                          <IconButton size="xs" variant="ghost" onClick={() => navigateChange(-1)}>
-                            <Icon name="arrow-up" size={14} />
-                          </IconButton>
-                        </Tooltip>
-                        <Tooltip value="Next change" placement="bottom">
-                          <IconButton size="xs" variant="ghost" onClick={() => navigateChange(1)}>
-                            <Icon name="arrow-down" size={14} />
-                          </IconButton>
-                        </Tooltip>
-                      </div>
-                    </Show>
-                    <Tooltip value="Raw" placement="bottom">
-                      <IconButton
-                        size="xs"
-                        variant="ghost"
-                        classList={{
-                          "text-text": view === "raw",
-                          "text-text-muted/70": view !== "raw",
-                          "bg-background-element": view === "raw",
-                        }}
-                        onClick={() => local.file.setView(activeFile.path, "raw")}
-                      >
-                        <Icon name="file-text" size={14} />
-                      </IconButton>
-                    </Tooltip>
-                    <Tooltip value="Unified diff" placement="bottom">
-                      <IconButton
-                        size="xs"
-                        variant="ghost"
-                        classList={{
-                          "text-text": view === "diff-unified",
-                          "text-text-muted/70": view !== "diff-unified",
-                          "bg-background-element": view === "diff-unified",
-                        }}
-                        onClick={() => local.file.setView(activeFile.path, "diff-unified")}
-                      >
-                        <Icon name="checklist" size={14} />
-                      </IconButton>
-                    </Tooltip>
-                    <Tooltip value="Split diff" placement="bottom">
-                      <IconButton
-                        size="xs"
-                        variant="ghost"
-                        classList={{
-                          "text-text": view === "diff-split",
-                          "text-text-muted/70": view !== "diff-split",
-                          "bg-background-element": view === "diff-split",
-                        }}
-                        onClick={() => local.file.setView(activeFile.path, "diff-split")}
-                      >
-                        <Icon name="columns" size={14} />
-                      </IconButton>
-                    </Tooltip>
-                  </div>
-                )
-              })()}
-            </Show>
-          </div>
-        </div>
-        <For each={local.file.opened()}>
-          {(file) => (
-            <Tabs.Content value={file.path} class="select-text">
-              {(() => {
-                const view = local.file.view(file.path)
-                const showRaw = view === "raw" || !file.content?.diff
-                const code = showRaw ? (file.content?.content ?? "") : (file.content?.diff ?? "")
-                return <Code path={file.path} code={code} class="[&_code]:pb-60" />
-              })()}
-            </Tabs.Content>
-          )}
-        </For>
-      </Tabs>
-      <DragOverlay>
-        {(() => {
-          const id = activeItem()
-          if (!id) return null
-          const draggedFile = local.file.node(id)
-          if (!draggedFile) return null
-          return (
-            <div class="relative px-3 h-8 flex items-center text-sm font-medium text-text whitespace-nowrap shrink-0 bg-background-panel border-x border-border-subtle/40 border-b border-b-transparent">
-              <TabVisual file={draggedFile} />
-            </div>
-          )
-        })()}
-      </DragOverlay>
-    </DragDropProvider>
-  )
-}
-
-function TabVisual(props: { file: LocalFile }): JSX.Element {
-  return (
-    <div class="flex items-center gap-x-1.5">
-      <FileIcon node={props.file} class="" />
-      <span classList={{ "text-xs": true, "text-primary": !!props.file.status?.status, italic: !props.file.pinned }}>
-        {props.file.name}
-      </span>
-      <span class="text-xs opacity-70">
-        <Switch>
-          <Match when={props.file.status?.status === "modified"}>
-            <span class="text-primary">M</span>
-          </Match>
-          <Match when={props.file.status?.status === "added"}>
-            <span class="text-success">A</span>
-          </Match>
-          <Match when={props.file.status?.status === "deleted"}>
-            <span class="text-error">D</span>
-          </Match>
-        </Switch>
-      </span>
-    </div>
-  )
-}
-
-function SortableTab(props: {
-  file: LocalFile
-  onTabClick: (file: LocalFile) => void
-  onTabClose: (file: LocalFile) => void
-}): JSX.Element {
-  const sortable = createSortable(props.file.path)
-
-  return (
-    // @ts-ignore
-    <div use:sortable classList={{ "opacity-0": sortable.isActiveDraggable }}>
-      <Tooltip value={props.file.path} placement="bottom">
-        <div class="relative">
-          <Tabs.Trigger value={props.file.path} class="peer/tab pr-7" onClick={() => props.onTabClick(props.file)}>
-            <TabVisual file={props.file} />
-          </Tabs.Trigger>
-          <IconButton
-            class="absolute right-1 top-1.5 opacity-0 text-text-muted/60 peer-data-[selected]/tab:opacity-100 peer-data-[selected]/tab:text-text peer-data-[selected]/tab:hover:bg-border-subtle hover:opacity-100 peer-hover/tab:opacity-100"
-            size="xs"
-            variant="ghost"
-            onClick={() => props.onTabClose(props.file)}
-          >
-            <Icon name="close" size={16} />
-          </IconButton>
-        </div>
-      </Tooltip>
-    </div>
-  )
-}
-
-function ConstrainDragYAxis(): JSX.Element {
-  const context = useDragDropContext()
-  if (!context) return <></>
-  const [, { onDragStart, onDragEnd, addTransformer, removeTransformer }] = context
-  const transformer: Transformer = {
-    id: "constrain-y-axis",
-    order: 100,
-    callback: (transform) => ({ ...transform, y: 0 }),
-  }
-  onDragStart((event) => {
-    const id = getDraggableId(event)
-    if (!id) return
-    addTransformer("draggables", id, transformer)
-  })
-  onDragEnd((event) => {
-    const id = getDraggableId(event)
-    if (!id) return
-    removeTransformer("draggables", id, transformer.id)
-  })
-  return <></>
-}
-
-const getDraggableId = (event: unknown): string | undefined => {
-  if (typeof event !== "object" || event === null) return undefined
-  if (!("draggable" in event)) return undefined
-  const draggable = (event as { draggable?: { id?: unknown } }).draggable
-  if (!draggable) return undefined
-  return typeof draggable.id === "string" ? draggable.id : undefined
-}

packages/desktop/src/components/file-tree.tsx

@@ -1,5 +1,4 @@
-import { useLocal } from "@/context"
-import type { LocalFile } from "@/context/local"
+import { useLocal, type LocalFile } from "@/context/local"
 import { Tooltip } from "@opencode-ai/ui"
 import { Collapsible, FileIcon } from "@/ui"
 import { For, Match, Switch, Show, type ComponentProps, type ParentProps } from "solid-js"
@@ -19,7 +18,7 @@ export default function FileTree(props: {
     <Dynamic
       component={p.as ?? "div"}
       classList={{
-        "p-0.5 w-full flex items-center gap-x-2 hover:bg-background-element cursor-pointer": true,
+        "p-0.5 w-full flex items-center gap-x-2 hover:bg-background-element": true,
         "bg-background-element": local.file.active()?.path === p.node.path,
         [props.nodeClass ?? ""]: !!props.nodeClass,
       }}
@@ -83,7 +82,7 @@ export default function FileTree(props: {
                 >
                   <Collapsible.Trigger>
                     <Node node={node}>
-                      <Collapsible.Arrow size={16} class="text-text-muted/60 ml-1" />
+                      <Collapsible.Arrow class="text-text-muted/60 ml-1" />
                       <FileIcon
                         node={node}
                         expanded={local.file.node(node.path).expanded}

packages/desktop/src/components/markdown.tsx

@@ -1,4 +1,4 @@
-import { useMarked } from "@/context"
+import { useMarked } from "@/context/marked"
 import { createResource } from "solid-js"
 
 function strip(text: string): string {

packages/desktop/src/components/prompt-form-helpers.ts

@@ -1,164 +0,0 @@
-import type { TextSelection } from "@/context/local"
-import { getFilename } from "@/utils"
-
-export interface PromptTextPart {
-  kind: "text"
-  value: string
-}
-
-export interface PromptAttachmentPart {
-  kind: "attachment"
-  token: string
-  display: string
-  path: string
-  selection?: TextSelection
-  origin: "context" | "active"
-}
-
-export interface PromptInterimPart {
-  kind: "interim"
-  value: string
-  leadingSpace: boolean
-}
-
-export type PromptContentPart = PromptTextPart | PromptAttachmentPart
-
-export type PromptDisplaySegment =
-  | { kind: "text"; value: string }
-  | { kind: "attachment"; part: PromptAttachmentPart; source: string }
-  | PromptInterimPart
-
-export interface AttachmentCandidate {
-  origin: "context" | "active"
-  path: string
-  selection?: TextSelection
-  display: string
-}
-
-export interface PromptSubmitValue {
-  text: string
-  parts: PromptContentPart[]
-}
-
-export const mentionPattern = /@([A-Za-z0-9_\-./]+)/g
-export const mentionTriggerPattern = /(^|\s)@([A-Za-z0-9_\-./]*)$/
-
-export type PromptSegment = (PromptTextPart | PromptAttachmentPart) & {
-  start: number
-  end: number
-}
-
-export type PromptAttachmentSegment = PromptAttachmentPart & {
-  start: number
-  end: number
-}
-
-function pushTextPart(parts: PromptContentPart[], value: string) {
-  if (!value) return
-  const last = parts[parts.length - 1]
-  if (last && last.kind === "text") {
-    last.value += value
-    return
-  }
-  parts.push({ kind: "text", value })
-}
-
-function addTextSegment(segments: PromptSegment[], start: number, value: string) {
-  if (!value) return
-  segments.push({ kind: "text", value, start, end: start + value.length })
-}
-
-export function createAttachmentDisplay(path: string, selection?: TextSelection) {
-  const base = getFilename(path)
-  if (!selection) return base
-  return `${base} (${selection.startLine}-${selection.endLine})`
-}
-
-export function registerCandidate(
-  map: Map<string, AttachmentCandidate>,
-  candidate: AttachmentCandidate,
-  tokens: (string | undefined)[],
-) {
-  for (const token of tokens) {
-    if (!token) continue
-    const normalized = token.toLowerCase()
-    if (map.has(normalized)) continue
-    map.set(normalized, candidate)
-  }
-}
-
-export function parsePrompt(value: string, lookup: Map<string, AttachmentCandidate>) {
-  const segments: PromptSegment[] = []
-  if (!value) return { parts: [] as PromptContentPart[], segments }
-
-  const pushTextRange = (rangeStart: number, rangeEnd: number) => {
-    if (rangeEnd <= rangeStart) return
-    const text = value.slice(rangeStart, rangeEnd)
-    let cursor = 0
-    for (const match of text.matchAll(mentionPattern)) {
-      const localIndex = match.index ?? 0
-      if (localIndex > cursor) {
-        addTextSegment(segments, rangeStart + cursor, text.slice(cursor, localIndex))
-      }
-      const token = match[1]
-      const candidate = lookup.get(token.toLowerCase())
-      if (candidate) {
-        const start = rangeStart + localIndex
-        const end = start + match[0].length
-        segments.push({
-          kind: "attachment",
-          token,
-          display: candidate.display,
-          path: candidate.path,
-          selection: candidate.selection,
-          origin: candidate.origin,
-          start,
-          end,
-        })
-      } else {
-        addTextSegment(segments, rangeStart + localIndex, match[0])
-      }
-      cursor = localIndex + match[0].length
-    }
-    if (cursor < text.length) {
-      addTextSegment(segments, rangeStart + cursor, text.slice(cursor))
-    }
-  }
-
-  pushTextRange(0, value.length)
-
-  const parts: PromptContentPart[] = []
-  for (const segment of segments) {
-    if (segment.kind === "text") {
-      pushTextPart(parts, segment.value)
-    } else {
-      const { start, end, ...attachment } = segment
-      parts.push(attachment as PromptAttachmentPart)
-    }
-  }
-  return { parts, segments }
-}
-
-export function composeDisplaySegments(
-  segments: PromptSegment[],
-  inputValue: string,
-  interim: string,
-): PromptDisplaySegment[] {
-  if (segments.length === 0 && !interim) return []
-
-  const display: PromptDisplaySegment[] = segments.map((segment) => {
-    if (segment.kind === "text") {
-      return { kind: "text", value: segment.value }
-    }
-    const { start, end, ...part } = segment
-    const placeholder = inputValue.slice(start, end)
-    return { kind: "attachment", part: part as PromptAttachmentPart, source: placeholder }
-  })
-
-  if (interim) {
-    const leadingSpace = !!(inputValue && !inputValue.endsWith(" ") && !interim.startsWith(" "))
-    display.push({ kind: "interim", value: interim, leadingSpace })
-  }
-
-  return display
-}

packages/desktop/src/components/prompt-form-hooks.ts

@@ -1,396 +0,0 @@
-import { createEffect, createMemo, createResource, type Accessor } from "solid-js"
-import type { SetStoreFunction } from "solid-js/store"
-import { getDirectory, getFilename } from "@/utils"
-import { createSpeechRecognition } from "@/utils/speech"
-import {
-  createAttachmentDisplay,
-  mentionPattern,
-  mentionTriggerPattern,
-  type PromptAttachmentPart,
-  type PromptAttachmentSegment,
-} from "./prompt-form-helpers"
-import type { LocalFile, TextSelection } from "@/context/local"
-
-export type MentionRange = {
-  start: number
-  end: number
-}
-
-export interface PromptFormState {
-  promptInput: string
-  isDragOver: boolean
-  mentionOpen: boolean
-  mentionQuery: string
-  mentionRange: MentionRange | undefined
-  mentionIndex: number
-  mentionAnchorOffset: { x: number; y: number }
-  inlineAliases: Map<string, PromptAttachmentPart>
-}
-
-interface MentionControllerOptions {
-  state: PromptFormState
-  setState: SetStoreFunction<PromptFormState>
-  attachmentSegments: Accessor<PromptAttachmentSegment[]>
-  getInputRef: () => HTMLTextAreaElement | undefined
-  getOverlayRef: () => HTMLDivElement | undefined
-  getMeasureRef: () => HTMLDivElement | undefined
-  searchFiles: (query: string) => Promise<string[]>
-  resolveFile: (path: string) => LocalFile | undefined
-  addContextFile: (path: string, selection?: TextSelection) => void
-  getActiveContext: () => { path: string; selection?: TextSelection } | undefined
-}
-
-interface MentionKeyDownOptions {
-  event: KeyboardEvent & { currentTarget: HTMLTextAreaElement }
-  mentionItems: () => string[]
-  insertMention: (path: string) => void
-}
-
-interface ScrollSyncOptions {
-  state: PromptFormState
-  getInputRef: () => HTMLTextAreaElement | undefined
-  getOverlayRef: () => HTMLDivElement | undefined
-  interim: Accessor<string>
-  updateMentionPosition: (element: HTMLTextAreaElement, range?: MentionRange) => void
-}
-
-export function usePromptSpeech(updatePromptInput: (updater: (prev: string) => string) => void) {
-  return createSpeechRecognition({
-    onFinal: (text) => updatePromptInput((prev) => (prev && !prev.endsWith(" ") ? `${prev} ` : prev) + text),
-  })
-}
-
-export function useMentionController(options: MentionControllerOptions) {
-  const mentionSource = createMemo(() => (options.state.mentionOpen ? options.state.mentionQuery : undefined))
-  const [mentionResults, { mutate: mutateMentionResults }] = createResource(mentionSource, (query) => {
-    if (!options.state.mentionOpen) return []
-    return options.searchFiles(query ?? "")
-  })
-  const mentionItems = createMemo(() => mentionResults() ?? [])
-
-  createEffect(() => {
-    if (!options.state.mentionOpen) return
-    options.state.mentionQuery
-    options.setState("mentionIndex", 0)
-  })
-
-  createEffect(() => {
-    if (!options.state.mentionOpen) return
-    queueMicrotask(() => {
-      const input = options.getInputRef()
-      if (!input) return
-      if (document.activeElement === input) return
-      input.focus()
-    })
-  })
-
-  createEffect(() => {
-    const used = new Set<string>()
-    for (const match of options.state.promptInput.matchAll(mentionPattern)) {
-      const token = match[1]
-      if (token) used.add(token.toLowerCase())
-    }
-    options.setState("inlineAliases", (prev) => {
-      if (prev.size === 0) return prev
-      const next = new Map(prev)
-      let changed = false
-      for (const key of prev.keys()) {
-        if (!used.has(key.toLowerCase())) {
-          next.delete(key)
-          changed = true
-        }
-      }
-      return changed ? next : prev
-    })
-  })
-
-  createEffect(() => {
-    if (!options.state.mentionOpen) return
-    const items = mentionItems()
-    if (items.length === 0) {
-      options.setState("mentionIndex", 0)
-      return
-    }
-    if (options.state.mentionIndex < items.length) return
-    options.setState("mentionIndex", items.length - 1)
-  })
-
-  createEffect(() => {
-    if (!options.state.mentionOpen) return
-    const rangeValue = options.state.mentionRange
-    if (!rangeValue) return
-    options.state.promptInput
-    queueMicrotask(() => {
-      const input = options.getInputRef()
-      if (!input) return
-      updateMentionPosition(input, rangeValue)
-    })
-  })
-
-  function closeMention() {
-    if (options.state.mentionOpen) options.setState("mentionOpen", false)
-    options.setState("mentionQuery", "")
-    options.setState("mentionRange", undefined)
-    options.setState("mentionIndex", 0)
-    mutateMentionResults(() => undefined)
-    options.setState("mentionAnchorOffset", { x: 0, y: 0 })
-  }
-
-  function updateMentionPosition(element: HTMLTextAreaElement, rangeValue = options.state.mentionRange) {
-    const measure = options.getMeasureRef()
-    if (!measure) return
-    if (!rangeValue) return
-    measure.style.width = `${element.clientWidth}px`
-    const measurement = element.value.slice(0, rangeValue.end)
-    measure.textContent = measurement
-    const caretSpan = document.createElement("span")
-    caretSpan.textContent = "\u200b"
-    measure.append(caretSpan)
-    const caretRect = caretSpan.getBoundingClientRect()
-    const containerRect = measure.getBoundingClientRect()
-    measure.removeChild(caretSpan)
-    const left = caretRect.left - containerRect.left
-    const top = caretRect.top - containerRect.top - element.scrollTop
-    options.setState("mentionAnchorOffset", { x: left, y: top < 0 ? 0 : top })
-  }
-
-  function isValidMentionQuery(value: string) {
-    return /^[A-Za-z0-9_\-./]*$/.test(value)
-  }
-
-  function syncMentionFromCaret(element: HTMLTextAreaElement) {
-    if (!options.state.mentionOpen) return
-    const rangeValue = options.state.mentionRange
-    if (!rangeValue) {
-      closeMention()
-      return
-    }
-    const caret = element.selectionEnd ?? element.selectionStart ?? element.value.length
-    if (rangeValue.start < 0 || rangeValue.start >= element.value.length) {
-      closeMention()
-      return
-    }
-    if (element.value[rangeValue.start] !== "@") {
-      closeMention()
-      return
-    }
-    if (caret <= rangeValue.start) {
-      closeMention()
-      return
-    }
-    const mentionValue = element.value.slice(rangeValue.start + 1, caret)
-    if (!isValidMentionQuery(mentionValue)) {
-      closeMention()
-      return
-    }
-    options.setState("mentionRange", { start: rangeValue.start, end: caret })
-    options.setState("mentionQuery", mentionValue)
-    updateMentionPosition(element, { start: rangeValue.start, end: caret })
-  }
-
-  function tryOpenMentionFromCaret(element: HTMLTextAreaElement) {
-    const selectionStart = element.selectionStart ?? element.value.length
-    const selectionEnd = element.selectionEnd ?? selectionStart
-    if (selectionStart !== selectionEnd) return false
-    const caret = selectionEnd
-    if (options.attachmentSegments().some((segment) => caret >= segment.start && caret <= segment.end)) {
-      return false
-    }
-    const before = element.value.slice(0, caret)
-    const match = before.match(mentionTriggerPattern)
-    if (!match) return false
-    const token = match[2] ?? ""
-    const start = caret - token.length - 1
-    if (start < 0) return false
-    options.setState("mentionOpen", true)
-    options.setState("mentionRange", { start, end: caret })
-    options.setState("mentionQuery", token)
-    options.setState("mentionIndex", 0)
-    queueMicrotask(() => {
-      updateMentionPosition(element, { start, end: caret })
-    })
-    return true
-  }
-
-  function handlePromptInput(event: InputEvent & { currentTarget: HTMLTextAreaElement }) {
-    const element = event.currentTarget
-    options.setState("promptInput", element.value)
-    if (options.state.mentionOpen) {
-      syncMentionFromCaret(element)
-      if (options.state.mentionOpen) return
-    }
-    const isDeletion = event.inputType ? event.inputType.startsWith("delete") : false
-    if (!isDeletion && tryOpenMentionFromCaret(element)) return
-    closeMention()
-  }
-
-  function handleMentionKeyDown({ event, mentionItems: items, insertMention }: MentionKeyDownOptions) {
-    if (!options.state.mentionOpen) return false
-    const list = items()
-    if (event.key === "ArrowDown") {
-      event.preventDefault()
-      if (list.length === 0) return true
-      const next = options.state.mentionIndex + 1 >= list.length ? 0 : options.state.mentionIndex + 1
-      options.setState("mentionIndex", next)
-      return true
-    }
-    if (event.key === "ArrowUp") {
-      event.preventDefault()
-      if (list.length === 0) return true
-      const previous = options.state.mentionIndex - 1 < 0 ? list.length - 1 : options.state.mentionIndex - 1
-      options.setState("mentionIndex", previous)
-      return true
-    }
-    if (event.key === "Enter") {
-      event.preventDefault()
-      const targetItem = list[options.state.mentionIndex] ?? list[0]
-      if (targetItem) insertMention(targetItem)
-      return true
-    }
-    if (event.key === "Escape") {
-      event.preventDefault()
-      closeMention()
-      return true
-    }
-    return false
-  }
-
-  function generateMentionAlias(path: string) {
-    const existing = new Set<string>()
-    for (const key of options.state.inlineAliases.keys()) {
-      existing.add(key.toLowerCase())
-    }
-    for (const match of options.state.promptInput.matchAll(mentionPattern)) {
-      const token = match[1]
-      if (token) existing.add(token.toLowerCase())
-    }
-
-    const base = getFilename(path)
-    if (base) {
-      if (!existing.has(base.toLowerCase())) return base
-    }
-
-    const directory = getDirectory(path)
-    if (base && directory) {
-      const segments = directory.split("/").filter(Boolean)
-      for (let i = segments.length - 1; i >= 0; i -= 1) {
-        const candidate = `${segments.slice(i).join("/")}/${base}`
-        if (!existing.has(candidate.toLowerCase())) return candidate
-      }
-    }
-
-    if (!existing.has(path.toLowerCase())) return path
-
-    const fallback = base || path || "file"
-    let index = 2
-    let candidate = `${fallback}-${index}`
-    while (existing.has(candidate.toLowerCase())) {
-      index += 1
-      candidate = `${fallback}-${index}`
-    }
-    return candidate
-  }
-
-  function insertMention(path: string) {
-    const input = options.getInputRef()
-    if (!input) return
-    const rangeValue = options.state.mentionRange
-    if (!rangeValue) return
-    const node = options.resolveFile(path)
-    const alias = generateMentionAlias(path)
-    const mentionText = `@${alias}`
-    const value = options.state.promptInput
-    const before = value.slice(0, rangeValue.start)
-    const after = value.slice(rangeValue.end)
-    const needsLeadingSpace = before.length > 0 && !/\s$/.test(before)
-    const needsTrailingSpace = after.length > 0 && !/^\s/.test(after)
-    const leading = needsLeadingSpace ? `${before} ` : before
-    const trailingSpacer = needsTrailingSpace ? " " : ""
-    const nextValue = `${leading}${mentionText}${trailingSpacer}${after}`
-    const origin = options.getActiveContext()?.path === path ? "active" : "context"
-    const part: PromptAttachmentPart = {
-      kind: "attachment",
-      token: alias,
-      display: createAttachmentDisplay(path, node?.selection),
-      path,
-      selection: node?.selection,
-      origin,
-    }
-    options.setState("promptInput", nextValue)
-    if (input.value !== nextValue) {
-      input.value = nextValue
-    }
-    options.setState("inlineAliases", (prev) => {
-      const next = new Map(prev)
-      next.set(alias, part)
-      return next
-    })
-    options.addContextFile(path, node?.selection)
-    closeMention()
-    queueMicrotask(() => {
-      const caret = leading.length + mentionText.length + trailingSpacer.length
-      input.setSelectionRange(caret, caret)
-      syncMentionFromCaret(input)
-    })
-  }
-
-  return {
-    mentionResults,
-    mentionItems,
-    closeMention,
-    syncMentionFromCaret,
-    tryOpenMentionFromCaret,
-    updateMentionPosition,
-    handlePromptInput,
-    handleMentionKeyDown,
-    insertMention,
-  }
-}
-
-export function usePromptScrollSync(options: ScrollSyncOptions) {
-  let shouldAutoScroll = true
-
-  createEffect(() => {
-    options.state.promptInput
-    options.interim()
-    queueMicrotask(() => {
-      const input = options.getInputRef()
-      const overlay = options.getOverlayRef()
-      if (!input || !overlay) return
-      if (!shouldAutoScroll) {
-        overlay.scrollTop = input.scrollTop
-        if (options.state.mentionOpen) options.updateMentionPosition(input)
-        return
-      }
-      const maxInputScroll = input.scrollHeight - input.clientHeight
-      const next = maxInputScroll > 0 ? maxInputScroll : 0
-      input.scrollTop = next
-      overlay.scrollTop = next
-      if (options.state.mentionOpen) options.updateMentionPosition(input)
-    })
-  })
-
-  function handlePromptScroll(event: Event & { currentTarget: HTMLTextAreaElement }) {
-    const target = event.currentTarget
-    shouldAutoScroll = target.scrollTop + target.clientHeight >= target.scrollHeight - 4
-    const overlay = options.getOverlayRef()
-    if (overlay) overlay.scrollTop = target.scrollTop
-    if (options.state.mentionOpen) options.updateMentionPosition(target)
-  }
-
-  function resetScrollPosition() {
-    shouldAutoScroll = true
-    const input = options.getInputRef()
-    const overlay = options.getOverlayRef()
-    if (input) input.scrollTop = 0
-    if (overlay) overlay.scrollTop = 0
-  }
-
-  return {
-    handlePromptScroll,
-    resetScrollPosition,
-    setAutoScroll: (value: boolean) => {
-      shouldAutoScroll = value
-    },
-  }
-}

packages/desktop/src/components/prompt-form.tsx

@@ -1,581 +0,0 @@
-import { For, Show, createMemo, onCleanup, type JSX } from "solid-js"
-import { createStore } from "solid-js/store"
-import { Popover } from "@kobalte/core/popover"
-import { Tooltip, Button, Icon, Select } from "@opencode-ai/ui"
-import { FileIcon, IconButton } from "@/ui"
-import { useLocal } from "@/context"
-import type { FileContext, LocalFile } from "@/context/local"
-import { getDirectory, getFilename } from "@/utils"
-import { composeDisplaySegments, createAttachmentDisplay, parsePrompt, registerCandidate } from "./prompt-form-helpers"
-import type {
-  AttachmentCandidate,
-  PromptAttachmentPart,
-  PromptAttachmentSegment,
-  PromptDisplaySegment,
-  PromptSubmitValue,
-} from "./prompt-form-helpers"
-import { useMentionController, usePromptScrollSync, usePromptSpeech, type PromptFormState } from "./prompt-form-hooks"
-
-interface PromptFormProps {
-  class?: string
-  classList?: Record<string, boolean>
-  onSubmit: (prompt: PromptSubmitValue) => Promise<void> | void
-  onOpenModelSelect: () => void
-  onInputRefChange?: (element: HTMLTextAreaElement | undefined) => void
-}
-
-export default function PromptForm(props: PromptFormProps) {
-  const local = useLocal()
-
-  const [state, setState] = createStore<PromptFormState>({
-    promptInput: "",
-    isDragOver: false,
-    mentionOpen: false,
-    mentionQuery: "",
-    mentionRange: undefined,
-    mentionIndex: 0,
-    mentionAnchorOffset: { x: 0, y: 0 },
-    inlineAliases: new Map<string, PromptAttachmentPart>(),
-  })
-
-  const placeholderText = "Start typing or speaking..."
-
-  const {
-    isSupported,
-    isRecording,
-    interim: interimTranscript,
-    start: startSpeech,
-    stop: stopSpeech,
-  } = usePromptSpeech((updater) => setState("promptInput", updater))
-
-  let inputRef: HTMLTextAreaElement | undefined = undefined
-  let overlayContainerRef: HTMLDivElement | undefined = undefined
-  let mentionMeasureRef: HTMLDivElement | undefined = undefined
-
-  const attachmentLookup = createMemo(() => {
-    const map = new Map<string, AttachmentCandidate>()
-    const activeFile = local.context.active()
-    if (activeFile) {
-      registerCandidate(
-        map,
-        {
-          origin: "active",
-          path: activeFile.path,
-          selection: activeFile.selection,
-          display: createAttachmentDisplay(activeFile.path, activeFile.selection),
-        },
-        [activeFile.path, getFilename(activeFile.path)],
-      )
-    }
-    for (const item of local.context.all()) {
-      registerCandidate(
-        map,
-        {
-          origin: "context",
-          path: item.path,
-          selection: item.selection,
-          display: createAttachmentDisplay(item.path, item.selection),
-        },
-        [item.path, getFilename(item.path)],
-      )
-    }
-    for (const [alias, part] of state.inlineAliases) {
-      registerCandidate(
-        map,
-        {
-          origin: part.origin,
-          path: part.path,
-          selection: part.selection,
-          display: part.display ?? createAttachmentDisplay(part.path, part.selection),
-        },
-        [alias],
-      )
-    }
-    return map
-  })
-
-  const parsedPrompt = createMemo(() => parsePrompt(state.promptInput, attachmentLookup()))
-  const baseParts = createMemo(() => parsedPrompt().parts)
-  const attachmentSegments = createMemo<PromptAttachmentSegment[]>(() =>
-    parsedPrompt().segments.filter((segment): segment is PromptAttachmentSegment => segment.kind === "attachment"),
-  )
-
-  const {
-    mentionResults,
-    mentionItems,
-    closeMention,
-    syncMentionFromCaret,
-    updateMentionPosition,
-    handlePromptInput,
-    handleMentionKeyDown,
-    insertMention,
-  } = useMentionController({
-    state,
-    setState,
-    attachmentSegments,
-    getInputRef: () => inputRef,
-    getOverlayRef: () => overlayContainerRef,
-    getMeasureRef: () => mentionMeasureRef,
-    searchFiles: (query) => local.file.search(query),
-    resolveFile: (path) => local.file.node(path) ?? undefined,
-    addContextFile: (path, selection) =>
-      local.context.add({
-        type: "file",
-        path,
-        selection,
-      }),
-    getActiveContext: () => local.context.active() ?? undefined,
-  })
-
-  const { handlePromptScroll, resetScrollPosition } = usePromptScrollSync({
-    state,
-    getInputRef: () => inputRef,
-    getOverlayRef: () => overlayContainerRef,
-    interim: () => (isRecording() ? interimTranscript() : ""),
-    updateMentionPosition,
-  })
-
-  const displaySegments = createMemo<PromptDisplaySegment[]>(() => {
-    const value = state.promptInput
-    const segments = parsedPrompt().segments
-    const interim = isRecording() ? interimTranscript() : ""
-    return composeDisplaySegments(segments, value, interim)
-  })
-
-  const hasDisplaySegments = createMemo(() => displaySegments().length > 0)
-
-  function handleAttachmentNavigation(
-    event: KeyboardEvent & { currentTarget: HTMLTextAreaElement },
-    direction: "left" | "right",
-  ) {
-    const element = event.currentTarget
-    const caret = element.selectionStart ?? 0
-    const segments = attachmentSegments()
-    if (direction === "left") {
-      let match = segments.find((segment) => caret > segment.start && caret <= segment.end)
-      if (!match && element.selectionStart !== element.selectionEnd) {
-        match = segments.find(
-          (segment) => element.selectionStart === segment.start && element.selectionEnd === segment.end,
-        )
-      }
-      if (!match) return false
-      event.preventDefault()
-      if (element.selectionStart === match.start && element.selectionEnd === match.end) {
-        const next = Math.max(0, match.start)
-        element.setSelectionRange(next, next)
-        syncMentionFromCaret(element)
-        return true
-      }
-      element.setSelectionRange(match.start, match.end)
-      syncMentionFromCaret(element)
-      return true
-    }
-    if (direction === "right") {
-      let match = segments.find((segment) => caret >= segment.start && caret < segment.end)
-      if (!match && element.selectionStart !== element.selectionEnd) {
-        match = segments.find(
-          (segment) => element.selectionStart === segment.start && element.selectionEnd === segment.end,
-        )
-      }
-      if (!match) return false
-      event.preventDefault()
-      if (element.selectionStart === match.start && element.selectionEnd === match.end) {
-        const next = match.end
-        element.setSelectionRange(next, next)
-        syncMentionFromCaret(element)
-        return true
-      }
-      element.setSelectionRange(match.start, match.end)
-      syncMentionFromCaret(element)
-      return true
-    }
-    return false
-  }
-
-  function renderAttachmentChip(part: PromptAttachmentPart, _placeholder: string) {
-    const display = part.display ?? createAttachmentDisplay(part.path, part.selection)
-    return <span class="truncate max-w-[16ch] text-primary">@{display}</span>
-  }
-
-  function renderTextSegment(value: string) {
-    if (!value) return undefined
-    return <span class="text-text">{value}</span>
-  }
-
-  function handlePromptKeyDown(event: KeyboardEvent & { currentTarget: HTMLTextAreaElement }) {
-    if (event.isComposing) return
-    const target = event.currentTarget
-    const key = event.key
-
-    const handled = handleMentionKeyDown({
-      event,
-      mentionItems,
-      insertMention,
-    })
-    if (handled) return
-
-    if (!state.mentionOpen) {
-      if (key === "ArrowLeft") {
-        if (handleAttachmentNavigation(event, "left")) return
-      }
-      if (key === "ArrowRight") {
-        if (handleAttachmentNavigation(event, "right")) return
-      }
-    }
-
-    if (key === "ArrowLeft" || key === "ArrowRight" || key === "Home" || key === "End") {
-      queueMicrotask(() => {
-        syncMentionFromCaret(target)
-      })
-    }
-
-    if (key === "Enter" && !event.shiftKey) {
-      event.preventDefault()
-      target.form?.requestSubmit()
-    }
-  }
-
-  const handleSubmit = async (event: SubmitEvent) => {
-    event.preventDefault()
-    const parts = baseParts()
-    const text = parts
-      .map((part) => {
-        if (part.kind === "text") return part.value
-        return `@${part.path}`
-      })
-      .join("")
-
-    const currentPrompt: PromptSubmitValue = {
-      text,
-      parts,
-    }
-    setState("promptInput", "")
-    resetScrollPosition()
-    if (inputRef) {
-      inputRef.blur()
-    }
-
-    await props.onSubmit(currentPrompt)
-  }
-
-  onCleanup(() => {
-    props.onInputRefChange?.(undefined)
-  })
-
-  return (
-    <form onSubmit={handleSubmit} class={props.class} classList={props.classList}>
-      <div
-        class="w-full min-w-0 p-2 mx-auto rounded-lg isolate backdrop-blur-xs
-               flex flex-col gap-1 bg-gradient-to-b from-background-panel/90 to-background/90
-               ring-1 ring-border-active/50 border border-transparent
-               focus-within:ring-2 focus-within:ring-primary/40 focus-within:border-primary
-               transition-all duration-200"
-        classList={{
-          "shadow-[0_0_33px_rgba(0,0,0,0.8)]": !!local.file.active(),
-          "ring-2 ring-primary/60 bg-primary/5": state.isDragOver,
-        }}
-        onDragEnter={(event) => {
-          const evt = event as unknown as globalThis.DragEvent
-          if (evt.dataTransfer?.types.includes("text/plain")) {
-            evt.preventDefault()
-            setState("isDragOver", true)
-          }
-        }}
-        onDragLeave={(event) => {
-          if (event.currentTarget === event.target) {
-            setState("isDragOver", false)
-          }
-        }}
-        onDragOver={(event) => {
-          const evt = event as unknown as globalThis.DragEvent
-          if (evt.dataTransfer?.types.includes("text/plain")) {
-            evt.preventDefault()
-            evt.dataTransfer.dropEffect = "copy"
-          }
-        }}
-        onDrop={(event) => {
-          const evt = event as unknown as globalThis.DragEvent
-          evt.preventDefault()
-          setState("isDragOver", false)
-
-          const data = evt.dataTransfer?.getData("text/plain")
-          if (data && data.startsWith("file:")) {
-            const filePath = data.slice(5)
-            const fileNode = local.file.node(filePath)
-            if (fileNode) {
-              local.context.add({
-                type: "file",
-                path: filePath,
-              })
-            }
-          }
-        }}
-      >
-        <Show when={local.context.all().length > 0 || local.context.active()}>
-          <div class="flex flex-wrap gap-1">
-            <Show when={local.context.active()}>
-              <ActiveTabContextTag file={local.context.active()!} onClose={() => local.context.removeActive()} />
-            </Show>
-            <For each={local.context.all()}>
-              {(file) => <FileTag file={file} onClose={() => local.context.remove(file.key)} />}
-            </For>
-          </div>
-        </Show>
-        <div class="relative">
-          <textarea
-            ref={(element) => {
-              inputRef = element ?? undefined
-              props.onInputRefChange?.(inputRef)
-            }}
-            value={state.promptInput}
-            onInput={handlePromptInput}
-            onKeyDown={handlePromptKeyDown}
-            onClick={(event) =>
-              queueMicrotask(() => {
-                syncMentionFromCaret(event.currentTarget)
-              })
-            }
-            onSelect={(event) =>
-              queueMicrotask(() => {
-                syncMentionFromCaret(event.currentTarget)
-              })
-            }
-            onBlur={(event) => {
-              const next = event.relatedTarget as HTMLElement | null
-              if (next && next.closest('[data-mention-popover="true"]')) return
-              closeMention()
-            }}
-            onScroll={handlePromptScroll}
-            placeholder={placeholderText}
-            autocapitalize="off"
-            autocomplete="off"
-            autocorrect="off"
-            spellcheck={false}
-            class="relative w-full h-20 rounded-md px-0.5 resize-none overflow-y-auto
-                   bg-transparent text-transparent caret-text font-light text-base
-                   leading-relaxed focus:outline-none selection:bg-primary/20"
-          ></textarea>
-          <div
-            ref={(element) => {
-              overlayContainerRef = element ?? undefined
-            }}
-            class="pointer-events-none absolute inset-0 overflow-hidden"
-          >
-            <PromptDisplayOverlay
-              hasDisplaySegments={hasDisplaySegments()}
-              displaySegments={displaySegments()}
-              placeholder={placeholderText}
-              renderAttachmentChip={renderAttachmentChip}
-              renderTextSegment={renderTextSegment}
-            />
-          </div>
-          <div
-            ref={(element) => {
-              mentionMeasureRef = element ?? undefined
-            }}
-            class="pointer-events-none invisible absolute inset-0 whitespace-pre-wrap text-base font-light leading-relaxed px-0.5"
-            aria-hidden="true"
-          ></div>
-          <MentionSuggestions
-            open={state.mentionOpen}
-            anchor={state.mentionAnchorOffset}
-            loading={mentionResults.loading}
-            items={mentionItems()}
-            activeIndex={state.mentionIndex}
-            onHover={(index) => setState("mentionIndex", index)}
-            onSelect={insertMention}
-          />
-        </div>
-        <div class="flex justify-between items-center text-xs text-text-muted">
-          <div class="flex gap-2 items-center">
-            <Select
-              options={local.agent.list().map((agent) => agent.name)}
-              current={local.agent.current().name}
-              onSelect={local.agent.set}
-              class="uppercase"
-            />
-            <Button onClick={() => props.onOpenModelSelect()}>
-              {local.model.current()?.name ?? "Select model"}
-              <Icon name="chevron-down" size={24} class="text-text-muted" />
-            </Button>
-            <span class="text-text-muted/70 whitespace-nowrap">{local.model.current()?.provider.name}</span>
-          </div>
-          <div class="flex gap-1 items-center">
-            <Show when={isSupported()}>
-              <Tooltip value={isRecording() ? "Stop voice input" : "Start voice input"} placement="top">
-                <IconButton
-                  onClick={async (event: MouseEvent) => {
-                    event.preventDefault()
-                    if (isRecording()) {
-                      stopSpeech()
-                    } else {
-                      startSpeech()
-                    }
-                    inputRef?.focus()
-                  }}
-                  classList={{
-                    "text-text-muted": !isRecording(),
-                    "text-error! animate-pulse": isRecording(),
-                  }}
-                  size="xs"
-                  variant="ghost"
-                >
-                  <Icon name="mic" size={16} />
-                </IconButton>
-              </Tooltip>
-            </Show>
-            <IconButton class="text-text-muted" size="xs" variant="ghost">
-              <Icon name="photo" size={16} />
-            </IconButton>
-            <IconButton
-              class="text-background-panel! bg-primary rounded-full! hover:bg-primary/90 ml-0.5"
-              size="xs"
-              variant="ghost"
-              type="submit"
-            >
-              <Icon name="arrow-up" size={14} />
-            </IconButton>
-          </div>
-        </div>
-      </div>
-    </form>
-  )
-}
-
-const ActiveTabContextTag = (props: { file: LocalFile; onClose: () => void }) => (
-  <div
-    class="flex items-center bg-background group/tag
-           border border-border-subtle/60 border-dashed
-           rounded-md text-xs text-text-muted"
-  >
-    <IconButton class="text-text-muted" size="xs" variant="ghost" onClick={props.onClose}>
-      <Icon name="file" class="group-hover/tag:hidden" size={12} />
-      <Icon name="close" class="hidden group-hover/tag:block" size={12} />
-    </IconButton>
-    <div class="pr-1 flex gap-1 items-center">
-      <span>{getFilename(props.file.path)}</span>
-    </div>
-  </div>
-)
-
-const FileTag = (props: { file: FileContext; onClose: () => void }) => (
-  <div
-    class="flex items-center bg-background group/tag
-           border border-border-subtle/60
-           rounded-md text-xs text-text-muted"
-  >
-    <IconButton class="text-text-muted" size="xs" variant="ghost" onClick={props.onClose}>
-      <FileIcon node={props.file} class="group-hover/tag:hidden size-3!" />
-      <Icon name="close" class="hidden group-hover/tag:block" size={12} />
-    </IconButton>
-    <div class="pr-1 flex gap-1 items-center">
-      <span>{getFilename(props.file.path)}</span>
-      <Show when={props.file.selection}>
-        <span>
-          ({props.file.selection!.startLine}-{props.file.selection!.endLine})
-        </span>
-      </Show>
-    </div>
-  </div>
-)
-
-function PromptDisplayOverlay(props: {
-  hasDisplaySegments: boolean
-  displaySegments: PromptDisplaySegment[]
-  placeholder: string
-  renderAttachmentChip: (part: PromptAttachmentPart, placeholder: string) => JSX.Element
-  renderTextSegment: (value: string) => JSX.Element | undefined
-}) {
-  return (
-    <div class="px-0.5 text-base font-light leading-relaxed whitespace-pre-wrap text-left">
-      <Show when={props.hasDisplaySegments} fallback={<span class="text-text-muted/70">{props.placeholder}</span>}>
-        <For each={props.displaySegments}>
-          {(segment) => {
-            if (segment.kind === "text") {
-              return props.renderTextSegment(segment.value)
-            }
-            if (segment.kind === "attachment") {
-              return props.renderAttachmentChip(segment.part, segment.source)
-            }
-            return (
-              <span class="text-text-muted/60 italic">
-                {segment.leadingSpace ? ` ${segment.value}` : segment.value}
-              </span>
-            )
-          }}
-        </For>
-      </Show>
-    </div>
-  )
-}
-
-function MentionSuggestions(props: {
-  open: boolean
-  anchor: { x: number; y: number }
-  loading: boolean
-  items: string[]
-  activeIndex: number
-  onHover: (index: number) => void
-  onSelect: (path: string) => void
-}) {
-  return (
-    <Popover open={props.open} modal={false} gutter={8} placement="bottom-start">
-      <Popover.Trigger class="hidden" />
-      <Popover.Anchor
-        class="pointer-events-none absolute top-0 left-0 w-0 h-0"
-        style={{ transform: `translate(${props.anchor.x}px, ${props.anchor.y}px)` }}
-      />
-      <Popover.Portal>
-        <Popover.Content
-          data-mention-popover="true"
-          class="z-50 w-72 max-h-60 overflow-y-auto rounded-md border border-border-subtle/40 bg-background-panel shadow-[0_10px_30px_rgba(0,0,0,0.35)] focus:outline-none"
-        >
-          <div class="py-1">
-            <Show when={props.loading}>
-              <div class="flex items-center gap-2 px-3 py-2 text-xs text-text-muted">
-                <Icon name="refresh" size={12} class="animate-spin" />
-                <span>Searching…</span>
-              </div>
-            </Show>
-            <Show when={!props.loading && props.items.length === 0}>
-              <div class="px-3 py-2 text-xs text-text-muted/80">No matching files</div>
-            </Show>
-            <For each={props.items}>
-              {(path, indexAccessor) => {
-                const index = indexAccessor()
-                const dir = getDirectory(path)
-                return (
-                  <button
-                    type="button"
-                    onMouseDown={(event) => event.preventDefault()}
-                    onMouseEnter={() => props.onHover(index)}
-                    onClick={() => props.onSelect(path)}
-                    class="w-full px-3 py-2 flex items-center gap-2 rounded-md text-left text-xs transition-colors"
-                    classList={{
-                      "bg-background-element text-text": index === props.activeIndex,
-                      "text-text-muted": index !== props.activeIndex,
-                    }}
-                  >
-                    <FileIcon node={{ path, type: "file" }} class="size-3 shrink-0" />
-                    <div class="flex flex-col min-w-0">
-                      <span class="truncate">{getFilename(path)}</span>
-                      {dir && <span class="truncate text-text-muted/70">{dir}</span>}
-                    </div>
-                  </button>
-                )
-              }}
-            </For>
-          </div>
-        </Popover.Content>
-      </Popover.Portal>
-    </Popover>
-  )
-}
-
-export type {
-  PromptAttachmentPart,
-  PromptAttachmentSegment,
-  PromptContentPart,
-  PromptDisplaySegment,
-  PromptSubmitValue,
-} from "./prompt-form-helpers"

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

@@ -1,63 +1,88 @@
-import { createEffect, on, Component, createMemo, Show } from "solid-js"
+import { Button, Icon, IconButton, Select, SelectDialog } from "@opencode-ai/ui"
+import { useFilteredList } from "@opencode-ai/ui/hooks"
+import { createEffect, on, Component, createMemo, Show, For, onMount, onCleanup } from "solid-js"
 import { createStore } from "solid-js/store"
+import { FileIcon } from "@/ui"
+import { getDirectory, getFilename } from "@/utils"
+import { createFocusSignal } from "@solid-primitives/active-element"
+import { TextSelection, useLocal } from "@/context/local"
+import { DateTime } from "luxon"
 
-interface TextPart {
-  type: "text"
+interface PartBase {
   content: string
 }
 
-interface AttachmentPart {
-  type: "attachment"
-  fileId: string
-  name: string
+interface TextPart extends PartBase {
+  type: "text"
 }
 
-export type ContentPart = TextPart | AttachmentPart
-
-export interface AttachmentToAdd {
-  id: string
-  name: string
+interface FileAttachmentPart extends PartBase {
+  type: "file"
+  path: string
+  selection?: TextSelection
 }
 
-type AddAttachmentCallback = (attachment: AttachmentToAdd) => void
-
-export interface PopoverState {
-  isOpen: boolean
-  searchQuery: string
-  addAttachment: AddAttachmentCallback
-}
+export type ContentPart = TextPart | FileAttachmentPart
 
 interface PromptInputProps {
   onSubmit: (parts: ContentPart[]) => void
-  onShowAttachments?: (state: PopoverState | null) => void
   class?: string
+  ref?: (el: HTMLDivElement) => void
 }
 
 export const PromptInput: Component<PromptInputProps> = (props) => {
-  let editorRef: HTMLDivElement | undefined
+  const local = useLocal()
+  let editorRef!: HTMLDivElement
 
   const defaultParts = [{ type: "text", content: "" } as const]
   const [store, setStore] = createStore<{
     contentParts: ContentPart[]
-    popover: {
-      isOpen: boolean
-      searchQuery: string
-    }
+    popoverIsOpen: boolean
   }>({
     contentParts: defaultParts,
-    popover: {
-      isOpen: false,
-      searchQuery: "",
-    },
+    popoverIsOpen: false,
   })
 
   const isEmpty = createMemo(() => isEqual(store.contentParts, defaultParts))
+  const isFocused = createFocusSignal(() => editorRef)
+
+  const handlePaste = (event: ClipboardEvent) => {
+    event.preventDefault()
+    event.stopPropagation()
+    // @ts-expect-error
+    const plainText = (event.clipboardData || window.clipboardData)?.getData("text/plain") ?? ""
+    addPart({ type: "text", content: plainText })
+  }
+
+  onMount(() => {
+    editorRef.addEventListener("paste", handlePaste)
+  })
+  onCleanup(() => {
+    editorRef.removeEventListener("paste", handlePaste)
+  })
+
+  createEffect(() => {
+    if (isFocused()) {
+      handleInput()
+    } else {
+      setStore("popoverIsOpen", false)
+    }
+  })
+
+  const { flat, active, onInput, onKeyDown } = useFilteredList<string>({
+    items: local.file.search,
+    key: (x) => x,
+    onSelect: (path) => {
+      if (!path) return
+      addPart({ type: "file", path, content: "@" + getFilename(path) })
+      setStore("popoverIsOpen", false)
+    },
+  })
 
   createEffect(
     on(
       () => store.contentParts,
       (currentParts) => {
-        if (!editorRef) return
         const domParts = parseFromDOM()
         if (isEqual(currentParts, domParts)) return
 
@@ -70,14 +95,16 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
         editorRef.innerHTML = ""
         currentParts.forEach((part) => {
           if (part.type === "text") {
-            editorRef!.appendChild(document.createTextNode(part.content))
-          } else if (part.type === "attachment") {
+            editorRef.appendChild(document.createTextNode(part.content))
+          } else if (part.type === "file") {
             const pill = document.createElement("span")
-            pill.textContent = `@${part.name}`
-            pill.className = "attachment-pill"
-            pill.setAttribute("data-file-id", part.fileId)
+            pill.textContent = part.content
+            pill.setAttribute("data-type", "file")
+            pill.setAttribute("data-path", part.path)
             pill.setAttribute("contenteditable", "false")
-            editorRef!.appendChild(pill)
+            pill.style.userSelect = "text"
+            pill.style.cursor = "default"
+            editorRef.appendChild(pill)
           }
         })
 
@@ -88,30 +115,23 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     ),
   )
 
-  createEffect(() => {
-    if (store.popover.isOpen) {
-      props.onShowAttachments?.({
-        isOpen: true,
-        searchQuery: store.popover.searchQuery,
-        addAttachment: addAttachment,
-      })
-    } else {
-      props.onShowAttachments?.(null)
-    }
-  })
-
   const parseFromDOM = (): ContentPart[] => {
-    if (!editorRef) return []
     const newParts: ContentPart[] = []
     editorRef.childNodes.forEach((node) => {
       if (node.nodeType === Node.TEXT_NODE) {
         if (node.textContent) newParts.push({ type: "text", content: node.textContent })
-      } else if (node.nodeType === Node.ELEMENT_NODE && (node as HTMLElement).dataset.fileId) {
-        newParts.push({
-          type: "attachment",
-          fileId: (node as HTMLElement).dataset.fileId!,
-          name: node.textContent!.substring(1),
-        })
+      } else if (node.nodeType === Node.ELEMENT_NODE && (node as HTMLElement).dataset.type) {
+        switch ((node as HTMLElement).dataset.type) {
+          case "file":
+            newParts.push({
+              type: "file",
+              path: (node as HTMLElement).dataset.path!,
+              content: node.textContent!,
+            })
+            break
+          default:
+            break
+        }
       }
     })
     if (newParts.length === 0) newParts.push(...defaultParts)
@@ -120,96 +140,249 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
 
   const handleInput = () => {
     const rawParts = parseFromDOM()
-    const cursorPosition = getCursorPosition(editorRef!)
-    const rawText = rawParts.map((p) => (p.type === "text" ? p.content : `@${p.name}`)).join("")
+    const cursorPosition = getCursorPosition(editorRef)
+    const rawText = rawParts.map((p) => p.content).join("")
 
     const atMatch = rawText.substring(0, cursorPosition).match(/@(\S*)$/)
     if (atMatch) {
-      setStore("popover", { isOpen: true, searchQuery: atMatch[1] })
-    } else if (store.popover.isOpen) {
-      setStore("popover", "isOpen", false)
+      onInput(atMatch[1])
+      setStore("popoverIsOpen", true)
+    } else if (store.popoverIsOpen) {
+      setStore("popoverIsOpen", false)
     }
 
     setStore("contentParts", rawParts)
   }
 
-  const addAttachment: AddAttachmentCallback = (attachment) => {
-    const rawText = store.contentParts.map((p) => (p.type === "text" ? p.content : `@${p.name}`)).join("")
-    const cursorPosition = getCursorPosition(editorRef!)
-
+  const addPart = (part: ContentPart) => {
+    const cursorPosition = getCursorPosition(editorRef)
+    const rawText = store.contentParts.map((p) => p.content).join("")
     const textBeforeCursor = rawText.substring(0, cursorPosition)
     const atMatch = textBeforeCursor.match(/@(\S*)$/)
 
-    if (!atMatch) return
+    const startIndex = atMatch ? atMatch.index! : cursorPosition
+    const endIndex = atMatch ? cursorPosition : cursorPosition
 
-    const startIndex = atMatch.index!
+    const pushText = (acc: { parts: ContentPart[] }, value: string) => {
+      if (!value) return
+      const last = acc.parts[acc.parts.length - 1]
+      if (last && last.type === "text") {
+        acc.parts[acc.parts.length - 1] = {
+          type: "text",
+          content: last.content + value,
+        }
+        return
+      }
+      acc.parts.push({ type: "text", content: value })
+    }
 
-    // Create new structured content
-    const newParts: ContentPart[] = []
-    const textBeforeTrigger = rawText.substring(0, startIndex)
-    if (textBeforeTrigger) newParts.push({ type: "text", content: textBeforeTrigger })
+    const {
+      parts: nextParts,
+      inserted,
+      cursorPositionAfter,
+    } = store.contentParts.reduce(
+      (acc, item) => {
+        if (acc.inserted) {
+          acc.parts.push(item)
+          acc.runningIndex += item.content.length
+          return acc
+        }
 
-    newParts.push({ type: "attachment", fileId: attachment.id, name: attachment.name })
+        const nextIndex = acc.runningIndex + item.content.length
+        if (nextIndex <= startIndex) {
+          acc.parts.push(item)
+          acc.runningIndex = nextIndex
+          return acc
+        }
 
-    // Add a space after the pill for better UX
-    newParts.push({ type: "text", content: " " })
+        if (item.type !== "text") {
+          acc.parts.push(item)
+          acc.runningIndex = nextIndex
+          return acc
+        }
 
-    const textAfterCursor = rawText.substring(cursorPosition)
-    if (textAfterCursor) newParts.push({ type: "text", content: textAfterCursor })
+        const headLength = Math.max(0, startIndex - acc.runningIndex)
+        const tailLength = Math.max(0, endIndex - acc.runningIndex)
+        const head = item.content.slice(0, headLength)
+        const tail = item.content.slice(tailLength)
 
-    setStore("contentParts", newParts)
-    setStore("popover", "isOpen", false)
+        pushText(acc, head)
 
-    // Set cursor position after the newly added pill + space
-    // We need to wait for the DOM to update
-    queueMicrotask(() => {
-      setCursorPosition(editorRef!, textBeforeTrigger.length + 1 + attachment.name.length + 1)
-    })
-  }
+        if (part.type === "text") {
+          pushText(acc, part.content)
+        }
+        if (part.type !== "text") {
+          acc.parts.push({ ...part })
+        }
 
-  const handleKeyDown = (event: KeyboardEvent) => {
-    if (store.popover.isOpen && (event.key === "ArrowUp" || event.key === "ArrowDown" || event.key === "Enter")) {
-      // In a real implementation, you'd prevent default and delegate this to the popover
-      console.log("Key press delegated to popover:", event.key)
-      event.preventDefault()
+        const needsGap = Boolean(atMatch)
+        const rest = needsGap ? (tail ? (/^\s/.test(tail) ? tail : ` ${tail}`) : " ") : tail
+        pushText(acc, rest)
+
+        const baseCursor = startIndex + part.content.length
+        const cursorAddition = needsGap && rest.length > 0 ? 1 : 0
+        acc.cursorPositionAfter = baseCursor + cursorAddition
+
+        acc.inserted = true
+        acc.runningIndex = nextIndex
+        return acc
+      },
+      {
+        parts: [] as ContentPart[],
+        runningIndex: 0,
+        inserted: false,
+        cursorPositionAfter: cursorPosition + part.content.length,
+      },
+    )
+
+    if (!inserted) {
+      const baseParts = store.contentParts.filter((item) => !(item.type === "text" && item.content === ""))
+      const appendedAcc = { parts: [...baseParts] as ContentPart[] }
+      if (part.type === "text") pushText(appendedAcc, part.content)
+      if (part.type !== "text") appendedAcc.parts.push({ ...part })
+      const next = appendedAcc.parts.length > 0 ? appendedAcc.parts : defaultParts
+      setStore("contentParts", next)
+      setStore("popoverIsOpen", false)
+      const nextCursor = rawText.length + part.content.length
+      queueMicrotask(() => setCursorPosition(editorRef, nextCursor))
       return
     }
 
-    if (event.key === "Enter" && !event.shiftKey) {
+    setStore("contentParts", nextParts)
+    setStore("popoverIsOpen", false)
+
+    queueMicrotask(() => setCursorPosition(editorRef, cursorPositionAfter))
+  }
+
+  const handleKeyDown = (event: KeyboardEvent) => {
+    if (store.popoverIsOpen && (event.key === "ArrowUp" || event.key === "ArrowDown" || event.key === "Enter")) {
+      onKeyDown(event)
       event.preventDefault()
-      if (store.contentParts.length > 0) {
-        props.onSubmit([...store.contentParts])
-        setStore("contentParts", defaultParts)
-      }
+      return
+    }
+    if (event.key === "Enter" && !event.shiftKey) {
+      handleSubmit(event)
+    }
+  }
+
+  const handleSubmit = (event: Event) => {
+    event.preventDefault()
+    if (store.contentParts.length > 0) {
+      props.onSubmit([...store.contentParts])
+      setStore("contentParts", defaultParts)
     }
   }
 
   return (
-    <div
-      classList={{
-        "size-full max-w-xl bg-surface-raised-stronger-non-alpha border border-border-strong-base": true,
-        "rounded-2xl overflow-clip focus-within:shadow-xs-border-selected": true,
-        [props.class ?? ""]: !!props.class,
-      }}
-    >
-      <div class="p-3" />
-      <div class="relative">
-        <div
-          ref={editorRef}
-          contenteditable="true"
-          onInput={handleInput}
-          onKeyDown={handleKeyDown}
-          classList={{
-            "w-full p-3 text-sm focus:outline-none": true,
-          }}
-        />
-        <Show when={isEmpty()}>
-          <div class="absolute bottom-0 left-0 p-3 text-sm text-text-weak pointer-events-none">
-            Plan and build anything
+    <div class="relative size-full _max-h-[320px] flex flex-col gap-3">
+      <Show when={store.popoverIsOpen}>
+        <div class="absolute inset-x-0 -top-3 -translate-y-full origin-bottom-left max-h-[252px] min-h-10 overflow-y-auto flex flex-col p-2 pb-0 rounded-2xl border border-border-base bg-surface-raised-stronger-non-alpha shadow-md">
+          <For each={flat()}>
+            {(i) => (
+              <div
+                classList={{
+                  "w-full flex items-center justify-between rounded-md": true,
+                  "bg-surface-raised-base-hover": active() === i,
+                }}
+              >
+                <div class="flex items-center gap-x-2 grow min-w-0">
+                  <FileIcon node={{ path: i, type: "file" }} class="shrink-0 size-4" />
+                  <div class="flex items-center text-14-regular">
+                    <span class="text-text-weak whitespace-nowrap overflow-hidden overflow-ellipsis truncate min-w-0">
+                      {getDirectory(i)}/
+                    </span>
+                    <span class="text-text-strong whitespace-nowrap">{getFilename(i)}</span>
+                  </div>
+                </div>
+                <div class="flex items-center gap-x-1 text-text-muted/40 shrink-0"></div>
+              </div>
+            )}
+          </For>
+        </div>
+      </Show>
+      <form
+        onSubmit={handleSubmit}
+        classList={{
+          "bg-surface-raised-stronger-non-alpha border border-border-strong-base": true,
+          "rounded-2xl overflow-clip focus-within:shadow-xs-border-selected": true,
+          [props.class ?? ""]: !!props.class,
+        }}
+      >
+        <div class="relative max-h-[240px] overflow-y-auto">
+          <div
+            ref={(el) => {
+              editorRef = el
+              props.ref?.(el)
+            }}
+            contenteditable="true"
+            onInput={handleInput}
+            onKeyDown={handleKeyDown}
+            classList={{
+              "w-full p-3 text-14-regular text-text-strong focus:outline-none whitespace-pre-wrap": true,
+              "[&>[data-type=file]]:text-icon-info-active": true,
+            }}
+          />
+          <Show when={isEmpty()}>
+            <div class="absolute top-0 left-0 p-3 text-14-regular text-text-weak pointer-events-none">
+              Plan and build anything
+            </div>
+          </Show>
+        </div>
+        <div class="p-3 flex items-center justify-between">
+          <div class="flex items-center justify-start gap-1">
+            <Select
+              options={local.agent.list().map((agent) => agent.name)}
+              current={local.agent.current().name}
+              onSelect={local.agent.set}
+              class="capitalize"
+            />
+            <SelectDialog
+              title="Select model"
+              placeholder="Search models"
+              emptyMessage="No model results"
+              key={(x) => `${x.provider.id}:${x.id}`}
+              items={local.model.list()}
+              current={local.model.current()}
+              filterKeys={["provider.name", "name", "id"]}
+              groupBy={(x) => x.provider.name}
+              sortGroupsBy={(a, b) => {
+                const order = ["opencode", "anthropic", "github-copilot", "openai", "google", "openrouter", "vercel"]
+                const aProvider = a.items[0].provider.id
+                const bProvider = b.items[0].provider.id
+                if (order.includes(aProvider) && !order.includes(bProvider)) return -1
+                if (!order.includes(aProvider) && order.includes(bProvider)) return 1
+                return order.indexOf(aProvider) - order.indexOf(bProvider)
+              }}
+              onSelect={(x) => local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined)}
+              trigger={
+                <Button as="div" variant="ghost">
+                  {local.model.current()?.name ?? "Select model"}
+                  <span class="ml-0.5 text-text-weak text-12-regular">{local.model.current()?.provider.name}</span>
+                  <Icon name="chevron-down" size="small" />
+                </Button>
+              }
+            >
+              {(i) => (
+                <div class="w-full flex items-center justify-between gap-x-3">
+                  <div class="flex items-center gap-x-2.5 text-text-muted grow min-w-0">
+                    <img src={`https://models.dev/logos/${i.provider.id}.svg`} class="size-6 p-0.5 shrink-0 " />
+                    <div class="flex gap-x-3 items-baseline flex-[1_0_0]">
+                      <span class="text-14-medium text-text-strong overflow-hidden text-ellipsis">{i.name}</span>
+                      <span class="text-12-medium text-text-weak overflow-hidden text-ellipsis truncate min-w-0">
+                        {DateTime.fromFormat(i.release_date, "yyyy-MM-dd").toFormat("LLL yyyy")}
+                      </span>
+                    </div>
+                  </div>
+                  <Show when={!i.cost || i.cost?.input === 0}>
+                    <div class="overflow-hidden text-12-medium text-text-strong">Free</div>
+                  </Show>
+                </div>
+              )}
+            </SelectDialog>
           </div>
-        </Show>
-      </div>
-      <div class="p-3" />
+          <IconButton type="submit" disabled={isEmpty()} icon="arrow-up" variant="primary" />
+        </div>
+      </form>
     </div>
   )
 }
@@ -223,7 +396,7 @@ function isEqual(arrA: ContentPart[], arrB: ContentPart[]): boolean {
     if (partA.type === "text" && partA.content !== (partB as TextPart).content) {
       return false
     }
-    if (partA.type === "attachment" && partA.fileId !== (partB as AttachmentPart).fileId) {
+    if (partA.type === "file" && partA.path !== (partB as FileAttachmentPart).path) {
       return false
     }
   }
@@ -241,24 +414,48 @@ function getCursorPosition(parent: HTMLElement): number {
 }
 
 function setCursorPosition(parent: HTMLElement, position: number) {
-  let child = parent.firstChild
-  let offset = position
-  while (child) {
-    if (offset > child.textContent!.length) {
-      offset -= child.textContent!.length
-      child = child.nextSibling
-    } else {
-      try {
-        const range = document.createRange()
-        const sel = window.getSelection()
-        range.setStart(child, offset)
-        range.collapse(true)
-        sel?.removeAllRanges()
-        sel?.addRange(range)
-      } catch (e) {
-        console.error("Failed to set cursor position.", e)
-      }
+  let remaining = position
+  let node = parent.firstChild
+  while (node) {
+    const length = node.textContent ? node.textContent.length : 0
+    const isText = node.nodeType === Node.TEXT_NODE
+    const isFile = node.nodeType === Node.ELEMENT_NODE && (node as HTMLElement).dataset.type === "file"
+
+    if (isText && remaining <= length) {
+      const range = document.createRange()
+      const selection = window.getSelection()
+      range.setStart(node, remaining)
+      range.collapse(true)
+      selection?.removeAllRanges()
+      selection?.addRange(range)
       return
     }
+
+    if (isFile && remaining <= length) {
+      const range = document.createRange()
+      const selection = window.getSelection()
+      range.setStartAfter(node)
+      range.collapse(true)
+      selection?.removeAllRanges()
+      selection?.addRange(range)
+      return
+    }
+
+    remaining -= length
+    node = node.nextSibling
   }
+
+  const fallbackRange = document.createRange()
+  const fallbackSelection = window.getSelection()
+  const last = parent.lastChild
+  if (last && last.nodeType === Node.TEXT_NODE) {
+    const len = last.textContent ? last.textContent.length : 0
+    fallbackRange.setStart(last, len)
+  }
+  if (!last || last.nodeType !== Node.TEXT_NODE) {
+    fallbackRange.selectNodeContents(parent)
+  }
+  fallbackRange.collapse(false)
+  fallbackSelection?.removeAllRanges()
+  fallbackSelection?.addRange(fallbackRange)
 }

packages/desktop/src/components/select-dialog.tsx

@@ -1,226 +0,0 @@
-import { createEffect, Show, For, createMemo, type JSX, createResource } from "solid-js"
-import { Dialog } from "@kobalte/core/dialog"
-import { Icon } from "@opencode-ai/ui"
-import { IconButton } from "@/ui"
-import { createStore } from "solid-js/store"
-import { entries, flatMap, groupBy, map, pipe } from "remeda"
-import { createList } from "solid-list"
-import fuzzysort from "fuzzysort"
-
-interface SelectDialogProps<T> {
-  items: T[] | ((filter: string) => Promise<T[]>)
-  key: (item: T) => string
-  render: (item: T) => JSX.Element
-  filter?: string[]
-  current?: T
-  placeholder?: string
-  groupBy?: (x: T) => string
-  onSelect?: (value: T | undefined) => void
-  onClose?: () => void
-}
-
-export function SelectDialog<T>(props: SelectDialogProps<T>) {
-  let scrollRef: HTMLDivElement | undefined
-  const [store, setStore] = createStore({
-    filter: "",
-    mouseActive: false,
-  })
-
-  const [grouped] = createResource(
-    () => store.filter,
-    async (filter) => {
-      const needle = filter.toLowerCase()
-      const all = (typeof props.items === "function" ? await props.items(needle) : props.items) || []
-      const result = pipe(
-        all,
-        (x) => {
-          if (!needle) return x
-          if (!props.filter && Array.isArray(x) && x.every((e) => typeof e === "string")) {
-            return fuzzysort.go(needle, x).map((x) => x.target) as T[]
-          }
-          return fuzzysort.go(needle, x, { keys: props.filter! }).map((x) => x.obj)
-        },
-        groupBy((x) => (props.groupBy ? props.groupBy(x) : "")),
-        // mapValues((x) => x.sort((a, b) => props.key(a).localeCompare(props.key(b)))),
-        entries(),
-        map(([k, v]) => ({ category: k, items: v })),
-      )
-      return result
-    },
-  )
-  const flat = createMemo(() => {
-    return pipe(
-      grouped() || [],
-      flatMap((x) => x.items),
-    )
-  })
-  const list = createList({
-    items: () => flat().map(props.key),
-    initialActive: props.current ? props.key(props.current) : undefined,
-    loop: true,
-  })
-  const resetSelection = () => {
-    const all = flat()
-    if (all.length === 0) return
-    list.setActive(props.key(all[0]))
-  }
-
-  createEffect(() => {
-    store.filter
-    scrollRef?.scrollTo(0, 0)
-    resetSelection()
-  })
-
-  createEffect(() => {
-    const all = flat()
-    if (store.mouseActive || all.length === 0) return
-    if (list.active() === props.key(all[0])) {
-      scrollRef?.scrollTo(0, 0)
-      return
-    }
-    const element = scrollRef?.querySelector(`[data-key="${list.active()}"]`)
-    element?.scrollIntoView({ block: "nearest", behavior: "smooth" })
-  })
-
-  const handleInput = (value: string) => {
-    setStore("filter", value)
-    resetSelection()
-  }
-
-  const handleSelect = (item: T) => {
-    props.onSelect?.(item)
-    props.onClose?.()
-  }
-
-  const handleKey = (e: KeyboardEvent) => {
-    setStore("mouseActive", false)
-
-    if (e.key === "Enter") {
-      e.preventDefault()
-      const selected = flat().find((x) => props.key(x) === list.active())
-      if (selected) handleSelect(selected)
-    } else if (e.key === "Escape") {
-      e.preventDefault()
-      props.onClose?.()
-    } else {
-      list.onKeyDown(e)
-    }
-  }
-
-  return (
-    <Dialog defaultOpen modal onOpenChange={(open) => open || props.onClose?.()}>
-      <Dialog.Portal>
-        <Dialog.Overlay class="fixed inset-0 bg-black/50 backdrop-blur-sm z-[100]" />
-        <Dialog.Content
-          class="fixed top-[20%] left-1/2 -translate-x-1/2 w-[90vw] max-w-2xl 
-                 shadow-[0_0_33px_rgba(0,0,0,0.8)]
-                 bg-background border border-border-subtle/30 rounded-lg  z-[101]
-                 max-h-[60vh] flex flex-col"
-        >
-          <div class="border-b border-border-subtle/30">
-            <div class="relative">
-              <Icon name="command" size={16} class="absolute left-3 top-1/2 -translate-y-1/2 text-text-muted/80" />
-              <input
-                type="text"
-                value={store.filter}
-                onInput={(e) => handleInput(e.currentTarget.value)}
-                onKeyDown={handleKey}
-                placeholder={props.placeholder}
-                class="w-full pl-10 pr-4 py-2 rounded-t-md
-                       text-sm text-text placeholder-text-muted/70
-                       focus:outline-none"
-                autofocus
-                spellcheck={false}
-                autocorrect="off"
-                autocomplete="off"
-                autocapitalize="off"
-              />
-              <div class="absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-2">
-                {/* <Show when={fileResults.loading && mode() === "files"}>
-                  <div class="text-text-muted">
-                    <Icon name="refresh" size={14} class="animate-spin" />
-                  </div>
-                </Show> */}
-                <Show when={store.filter}>
-                  <IconButton
-                    size="xs"
-                    variant="ghost"
-                    class="text-text-muted hover:text-text"
-                    onClick={() => {
-                      setStore("filter", "")
-                      resetSelection()
-                    }}
-                  >
-                    <Icon name="close" size={14} />
-                  </IconButton>
-                </Show>
-              </div>
-            </div>
-          </div>
-          <div ref={(el) => (scrollRef = el)} class="relative flex-1 overflow-y-auto">
-            <Show
-              when={flat().length > 0}
-              fallback={<div class="text-center py-8 text-text-muted text-sm">No results</div>}
-            >
-              <For each={grouped()}>
-                {(group) => (
-                  <>
-                    <Show when={group.category}>
-                      <div class="top-0 sticky z-10 bg-background-panel p-2 text-xs text-text-muted/60 tracking-wider uppercase">
-                        {group.category}
-                      </div>
-                    </Show>
-                    <div class="p-2">
-                      <For each={group.items}>
-                        {(item) => (
-                          <button
-                            data-key={props.key(item)}
-                            onClick={() => handleSelect(item)}
-                            onMouseMove={() => {
-                              setStore("mouseActive", true)
-                              list.setActive(props.key(item))
-                            }}
-                            classList={{
-                              "w-full px-3 py-2 flex items-center gap-3": true,
-                              "rounded-md text-left transition-colors group": true,
-                              "bg-background-element": props.key(item) === list.active(),
-                            }}
-                          >
-                            {props.render(item)}
-                          </button>
-                        )}
-                      </For>
-                    </div>
-                  </>
-                )}
-              </For>
-            </Show>
-          </div>
-          <div class="p-3 border-t border-border-subtle/30 flex items-center justify-between text-xs text-text-muted">
-            <div class="flex items-center gap-5">
-              <span class="flex items-center gap-1.5">
-                <kbd class="px-1.5 py-0.5 bg-background-element border border-border-subtle/30 rounded text-[10px]">
-                  ↑↓
-                </kbd>
-                Navigate
-              </span>
-              <span class="flex items-center gap-1.5">
-                <kbd class="px-1.5 py-0.5 bg-background-element border border-border-subtle/30 rounded text-[10px]">
-                  ↵
-                </kbd>
-                Select
-              </span>
-              <span class="flex items-center gap-1.5">
-                <kbd class="px-1.5 py-0.5 bg-background-element border border-border-subtle/30 rounded text-[10px]">
-                  ESC
-                </kbd>
-                Close
-              </span>
-            </div>
-            <span>{`${flat().length} results`}</span>
-          </div>
-        </Dialog.Content>
-      </Dialog.Portal>
-    </Dialog>
-  )
-}

packages/desktop/src/components/session-timeline.tsx

@@ -1,11 +1,9 @@
-import { useLocal, useSync } from "@/context"
 import { Icon, Tooltip } from "@opencode-ai/ui"
 import { Collapsible } from "@/ui"
-import type { AssistantMessage, Part, ToolPart } from "@opencode-ai/sdk"
+import type { AssistantMessage, Message, Part, ToolPart } from "@opencode-ai/sdk"
 import { DateTime } from "luxon"
 import {
   createSignal,
-  onMount,
   For,
   Match,
   splitProps,
@@ -23,6 +21,8 @@ import { createElementSize } from "@solid-primitives/resize-observer"
 import { createScrollPosition } from "@solid-primitives/scroll"
 import { ProgressCircle } from "./progress-circle"
 import { pipe, sumBy } from "remeda"
+import { useSync } from "@/context/sync"
+import { useLocal } from "@/context/local"
 
 function Part(props: ParentProps & ComponentProps<"div">) {
   const [local, others] = splitProps(props, ["class", "classList", "children"])
@@ -67,7 +67,7 @@ function ReadToolPart(props: { part: ToolPart }) {
         {(state) => {
           const path = state().input["filePath"] as string
           return (
-            <Part class="cursor-pointer" onClick={() => local.file.open(path)}>
+            <Part onClick={() => local.file.open(path)}>
               <span class="">Read</span> {getFilename(path)}
             </Part>
           )
@@ -253,7 +253,7 @@ export default function SessionTimeline(props: { session: string; class?: string
       case "patch":
         return false
       case "text":
-        return !part.synthetic
+        return !part.synthetic && part.text.trim()
       case "reasoning":
         return part.text.trim()
       case "tool":
@@ -270,8 +270,17 @@ export default function SessionTimeline(props: { session: string; class?: string
     }
   }
 
+  const hasValidParts = (message: Message) => {
+    return sync.data.part[message.id]?.filter(valid).length > 0
+  }
+
+  const hasTextPart = (message: Message) => {
+    return !!sync.data.part[message.id]?.filter(valid).find((p) => p.type === "text")
+  }
+
   const session = createMemo(() => sync.session.get(props.session))
   const messages = createMemo(() => sync.data.message[props.session] ?? [])
+  const messagesWithValidParts = createMemo(() => sync.data.message[props.session]?.filter(hasValidParts) ?? [])
   const working = createMemo(() => {
     const last = messages()[messages().length - 1]
     if (!last) return false
@@ -378,6 +387,11 @@ export default function SessionTimeline(props: { session: string; class?: string
     }
   }
 
+  createEffect(() => {
+    console.log("WHAT")
+    console.log(JSON.stringify(messagesWithValidParts()))
+  })
+
   return (
     <div
       ref={setRoot}
@@ -386,7 +400,7 @@ export default function SessionTimeline(props: { session: string; class?: string
         [props.class ?? ""]: !!props.class,
       }}
     >
-      <div class="py-1.5 px-10 flex justify-end items-center self-stretch">
+      <div class="flex justify-end items-center self-stretch">
         <div class="flex items-center gap-6">
           <Tooltip value={`${tokens()} Tokens`} class="flex items-center gap-1.5">
             <Show when={context()}>
@@ -397,11 +411,16 @@ export default function SessionTimeline(props: { session: string; class?: string
           <div class="text-14-regular text-text-strong text-right">{cost()}</div>
         </div>
       </div>
-      <ul role="list" class="flex flex-col gap-6 items-start self-stretch px-10 pt-2 pb-6">
-        <For each={messages()}>
+      <ul role="list" class="flex flex-col items-start self-stretch">
+        <For each={messagesWithValidParts()}>
           {(message) => (
-            <div class="flex flex-col gap-1 justify-center items-start self-stretch">
-              <For each={sync.data.part[message.id]?.filter(valid)}>
+            <div
+              classList={{
+                "flex flex-col gap-1 justify-center items-start self-stretch": true,
+                "mt-6": hasTextPart(message),
+              }}
+            >
+              <For each={sync.data.part[message.id]?.filter(valid) ?? []}>
                 {(part) => (
                   <li class="group/li">
                     <Switch fallback={<div class="">{part.type}</div>}>
@@ -449,9 +468,9 @@ export default function SessionTimeline(props: { session: string; class?: string
         <Collapsible defaultOpen={false}>
           <Collapsible.Trigger>
             <div class="mt-12 ml-1 flex items-center gap-x-2 text-xs text-text-muted">
-              <Icon name="file-code" size={16} />
+              <Icon name="file-code" />
               <span>Raw Session Data</span>
-              <Collapsible.Arrow size={18} class="text-text-muted" />
+              <Collapsible.Arrow class="text-text-muted" />
             </div>
           </Collapsible.Trigger>
           <Collapsible.Content class="mt-5">
@@ -460,9 +479,9 @@ export default function SessionTimeline(props: { session: string; class?: string
                 <Collapsible>
                   <Collapsible.Trigger>
                     <div class="flex items-center gap-x-2 text-xs text-text-muted ml-1">
-                      <Icon name="file-code" size={16} />
+                      <Icon name="file-code" />
                       <span>session</span>
-                      <Collapsible.Arrow size={18} class="text-text-muted" />
+                      <Collapsible.Arrow class="text-text-muted" />
                     </div>
                   </Collapsible.Trigger>
                   <Collapsible.Content>
@@ -477,9 +496,9 @@ export default function SessionTimeline(props: { session: string; class?: string
                       <Collapsible>
                         <Collapsible.Trigger>
                           <div class="flex items-center gap-x-2 text-xs text-text-muted ml-1">
-                            <Icon name="file-code" size={16} />
+                            <Icon name="file-code" />
                             <span>{message.role === "user" ? "user" : "assistant"}</span>
-                            <Collapsible.Arrow size={18} class="text-text-muted" />
+                            <Collapsible.Arrow class="text-text-muted" />
                           </div>
                         </Collapsible.Trigger>
                         <Collapsible.Content>
@@ -493,9 +512,9 @@ export default function SessionTimeline(props: { session: string; class?: string
                           <Collapsible>
                             <Collapsible.Trigger>
                               <div class="flex items-center gap-x-2 text-xs text-text-muted ml-1">
-                                <Icon name="file-code" size={16} />
+                                <Icon name="file-code" />
                                 <span>{part.type}</span>
-                                <Collapsible.Arrow size={18} class="text-text-muted" />
+                                <Collapsible.Arrow class="text-text-muted" />
                               </div>
                             </Collapsible.Trigger>
                             <Collapsible.Content>

packages/desktop/src/components/theme.json

@@ -0,0 +1,558 @@
+{
+  "colors": {
+    "actionBar.toggledBackground": "var(--surface-raised-base)",
+    "activityBarBadge.background": "var(--surface-brand-base)",
+    "checkbox.border": "var(--border-base)",
+    "editor.background": "transparent",
+    "editor.foreground": "var(--text-base)",
+    "editor.inactiveSelectionBackground": "var(--surface-raised-base)",
+    "editor.selectionHighlightBackground": "var(--border-active)",
+    "editorIndentGuide.activeBackground1": "var(--border-weak-base)",
+    "editorIndentGuide.background1": "var(--border-weak-base)",
+    "input.placeholderForeground": "var(--text-weak)",
+    "list.activeSelectionIconForeground": "var(--text-base)",
+    "list.dropBackground": "var(--surface-raised-base)",
+    "menu.background": "var(--surface-base)",
+    "menu.border": "var(--border-base)",
+    "menu.foreground": "var(--text-base)",
+    "menu.selectionBackground": "var(--surface-interactive-base)",
+    "menu.separatorBackground": "var(--border-base)",
+    "ports.iconRunningProcessForeground": "var(--icon-success-base)",
+    "sideBarSectionHeader.background": "transparent",
+    "sideBarSectionHeader.border": "var(--border-weak-base)",
+    "sideBarTitle.foreground": "var(--text-weak)",
+    "statusBarItem.remoteBackground": "var(--surface-success-base)",
+    "statusBarItem.remoteForeground": "var(--text-base)",
+    "tab.lastPinnedBorder": "var(--border-weak-base)",
+    "tab.selectedBackground": "var(--surface-raised-base)",
+    "tab.selectedForeground": "var(--text-weak)",
+    "terminal.inactiveSelectionBackground": "var(--surface-raised-base)",
+    "widget.border": "var(--border-base)"
+  },
+  "displayName": "opencode",
+  "name": "opencode",
+  "semanticHighlighting": true,
+  "semanticTokenColors": {
+    "customLiteral": "var(--syntax-function)",
+    "newOperator": "var(--syntax-operator)",
+    "numberLiteral": "var(--syntax-number)",
+    "stringLiteral": "var(--syntax-string)"
+  },
+  "tokenColors": [
+    {
+      "scope": [
+        "meta.embedded",
+        "source.groovy.embedded",
+        "string meta.image.inline.markdown",
+        "variable.legacy.builtin.python"
+      ],
+      "settings": {
+        "foreground": "var(--text-base)"
+      }
+    },
+    {
+      "scope": "emphasis",
+      "settings": {
+        "fontStyle": "italic"
+      }
+    },
+    {
+      "scope": "strong",
+      "settings": {
+        "fontStyle": "bold"
+      }
+    },
+    {
+      "scope": "header",
+      "settings": {
+        "foreground": "var(--markdown-heading)"
+      }
+    },
+    {
+      "scope": "comment",
+      "settings": {
+        "foreground": "var(--syntax-comment)"
+      }
+    },
+    {
+      "scope": "constant.language",
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": [
+        "constant.numeric",
+        "variable.other.enummember",
+        "keyword.operator.plus.exponent",
+        "keyword.operator.minus.exponent"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-number)"
+      }
+    },
+    {
+      "scope": "constant.regexp",
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": "entity.name.tag",
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": ["entity.name.tag.css", "entity.name.tag.less"],
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": "entity.other.attribute-name",
+      "settings": {
+        "foreground": "var(--syntax-variable)"
+      }
+    },
+    {
+      "scope": [
+        "entity.other.attribute-name.class.css",
+        "source.css entity.other.attribute-name.class",
+        "entity.other.attribute-name.id.css",
+        "entity.other.attribute-name.parent-selector.css",
+        "entity.other.attribute-name.parent.less",
+        "source.css entity.other.attribute-name.pseudo-class",
+        "entity.other.attribute-name.pseudo-element.css",
+        "source.css.less entity.other.attribute-name.id",
+        "entity.other.attribute-name.scss"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": "invalid",
+      "settings": {
+        "foreground": "var(--syntax-critical)"
+      }
+    },
+    {
+      "scope": "markup.underline",
+      "settings": {
+        "fontStyle": "underline"
+      }
+    },
+    {
+      "scope": "markup.bold",
+      "settings": {
+        "fontStyle": "bold",
+        "foreground": "var(--markdown-strong)"
+      }
+    },
+    {
+      "scope": "markup.heading",
+      "settings": {
+        "fontStyle": "bold",
+        "foreground": "var(--theme-markdown-heading)"
+      }
+    },
+    {
+      "scope": "markup.italic",
+      "settings": {
+        "fontStyle": "italic"
+      }
+    },
+    {
+      "scope": "markup.strikethrough",
+      "settings": {
+        "fontStyle": "strikethrough"
+      }
+    },
+    {
+      "scope": "markup.inserted",
+      "settings": {
+        "foreground": "var(--text-diff-add-base)"
+      }
+    },
+    {
+      "scope": "markup.deleted",
+      "settings": {
+        "foreground": "var(--text-diff-delete-base)"
+      }
+    },
+    {
+      "scope": "markup.changed",
+      "settings": {
+        "foreground": "var(--text-base)"
+      }
+    },
+    {
+      "scope": "punctuation.definition.quote.begin.markdown",
+      "settings": {
+        "foreground": "var(--markdown-block-quote)"
+      }
+    },
+    {
+      "scope": "punctuation.definition.list.begin.markdown",
+      "settings": {
+        "foreground": "var(--markdown-list-enumeration)"
+      }
+    },
+    {
+      "scope": "markup.inline.raw",
+      "settings": {
+        "foreground": "var(--markdown-code)"
+      }
+    },
+    {
+      "scope": "punctuation.definition.tag",
+      "settings": {
+        "foreground": "var(--syntax-punctuation)"
+      }
+    },
+    {
+      "scope": ["meta.preprocessor", "entity.name.function.preprocessor"],
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": "meta.preprocessor.string",
+      "settings": {
+        "foreground": "var(--syntax-string)"
+      }
+    },
+    {
+      "scope": "meta.preprocessor.numeric",
+      "settings": {
+        "foreground": "var(--syntax-number)"
+      }
+    },
+    {
+      "scope": "meta.structure.dictionary.key.python",
+      "settings": {
+        "foreground": "var(--syntax-variable)"
+      }
+    },
+    {
+      "scope": "meta.diff.header",
+      "settings": {
+        "foreground": "var(--text-weak)"
+      }
+    },
+    {
+      "scope": "storage",
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": "storage.type",
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": ["storage.modifier", "keyword.operator.noexcept"],
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": ["string", "meta.embedded.assembly"],
+      "settings": {
+        "foreground": "var(--syntax-string)"
+      }
+    },
+    {
+      "scope": "string.tag",
+      "settings": {
+        "foreground": "var(--syntax-string)"
+      }
+    },
+    {
+      "scope": "string.value",
+      "settings": {
+        "foreground": "var(--syntax-string)"
+      }
+    },
+    {
+      "scope": "string.regexp",
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": [
+        "punctuation.definition.template-expression.begin",
+        "punctuation.definition.template-expression.end",
+        "punctuation.section.embedded"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": ["meta.template.expression"],
+      "settings": {
+        "foreground": "var(--text-base)"
+      }
+    },
+    {
+      "scope": [
+        "support.type.vendored.property-name",
+        "support.type.property-name",
+        "source.css variable",
+        "source.coffee.embedded"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-variable)"
+      }
+    },
+    {
+      "scope": "keyword",
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": "keyword.control",
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": "keyword.operator",
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": [
+        "keyword.operator.new",
+        "keyword.operator.expression",
+        "keyword.operator.cast",
+        "keyword.operator.sizeof",
+        "keyword.operator.alignof",
+        "keyword.operator.typeid",
+        "keyword.operator.alignas",
+        "keyword.operator.instanceof",
+        "keyword.operator.logical.python",
+        "keyword.operator.wordlike"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": "keyword.other.unit",
+      "settings": {
+        "foreground": "var(--syntax-number)"
+      }
+    },
+    {
+      "scope": ["punctuation.section.embedded.begin.php", "punctuation.section.embedded.end.php"],
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": "support.function.git-rebase",
+      "settings": {
+        "foreground": "var(--syntax-variable)"
+      }
+    },
+    {
+      "scope": "constant.sha.git-rebase",
+      "settings": {
+        "foreground": "var(--syntax-number)"
+      }
+    },
+    {
+      "scope": ["storage.modifier.import.java", "variable.language.wildcard.java", "storage.modifier.package.java"],
+      "settings": {
+        "foreground": "var(--text-base)"
+      }
+    },
+    {
+      "scope": "variable.language",
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": [
+        "entity.name.function",
+        "support.function",
+        "support.constant.handlebars",
+        "source.powershell variable.other.member",
+        "entity.name.operator.custom-literal"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-function)"
+      }
+    },
+    {
+      "scope": [
+        "support.class",
+        "support.type",
+        "entity.name.type",
+        "entity.name.namespace",
+        "entity.other.attribute",
+        "entity.name.scope-resolution",
+        "entity.name.class",
+        "storage.type.numeric.go",
+        "storage.type.byte.go",
+        "storage.type.boolean.go",
+        "storage.type.string.go",
+        "storage.type.uintptr.go",
+        "storage.type.error.go",
+        "storage.type.rune.go",
+        "storage.type.cs",
+        "storage.type.generic.cs",
+        "storage.type.modifier.cs",
+        "storage.type.variable.cs",
+        "storage.type.annotation.java",
+        "storage.type.generic.java",
+        "storage.type.java",
+        "storage.type.object.array.java",
+        "storage.type.primitive.array.java",
+        "storage.type.primitive.java",
+        "storage.type.token.java",
+        "storage.type.groovy",
+        "storage.type.annotation.groovy",
+        "storage.type.parameters.groovy",
+        "storage.type.generic.groovy",
+        "storage.type.object.array.groovy",
+        "storage.type.primitive.array.groovy",
+        "storage.type.primitive.groovy"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-type)"
+      }
+    },
+    {
+      "scope": [
+        "meta.type.cast.expr",
+        "meta.type.new.expr",
+        "support.constant.math",
+        "support.constant.dom",
+        "support.constant.json",
+        "entity.other.inherited-class",
+        "punctuation.separator.namespace.ruby"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-type)"
+      }
+    },
+    {
+      "scope": [
+        "keyword.control",
+        "source.cpp keyword.operator.new",
+        "keyword.operator.delete",
+        "keyword.other.using",
+        "keyword.other.directive.using",
+        "keyword.other.operator",
+        "entity.name.operator"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": [
+        "variable",
+        "meta.definition.variable.name",
+        "support.variable",
+        "entity.name.variable",
+        "constant.other.placeholder"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-variable)"
+      }
+    },
+    {
+      "scope": ["variable.other.constant", "variable.other.enummember"],
+      "settings": {
+        "foreground": "var(--syntax-variable)"
+      }
+    },
+    {
+      "scope": ["meta.object-literal.key"],
+      "settings": {
+        "foreground": "var(--syntax-variable)"
+      }
+    },
+    {
+      "scope": [
+        "support.constant.property-value",
+        "support.constant.font-name",
+        "support.constant.media-type",
+        "support.constant.media",
+        "constant.other.color.rgb-value",
+        "constant.other.rgb-value",
+        "support.constant.color"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-string)"
+      }
+    },
+    {
+      "scope": [
+        "punctuation.definition.group.regexp",
+        "punctuation.definition.group.assertion.regexp",
+        "punctuation.definition.character-class.regexp",
+        "punctuation.character.set.begin.regexp",
+        "punctuation.character.set.end.regexp",
+        "keyword.operator.negation.regexp",
+        "support.other.parenthesis.regexp"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-string)"
+      }
+    },
+    {
+      "scope": [
+        "constant.character.character-class.regexp",
+        "constant.other.character-class.set.regexp",
+        "constant.other.character-class.regexp",
+        "constant.character.set.regexp"
+      ],
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": ["keyword.operator.or.regexp", "keyword.control.anchor.regexp"],
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": "keyword.operator.quantifier.regexp",
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": ["constant.character", "constant.other.option"],
+      "settings": {
+        "foreground": "var(--syntax-keyword)"
+      }
+    },
+    {
+      "scope": "constant.character.escape",
+      "settings": {
+        "foreground": "var(--syntax-operator)"
+      }
+    },
+    {
+      "scope": "entity.name.label",
+      "settings": {
+        "foreground": "var(--text-weak)"
+      }
+    }
+  ],
+  "type": "dark"
+}

packages/desktop/src/context/event.tsx

@@ -1,34 +0,0 @@
-import { createContext, useContext, type ParentProps } from "solid-js"
-import { createEventBus } from "@solid-primitives/event-bus"
-import type { Event as SDKEvent } from "@opencode-ai/sdk"
-import { useSDK } from "@/context"
-
-export type Event = SDKEvent // can extend with custom events later
-
-function init() {
-  const sdk = useSDK()
-  const bus = createEventBus<Event>()
-  sdk.event.subscribe().then(async (events) => {
-    for await (const event of events.stream) {
-      bus.emit(event)
-    }
-  })
-  return bus
-}
-
-type EventContext = ReturnType<typeof init>
-
-const ctx = createContext<EventContext>()
-
-export function EventProvider(props: ParentProps) {
-  const value = init()
-  return <ctx.Provider value={value}>{props.children}</ctx.Provider>
-}
-
-export function useEvent() {
-  const value = useContext(ctx)
-  if (!value) {
-    throw new Error("useEvent must be used within a EventProvider")
-  }
-  return value
-}

packages/desktop/src/context/helper.tsx

@@ -0,0 +1,25 @@
+import { createContext, Show, useContext, type ParentProps } from "solid-js"
+
+export function createSimpleContext<T, Props extends Record<string, any>>(input: {
+  name: string
+  init: ((input: Props) => T) | (() => T)
+}) {
+  const ctx = createContext<T>()
+
+  return {
+    provider: (props: ParentProps<Props>) => {
+      const init = input.init(props)
+      return (
+        // @ts-expect-error
+        <Show when={init.ready === undefined || init.ready === true}>
+          <ctx.Provider value={init}>{props.children}</ctx.Provider>
+        </Show>
+      )
+    },
+    use() {
+      const value = useContext(ctx)
+      if (!value) throw new Error(`${input.name} context must be used within a context provider`)
+      return value
+    },
+  }
+}

packages/desktop/src/context/index.ts

@@ -1,6 +0,0 @@
-export { EventProvider, useEvent } from "./event"
-export { LocalProvider, useLocal } from "./local"
-export { MarkedProvider, useMarked } from "./marked"
-export { SDKProvider, useSDK } from "./sdk"
-export { ShikiProvider, useShiki } from "./shiki"
-export { SyncProvider, useSync } from "./sync"

packages/desktop/src/context/marked.tsx

@@ -1,43 +1,30 @@
-import { createContext, useContext, type ParentProps } from "solid-js"
-import { useShiki } from "@/context"
 import { marked } from "marked"
 import markedShiki from "marked-shiki"
 import { bundledLanguages, type BundledLanguage } from "shiki"
 
-function init(highlighter: ReturnType<typeof useShiki>) {
-  return marked.use(
-    markedShiki({
-      async highlight(code, lang) {
-        if (!(lang in bundledLanguages)) {
-          lang = "text"
-        }
-        if (!highlighter.getLoadedLanguages().includes(lang)) {
-          await highlighter.loadLanguage(lang as BundledLanguage)
-        }
-        return highlighter.codeToHtml(code, {
-          lang: lang || "text",
-          theme: "opencode",
-          tabindex: false,
-        })
-      },
-    }),
-  )
-}
+import { createSimpleContext } from "./helper"
+import { useShiki } from "./shiki"
 
-type MarkedContext = ReturnType<typeof init>
-
-const ctx = createContext<MarkedContext>()
-
-export function MarkedProvider(props: ParentProps) {
-  const highlighter = useShiki()
-  const value = init(highlighter)
-  return <ctx.Provider value={value}>{props.children}</ctx.Provider>
-}
-
-export function useMarked() {
-  const value = useContext(ctx)
-  if (!value) {
-    throw new Error("useMarked must be used within a MarkedProvider")
-  }
-  return value
-}
+export const { use: useMarked, provider: MarkedProvider } = createSimpleContext({
+  name: "Marked",
+  init: () => {
+    const highlighter = useShiki()
+    return marked.use(
+      markedShiki({
+        async highlight(code, lang) {
+          if (!(lang in bundledLanguages)) {
+            lang = "text"
+          }
+          if (!highlighter.getLoadedLanguages().includes(lang)) {
+            await highlighter.loadLanguage(lang as BundledLanguage)
+          }
+          return highlighter.codeToHtml(code, {
+            lang: lang || "text",
+            theme: "opencode",
+            tabindex: false,
+          })
+        },
+      }),
+    )
+  },
+})

packages/desktop/src/context/sdk.tsx

@@ -1,29 +1,37 @@
-import { createContext, useContext, type ParentProps } from "solid-js"
-import { createOpencodeClient } from "@opencode-ai/sdk/client"
+import { createOpencodeClient, type Event } from "@opencode-ai/sdk/client"
+import { createSimpleContext } from "./helper"
+import { createGlobalEmitter } from "@solid-primitives/event-bus"
+import { onCleanup } from "solid-js"
 
-const host = import.meta.env.VITE_OPENCODE_SERVER_HOST ?? "127.0.0.1"
-const port = import.meta.env.VITE_OPENCODE_SERVER_PORT ?? "4096"
+export const { use: useSDK, provider: SDKProvider } = createSimpleContext({
+  name: "SDK",
+  init: (props: { url: string }) => {
+    const abort = new AbortController()
+    const sdk = createOpencodeClient({
+      baseUrl: props.url,
+      signal: abort.signal,
+      fetch: (req) => {
+        // @ts-ignore
+        req.timeout = false
+        return fetch(req)
+      },
+    })
 
-function init() {
-  const client = createOpencodeClient({
-    baseUrl: `http://${host}:${port}`,
-  })
-  return client
-}
+    const emitter = createGlobalEmitter<{
+      [key in Event["type"]]: Extract<Event, { type: key }>
+    }>()
 
-type SDKContext = ReturnType<typeof init>
+    sdk.event.subscribe().then(async (events) => {
+      for await (const event of events.stream) {
+        console.log("event", event.type)
+        emitter.emit(event.type, event)
+      }
+    })
 
-const ctx = createContext<SDKContext>()
+    onCleanup(() => {
+      abort.abort()
+    })
 
-export function SDKProvider(props: ParentProps) {
-  const value = init()
-  return <ctx.Provider value={value}>{props.children}</ctx.Provider>
-}
-
-export function useSDK() {
-  const value = useContext(ctx)
-  if (!value) {
-    throw new Error("useSDK must be used within a SDKProvider")
-  }
-  return value
-}
+    return { client: sdk, event: emitter }
+  },
+})

packages/desktop/src/context/shiki.tsx

@@ -1,45 +1,45 @@
+import { createSimpleContext } from "./helper"
 import { createHighlighter, type ThemeInput } from "shiki"
-import { createContext, useContext, type ParentProps } from "solid-js"
 
 const theme: ThemeInput = {
   colors: {
-    "actionBar.toggledBackground": "var(--theme-background-element)",
-    "activityBarBadge.background": "var(--theme-accent)",
-    "checkbox.border": "var(--theme-border)",
+    "actionBar.toggledBackground": "var(--surface-raised-base)",
+    "activityBarBadge.background": "var(--surface-brand-base)",
+    "checkbox.border": "var(--border-base)",
     "editor.background": "transparent",
-    "editor.foreground": "var(--theme-text)",
-    "editor.inactiveSelectionBackground": "var(--theme-background-element)",
-    "editor.selectionHighlightBackground": "var(--theme-border-active)",
-    "editorIndentGuide.activeBackground1": "var(--theme-border-subtle)",
-    "editorIndentGuide.background1": "var(--theme-border-subtle)",
-    "input.placeholderForeground": "var(--theme-text-muted)",
-    "list.activeSelectionIconForeground": "var(--theme-text)",
-    "list.dropBackground": "var(--theme-background-element)",
-    "menu.background": "var(--theme-background-panel)",
-    "menu.border": "var(--theme-border)",
-    "menu.foreground": "var(--theme-text)",
-    "menu.selectionBackground": "var(--theme-primary)",
-    "menu.separatorBackground": "var(--theme-border)",
-    "ports.iconRunningProcessForeground": "var(--theme-success)",
+    "editor.foreground": "var(--text-base)",
+    "editor.inactiveSelectionBackground": "var(--surface-raised-base)",
+    "editor.selectionHighlightBackground": "var(--border-active)",
+    "editorIndentGuide.activeBackground1": "var(--border-weak-base)",
+    "editorIndentGuide.background1": "var(--border-weak-base)",
+    "input.placeholderForeground": "var(--text-weak)",
+    "list.activeSelectionIconForeground": "var(--text-base)",
+    "list.dropBackground": "var(--surface-raised-base)",
+    "menu.background": "var(--surface-base)",
+    "menu.border": "var(--border-base)",
+    "menu.foreground": "var(--text-base)",
+    "menu.selectionBackground": "var(--surface-interactive-base)",
+    "menu.separatorBackground": "var(--border-base)",
+    "ports.iconRunningProcessForeground": "var(--icon-success-base)",
     "sideBarSectionHeader.background": "transparent",
-    "sideBarSectionHeader.border": "var(--theme-border-subtle)",
-    "sideBarTitle.foreground": "var(--theme-text-muted)",
-    "statusBarItem.remoteBackground": "var(--theme-success)",
-    "statusBarItem.remoteForeground": "var(--theme-text)",
-    "tab.lastPinnedBorder": "var(--theme-border-subtle)",
-    "tab.selectedBackground": "var(--theme-background-element)",
-    "tab.selectedForeground": "var(--theme-text-muted)",
-    "terminal.inactiveSelectionBackground": "var(--theme-background-element)",
-    "widget.border": "var(--theme-border)",
+    "sideBarSectionHeader.border": "var(--border-weak-base)",
+    "sideBarTitle.foreground": "var(--text-weak)",
+    "statusBarItem.remoteBackground": "var(--surface-success-base)",
+    "statusBarItem.remoteForeground": "var(--text-base)",
+    "tab.lastPinnedBorder": "var(--border-weak-base)",
+    "tab.selectedBackground": "var(--surface-raised-base)",
+    "tab.selectedForeground": "var(--text-weak)",
+    "terminal.inactiveSelectionBackground": "var(--surface-raised-base)",
+    "widget.border": "var(--border-base)",
   },
   displayName: "opencode",
   name: "opencode",
   semanticHighlighting: true,
   semanticTokenColors: {
-    customLiteral: "var(--theme-syntax-function)",
-    newOperator: "var(--theme-syntax-operator)",
-    numberLiteral: "var(--theme-syntax-number)",
-    stringLiteral: "var(--theme-syntax-string)",
+    customLiteral: "var(--syntax-function)",
+    newOperator: "var(--syntax-operator)",
+    numberLiteral: "var(--syntax-number)",
+    stringLiteral: "var(--syntax-string)",
   },
   tokenColors: [
     {
@@ -50,7 +50,7 @@ const theme: ThemeInput = {
         "variable.legacy.builtin.python",
       ],
       settings: {
-        foreground: "var(--theme-text)",
+        foreground: "var(--text-base)",
       },
     },
     {
@@ -68,19 +68,19 @@ const theme: ThemeInput = {
     {
       scope: "header",
       settings: {
-        foreground: "var(--theme-markdown-heading)",
+        foreground: "var(--markdown-heading)",
       },
     },
     {
       scope: "comment",
       settings: {
-        foreground: "var(--theme-syntax-comment)",
+        foreground: "var(--syntax-comment)",
       },
     },
     {
       scope: "constant.language",
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
@@ -91,31 +91,31 @@ const theme: ThemeInput = {
         "keyword.operator.minus.exponent",
       ],
       settings: {
-        foreground: "var(--theme-syntax-number)",
+        foreground: "var(--syntax-number)",
       },
     },
     {
       scope: "constant.regexp",
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
       scope: "entity.name.tag",
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: ["entity.name.tag.css", "entity.name.tag.less"],
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
       scope: "entity.other.attribute-name",
       settings: {
-        foreground: "var(--theme-syntax-variable)",
+        foreground: "var(--syntax-variable)",
       },
     },
     {
@@ -131,13 +131,13 @@ const theme: ThemeInput = {
         "entity.other.attribute-name.scss",
       ],
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
       scope: "invalid",
       settings: {
-        foreground: "var(--theme-error)",
+        foreground: "var(--syntax-critical)",
       },
     },
     {
@@ -150,7 +150,7 @@ const theme: ThemeInput = {
       scope: "markup.bold",
       settings: {
         fontStyle: "bold",
-        foreground: "var(--theme-markdown-strong)",
+        foreground: "var(--markdown-strong)",
       },
     },
     {
@@ -175,115 +175,115 @@ const theme: ThemeInput = {
     {
       scope: "markup.inserted",
       settings: {
-        foreground: "var(--theme-diff-added)",
+        foreground: "var(--text-diff-add-base)",
       },
     },
     {
       scope: "markup.deleted",
       settings: {
-        foreground: "var(--theme-diff-removed)",
+        foreground: "var(--text-diff-delete-base)",
       },
     },
     {
       scope: "markup.changed",
       settings: {
-        foreground: "var(--theme-diff-context)",
+        foreground: "var(--text-base)",
       },
     },
     {
       scope: "punctuation.definition.quote.begin.markdown",
       settings: {
-        foreground: "var(--theme-markdown-block-quote)",
+        foreground: "var(--markdown-block-quote)",
       },
     },
     {
       scope: "punctuation.definition.list.begin.markdown",
       settings: {
-        foreground: "var(--theme-markdown-list-enumeration)",
+        foreground: "var(--markdown-list-enumeration)",
       },
     },
     {
       scope: "markup.inline.raw",
       settings: {
-        foreground: "var(--theme-markdown-code)",
+        foreground: "var(--markdown-code)",
       },
     },
     {
       scope: "punctuation.definition.tag",
       settings: {
-        foreground: "var(--theme-syntax-punctuation)",
+        foreground: "var(--syntax-punctuation)",
       },
     },
     {
       scope: ["meta.preprocessor", "entity.name.function.preprocessor"],
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: "meta.preprocessor.string",
       settings: {
-        foreground: "var(--theme-syntax-string)",
+        foreground: "var(--syntax-string)",
       },
     },
     {
       scope: "meta.preprocessor.numeric",
       settings: {
-        foreground: "var(--theme-syntax-number)",
+        foreground: "var(--syntax-number)",
       },
     },
     {
       scope: "meta.structure.dictionary.key.python",
       settings: {
-        foreground: "var(--theme-syntax-variable)",
+        foreground: "var(--syntax-variable)",
       },
     },
     {
       scope: "meta.diff.header",
       settings: {
-        foreground: "var(--theme-diff-hunk-header)",
+        foreground: "var(--text-weak)",
       },
     },
     {
       scope: "storage",
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: "storage.type",
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: ["storage.modifier", "keyword.operator.noexcept"],
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: ["string", "meta.embedded.assembly"],
       settings: {
-        foreground: "var(--theme-syntax-string)",
+        foreground: "var(--syntax-string)",
       },
     },
     {
       scope: "string.tag",
       settings: {
-        foreground: "var(--theme-syntax-string)",
+        foreground: "var(--syntax-string)",
       },
     },
     {
       scope: "string.value",
       settings: {
-        foreground: "var(--theme-syntax-string)",
+        foreground: "var(--syntax-string)",
       },
     },
     {
       scope: "string.regexp",
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
@@ -293,13 +293,13 @@ const theme: ThemeInput = {
         "punctuation.section.embedded",
       ],
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: ["meta.template.expression"],
       settings: {
-        foreground: "var(--theme-text)",
+        foreground: "var(--text-base)",
       },
     },
     {
@@ -310,25 +310,25 @@ const theme: ThemeInput = {
         "source.coffee.embedded",
       ],
       settings: {
-        foreground: "var(--theme-syntax-variable)",
+        foreground: "var(--syntax-variable)",
       },
     },
     {
       scope: "keyword",
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: "keyword.control",
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: "keyword.operator",
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
@@ -345,43 +345,43 @@ const theme: ThemeInput = {
         "keyword.operator.wordlike",
       ],
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: "keyword.other.unit",
       settings: {
-        foreground: "var(--theme-syntax-number)",
+        foreground: "var(--syntax-number)",
       },
     },
     {
       scope: ["punctuation.section.embedded.begin.php", "punctuation.section.embedded.end.php"],
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: "support.function.git-rebase",
       settings: {
-        foreground: "var(--theme-syntax-variable)",
+        foreground: "var(--syntax-variable)",
       },
     },
     {
       scope: "constant.sha.git-rebase",
       settings: {
-        foreground: "var(--theme-syntax-number)",
+        foreground: "var(--syntax-number)",
       },
     },
     {
       scope: ["storage.modifier.import.java", "variable.language.wildcard.java", "storage.modifier.package.java"],
       settings: {
-        foreground: "var(--theme-text)",
+        foreground: "var(--text-base)",
       },
     },
     {
       scope: "variable.language",
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
@@ -393,7 +393,7 @@ const theme: ThemeInput = {
         "entity.name.operator.custom-literal",
       ],
       settings: {
-        foreground: "var(--theme-syntax-function)",
+        foreground: "var(--syntax-function)",
       },
     },
     {
@@ -432,7 +432,7 @@ const theme: ThemeInput = {
         "storage.type.primitive.groovy",
       ],
       settings: {
-        foreground: "var(--theme-syntax-type)",
+        foreground: "var(--syntax-type)",
       },
     },
     {
@@ -446,7 +446,7 @@ const theme: ThemeInput = {
         "punctuation.separator.namespace.ruby",
       ],
       settings: {
-        foreground: "var(--theme-syntax-type)",
+        foreground: "var(--syntax-type)",
       },
     },
     {
@@ -460,7 +460,7 @@ const theme: ThemeInput = {
         "entity.name.operator",
       ],
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
@@ -472,19 +472,19 @@ const theme: ThemeInput = {
         "constant.other.placeholder",
       ],
       settings: {
-        foreground: "var(--theme-syntax-variable)",
+        foreground: "var(--syntax-variable)",
       },
     },
     {
       scope: ["variable.other.constant", "variable.other.enummember"],
       settings: {
-        foreground: "var(--theme-syntax-variable)",
+        foreground: "var(--syntax-variable)",
       },
     },
     {
       scope: ["meta.object-literal.key"],
       settings: {
-        foreground: "var(--theme-syntax-variable)",
+        foreground: "var(--syntax-variable)",
       },
     },
     {
@@ -498,7 +498,7 @@ const theme: ThemeInput = {
         "support.constant.color",
       ],
       settings: {
-        foreground: "var(--theme-syntax-string)",
+        foreground: "var(--syntax-string)",
       },
     },
     {
@@ -512,7 +512,7 @@ const theme: ThemeInput = {
         "support.other.parenthesis.regexp",
       ],
       settings: {
-        foreground: "var(--theme-syntax-string)",
+        foreground: "var(--syntax-string)",
       },
     },
     {
@@ -523,37 +523,37 @@ const theme: ThemeInput = {
         "constant.character.set.regexp",
       ],
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
       scope: ["keyword.operator.or.regexp", "keyword.control.anchor.regexp"],
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
       scope: "keyword.operator.quantifier.regexp",
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
       scope: ["constant.character", "constant.other.option"],
       settings: {
-        foreground: "var(--theme-syntax-keyword)",
+        foreground: "var(--syntax-keyword)",
       },
     },
     {
       scope: "constant.character.escape",
       settings: {
-        foreground: "var(--theme-syntax-operator)",
+        foreground: "var(--syntax-operator)",
       },
     },
     {
       scope: "entity.name.label",
       settings: {
-        foreground: "var(--theme-text-muted)",
+        foreground: "var(--text-weak)",
       },
     },
   ],
@@ -565,18 +565,9 @@ const highlighter = await createHighlighter({
   langs: [],
 })
 
-type ShikiContext = typeof highlighter
-
-const ctx = createContext<ShikiContext>()
-
-export function ShikiProvider(props: ParentProps) {
-  return <ctx.Provider value={highlighter}>{props.children}</ctx.Provider>
-}
-
-export function useShiki() {
-  const value = useContext(ctx)
-  if (!value) {
-    throw new Error("useShiki must be used within a ShikiProvider")
-  }
-  return value
-}
+export const { use: useShiki, provider: ShikiProvider } = createSimpleContext({
+  name: "Shiki",
+  init: () => {
+    return highlighter
+  },
+})

packages/desktop/src/context/sync.tsx

@@ -1,177 +1,169 @@
 import type { Message, Agent, Provider, Session, Part, Config, Path, File, FileNode, Project } from "@opencode-ai/sdk"
 import { createStore, produce, reconcile } from "solid-js/store"
-import { createContext, createMemo, Show, useContext, type ParentProps } from "solid-js"
-import { useSDK, useEvent } from "@/context"
+import { createMemo } from "solid-js"
 import { Binary } from "@/utils/binary"
+import { createSimpleContext } from "./helper"
+import { useSDK } from "./sdk"
 
-function init() {
-  const [store, setStore] = createStore<{
-    ready: boolean
-    provider: Provider[]
-    agent: Agent[]
-    project: Project
-    config: Config
-    path: Path
-    session: Session[]
-    message: {
-      [sessionID: string]: Message[]
-    }
-    part: {
-      [messageID: string]: Part[]
-    }
-    node: FileNode[]
-    changes: File[]
-  }>({
-    project: { id: "", worktree: "", time: { created: 0, initialized: 0 } },
-    config: {},
-    path: { state: "", config: "", worktree: "", directory: "" },
-    ready: false,
-    agent: [],
-    provider: [],
-    session: [],
-    message: {},
-    part: {},
-    node: [],
-    changes: [],
-  })
-
-  const bus = useEvent()
-  bus.listen((event) => {
-    switch (event.type) {
-      case "session.updated": {
-        const result = Binary.search(store.session, event.properties.info.id, (s) => s.id)
-        if (result.found) {
-          setStore("session", result.index, reconcile(event.properties.info))
-          break
-        }
-        setStore(
-          "session",
-          produce((draft) => {
-            draft.splice(result.index, 0, event.properties.info)
-          }),
-        )
-        break
+export const { use: useSync, provider: SyncProvider } = createSimpleContext({
+  name: "Sync",
+  init: () => {
+    const [store, setStore] = createStore<{
+      ready: boolean
+      provider: Provider[]
+      agent: Agent[]
+      project: Project
+      config: Config
+      path: Path
+      session: Session[]
+      message: {
+        [sessionID: string]: Message[]
       }
-      case "message.updated": {
-        const messages = store.message[event.properties.info.sessionID]
-        if (!messages) {
-          setStore("message", event.properties.info.sessionID, [event.properties.info])
-          break
-        }
-        const result = Binary.search(messages, event.properties.info.id, (m) => m.id)
-        if (result.found) {
-          setStore("message", event.properties.info.sessionID, result.index, reconcile(event.properties.info))
-          break
-        }
-        setStore(
-          "message",
-          event.properties.info.sessionID,
-          produce((draft) => {
-            draft.splice(result.index, 0, event.properties.info)
-          }),
-        )
-        break
+      part: {
+        [messageID: string]: Part[]
       }
-      case "message.part.updated": {
-        const parts = store.part[event.properties.part.messageID]
-        if (!parts) {
-          setStore("part", event.properties.part.messageID, [event.properties.part])
+      node: FileNode[]
+      changes: File[]
+    }>({
+      project: { id: "", worktree: "", time: { created: 0, initialized: 0 } },
+      config: {},
+      path: { state: "", config: "", worktree: "", directory: "" },
+      ready: false,
+      agent: [],
+      provider: [],
+      session: [],
+      message: {},
+      part: {},
+      node: [],
+      changes: [],
+    })
+
+    const sdk = useSDK()
+    sdk.event.listen((e) => {
+      const event = e.details
+      switch (event.type) {
+        case "session.updated": {
+          const result = Binary.search(store.session, event.properties.info.id, (s) => s.id)
+          if (result.found) {
+            setStore("session", result.index, reconcile(event.properties.info))
+            break
+          }
+          setStore(
+            "session",
+            produce((draft) => {
+              draft.splice(result.index, 0, event.properties.info)
+            }),
+          )
           break
         }
-        const result = Binary.search(parts, event.properties.part.id, (p) => p.id)
-        if (result.found) {
-          setStore("part", event.properties.part.messageID, result.index, reconcile(event.properties.part))
+        case "message.updated": {
+          const messages = store.message[event.properties.info.sessionID]
+          if (!messages) {
+            setStore("message", event.properties.info.sessionID, [event.properties.info])
+            break
+          }
+          const result = Binary.search(messages, event.properties.info.id, (m) => m.id)
+          if (result.found) {
+            setStore("message", event.properties.info.sessionID, result.index, reconcile(event.properties.info))
+            break
+          }
+          setStore(
+            "message",
+            event.properties.info.sessionID,
+            produce((draft) => {
+              draft.splice(result.index, 0, event.properties.info)
+            }),
+          )
+          break
+        }
+        case "message.part.updated": {
+          const parts = store.part[event.properties.part.messageID]
+          if (!parts) {
+            setStore("part", event.properties.part.messageID, [event.properties.part])
+            break
+          }
+          const result = Binary.search(parts, event.properties.part.id, (p) => p.id)
+          if (result.found) {
+            setStore("part", event.properties.part.messageID, result.index, reconcile(event.properties.part))
+            break
+          }
+          setStore(
+            "part",
+            event.properties.part.messageID,
+            produce((draft) => {
+              draft.splice(result.index, 0, event.properties.part)
+            }),
+          )
           break
         }
-        setStore(
-          "part",
-          event.properties.part.messageID,
-          produce((draft) => {
-            draft.splice(result.index, 0, event.properties.part)
-          }),
-        )
-        break
       }
-    }
-  })
+    })
 
-  const sdk = useSDK()
-
-  const load = {
-    project: () => sdk.project.current().then((x) => setStore("project", x.data!)),
-    provider: () => sdk.config.providers().then((x) => setStore("provider", x.data!.providers)),
-    path: () => sdk.path.get().then((x) => setStore("path", x.data!)),
-    agent: () => sdk.app.agents().then((x) => setStore("agent", x.data ?? [])),
-    session: () =>
-      sdk.session.list().then((x) =>
-        setStore(
-          "session",
-          (x.data ?? []).slice().sort((a, b) => a.id.localeCompare(b.id)),
+    const load = {
+      project: () => sdk.client.project.current().then((x) => setStore("project", x.data!)),
+      provider: () => sdk.client.config.providers().then((x) => setStore("provider", x.data!.providers)),
+      path: () => sdk.client.path.get().then((x) => setStore("path", x.data!)),
+      agent: () => sdk.client.app.agents().then((x) => setStore("agent", x.data ?? [])),
+      session: () =>
+        sdk.client.session.list().then((x) =>
+          setStore(
+            "session",
+            (x.data ?? []).slice().sort((a, b) => a.id.localeCompare(b.id)),
+          ),
         ),
-      ),
-    config: () => sdk.config.get().then((x) => setStore("config", x.data!)),
-    changes: () => sdk.file.status().then((x) => setStore("changes", x.data!)),
-    node: () => sdk.file.list({ query: { path: "/" } }).then((x) => setStore("node", x.data!)),
-  }
+      config: () => sdk.client.config.get().then((x) => setStore("config", x.data!)),
+      changes: () => sdk.client.file.status().then((x) => setStore("changes", x.data!)),
+      node: () => sdk.client.file.list({ query: { path: "/" } }).then((x) => setStore("node", x.data!)),
+    }
 
-  Promise.all(Object.values(load).map((p) => p())).then(() => setStore("ready", true))
+    Promise.all(Object.values(load).map((p) => p())).then(() => setStore("ready", true))
 
-  const sanitizer = createMemo(() => new RegExp(`${store.path.directory}/`, "g"))
-  const sanitize = (text: string) => text.replace(sanitizer(), "")
-  const absolute = (path: string) => (store.path.directory + "/" + path).replace("//", "/")
+    const sanitizer = createMemo(() => new RegExp(`${store.path.directory}/`, "g"))
+    const sanitize = (text: string) => text.replace(sanitizer(), "")
+    const absolute = (path: string) => (store.path.directory + "/" + path).replace("//", "/")
 
-  return {
-    data: store,
-    set: setStore,
-    session: {
-      get(sessionID: string) {
-        const match = Binary.search(store.session, sessionID, (s) => s.id)
-        if (match.found) return store.session[match.index]
-        return undefined
+    return {
+      data: store,
+      set: setStore,
+      get ready() {
+        return store.ready
       },
-      async sync(sessionID: string) {
-        const [session, messages] = await Promise.all([
-          sdk.session.get({ path: { id: sessionID } }),
-          sdk.session.messages({ path: { id: sessionID } }),
-        ])
-        setStore(
-          produce((draft) => {
-            const match = Binary.search(draft.session, sessionID, (s) => s.id)
-            draft.session[match.index] = session.data!
-            draft.message[sessionID] = messages
-              .data!.map((x) => x.info)
-              .slice()
-              .sort((a, b) => a.id.localeCompare(b.id))
-            for (const message of messages.data!) {
-              draft.part[message.info.id] = message.parts.slice().sort((a, b) => a.id.localeCompare(b.id))
-            }
-          }),
-        )
+      session: {
+        get(sessionID: string) {
+          const match = Binary.search(store.session, sessionID, (s) => s.id)
+          if (match.found) return store.session[match.index]
+          return undefined
+        },
+        async sync(sessionID: string, isRetry = false) {
+          const [session, messages] = await Promise.all([
+            sdk.client.session.get({ path: { id: sessionID } }),
+            sdk.client.session.messages({ path: { id: sessionID } }),
+          ])
+
+          // If no messages and this might be a new session, retry after a delay
+          if (!isRetry && messages.data!.length === 0) {
+            setTimeout(() => this.sync(sessionID, true), 500)
+            return
+          }
+
+          setStore(
+            produce((draft) => {
+              const match = Binary.search(draft.session, sessionID, (s) => s.id)
+              draft.session[match.index] = session.data!
+              draft.message[sessionID] = messages
+                .data!.map((x) => x.info)
+                .slice()
+                .sort((a, b) => a.id.localeCompare(b.id))
+              for (const message of messages.data!) {
+                draft.part[message.info.id] = message.parts.slice().sort((a, b) => a.id.localeCompare(b.id))
+              }
+            }),
+          )
+        },
       },
-    },
-    load,
-    absolute,
-    sanitize,
-  }
-}
-
-type SyncContext = ReturnType<typeof init>
-
-const ctx = createContext<SyncContext>()
-
-export function SyncProvider(props: ParentProps) {
-  const value = init()
-  return (
-    <Show when={value.data.ready}>
-      <ctx.Provider value={value}>{props.children}</ctx.Provider>
-    </Show>
-  )
-}
-
-export function useSync() {
-  const value = useContext(ctx)
-  if (!value) {
-    throw new Error("useSync must be used within a SyncProvider")
-  }
-  return value
-}
+      load,
+      absolute,
+      sanitize,
+    }
+  },
+})

packages/desktop/src/index.tsx

@@ -3,10 +3,19 @@ import "@/index.css"
 import { render } from "solid-js/web"
 import { Router, Route } from "@solidjs/router"
 import { MetaProvider } from "@solidjs/meta"
-import { EventProvider, SDKProvider, SyncProvider, LocalProvider, ShikiProvider, MarkedProvider } from "@/context"
 import { Fonts } from "@opencode-ai/ui"
+import { ShikiProvider } from "./context/shiki"
+import { MarkedProvider } from "./context/marked"
+import { SDKProvider } from "./context/sdk"
+import { SyncProvider } from "./context/sync"
+import { LocalProvider } from "./context/local"
 import Home from "@/pages"
 
+const host = import.meta.env.VITE_OPENCODE_SERVER_HOST ?? "127.0.0.1"
+const port = import.meta.env.VITE_OPENCODE_SERVER_PORT ?? "4096"
+
+const url = new URLSearchParams(document.location.search).get("url") || `http://${host}:${port}`
+
 const root = document.getElementById("root")
 if (import.meta.env.DEV && !(root instanceof HTMLElement)) {
   throw new Error(
@@ -18,19 +27,17 @@ render(
   () => (
     <ShikiProvider>
       <MarkedProvider>
-        <SDKProvider>
-          <EventProvider>
-            <SyncProvider>
-              <LocalProvider>
-                <MetaProvider>
-                  <Fonts />
-                  <Router>
-                    <Route path="/" component={Home} />
-                  </Router>
-                </MetaProvider>
-              </LocalProvider>
-            </SyncProvider>
-          </EventProvider>
+        <SDKProvider url={url}>
+          <SyncProvider>
+            <LocalProvider>
+              <MetaProvider>
+                <Fonts />
+                <Router>
+                  <Route path="/" component={Home} />
+                </Router>
+              </MetaProvider>
+            </LocalProvider>
+          </SyncProvider>
         </SDKProvider>
       </MarkedProvider>
     </ShikiProvider>

packages/desktop/src/pages/index.tsx

@@ -1,17 +1,31 @@
-import { Button, Icon, List, Tooltip } from "@opencode-ai/ui"
-import { FileIcon, IconButton } from "@/ui"
+import { Button, List, SelectDialog, Tooltip, IconButton, Tabs, Icon, Accordion } from "@opencode-ai/ui"
+import { FileIcon } from "@/ui"
 import FileTree from "@/components/file-tree"
-import EditorPane from "@/components/editor-pane"
-import { For, Match, onCleanup, onMount, Show, Switch } from "solid-js"
-import { SelectDialog } from "@/components/select-dialog"
-import { useSync, useSDK, useLocal } from "@/context"
-import type { LocalFile, TextSelection } from "@/context/local"
-import SessionTimeline from "@/components/session-timeline"
-import { type PromptContentPart, type PromptSubmitValue } from "@/components/prompt-form"
+import { For, onCleanup, onMount, Show, Match, Switch, createSignal, createEffect, createMemo } from "solid-js"
+import { useLocal, type LocalFile, type TextSelection } from "@/context/local"
 import { createStore } from "solid-js/store"
 import { getDirectory, getFilename } from "@/utils"
-import { PromptInput } from "@/components/prompt-input"
+import { ContentPart, PromptInput } from "@/components/prompt-input"
 import { DateTime } from "luxon"
+import {
+  DragDropProvider,
+  DragDropSensors,
+  DragOverlay,
+  SortableProvider,
+  closestCenter,
+  createSortable,
+  useDragDropContext,
+} from "@thisbeyond/solid-dnd"
+import type { DragEvent, Transformer } from "@thisbeyond/solid-dnd"
+import type { JSX } from "solid-js"
+import { Code } from "@/components/code"
+import { useSync } from "@/context/sync"
+import { useSDK } from "@/context/sdk"
+import { Diff } from "@/components/diff"
+import { ProgressCircle } from "@/components/progress-circle"
+import { AssistantMessage } from "@/components/assistant-message"
+import { type AssistantMessage as AssistantMessageType } from "@opencode-ai/sdk"
+import { DiffChanges } from "@/components/diff-changes"
 
 export default function Page() {
   const local = useLocal()
@@ -19,11 +33,18 @@ export default function Page() {
   const sdk = useSDK()
   const [store, setStore] = createStore({
     clickTimer: undefined as number | undefined,
-    modelSelectOpen: false,
     fileSelectOpen: false,
   })
+  let inputRef!: HTMLDivElement
+  let messageScrollElement!: HTMLDivElement
+  const [activeItem, setActiveItem] = createSignal<string | undefined>(undefined)
 
-  let inputRef: HTMLTextAreaElement | undefined = undefined
+  createEffect(() => {
+    if (!local.session.activeMessage()) return
+    if (!messageScrollElement) return
+    const element = messageScrollElement.querySelector(`[data-message="${local.session.activeMessage()?.id}"]`)
+    element?.scrollIntoView({ block: "start", behavior: "instant" })
+  })
 
   const MOD = typeof navigator === "object" && /(Mac|iPod|iPhone|iPad)/.test(navigator.platform) ? "Meta" : "Control"
 
@@ -38,7 +59,6 @@ export default function Page() {
   const handleKeyDown = (event: KeyboardEvent) => {
     if (event.getModifierState(MOD) && event.shiftKey && event.key.toLowerCase() === "p") {
       event.preventDefault()
-      // TODO: command palette
       return
     }
     if (event.getModifierState(MOD) && event.key.toLowerCase() === "p") {
@@ -50,7 +70,7 @@ export default function Page() {
     const focused = document.activeElement === inputRef
     if (focused) {
       if (event.key === "Escape") {
-        // inputRef?.blur()
+        inputRef?.blur()
       }
       return
     }
@@ -76,8 +96,8 @@ export default function Page() {
       }
     }
 
-    if (event.key.length === 1 && event.key !== "Unidentified") {
-      // inputRef?.focus()
+    if (event.key.length === 1 && event.key !== "Unidentified" && !(event.ctrlKey || event.metaKey)) {
+      inputRef?.focus()
     }
   }
 
@@ -104,17 +124,67 @@ export default function Page() {
     }
   }
 
-  const handlePromptSubmit2 = () => {}
+  const navigateChange = (dir: 1 | -1) => {
+    const active = local.file.active()
+    if (!active) return
+    const current = local.file.changeIndex(active.path)
+    const next = current === undefined ? (dir === 1 ? 0 : -1) : current + dir
+    local.file.setChangeIndex(active.path, next)
+  }
 
-  const handlePromptSubmit = async (prompt: PromptSubmitValue) => {
+  const handleTabChange = (path: string) => {
+    if (path === "chat" || path === "review") return
+    local.file.open(path)
+  }
+
+  const handleTabClose = (file: LocalFile) => {
+    local.file.close(file.path)
+  }
+
+  const handleDragStart = (event: unknown) => {
+    const id = getDraggableId(event)
+    if (!id) return
+    setActiveItem(id)
+  }
+
+  const handleDragOver = (event: DragEvent) => {
+    const { draggable, droppable } = event
+    if (draggable && droppable) {
+      const currentFiles = local.file.opened().map((file) => file.path)
+      const fromIndex = currentFiles.indexOf(draggable.id.toString())
+      const toIndex = currentFiles.indexOf(droppable.id.toString())
+      if (fromIndex !== toIndex) {
+        local.file.move(draggable.id.toString(), toIndex)
+      }
+    }
+  }
+
+  const handleDragEnd = () => {
+    setActiveItem(undefined)
+  }
+
+  const scrollDiffItem = (element: HTMLElement) => {
+    element.scrollIntoView({ block: "start", behavior: "instant" })
+  }
+
+  const handleDiffTriggerClick = (event: MouseEvent) => {
+    const target = event.currentTarget as HTMLElement
+    queueMicrotask(() => {
+      if (target.getAttribute("aria-expanded") !== "true") return
+      const item = target.closest('[data-slot="accordion-item"]') as HTMLElement | null
+      if (!item) return
+      scrollDiffItem(item)
+    })
+  }
+
+  const handlePromptSubmit = async (parts: ContentPart[]) => {
     const existingSession = local.session.active()
     let session = existingSession
     if (!session) {
-      const created = await sdk.session.create()
+      const created = await sdk.client.session.create()
       session = created.data ?? undefined
     }
     if (!session) return
-    local.session.setActive(session.id)
 
     interface SubmissionAttachment {
       path: string
@@ -134,6 +204,7 @@ export default function Page() {
 
     const toAbsolutePath = (path: string) => (path.startsWith("/") ? path : sync.absolute(path))
 
+    const text = parts.map((part) => part.content).join("")
     const attachments = new Map<string, SubmissionAttachment>()
 
     const registerAttachment = (path: string, selection: TextSelection | undefined, label?: string) => {
@@ -147,30 +218,27 @@ export default function Page() {
       })
     }
 
-    const promptAttachments = prompt.parts.filter(
-      (part): part is Extract<PromptContentPart, { kind: "attachment" }> => part.kind === "attachment",
-    )
-
+    const promptAttachments = parts.filter((part) => part.type === "file")
     for (const part of promptAttachments) {
-      registerAttachment(part.path, part.selection, part.display)
+      registerAttachment(part.path, part.selection, part.content)
     }
 
-    const activeFile = local.context.active()
-    if (activeFile) {
-      registerAttachment(
-        activeFile.path,
-        activeFile.selection,
-        activeFile.name ?? formatAttachmentLabel(activeFile.path, activeFile.selection),
-      )
-    }
+    // const activeFile = local.context.active()
+    // if (activeFile) {
+    //   registerAttachment(
+    //     activeFile.path,
+    //     activeFile.selection,
+    //     activeFile.name ?? formatAttachmentLabel(activeFile.path, activeFile.selection),
+    //   )
+    // }
 
-    for (const contextFile of local.context.all()) {
-      registerAttachment(
-        contextFile.path,
-        contextFile.selection,
-        formatAttachmentLabel(contextFile.path, contextFile.selection),
-      )
-    }
+    // for (const contextFile of local.context.all()) {
+    //   registerAttachment(
+    //     contextFile.path,
+    //     contextFile.selection,
+    //     formatAttachmentLabel(contextFile.path, contextFile.selection),
+    //   )
+    // }
 
     const attachmentParts = Array.from(attachments.values()).map((attachment) => {
       const absolute = toAbsolutePath(attachment.path)
@@ -194,7 +262,7 @@ export default function Page() {
       }
     })
 
-    await sdk.session.prompt({
+    await sdk.client.session.prompt({
       path: { id: session.id },
       body: {
         agent: local.agent.current()!.name,
@@ -205,88 +273,539 @@ export default function Page() {
         parts: [
           {
             type: "text",
-            text: prompt.text,
+            text,
           },
           ...attachmentParts,
         ],
       },
     })
+    local.session.setActive(session.id)
   }
 
-  const plus = (
-    <IconButton
-      class="text-text-muted/60 peer-data-[selected]/tab:opacity-100 peer-data-[selected]/tab:text-text peer-data-[selected]/tab:hover:bg-border-subtle hover:opacity-100 peer-hover/tab:opacity-100"
-      size="xs"
-      variant="secondary"
-      onClick={() => setStore("fileSelectOpen", true)}
-    >
-      <Icon name="plus" size={12} />
-    </IconButton>
-  )
+  const handleNewSession = () => {
+    local.session.setActive(undefined)
+    inputRef?.focus()
+  }
+
+  const TabVisual = (props: { file: LocalFile }): JSX.Element => {
+    return (
+      <div class="flex items-center gap-x-1.5">
+        <FileIcon node={props.file} class="_grayscale-100" />
+        <span
+          classList={{
+            "text-14-medium": true,
+            "text-primary": !!props.file.status?.status,
+            italic: !props.file.pinned,
+          }}
+        >
+          {props.file.name}
+        </span>
+        <span class="hidden opacity-70">
+          <Switch>
+            <Match when={props.file.status?.status === "modified"}>
+              <span class="text-primary">M</span>
+            </Match>
+            <Match when={props.file.status?.status === "added"}>
+              <span class="text-success">A</span>
+            </Match>
+            <Match when={props.file.status?.status === "deleted"}>
+              <span class="text-error">D</span>
+            </Match>
+          </Switch>
+        </span>
+      </div>
+    )
+  }
+
+  const SortableTab = (props: {
+    file: LocalFile
+    onTabClick: (file: LocalFile) => void
+    onTabClose: (file: LocalFile) => void
+  }): JSX.Element => {
+    const sortable = createSortable(props.file.path)
+
+    return (
+      // @ts-ignore
+      <div use:sortable classList={{ "h-full": true, "opacity-0": sortable.isActiveDraggable }}>
+        <Tooltip value={props.file.path} placement="bottom" class="h-full">
+          <div class="relative h-full">
+            <Tabs.Trigger value={props.file.path} class="peer/tab pr-7" onClick={() => props.onTabClick(props.file)}>
+              <TabVisual file={props.file} />
+            </Tabs.Trigger>
+            <IconButton
+              icon="close"
+              class="absolute right-1 top-1.5 opacity-0 text-text-muted/60 peer-data-[selected]/tab:opacity-100 peer-data-[selected]/tab:text-text peer-data-[selected]/tab:hover:bg-border-subtle hover:opacity-100 peer-hover/tab:opacity-100"
+              variant="ghost"
+              onClick={() => props.onTabClose(props.file)}
+            />
+          </div>
+        </Tooltip>
+      </div>
+    )
+  }
+
+  const ConstrainDragYAxis = (): JSX.Element => {
+    const context = useDragDropContext()
+    if (!context) return <></>
+    const [, { onDragStart, onDragEnd, addTransformer, removeTransformer }] = context
+    const transformer: Transformer = {
+      id: "constrain-y-axis",
+      order: 100,
+      callback: (transform) => ({ ...transform, y: 0 }),
+    }
+    onDragStart((event) => {
+      const id = getDraggableId(event)
+      if (!id) return
+      addTransformer("draggables", id, transformer)
+    })
+    onDragEnd((event) => {
+      const id = getDraggableId(event)
+      if (!id) return
+      removeTransformer("draggables", id, transformer.id)
+    })
+    return <></>
+  }
+
+  const getDraggableId = (event: unknown): string | undefined => {
+    if (typeof event !== "object" || event === null) return undefined
+    if (!("draggable" in event)) return undefined
+    const draggable = (event as { draggable?: { id?: unknown } }).draggable
+    if (!draggable) return undefined
+    return typeof draggable.id === "string" ? draggable.id : undefined
+  }
 
   return (
     <div class="relative h-screen flex flex-col">
       <header class="hidden h-12 shrink-0 bg-background-strong border-b border-border-weak-base"></header>
       <main class="h-[calc(100vh-0rem)] flex">
-        <div class="shrink-0 w-70 p-1.5 bg-background-weak border-r border-border-weak-base flex flex-col items-start gap-1.5">
-          <div class="flex flex-col items-start self-stretch px-3 py-1">
-            <span class="text-12-medium overflow-hidden text-ellipsis">{sync.data.path.directory}</span>
+        <div class="w-70 shrink-0 bg-background-weak border-r border-border-weak-base flex flex-col items-start">
+          <div class="h-10 flex items-center self-stretch px-5 border-b border-border-weak-base">
+            <span class="text-14-regular overflow-hidden text-ellipsis">{getFilename(sync.data.path.directory)}</span>
           </div>
-          <div class="flex flex-col items-start gap-4 self-stretch flex-1">
-            <div class="px-3 py-1.5 w-full">
-              <Button class="w-full" size="large">
-                New Session
-              </Button>
-            </div>
+          <div class="flex flex-col items-start gap-4 self-stretch flex-1 py-4 px-3">
+            <Button class="w-full" size="large" onClick={handleNewSession} icon="edit-small-2">
+              New Session
+            </Button>
             <List
               data={sync.data.session}
               key={(x) => x.id}
+              current={local.session.active()}
               onSelect={(s) => local.session.setActive(s?.id)}
               onHover={(s) => (!!s ? sync.session.sync(s?.id) : undefined)}
             >
-              {(session) => (
-                <Tooltip placement="right" value={session.title}>
-                  <div>
-                    <div class="flex items-center self-stretch gap-6">
-                      <span class="text-14-regular text-text-strong overflow-hidden text-ellipsis truncate">
-                        {session.title}
-                      </span>
-                      <span class="text-12-regular text-text-weak text-right whitespace-nowrap">
-                        {DateTime.fromMillis(session.time.updated).toRelative()}
-                      </span>
-                    </div>
-                    <div class="flex justify-between items-center self-stretch">
-                      <span class="text-12-regular text-text-weak">2 files changed</span>
-                      <div class="flex gap-2 justify-end items-center">
-                        <span class="text-12-mono text-right text-text-diff-add-base">+43</span>
-                        <span class="text-12-mono text-right text-text-diff-delete-base">-2</span>
+              {(session) => {
+                const diffs = createMemo(() => session.summary?.diffs ?? [])
+                const filesChanged = createMemo(() => diffs().length)
+                return (
+                  <Tooltip placement="right" value={session.title}>
+                    <div>
+                      <div class="flex items-center self-stretch gap-6 justify-between">
+                        <span class="text-14-regular text-text-strong overflow-hidden text-ellipsis truncate">
+                          {session.title}
+                        </span>
+                        <span class="text-12-regular text-text-weak text-right whitespace-nowrap">
+                          {DateTime.fromMillis(session.time.updated).toRelative()}
+                        </span>
+                      </div>
+                      <div class="flex justify-between items-center self-stretch">
+                        <span class="text-12-regular text-text-weak">{`${filesChanged() || "No"} file${filesChanged() !== 1 ? "s" : ""} changed`}</span>
+                        <DiffChanges diff={diffs()} />
                       </div>
                     </div>
-                  </div>
-                </Tooltip>
-              )}
+                  </Tooltip>
+                )
+              }}
             </List>
           </div>
         </div>
-        <div class="relative grid grid-cols-2 bg-background-base">
-          <div class="pt-1.5 min-w-0 overflow-y-auto no-scrollbar flex justify-center">
-            <Show when={local.session.active()}>
-              {(activeSession) => <SessionTimeline session={activeSession().id} class="w-full" />}
-            </Show>
-          </div>
-          <div class="p-1.5 pl-px flex flex-col items-center justify-center overflow-y-auto no-scrollbar">
-            <EditorPane onFileClick={handleFileClick} />
-          </div>
-          <div class="absolute bottom-4 inset-x-0 p-2 flex flex-col justify-center items-center z-50">
-            <PromptInput onSubmit={handlePromptSubmit2} />
-            {/* <PromptForm */}
-            {/*   class="w-2xl" */}
-            {/*   onSubmit={handlePromptSubmit} */}
-            {/*   onOpenModelSelect={() => setStore("modelSelectOpen", true)} */}
-            {/*   onInputRefChange={(element: HTMLTextAreaElement | undefined) => { */}
-            {/*     inputRef = element ?? undefined */}
-            {/*   }} */}
-            {/* /> */}
+        <div class="relative bg-background-base w-full h-full overflow-x-hidden">
+          <DragDropProvider
+            onDragStart={handleDragStart}
+            onDragEnd={handleDragEnd}
+            onDragOver={handleDragOver}
+            collisionDetector={closestCenter}
+          >
+            <DragDropSensors />
+            <ConstrainDragYAxis />
+            <Tabs onChange={handleTabChange}>
+              <div class="sticky top-0 shrink-0 flex">
+                <Tabs.List>
+                  <Tabs.Trigger value="chat" class="flex gap-x-4 items-center">
+                    <div>Chat</div>
+                    <Tooltip value={`${local.session.tokens() ?? 0} Tokens`} class="flex items-center gap-1.5">
+                      <ProgressCircle percentage={local.session.context() ?? 0} />
+                      <div class="text-14-regular text-text-weak text-right">{local.session.context() ?? 0}%</div>
+                    </Tooltip>
+                  </Tabs.Trigger>
+                  {/* <Tabs.Trigger value="review">Review</Tabs.Trigger> */}
+                  <SortableProvider ids={local.file.opened().map((file) => file.path)}>
+                    <For each={local.file.opened()}>
+                      {(file) => <SortableTab file={file} onTabClick={handleFileClick} onTabClose={handleTabClose} />}
+                    </For>
+                  </SortableProvider>
+                  <div class="bg-background-base h-full flex items-center justify-center border-b border-border-weak-base px-3">
+                    <IconButton
+                      icon="plus-small"
+                      variant="ghost"
+                      iconSize="large"
+                      onClick={() => setStore("fileSelectOpen", true)}
+                    />
+                  </div>
+                </Tabs.List>
+                <div class="hidden shrink-0 h-full _flex items-center gap-1 px-2 border-b border-border-subtle/40">
+                  <Show when={local.file.active() && local.file.active()!.content?.diff}>
+                    {(() => {
+                      const activeFile = local.file.active()!
+                      const view = local.file.view(activeFile.path)
+                      return (
+                        <div class="flex items-center gap-1">
+                          <Show when={view !== "raw"}>
+                            <div class="mr-1 flex items-center gap-1">
+                              <Tooltip value="Previous change" placement="bottom">
+                                <IconButton icon="arrow-up" variant="ghost" onClick={() => navigateChange(-1)} />
+                              </Tooltip>
+                              <Tooltip value="Next change" placement="bottom">
+                                <IconButton icon="arrow-down" variant="ghost" onClick={() => navigateChange(1)} />
+                              </Tooltip>
+                            </div>
+                          </Show>
+                          <Tooltip value="Raw" placement="bottom">
+                            <IconButton
+                              icon="file-text"
+                              variant="ghost"
+                              classList={{
+                                "text-text": view === "raw",
+                                "text-text-muted/70": view !== "raw",
+                                "bg-background-element": view === "raw",
+                              }}
+                              onClick={() => local.file.setView(activeFile.path, "raw")}
+                            />
+                          </Tooltip>
+                          <Tooltip value="Unified diff" placement="bottom">
+                            <IconButton
+                              icon="checklist"
+                              variant="ghost"
+                              classList={{
+                                "text-text": view === "diff-unified",
+                                "text-text-muted/70": view !== "diff-unified",
+                                "bg-background-element": view === "diff-unified",
+                              }}
+                              onClick={() => local.file.setView(activeFile.path, "diff-unified")}
+                            />
+                          </Tooltip>
+                          <Tooltip value="Split diff" placement="bottom">
+                            <IconButton
+                              icon="columns"
+                              variant="ghost"
+                              classList={{
+                                "text-text": view === "diff-split",
+                                "text-text-muted/70": view !== "diff-split",
+                                "bg-background-element": view === "diff-split",
+                              }}
+                              onClick={() => local.file.setView(activeFile.path, "diff-split")}
+                            />
+                          </Tooltip>
+                        </div>
+                      )
+                    })()}
+                  </Show>
+                </div>
+              </div>
+              <Tabs.Content value="chat" class="select-text flex flex-col flex-1 min-h-0">
+                <div class="p-6 pt-12 max-w-[904px] w-full mx-auto flex flex-col flex-1 min-h-0">
+                  <Show
+                    when={local.session.active()}
+                    fallback={
+                      <div class="flex flex-col pb-36 justify-end items-start gap-4 flex-[1_0_0] self-stretch">
+                        <div class="text-20-medium text-text-weaker">New session</div>
+                        <div class="flex justify-center items-center gap-3">
+                          <Icon name="folder" size="small" />
+                          <div class="text-12-medium text-text-weak">
+                            {getDirectory(sync.data.path.directory)}/
+                            <span class="text-text-strong">{getFilename(sync.data.path.directory)}</span>
+                          </div>
+                        </div>
+                        <div class="flex justify-center items-center gap-3">
+                          <Icon name="pencil-line" size="small" />
+                          <div class="text-12-medium text-text-weak">
+                            Last modified&nbsp;
+                            <span class="text-text-strong">
+                              {DateTime.fromMillis(sync.data.project.time.created).toRelative()}
+                            </span>
+                          </div>
+                        </div>
+                      </div>
+                    }
+                  >
+                    {(activeSession) => (
+                      <div class="py-3 flex flex-col flex-1 min-h-0">
+                        <div class="flex items-start gap-8 flex-1 min-h-0">
+                          <Show when={local.session.userMessages().length > 1}>
+                            <ul role="list" class="w-60 shrink-0 flex flex-col items-start gap-1">
+                              <For each={local.session.userMessages()}>
+                                {(message) => {
+                                  const countLines = (text: string) => {
+                                    if (!text) return 0
+                                    return text.split("\n").length
+                                  }
+
+                                  const additions = createMemo(
+                                    () =>
+                                      message.summary?.diffs.reduce((acc, diff) => acc + (diff.additions ?? 0), 0) ?? 0,
+                                  )
+
+                                  const deletions = createMemo(
+                                    () =>
+                                      message.summary?.diffs.reduce((acc, diff) => acc + (diff.deletions ?? 0), 0) ?? 0,
+                                  )
+
+                                  const totalBeforeLines = createMemo(
+                                    () =>
+                                      message.summary?.diffs.reduce((acc, diff) => acc + countLines(diff.before), 0) ??
+                                      0,
+                                  )
+
+                                  const blockCounts = createMemo(() => {
+                                    const TOTAL_BLOCKS = 5
+
+                                    const adds = additions()
+                                    const dels = deletions()
+                                    const unchanged = Math.max(0, totalBeforeLines() - dels)
+
+                                    const totalActivity = unchanged + adds + dels
+
+                                    if (totalActivity === 0) {
+                                      return { added: 0, deleted: 0, neutral: TOTAL_BLOCKS }
+                                    }
+
+                                    const percentAdded = adds / totalActivity
+                                    const percentDeleted = dels / totalActivity
+                                    const added_raw = percentAdded * TOTAL_BLOCKS
+                                    const deleted_raw = percentDeleted * TOTAL_BLOCKS
+
+                                    let added = adds > 0 ? Math.ceil(added_raw) : 0
+                                    let deleted = dels > 0 ? Math.ceil(deleted_raw) : 0
+
+                                    let total_allocated = added + deleted
+                                    if (total_allocated > TOTAL_BLOCKS) {
+                                      if (added_raw < deleted_raw) {
+                                        added = Math.floor(added_raw)
+                                      } else {
+                                        deleted = Math.floor(deleted_raw)
+                                      }
+
+                                      total_allocated = added + deleted
+                                      if (total_allocated > TOTAL_BLOCKS) {
+                                        if (added_raw < deleted_raw) {
+                                          deleted = Math.floor(deleted_raw)
+                                        } else {
+                                          added = Math.floor(added_raw)
+                                        }
+                                      }
+                                    }
+
+                                    const neutral = Math.max(0, TOTAL_BLOCKS - added - deleted)
+
+                                    return { added, deleted, neutral }
+                                  })
+
+                                  const ADD_COLOR = "var(--icon-diff-add-base)"
+                                  const DELETE_COLOR = "var(--icon-diff-delete-base)"
+                                  const NEUTRAL_COLOR = "var(--icon-weak-base)"
+
+                                  const visibleBlocks = createMemo(() => {
+                                    const counts = blockCounts()
+                                    const blocks = [
+                                      ...Array(counts.added).fill(ADD_COLOR),
+                                      ...Array(counts.deleted).fill(DELETE_COLOR),
+                                      ...Array(counts.neutral).fill(NEUTRAL_COLOR),
+                                    ]
+                                    return blocks.slice(0, 5)
+                                  })
+
+                                  return (
+                                    <li
+                                      class="group/li flex items-center gap-x-2 py-1 self-stretch cursor-default"
+                                      onClick={() => local.session.setActiveMessage(message.id)}
+                                    >
+                                      <div class="w-[18px] shrink-0">
+                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 12" fill="none">
+                                          <g>
+                                            <For each={visibleBlocks()}>
+                                              {(color, i) => (
+                                                <rect x={i() * 4} width="2" height="12" rx="1" fill={color} />
+                                              )}
+                                            </For>
+                                          </g>
+                                        </svg>
+                                      </div>
+                                      <div
+                                        data-active={local.session.activeMessage()?.id === message.id}
+                                        classList={{
+                                          "text-14-regular text-text-weak whitespace-nowrap truncate min-w-0": true,
+                                          "text-text-weak data-[active=true]:text-text-strong group-hover/li:text-text-base": true,
+                                        }}
+                                      >
+                                        {message.summary?.title ?? local.session.getMessageText(message)}
+                                      </div>
+                                    </li>
+                                  )
+                                }}
+                              </For>
+                            </ul>
+                          </Show>
+                          <div ref={messageScrollElement} class="grow min-w-0 h-full overflow-y-auto no-scrollbar">
+                            <div class="flex flex-col items-start gap-50 pb-[800px]">
+                              <For each={local.session.userMessages()}>
+                                {(message) => {
+                                  const title = createMemo(() => message.summary?.title)
+                                  const prompt = createMemo(() => local.session.getMessageText(message))
+                                  const summary = createMemo(() => message.summary?.body)
+                                  const assistantMessages = createMemo(() => {
+                                    return sync.data.message[activeSession().id]?.filter(
+                                      (m) => m.role === "assistant" && m.parentID == message.id,
+                                    ) as AssistantMessageType[]
+                                  })
+
+                                  return (
+                                    <div
+                                      data-message={message.id}
+                                      class="flex flex-col items-start self-stretch gap-14 pt-1.5"
+                                    >
+                                      {/* Title */}
+                                      <div class="flex flex-col items-start gap-2 self-stretch">
+                                        <h1 class="text-14-medium text-text-strong overflow-hidden text-ellipsis min-w-0">
+                                          {title() ?? prompt()}
+                                        </h1>
+                                        <Show when={title}>
+                                          <div class="text-12-regular text-text-base">{prompt()}</div>
+                                        </Show>
+                                      </div>
+                                      {/* Summary */}
+                                      <div class="w-full flex flex-col gap-6 items-start self-stretch">
+                                        <Show when={summary}>
+                                          <div class="flex flex-col items-start gap-1 self-stretch">
+                                            <h2 class="text-12-medium text-text-weak">Summary</h2>
+                                            <div class="text-14-regular text-text-base self-stretch">{summary()}</div>
+                                          </div>
+                                        </Show>
+                                        <Show when={message.summary?.diffs.length}>
+                                          <Accordion class="w-full" multiple>
+                                            <For each={message.summary?.diffs || []}>
+                                              {(diff) => (
+                                                <Accordion.Item value={diff.file}>
+                                                  <Accordion.Header>
+                                                    <Accordion.Trigger onClick={handleDiffTriggerClick}>
+                                                      <div class="flex items-center justify-between w-full">
+                                                        <div class="flex items-center gap-5">
+                                                          <FileIcon
+                                                            node={{ path: diff.file, type: "file" }}
+                                                            class="shrink-0 size-4"
+                                                          />
+                                                          <div class="flex">
+                                                            <Show when={diff.file.includes("/")}>
+                                                              <span class="text-text-base">
+                                                                {getDirectory(diff.file)}/
+                                                              </span>
+                                                            </Show>
+                                                            <span class="text-text-strong">
+                                                              {getFilename(diff.file)}
+                                                            </span>
+                                                          </div>
+                                                        </div>
+                                                        <div class="flex gap-4 items-center justify-end">
+                                                          <DiffChanges diff={diff} />
+                                                          <Icon name="chevron-grabber-vertical" size="small" />
+                                                        </div>
+                                                      </div>
+                                                    </Accordion.Trigger>
+                                                  </Accordion.Header>
+                                                  <Accordion.Content>
+                                                    <Diff
+                                                      before={{
+                                                        name: diff.file!,
+                                                        contents: diff.before!,
+                                                      }}
+                                                      after={{
+                                                        name: diff.file!,
+                                                        contents: diff.after!,
+                                                      }}
+                                                    />
+                                                  </Accordion.Content>
+                                                </Accordion.Item>
+                                              )}
+                                            </For>
+                                          </Accordion>
+                                        </Show>
+                                      </div>
+                                      {/* Response */}
+                                      <div data-todo="Response" class="w-full">
+                                        <div class="flex flex-col items-start gap-1 self-stretch">
+                                          <h2 class="text-12-medium text-text-weak">Response</h2>
+                                        </div>
+                                        <div class="w-full flex flex-col items-start self-stretch gap-8">
+                                          <For each={assistantMessages()}>
+                                            {(assistantMessage) => {
+                                              const parts = createMemo(() => sync.data.part[assistantMessage.id])
+                                              return <AssistantMessage message={assistantMessage} parts={parts()} />
+                                            }}
+                                          </For>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  )
+                                }}
+                              </For>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    )}
+                  </Show>
+                </div>
+              </Tabs.Content>
+              {/* <Tabs.Content value="review" class="select-text"></Tabs.Content> */}
+              <For each={local.file.opened()}>
+                {(file) => (
+                  <Tabs.Content value={file.path} class="select-text">
+                    {(() => {
+                      const view = local.file.view(file.path)
+                      const showRaw = view === "raw" || !file.content?.diff
+                      const code = showRaw ? (file.content?.content ?? "") : (file.content?.diff ?? "")
+                      return <Code path={file.path} code={code} class="[&_code]:pb-60" />
+                    })()}
+                  </Tabs.Content>
+                )}
+              </For>
+            </Tabs>
+            <DragOverlay>
+              {(() => {
+                const id = activeItem()
+                if (!id) return null
+                const draggedFile = local.file.node(id)
+                if (!draggedFile) return null
+                return (
+                  <div class="relative px-3 h-8 flex items-center text-sm font-medium text-text whitespace-nowrap shrink-0 bg-background-panel border-x border-border-subtle/40 border-b border-b-transparent">
+                    <TabVisual file={draggedFile} />
+                  </div>
+                )
+              })()}
+            </DragOverlay>
+          </DragDropProvider>
+          <div
+            classList={{
+              "absolute inset-x-0 px-6 max-w-[904px] flex flex-col justify-center items-center z-50 mx-auto": true,
+              "bottom-8": true,
+              // "bottom-8": !!local.session.active(),
+              // "bottom-1/2 translate-y-1/2": !local.session.active(),
+            }}
+          >
+            <PromptInput
+              ref={(el) => {
+                inputRef = el
+              }}
+              onSubmit={handlePromptSubmit}
+            />
           </div>
           <div class="hidden shrink-0 w-56 p-2 h-full overflow-y-auto">
             <FileTree path="" onFileClick={handleFileClick} />
@@ -302,7 +821,7 @@ export default function Page() {
                     <li>
                       <button
                         onClick={() => local.file.open(path, { view: "diff-unified", pinned: true })}
-                        class="w-full flex items-center px-2 py-0.5 gap-x-2 text-text-muted grow min-w-0 cursor-pointer hover:bg-background-element"
+                        class="w-full flex items-center px-2 py-0.5 gap-x-2 text-text-muted grow min-w-0 hover:bg-background-element"
                       >
                         <FileIcon node={{ path, type: "file" }} class="shrink-0 size-3" />
                         <span class="text-xs text-text whitespace-nowrap">{getFilename(path)}</span>
@@ -318,73 +837,36 @@ export default function Page() {
           </div>
         </div>
       </main>
-      <Show when={store.modelSelectOpen}>
-        <SelectDialog
-          key={(x) => `${x.provider.id}:${x.id}`}
-          items={local.model.list()}
-          current={local.model.current()}
-          render={(i) => (
-            <div class="w-full flex items-center justify-between">
-              <div class="flex items-center gap-x-2 text-text-muted grow min-w-0">
-                <img src={`https://models.dev/logos/${i.provider.id}.svg`} class="size-4 invert opacity-40" />
-                <span class="text-xs text-text whitespace-nowrap">{i.name}</span>
-                <span class="text-xs text-text-muted/80 whitespace-nowrap overflow-hidden overflow-ellipsis truncate min-w-0">
-                  {i.id}
-                </span>
-              </div>
-              <div class="flex items-center gap-x-1 text-text-muted/40 shrink-0">
-                <Tooltip forceMount={false} value="Reasoning">
-                  <Icon name="brain" size={16} classList={{ "text-accent": i.reasoning }} />
-                </Tooltip>
-                <Tooltip forceMount={false} value="Tools">
-                  <Icon name="hammer" size={16} classList={{ "text-secondary": i.tool_call }} />
-                </Tooltip>
-                <Tooltip forceMount={false} value="Attachments">
-                  <Icon name="photo" size={16} classList={{ "text-success": i.attachment }} />
-                </Tooltip>
-                <div class="rounded-full bg-text-muted/20 text-text-muted/80 w-9 h-4 flex items-center justify-center text-[10px]">
-                  {new Intl.NumberFormat("en-US", {
-                    notation: "compact",
-                    compactDisplay: "short",
-                  }).format(i.limit.context)}
-                </div>
-                <Tooltip forceMount={false} value={`$${i.cost?.input}/1M input, $${i.cost?.output}/1M output`}>
-                  <div class="rounded-full bg-success/20 text-success/80 w-9 h-4 flex items-center justify-center text-[10px]">
-                    <Switch fallback="FREE">
-                      <Match when={i.cost?.input > 10}>$$$</Match>
-                      <Match when={i.cost?.input > 1}>$$</Match>
-                      <Match when={i.cost?.input > 0.1}>$</Match>
-                    </Switch>
-                  </div>
-                </Tooltip>
-              </div>
-            </div>
-          )}
-          filter={["provider.name", "name", "id"]}
-          groupBy={(x) => x.provider.name}
-          onClose={() => setStore("modelSelectOpen", false)}
-          onSelect={(x) => local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined)}
-        />
-      </Show>
       <Show when={store.fileSelectOpen}>
         <SelectDialog
+          defaultOpen
+          title="Select file"
+          placeholder="Search files"
+          emptyMessage="No files found"
           items={local.file.search}
           key={(x) => x}
-          render={(i) => (
-            <div class="w-full flex items-center justify-between">
-              <div class="flex items-center gap-x-2 text-text-muted grow min-w-0">
+          onOpenChange={(open) => setStore("fileSelectOpen", open)}
+          onSelect={(x) => (x ? local.file.open(x, { pinned: true }) : undefined)}
+        >
+          {(i) => (
+            <div
+              classList={{
+                "w-full flex items-center justify-between rounded-md": true,
+              }}
+            >
+              <div class="flex items-center gap-x-2 grow min-w-0">
                 <FileIcon node={{ path: i, type: "file" }} class="shrink-0 size-4" />
-                <span class="text-xs text-text whitespace-nowrap">{getFilename(i)}</span>
-                <span class="text-xs text-text-muted/80 whitespace-nowrap overflow-hidden overflow-ellipsis truncate min-w-0">
-                  {getDirectory(i)}
-                </span>
+                <div class="flex items-center text-14-regular">
+                  <span class="text-text-weak whitespace-nowrap overflow-hidden overflow-ellipsis truncate min-w-0">
+                    {getDirectory(i)}/
+                  </span>
+                  <span class="text-text-strong whitespace-nowrap">{getFilename(i)}</span>
+                </div>
               </div>
               <div class="flex items-center gap-x-1 text-text-muted/40 shrink-0"></div>
             </div>
           )}
-          onClose={() => setStore("fileSelectOpen", false)}
-          onSelect={(x) => (x ? local.file.open(x, { pinned: true }) : undefined)}
-        />
+        </SelectDialog>
       </Show>
     </div>
   )

packages/desktop/src/ui/collapsible.tsx

@@ -16,7 +16,7 @@ function CollapsibleTrigger(props: CollapsibleTriggerProps) {
   return (
     <KobalteCollapsible.Trigger
       classList={{
-        "w-full group/collapsible cursor-pointer": true,
+        "w-full group/collapsible": true,
         [local.class ?? ""]: !!local.class,
       }}
       {...others}

packages/desktop/src/ui/icon-button.tsx

@@ -1,38 +0,0 @@
-import { Button as KobalteButton } from "@kobalte/core/button"
-import { splitProps } from "solid-js"
-import type { ComponentProps, JSX } from "solid-js"
-
-export interface IconButtonProps extends ComponentProps<typeof KobalteButton> {
-  variant?: "primary" | "secondary" | "outline" | "ghost"
-  size?: "xs" | "sm" | "md" | "lg"
-  children: JSX.Element
-}
-
-export function IconButton(props: IconButtonProps) {
-  const [local, others] = splitProps(props, ["variant", "size", "class", "classList"])
-  return (
-    <KobalteButton
-      classList={{
-        ...(local.classList || {}),
-        "inline-flex items-center justify-center rounded-md font-medium cursor-pointer": true,
-        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2": true,
-        "disabled:pointer-events-none disabled:opacity-50": true,
-        "bg-primary text-background hover:bg-secondary focus-visible:ring-primary data-[disabled]:opacity-50":
-          (local.variant || "primary") === "primary",
-        "bg-background-panel text-text hover:bg-background-element focus-visible:ring-secondary data-[disabled]:opacity-50":
-          local.variant === "secondary",
-        "border border-border bg-transparent text-text hover:bg-background-panel": local.variant === "outline",
-        "focus-visible:ring-border-active data-[disabled]:border-border-subtle data-[disabled]:text-text-muted":
-          local.variant === "outline",
-        "text-text hover:bg-background-panel focus-visible:ring-border-active data-[disabled]:text-text-muted":
-          local.variant === "ghost",
-        "h-5 w-5 text-xs": local.size === "xs",
-        "h-8 w-8 text-sm": local.size === "sm",
-        "h-10 w-10 text-sm": (local.size || "md") === "md",
-        "h-12 w-12 text-base": local.size === "lg",
-        [local.class ?? ""]: !!local.class,
-      }}
-      {...others}
-    />
-  )
-}

packages/desktop/src/ui/index.ts

@@ -5,4 +5,3 @@ export {
   type CollapsibleContentProps,
 } from "./collapsible"
 export { FileIcon, type FileIconProps } from "./file-icon"
-export { IconButton, type IconButtonProps } from "./icon-button"

packages/function/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/function",
-  "version": "0.15.9",
+  "version": "0.15.19",
   "$schema": "https://json.schemastore.org/package.json",
   "private": true,
   "type": "module",

packages/opencode/package.json

@@ -1,6 +1,6 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
-  "version": "0.15.9",
+  "version": "0.15.19",
   "name": "opencode",
   "type": "module",
   "private": true,
@@ -29,12 +29,12 @@
     "typescript": "catalog:",
     "@typescript/native-preview": "catalog:",
     "vscode-languageserver-types": "3.17.5",
-    "zod-to-json-schema": "3.24.5",
     "@opencode-ai/script": "workspace:*"
   },
   "dependencies": {
     "@actions/core": "1.11.1",
     "@actions/github": "6.0.1",
+    "@agentclientprotocol/sdk": "0.4.9",
     "@clack/prompts": "1.0.0-alpha.1",
     "@hono/standard-validator": "0.1.5",
     "@hono/zod-validator": "catalog:",
@@ -46,6 +46,7 @@
     "@opencode-ai/script": "workspace:*",
     "@opencode-ai/sdk": "workspace:*",
     "@parcel/watcher": "2.5.1",
+    "@pierre/precision-diffs": "catalog:",
     "@standard-schema/spec": "1.0.0",
     "@zip.js/zip.js": "2.7.62",
     "ai": "catalog:",
@@ -69,6 +70,7 @@
     "web-tree-sitter": "0.22.6",
     "xdg-basedir": "5.1.0",
     "yargs": "18.0.0",
-    "zod": "catalog:"
+    "zod": "catalog:",
+    "zod-to-json-schema": "3.24.5"
   }
 }

packages/opencode/script/build.ts

@@ -1,6 +1,11 @@
 #!/usr/bin/env bun
 import path from "path"
-const dir = new URL("..", import.meta.url).pathname
+import { fileURLToPath } from "url"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const dir = path.resolve(__dirname, "..")
+
 process.chdir(dir)
 import { $ } from "bun"
 
@@ -40,6 +45,7 @@ for (const [os, arch] of targets) {
   await $`tar -xf ../../node_modules/${watcher.replace("@parcel/", "parcel-")}-*.tgz -C ../../node_modules/${watcher} --strip-components=1`
 
   await Bun.build({
+    sourcemap: "external",
     compile: {
       target: `bun-${os}-${arch}` as any,
       outfile: `dist/${name}/bin/opencode`,

packages/opencode/script/publish.ts

@@ -51,13 +51,16 @@ if (!Script.preview) {
   const macX64Sha = await $`sha256sum ./dist/opencode-darwin-x64.zip | cut -d' ' -f1`.text().then((x) => x.trim())
   const macArm64Sha = await $`sha256sum ./dist/opencode-darwin-arm64.zip | cut -d' ' -f1`.text().then((x) => x.trim())
 
+  const [pkgver, _subver = ""] = Script.version.split(/(-.*)/, 2)
+
   // arch
   const binaryPkgbuild = [
     "# Maintainer: dax",
     "# Maintainer: adam",
     "",
     "pkgname='opencode-bin'",
-    `pkgver=${Script.version.split("-")[0]}`,
+    `pkgver=${pkgver}`,
+    `_subver=${_subver}`,
     "options=('!debug' '!strip')",
     "pkgrel=1",
     "pkgdesc='The AI coding agent built for the terminal.'",
@@ -68,10 +71,10 @@ if (!Script.preview) {
     "conflicts=('opencode')",
     "depends=('fzf' 'ripgrep')",
     "",
-    `source_aarch64=("\${pkgname}_\${pkgver}_aarch64.zip::https://github.com/sst/opencode/releases/download/v${Script.version}/opencode-linux-arm64.zip")`,
+    `source_aarch64=("\${pkgname}_\${pkgver}_aarch64.zip::https://github.com/sst/opencode/releases/download/v\${pkgver}\${_subver}/opencode-linux-arm64.zip")`,
     `sha256sums_aarch64=('${arm64Sha}')`,
     "",
-    `source_x86_64=("\${pkgname}_\${pkgver}_x86_64.zip::https://github.com/sst/opencode/releases/download/v${Script.version}/opencode-linux-x64.zip")`,
+    `source_x86_64=("\${pkgname}_\${pkgver}_x86_64.zip::https://github.com/sst/opencode/releases/download/v\${pkgver}\${_subver}/opencode-linux-x64.zip")`,
     `sha256sums_x86_64=('${x64Sha}')`,
     "",
     "package() {",
@@ -86,7 +89,8 @@ if (!Script.preview) {
     "# Maintainer: adam",
     "",
     "pkgname='opencode'",
-    `pkgver=${Script.version.split("-")[0]}`,
+    `pkgver=${pkgver}`,
+    `_subver=${_subver}`,
     "options=('!debug' '!strip')",
     "pkgrel=1",
     "pkgdesc='The AI coding agent built for the terminal.'",
@@ -98,7 +102,7 @@ if (!Script.preview) {
     "depends=('fzf' 'ripgrep')",
     "makedepends=('git' 'bun-bin' 'go')",
     "",
-    `source=("opencode-\${pkgver}.tar.gz::https://github.com/sst/opencode/archive/v${Script.version}.tar.gz")`,
+    `source=("opencode-\${pkgver}.tar.gz::https://github.com/sst/opencode/archive/v\${pkgver}\${_subver}.tar.gz")`,
     `sha256sums=('SKIP')`,
     "",
     "build() {",

packages/opencode/script/schema.ts

@@ -1,6 +1,6 @@
 #!/usr/bin/env bun
 
-import { z } from "zod/v4"
+import { z } from "zod"
 import { Config } from "../src/config/config"
 
 const file = process.argv[2]

packages/opencode/src/acp/README.md

@@ -0,0 +1,164 @@
+# ACP (Agent Client Protocol) Implementation
+
+This directory contains a clean, protocol-compliant implementation of the [Agent Client Protocol](https://agentclientprotocol.com/) for opencode.
+
+## Architecture
+
+The implementation follows a clean separation of concerns:
+
+### Core Components
+
+- **`agent.ts`** - Implements the `Agent` interface from `@agentclientprotocol/sdk`
+  - Handles initialization and capability negotiation
+  - Manages session lifecycle (`session/new`, `session/load`)
+  - Processes prompts and returns responses
+  - Properly implements ACP protocol v1
+
+- **`client.ts`** - Implements the `Client` interface for client-side capabilities
+  - File operations (`readTextFile`, `writeTextFile`)
+  - Permission requests (auto-approves for now)
+  - Terminal support (stub implementation)
+
+- **`session.ts`** - Session state management
+  - Creates and tracks ACP sessions
+  - Maps ACP sessions to internal opencode sessions
+  - Maintains working directory context
+  - Handles MCP server configurations
+
+- **`server.ts`** - ACP server startup and lifecycle
+  - Sets up JSON-RPC over stdio using the official library
+  - Manages graceful shutdown on SIGTERM/SIGINT
+  - Provides Instance context for the agent
+
+- **`types.ts`** - Type definitions for internal use
+
+## Usage
+
+### Command Line
+
+```bash
+# Start the ACP server in the current directory
+opencode acp
+
+# Start in a specific directory
+opencode acp --cwd /path/to/project
+```
+
+### Programmatic
+
+```typescript
+import { ACPServer } from "./acp/server"
+
+await ACPServer.start()
+```
+
+### Integration with Zed
+
+Add to your Zed configuration (`~/.config/zed/settings.json`):
+
+```json
+{
+  "agent_servers": {
+    "OpenCode": {
+      "command": "opencode",
+      "args": ["acp"]
+    }
+  }
+}
+```
+
+## Protocol Compliance
+
+This implementation follows the ACP specification v1:
+
+✅ **Initialization**
+
+- Proper `initialize` request/response with protocol version negotiation
+- Capability advertisement (`agentCapabilities`)
+- Authentication support (stub)
+
+✅ **Session Management**
+
+- `session/new` - Create new conversation sessions
+- `session/load` - Resume existing sessions (basic support)
+- Working directory context (`cwd`)
+- MCP server configuration support
+
+✅ **Prompting**
+
+- `session/prompt` - Process user messages
+- Content block handling (text, resources)
+- Response with stop reasons
+
+✅ **Client Capabilities**
+
+- File read/write operations
+- Permission requests
+- Terminal support (stub for future)
+
+## Current Limitations
+
+### Not Yet Implemented
+
+1. **Streaming Responses** - Currently returns complete responses instead of streaming via `session/update` notifications
+2. **Tool Call Reporting** - Doesn't report tool execution progress
+3. **Session Modes** - No mode switching support yet
+4. **Authentication** - No actual auth implementation
+5. **Terminal Support** - Placeholder only
+6. **Session Persistence** - `session/load` doesn't restore actual conversation history
+
+### Future Enhancements
+
+- **Real-time Streaming**: Implement `session/update` notifications for progressive responses
+- **Tool Call Visibility**: Report tool executions as they happen
+- **Session Persistence**: Save and restore full conversation history
+- **Mode Support**: Implement different operational modes (ask, code, etc.)
+- **Enhanced Permissions**: More sophisticated permission handling
+- **Terminal Integration**: Full terminal support via opencode's bash tool
+
+## Testing
+
+```bash
+# Run ACP tests
+bun test test/acp.test.ts
+
+# Test manually with stdio
+echo '{"jsonrpc":"2.0","id":1,"method":"initialize","params":{"protocolVersion":1}}' | opencode acp
+```
+
+## Design Decisions
+
+### Why the Official Library?
+
+We use `@agentclientprotocol/sdk` instead of implementing JSON-RPC ourselves because:
+
+- Ensures protocol compliance
+- Handles edge cases and future protocol versions
+- Reduces maintenance burden
+- Works with other ACP clients automatically
+
+### Clean Architecture
+
+Each component has a single responsibility:
+
+- **Agent** = Protocol interface
+- **Client** = Client-side operations
+- **Session** = State management
+- **Server** = Lifecycle and I/O
+
+This makes the codebase maintainable and testable.
+
+### Mapping to OpenCode
+
+ACP sessions map cleanly to opencode's internal session model:
+
+- ACP `session/new` → creates internal Session
+- ACP `session/prompt` → uses SessionPrompt.prompt()
+- Working directory context preserved per-session
+- Tool execution uses existing ToolRegistry
+
+## References
+
+- [ACP Specification](https://agentclientprotocol.com/)
+- [TypeScript Library](https://github.com/agentclientprotocol/typescript-sdk)
+- [Protocol Examples](https://github.com/agentclientprotocol/typescript-sdk/tree/main/src/examples)

packages/opencode/src/acp/agent.ts

@@ -0,0 +1,704 @@
+import {
+  type Agent as ACPAgent,
+  type AgentSideConnection,
+  type AuthenticateRequest,
+  type CancelNotification,
+  type InitializeRequest,
+  type LoadSessionRequest,
+  type NewSessionRequest,
+  type PermissionOption,
+  type PlanEntry,
+  type PromptRequest,
+  type SetSessionModelRequest,
+  type SetSessionModeRequest,
+  type SetSessionModeResponse,
+  type ToolCallContent,
+  type ToolKind,
+} from "@agentclientprotocol/sdk"
+import { Log } from "../util/log"
+import { ACPSessionManager } from "./session"
+import type { ACPConfig } from "./types"
+import { Provider } from "../provider/provider"
+import { SessionPrompt } from "../session/prompt"
+import { Installation } from "@/installation"
+import { SessionLock } from "@/session/lock"
+import { Bus } from "@/bus"
+import { MessageV2 } from "@/session/message-v2"
+import { Storage } from "@/storage/storage"
+import { Command } from "@/command"
+import { Agent as Agents } from "@/agent/agent"
+import { Permission } from "@/permission"
+import { Session } from "@/session"
+import { Identifier } from "@/id/id"
+import { SessionCompaction } from "@/session/compaction"
+import type { Config } from "@/config/config"
+import { MCP } from "@/mcp"
+import { Todo } from "@/session/todo"
+import { z } from "zod"
+
+export namespace ACP {
+  const log = Log.create({ service: "acp-agent" })
+
+  export class Agent implements ACPAgent {
+    private sessionManager = new ACPSessionManager()
+    private connection: AgentSideConnection
+    private config: ACPConfig
+
+    constructor(connection: AgentSideConnection, config: ACPConfig = {}) {
+      this.connection = connection
+      this.config = config
+      this.setupEventSubscriptions()
+    }
+
+    private setupEventSubscriptions() {
+      const options: PermissionOption[] = [
+        { optionId: "once", kind: "allow_once", name: "Allow once" },
+        { optionId: "always", kind: "allow_always", name: "Always allow" },
+        { optionId: "reject", kind: "reject_once", name: "Reject" },
+      ]
+      Bus.subscribe(Permission.Event.Updated, async (event) => {
+        const acpSession = this.sessionManager.get(event.properties.sessionID)
+        if (!acpSession) return
+        try {
+          const permission = event.properties
+          const res = await this.connection
+            .requestPermission({
+              sessionId: acpSession.id,
+              toolCall: {
+                toolCallId: permission.callID ?? permission.id,
+                status: "pending",
+                title: permission.title,
+                rawInput: permission.metadata,
+                kind: toToolKind(permission.type),
+                locations: toLocations(permission.type, permission.metadata),
+              },
+              options,
+            })
+            .catch((error) => {
+              log.error("failed to request permission from ACP", {
+                error,
+                permissionID: permission.id,
+                sessionID: permission.sessionID,
+              })
+              Permission.respond({
+                sessionID: permission.sessionID,
+                permissionID: permission.id,
+                response: "reject",
+              })
+              return
+            })
+          if (!res) return
+          if (res.outcome.outcome !== "selected") {
+            Permission.respond({ sessionID: permission.sessionID, permissionID: permission.id, response: "reject" })
+            return
+          }
+          Permission.respond({
+            sessionID: permission.sessionID,
+            permissionID: permission.id,
+            response: res.outcome.optionId as "once" | "always" | "reject",
+          })
+        } catch (err) {
+          if (!(err instanceof Permission.RejectedError)) {
+            log.error("unexpected error when handling permission", { error: err })
+            throw err
+          }
+        }
+      })
+
+      Bus.subscribe(MessageV2.Event.PartUpdated, async (event) => {
+        const props = event.properties
+        const { part } = props
+        const acpSession = this.sessionManager.get(part.sessionID)
+        if (!acpSession) return
+
+        const message = await Storage.read<MessageV2.Info>(["message", part.sessionID, part.messageID]).catch(
+          () => undefined,
+        )
+        if (!message || message.role !== "assistant") return
+
+        if (part.type === "tool") {
+          switch (part.state.status) {
+            case "pending":
+              await this.connection
+                .sessionUpdate({
+                  sessionId: acpSession.id,
+                  update: {
+                    sessionUpdate: "tool_call",
+                    toolCallId: part.callID,
+                    title: part.tool,
+                    kind: toToolKind(part.tool),
+                    status: "pending",
+                    locations: [],
+                    rawInput: {},
+                  },
+                })
+                .catch((err) => {
+                  log.error("failed to send tool pending to ACP", { error: err })
+                })
+              break
+            case "running":
+              await this.connection
+                .sessionUpdate({
+                  sessionId: acpSession.id,
+                  update: {
+                    sessionUpdate: "tool_call_update",
+                    toolCallId: part.callID,
+                    status: "in_progress",
+                    locations: toLocations(part.tool, part.state.input),
+                    rawInput: part.state.input,
+                  },
+                })
+                .catch((err) => {
+                  log.error("failed to send tool in_progress to ACP", { error: err })
+                })
+              break
+            case "completed":
+              const kind = toToolKind(part.tool)
+              const content: ToolCallContent[] = [
+                {
+                  type: "content",
+                  content: {
+                    type: "text",
+                    text: part.state.output,
+                  },
+                },
+              ]
+
+              if (kind === "edit") {
+                const input = part.state.input
+                const filePath = typeof input["filePath"] === "string" ? input["filePath"] : ""
+                const oldText = typeof input["oldString"] === "string" ? input["oldString"] : ""
+                const newText =
+                  typeof input["newString"] === "string"
+                    ? input["newString"]
+                    : typeof input["content"] === "string"
+                      ? input["content"]
+                      : ""
+                content.push({
+                  type: "diff",
+                  path: filePath,
+                  oldText,
+                  newText,
+                })
+              }
+
+              if (part.tool === "todowrite") {
+                const parsedTodos = z.array(Todo.Info).safeParse(JSON.parse(part.state.output))
+                if (parsedTodos.success) {
+                  await this.connection
+                    .sessionUpdate({
+                      sessionId: acpSession.id,
+                      update: {
+                        sessionUpdate: "plan",
+                        entries: parsedTodos.data.map((todo) => {
+                          const status: PlanEntry["status"] =
+                            todo.status === "cancelled" ? "completed" : (todo.status as PlanEntry["status"])
+                          return {
+                            priority: "medium",
+                            status,
+                            content: todo.content,
+                          }
+                        }),
+                      },
+                    })
+                    .catch((err) => {
+                      log.error("failed to send session update for todo", { error: err })
+                    })
+                } else {
+                  log.error("failed to parse todo output", { error: parsedTodos.error })
+                }
+              }
+
+              await this.connection
+                .sessionUpdate({
+                  sessionId: acpSession.id,
+                  update: {
+                    sessionUpdate: "tool_call_update",
+                    toolCallId: part.callID,
+                    status: "completed",
+                    kind,
+                    content,
+                    title: part.state.title,
+                    rawOutput: {
+                      output: part.state.output,
+                      metadata: part.state.metadata,
+                    },
+                  },
+                })
+                .catch((err) => {
+                  log.error("failed to send tool completed to ACP", { error: err })
+                })
+              break
+            case "error":
+              await this.connection
+                .sessionUpdate({
+                  sessionId: acpSession.id,
+                  update: {
+                    sessionUpdate: "tool_call_update",
+                    toolCallId: part.callID,
+                    status: "failed",
+                    content: [
+                      {
+                        type: "content",
+                        content: {
+                          type: "text",
+                          text: part.state.error,
+                        },
+                      },
+                    ],
+                    rawOutput: {
+                      error: part.state.error,
+                    },
+                  },
+                })
+                .catch((err) => {
+                  log.error("failed to send tool error to ACP", { error: err })
+                })
+              break
+          }
+        } else if (part.type === "text") {
+          const delta = props.delta
+          if (delta && part.synthetic !== true) {
+            await this.connection
+              .sessionUpdate({
+                sessionId: acpSession.id,
+                update: {
+                  sessionUpdate: "agent_message_chunk",
+                  content: {
+                    type: "text",
+                    text: delta,
+                  },
+                },
+              })
+              .catch((err) => {
+                log.error("failed to send text to ACP", { error: err })
+              })
+          }
+        } else if (part.type === "reasoning") {
+          const delta = props.delta
+          if (delta) {
+            await this.connection
+              .sessionUpdate({
+                sessionId: acpSession.id,
+                update: {
+                  sessionUpdate: "agent_thought_chunk",
+                  content: {
+                    type: "text",
+                    text: delta,
+                  },
+                },
+              })
+              .catch((err) => {
+                log.error("failed to send reasoning to ACP", { error: err })
+              })
+          }
+        }
+      })
+    }
+
+    async initialize(params: InitializeRequest) {
+      log.info("initialize", { protocolVersion: params.protocolVersion })
+
+      return {
+        protocolVersion: 1,
+        agentCapabilities: {
+          loadSession: true,
+          mcpCapabilities: {
+            http: true,
+            sse: true,
+          },
+          promptCapabilities: {
+            embeddedContext: true,
+            image: true,
+          },
+        },
+        authMethods: [
+          {
+            description: "Run `opencode auth login` in the terminal",
+            name: "Login with opencode",
+            id: "opencode-login",
+          },
+        ],
+        _meta: {
+          opencode: {
+            version: Installation.VERSION,
+          },
+        },
+      }
+    }
+
+    async authenticate(_params: AuthenticateRequest) {
+      throw new Error("Authentication not implemented")
+    }
+
+    async newSession(params: NewSessionRequest) {
+      const model = await defaultModel(this.config)
+      const session = await this.sessionManager.create(params.cwd, params.mcpServers, model)
+
+      log.info("creating_session", { mcpServers: params.mcpServers.length })
+      const load = await this.loadSession({
+        cwd: params.cwd,
+        mcpServers: params.mcpServers,
+        sessionId: session.id,
+      })
+
+      return {
+        sessionId: session.id,
+        models: load.models,
+        modes: load.modes,
+        _meta: {},
+      }
+    }
+
+    async loadSession(params: LoadSessionRequest) {
+      const model = await defaultModel(this.config)
+      const sessionId = params.sessionId
+
+      const providers = await Provider.list()
+      const entries = Object.entries(providers).sort((a, b) => {
+        const nameA = a[1].info.name.toLowerCase()
+        const nameB = b[1].info.name.toLowerCase()
+        if (nameA < nameB) return -1
+        if (nameA > nameB) return 1
+        return 0
+      })
+      const availableModels = entries.flatMap(([providerID, provider]) => {
+        const models = Provider.sort(Object.values(provider.info.models))
+        return models.map((model) => ({
+          modelId: `${providerID}/${model.id}`,
+          name: `${provider.info.name}/${model.name}`,
+        }))
+      })
+
+      const availableCommands = (await Command.list()).map((command) => ({
+        name: command.name,
+        description: command.description ?? "",
+      }))
+      const names = new Set(availableCommands.map((c) => c.name))
+      if (!names.has("init"))
+        availableCommands.push({
+          name: "init",
+          description: "create/update a AGENTS.md",
+        })
+      if (!names.has("compact"))
+        availableCommands.push({
+          name: "compact",
+          description: "compact the session",
+        })
+
+      setTimeout(() => {
+        this.connection.sessionUpdate({
+          sessionId,
+          update: {
+            sessionUpdate: "available_commands_update",
+            availableCommands,
+          },
+        })
+      }, 0)
+
+      const availableModes = (await Agents.list())
+        .filter((agent) => agent.mode !== "subagent")
+        .map((agent) => ({
+          id: agent.name,
+          name: agent.name,
+          description: agent.description,
+        }))
+
+      const currentModeId = availableModes.find((m) => m.name === "build")?.id ?? availableModes[0].id
+
+      const mcpServers: Record<string, Config.Mcp> = {}
+      for (const server of params.mcpServers) {
+        if ("type" in server) {
+          mcpServers[server.name] = {
+            url: server.url,
+            headers: server.headers.reduce<Record<string, string>>((acc, { name, value }) => {
+              acc[name] = value
+              return acc
+            }, {}),
+            type: "remote",
+          }
+        } else {
+          mcpServers[server.name] = {
+            type: "local",
+            command: [server.command, ...server.args],
+            environment: server.env.reduce<Record<string, string>>((acc, { name, value }) => {
+              acc[name] = value
+              return acc
+            }, {}),
+          }
+        }
+      }
+
+      await Promise.all(
+        Object.entries(mcpServers).map(async ([key, mcp]) => {
+          await MCP.add(key, mcp)
+        }),
+      )
+
+      return {
+        sessionId,
+        models: {
+          currentModelId: `${model.providerID}/${model.modelID}`,
+          availableModels,
+        },
+        modes: {
+          availableModes,
+          currentModeId,
+        },
+        _meta: {},
+      }
+    }
+
+    async setSessionModel(params: SetSessionModelRequest) {
+      const session = this.sessionManager.get(params.sessionId)
+      if (!session) {
+        throw new Error(`Session not found: ${params.sessionId}`)
+      }
+
+      const parsed = Provider.parseModel(params.modelId)
+      const model = await Provider.getModel(parsed.providerID, parsed.modelID)
+
+      this.sessionManager.setModel(session.id, {
+        providerID: model.providerID,
+        modelID: model.modelID,
+      })
+
+      return {
+        _meta: {},
+      }
+    }
+
+    async setSessionMode(params: SetSessionModeRequest): Promise<SetSessionModeResponse | void> {
+      const session = this.sessionManager.get(params.sessionId)
+      if (!session) {
+        throw new Error(`Session not found: ${params.sessionId}`)
+      }
+      await Agents.get(params.modeId).then((agent) => {
+        if (!agent) throw new Error(`Agent not found: ${params.modeId}`)
+      })
+      this.sessionManager.setMode(params.sessionId, params.modeId)
+    }
+
+    async prompt(params: PromptRequest) {
+      const sessionID = params.sessionId
+      const acpSession = this.sessionManager.get(sessionID)
+      if (!acpSession) {
+        throw new Error(`Session not found: ${sessionID}`)
+      }
+
+      const current = acpSession.model
+      const model = current ?? (await defaultModel(this.config))
+      if (!current) {
+        this.sessionManager.setModel(acpSession.id, model)
+      }
+      const agent = acpSession.modeId ?? "build"
+
+      const parts: SessionPrompt.PromptInput["parts"] = []
+      for (const part of params.prompt) {
+        switch (part.type) {
+          case "text":
+            parts.push({
+              type: "text" as const,
+              text: part.text,
+            })
+            break
+          case "image":
+            if (part.data) {
+              parts.push({
+                type: "file",
+                url: `data:${part.mimeType};base64,${part.data}`,
+                mime: part.mimeType,
+              })
+            } else if (part.uri && part.uri.startsWith("http:")) {
+              parts.push({
+                type: "file",
+                url: part.uri,
+                mime: part.mimeType,
+              })
+            }
+            break
+
+          case "resource_link":
+            const parsed = parseUri(part.uri)
+            parts.push(parsed)
+
+            break
+
+          case "resource":
+            const resource = part.resource
+            if ("text" in resource) {
+              parts.push({
+                type: "text",
+                text: resource.text,
+              })
+            }
+            break
+
+          default:
+            break
+        }
+      }
+
+      log.info("parts", { parts })
+
+      const cmd = (() => {
+        const text = parts
+          .filter((p) => p.type === "text")
+          .map((p) => p.text)
+          .join("")
+          .trim()
+
+        if (!text.startsWith("/")) return
+
+        const [name, ...rest] = text.slice(1).split(/\s+/)
+        return { name, args: rest.join(" ").trim() }
+      })()
+
+      const done = {
+        stopReason: "end_turn" as const,
+        _meta: {},
+      }
+
+      if (!cmd) {
+        await SessionPrompt.prompt({
+          sessionID,
+          model: {
+            providerID: model.providerID,
+            modelID: model.modelID,
+          },
+          parts,
+          agent,
+        })
+        return done
+      }
+
+      const command = await Command.get(cmd.name)
+      if (command) {
+        await SessionPrompt.command({
+          sessionID,
+          command: command.name,
+          arguments: cmd.args,
+          model: model.providerID + "/" + model.modelID,
+          agent,
+        })
+        return done
+      }
+
+      switch (cmd.name) {
+        case "init":
+          await Session.initialize({
+            sessionID,
+            messageID: Identifier.ascending("message"),
+            providerID: model.providerID,
+            modelID: model.modelID,
+          })
+          break
+        case "compact":
+          await SessionCompaction.run({
+            sessionID,
+            providerID: model.providerID,
+            modelID: model.modelID,
+          })
+          break
+      }
+
+      return done
+    }
+
+    async cancel(params: CancelNotification) {
+      SessionLock.abort(params.sessionId)
+    }
+  }
+
+  function toToolKind(toolName: string): ToolKind {
+    const tool = toolName.toLocaleLowerCase()
+    switch (tool) {
+      case "bash":
+        return "execute"
+      case "webfetch":
+        return "fetch"
+
+      case "edit":
+      case "patch":
+      case "write":
+        return "edit"
+
+      case "grep":
+      case "glob":
+      case "context7_resolve_library_id":
+      case "context7_get_library_docs":
+        return "search"
+
+      case "list":
+      case "read":
+        return "read"
+
+      default:
+        return "other"
+    }
+  }
+
+  function toLocations(toolName: string, input: Record<string, any>): { path: string }[] {
+    const tool = toolName.toLocaleLowerCase()
+    switch (tool) {
+      case "read":
+      case "edit":
+      case "write":
+        return input["filePath"] ? [{ path: input["filePath"] }] : []
+      case "glob":
+      case "grep":
+        return input["path"] ? [{ path: input["path"] }] : []
+      case "bash":
+        return []
+      case "list":
+        return input["path"] ? [{ path: input["path"] }] : []
+      default:
+        return []
+    }
+  }
+
+  async function defaultModel(config: ACPConfig) {
+    const configured = config.defaultModel
+    if (configured) return configured
+    return Provider.defaultModel()
+  }
+
+  function parseUri(
+    uri: string,
+  ): { type: "file"; url: string; filename: string; mime: string } | { type: "text"; text: string } {
+    try {
+      if (uri.startsWith("file://")) {
+        const path = uri.slice(7)
+        const name = path.split("/").pop() || path
+        return {
+          type: "file",
+          url: uri,
+          filename: name,
+          mime: "text/plain",
+        }
+      }
+      if (uri.startsWith("zed://")) {
+        const url = new URL(uri)
+        const path = url.searchParams.get("path")
+        if (path) {
+          const name = path.split("/").pop() || path
+          return {
+            type: "file",
+            url: `file://${path}`,
+            filename: name,
+            mime: "text/plain",
+          }
+        }
+      }
+      return {
+        type: "text",
+        text: uri,
+      }
+    } catch {
+      return {
+        type: "text",
+        text: uri,
+      }
+    }
+  }
+}

packages/opencode/src/acp/session.ts

@@ -0,0 +1,64 @@
+import type { McpServer } from "@agentclientprotocol/sdk"
+import { Identifier } from "../id/id"
+import { Session } from "../session"
+import { Provider } from "../provider/provider"
+import type { ACPSessionState } from "./types"
+
+export class ACPSessionManager {
+  private sessions = new Map<string, ACPSessionState>()
+
+  async create(cwd: string, mcpServers: McpServer[], model?: ACPSessionState["model"]): Promise<ACPSessionState> {
+    const session = await Session.create({ title: `ACP Session ${crypto.randomUUID()}` })
+    const sessionId = session.id
+    const resolvedModel = model ?? (await Provider.defaultModel())
+
+    const state: ACPSessionState = {
+      id: sessionId,
+      cwd,
+      mcpServers,
+      createdAt: new Date(),
+      model: resolvedModel,
+    }
+
+    this.sessions.set(sessionId, state)
+    return state
+  }
+
+  get(sessionId: string) {
+    return this.sessions.get(sessionId)
+  }
+
+  async remove(sessionId: string) {
+    const state = this.sessions.get(sessionId)
+    if (!state) return
+
+    await Session.remove(sessionId).catch(() => {})
+    this.sessions.delete(sessionId)
+  }
+
+  has(sessionId: string) {
+    return this.sessions.has(sessionId)
+  }
+
+  getModel(sessionId: string) {
+    const session = this.sessions.get(sessionId)
+    if (!session) return
+    return session.model
+  }
+
+  setModel(sessionId: string, model: ACPSessionState["model"]) {
+    const session = this.sessions.get(sessionId)
+    if (!session) return
+    session.model = model
+    this.sessions.set(sessionId, session)
+    return session
+  }
+
+  setMode(sessionId: string, modeId: string) {
+    const session = this.sessions.get(sessionId)
+    if (!session) return
+    session.modeId = modeId
+    this.sessions.set(sessionId, session)
+    return session
+  }
+}

packages/opencode/src/acp/types.ts

@@ -0,0 +1,20 @@
+import type { McpServer } from "@agentclientprotocol/sdk"
+
+export interface ACPSessionState {
+  id: string
+  cwd: string
+  mcpServers: McpServer[]
+  createdAt: Date
+  model: {
+    providerID: string
+    modelID: string
+  }
+  modeId?: string
+}
+
+export interface ACPConfig {
+  defaultModel?: {
+    providerID: string
+    modelID: string
+  }
+}

packages/opencode/src/agent/agent.ts

@@ -1,5 +1,5 @@
 import { Config } from "../config/config"
-import z from "zod/v4"
+import z from "zod"
 import { Provider } from "../provider/provider"
 import { generateObject, type ModelMessage } from "ai"
 import PROMPT_GENERATE from "./generate.txt"
@@ -51,7 +51,44 @@ export namespace Agent {
     const planPermission = mergeAgentPermissions(
       {
         edit: "deny",
-        bash: "ask",
+        bash: {
+          "cut*": "allow",
+          "diff*": "allow",
+          "du*": "allow",
+          "file *": "allow",
+          "find * -delete*": "ask",
+          "find * -exec*": "ask",
+          "find * -fprint*": "ask",
+          "find * -fls*": "ask",
+          "find * -fprintf*": "ask",
+          "find * -ok*": "ask",
+          "find *": "allow",
+          "git diff*": "allow",
+          "git log*": "allow",
+          "git show*": "allow",
+          "git status*": "allow",
+          "git branch": "allow",
+          "git branch -v": "allow",
+          "grep*": "allow",
+          "head*": "allow",
+          "less*": "allow",
+          "ls*": "allow",
+          "more*": "allow",
+          "pwd*": "allow",
+          "rg*": "allow",
+          "sort --output=*": "ask",
+          "sort -o *": "ask",
+          "sort*": "allow",
+          "stat*": "allow",
+          "tail*": "allow",
+          "tree -o *": "ask",
+          "tree*": "allow",
+          "uniq*": "allow",
+          "wc*": "allow",
+          "whereis*": "allow",
+          "which*": "allow",
+          "*": "ask",
+        },
         webfetch: "allow",
       },
       cfg.permission ?? {},

packages/opencode/src/auth/github-copilot.ts

@@ -1,147 +0,0 @@
-import z from "zod/v4"
-import { Auth } from "./index"
-import { NamedError } from "../util/error"
-
-export namespace AuthGithubCopilot {
-  const CLIENT_ID = "Iv1.b507a08c87ecfe98"
-  const DEVICE_CODE_URL = "https://github.com/login/device/code"
-  const ACCESS_TOKEN_URL = "https://github.com/login/oauth/access_token"
-  const COPILOT_API_KEY_URL = "https://api.github.com/copilot_internal/v2/token"
-
-  interface DeviceCodeResponse {
-    device_code: string
-    user_code: string
-    verification_uri: string
-    expires_in: number
-    interval: number
-  }
-
-  interface AccessTokenResponse {
-    access_token?: string
-    error?: string
-    error_description?: string
-  }
-
-  interface CopilotTokenResponse {
-    token: string
-    expires_at: number
-    refresh_in: number
-    endpoints: {
-      api: string
-    }
-  }
-
-  export async function authorize() {
-    const deviceResponse = await fetch(DEVICE_CODE_URL, {
-      method: "POST",
-      headers: {
-        Accept: "application/json",
-        "Content-Type": "application/json",
-        "User-Agent": "GitHubCopilotChat/0.26.7",
-      },
-      body: JSON.stringify({
-        client_id: CLIENT_ID,
-        scope: "read:user",
-      }),
-    })
-    const deviceData: DeviceCodeResponse = await deviceResponse.json()
-    return {
-      device: deviceData.device_code,
-      user: deviceData.user_code,
-      verification: deviceData.verification_uri,
-      interval: deviceData.interval || 5,
-      expiry: deviceData.expires_in,
-    }
-  }
-
-  export async function poll(device_code: string) {
-    const response = await fetch(ACCESS_TOKEN_URL, {
-      method: "POST",
-      headers: {
-        Accept: "application/json",
-        "Content-Type": "application/json",
-        "User-Agent": "GitHubCopilotChat/0.26.7",
-      },
-      body: JSON.stringify({
-        client_id: CLIENT_ID,
-        device_code,
-        grant_type: "urn:ietf:params:oauth:grant-type:device_code",
-      }),
-    })
-
-    if (!response.ok) return "failed"
-
-    const data: AccessTokenResponse = await response.json()
-
-    if (data.access_token) {
-      // Store the GitHub OAuth token
-      await Auth.set("github-copilot", {
-        type: "oauth",
-        refresh: data.access_token,
-        access: "",
-        expires: 0,
-      })
-      return "complete"
-    }
-
-    if (data.error === "authorization_pending") return "pending"
-
-    if (data.error) return "failed"
-
-    return "pending"
-  }
-
-  export async function access() {
-    const info = await Auth.get("github-copilot")
-    if (!info || info.type !== "oauth") return
-    if (info.access && info.expires > Date.now()) return info.access
-
-    // Get new Copilot API token
-    const response = await fetch(COPILOT_API_KEY_URL, {
-      headers: {
-        Accept: "application/json",
-        Authorization: `Bearer ${info.refresh}`,
-        "User-Agent": "GitHubCopilotChat/0.26.7",
-        "Editor-Version": "vscode/1.99.3",
-        "Editor-Plugin-Version": "copilot-chat/0.26.7",
-      },
-    })
-
-    if (!response.ok) return
-
-    const tokenData: CopilotTokenResponse = await response.json()
-
-    // Store the Copilot API token
-    await Auth.set("github-copilot", {
-      type: "oauth",
-      refresh: info.refresh,
-      access: tokenData.token,
-      expires: tokenData.expires_at * 1000,
-    })
-
-    return tokenData.token
-  }
-
-  export const DeviceCodeError = NamedError.create("DeviceCodeError", z.object({}))
-
-  export const TokenExchangeError = NamedError.create(
-    "TokenExchangeError",
-    z.object({
-      message: z.string(),
-    }),
-  )
-
-  export const AuthenticationError = NamedError.create(
-    "AuthenticationError",
-    z.object({
-      message: z.string(),
-    }),
-  )
-
-  export const CopilotTokenError = NamedError.create(
-    "CopilotTokenError",
-    z.object({
-      message: z.string(),
-    }),
-  )
-}

packages/opencode/src/auth/index.ts

@@ -1,7 +1,7 @@
 import path from "path"
 import { Global } from "../global"
 import fs from "fs/promises"
-import z from "zod/v4"
+import z from "zod"
 
 export namespace Auth {
   export const Oauth = z

packages/opencode/src/bun/index.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { Global } from "../global"
 import { Log } from "../util/log"
 import path from "path"

packages/opencode/src/bus/index.ts

@@ -1,5 +1,5 @@
-import z from "zod/v4"
-import type { ZodType } from "zod/v4"
+import z from "zod"
+import type { ZodType } from "zod"
 import { Log } from "../util/log"
 import { Instance } from "../project/instance"
 

packages/opencode/src/cli/cmd/acp.ts

@@ -0,0 +1,62 @@
+import { Log } from "@/util/log"
+import { bootstrap } from "../bootstrap"
+import { cmd } from "./cmd"
+import { AgentSideConnection, ndJsonStream } from "@agentclientprotocol/sdk"
+import { ACP } from "@/acp/agent"
+
+const log = Log.create({ service: "acp-command" })
+
+process.on("unhandledRejection", (reason, promise) => {
+  log.error("Unhandled rejection", {
+    promise,
+    reason,
+  })
+})
+
+export const AcpCommand = cmd({
+  command: "acp",
+  describe: "Start ACP (Agent Client Protocol) server",
+  builder: (yargs) => {
+    return yargs.option("cwd", {
+      describe: "working directory",
+      type: "string",
+      default: process.cwd(),
+    })
+  },
+  handler: async (opts) => {
+    if (opts.cwd) process.chdir(opts["cwd"])
+    await bootstrap(process.cwd(), async () => {
+      const input = new WritableStream<Uint8Array>({
+        write(chunk) {
+          return new Promise<void>((resolve, reject) => {
+            process.stdout.write(chunk, (err) => {
+              if (err) {
+                reject(err)
+              } else {
+                resolve()
+              }
+            })
+          })
+        },
+      })
+      const output = new ReadableStream<Uint8Array>({
+        start(controller) {
+          process.stdin.on("data", (chunk: Buffer) => {
+            controller.enqueue(new Uint8Array(chunk))
+          })
+          process.stdin.on("end", () => controller.close())
+          process.stdin.on("error", (err) => controller.error(err))
+        },
+      })
+
+      const stream = ndJsonStream(input, output)
+
+      new AgentSideConnection((conn) => {
+        return new ACP.Agent(conn)
+      }, stream)
+
+      log.info("setup connection")
+    })
+    process.stdin.resume()
+  },
+})

packages/opencode/src/cli/cmd/debug/file.ts

@@ -1,3 +1,4 @@
+import { EOL } from "os"
 import { File } from "../../../file"
 import { bootstrap } from "../../bootstrap"
 import { cmd } from "../cmd"
@@ -13,7 +14,7 @@ const FileSearchCommand = cmd({
   async handler(args) {
     await bootstrap(process.cwd(), async () => {
       const results = await File.search({ query: args.query })
-      console.log(results.join("\n"))
+      console.log(results.join(EOL))
     })
   },
 })

packages/opencode/src/cli/cmd/debug/ripgrep.ts

@@ -1,3 +1,4 @@
+import { EOL } from "os"
 import { Ripgrep } from "../../../file/ripgrep"
 import { Instance } from "../../../project/instance"
 import { bootstrap } from "../../bootstrap"
@@ -48,7 +49,7 @@ const FilesCommand = cmd({
         files.push(file)
         if (args.limit && files.length >= args.limit) break
       }
-      console.log(files.join("\n"))
+      console.log(files.join(EOL))
     })
   },
 })

packages/opencode/src/cli/cmd/export.ts

@@ -4,6 +4,7 @@ import { cmd } from "./cmd"
 import { bootstrap } from "../bootstrap"
 import { UI } from "../ui"
 import * as prompts from "@clack/prompts"
+import { EOL } from "os"
 
 export const ExportCommand = cmd({
   command: "export [sessionID]",
@@ -67,7 +68,7 @@ export const ExportCommand = cmd({
         }
 
         process.stdout.write(JSON.stringify(exportData, null, 2))
-        process.stdout.write("\n")
+        process.stdout.write(EOL)
       } catch (error) {
         UI.error(`Session not found: ${sessionID!}`)
         process.exit(1)

packages/opencode/src/cli/cmd/run.ts

@@ -1,4 +1,5 @@
 import type { Argv } from "yargs"
+import path from "path"
 import { Bus } from "../../bus"
 import { Provider } from "../../provider/provider"
 import { Session } from "../../session"
@@ -12,6 +13,7 @@ import { Identifier } from "../../id/id"
 import { Agent } from "../../agent/agent"
 import { Command } from "../../command"
 import { SessionPrompt } from "../../session/prompt"
+import { EOL } from "os"
 
 const TOOL: Record<string, [string, string]> = {
   todowrite: ["Todo", UI.Style.TEXT_WARNING_BOLD],
@@ -70,10 +72,45 @@ export const RunCommand = cmd({
         default: "default",
         describe: "format: default (formatted) or json (raw JSON events)",
       })
+      .option("file", {
+        alias: ["f"],
+        type: "string",
+        array: true,
+        describe: "file(s) to attach to message",
+      })
   },
   handler: async (args) => {
     let message = args.message.join(" ")
 
+    let fileParts: any[] = []
+    if (args.file) {
+      const files = Array.isArray(args.file) ? args.file : [args.file]
+
+      for (const filePath of files) {
+        const resolvedPath = path.resolve(process.cwd(), filePath)
+        const file = Bun.file(resolvedPath)
+        const stats = await file.stat().catch(() => {})
+        if (!stats) {
+          UI.error(`File not found: ${filePath}`)
+          process.exit(1)
+        }
+        if (!(await file.exists())) {
+          UI.error(`File not found: ${filePath}`)
+          process.exit(1)
+        }
+
+        const stat = await file.stat()
+        const mime = stat.isDirectory() ? "application/x-directory" : "text/plain"
+
+        fileParts.push({
+          type: "file",
+          url: `file://${resolvedPath}`,
+          filename: path.basename(resolvedPath),
+          mime,
+        })
+      }
+    }
+
     if (!process.stdin.isTTY) message += "\n" + (await Bun.stdin.text())
 
     if (message.trim().length === 0 && !args.command) {
@@ -158,13 +195,12 @@ export const RunCommand = cmd({
             sessionID: session?.id,
             ...data,
           }
-          process.stdout.write(JSON.stringify(jsonEvent) + "\n")
+          process.stdout.write(JSON.stringify(jsonEvent) + EOL)
           return true
         }
         return false
       }
 
-      let text = ""
       const messageID = Identifier.ascending("message")
 
       Bus.subscribe(MessageV2.Event.PartUpdated, async (evt) => {
@@ -196,15 +232,14 @@ export const RunCommand = cmd({
         }
 
         if (part.type === "text") {
-          text = part.text
+          const text = part.text
+          const isPiped = !process.stdout.isTTY
 
           if (part.time?.end) {
             if (outputJsonEvent("text", { part })) return
-            UI.empty()
-            UI.println(UI.markdown(text))
-            UI.empty()
-            text = ""
-            return
+            if (!isPiped) UI.println()
+            process.stdout.write((isPiped ? text : UI.markdown(text)) + EOL)
+            if (!isPiped) UI.println()
           }
         }
       })
@@ -218,13 +253,13 @@ export const RunCommand = cmd({
         if ("data" in error && error.data && "message" in error.data) {
           err = error.data.message
         }
-        errorMsg = errorMsg ? errorMsg + "\n" + err : err
+        errorMsg = errorMsg ? errorMsg + EOL + err : err
 
         if (outputJsonEvent("error", { error })) return
         UI.error(err)
       })
 
-      const result = await (async () => {
+      await (async () => {
         if (args.command) {
           return await SessionPrompt.command({
             messageID,
@@ -244,6 +279,7 @@ export const RunCommand = cmd({
           },
           agent: agent.name,
           parts: [
+            ...fileParts,
             {
               id: Identifier.ascending("part"),
               type: "text",
@@ -252,15 +288,6 @@ export const RunCommand = cmd({
           ],
         })
       })()
-
-      const isPiped = !process.stdout.isTTY
-      if (isPiped) {
-        const match = result.parts.findLast((x: any) => x.type === "text") as any
-        if (outputJsonEvent("text", { text: match })) return
-        if (match) process.stdout.write(UI.markdown(match.text))
-        if (errorMsg) process.stdout.write(errorMsg)
-      }
-      UI.empty()
       if (errorMsg) process.exit(1)
     })
   },

packages/opencode/src/cli/cmd/tui.ts

@@ -157,7 +157,7 @@ export const TuiCommand = cmd({
 
         ;(async () => {
           // if (Installation.isLocal()) return
-          const config = await Config.global()
+          const config = await Config.get()
           if (config.autoupdate === false || Flag.OPENCODE_DISABLE_AUTOUPDATE) return
           const latest = await Installation.latest().catch(() => {})
           if (!latest) return

packages/opencode/src/cli/ui.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { EOL } from "os"
 import { NamedError } from "../util/error"
 

packages/opencode/src/command/index.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { Config } from "../config/config"
 import { Instance } from "../project/instance"
 

packages/opencode/src/config/config.ts

@@ -1,7 +1,7 @@
 import { Log } from "../util/log"
 import path from "path"
 import os from "os"
-import z from "zod/v4"
+import z from "zod"
 import { Filesystem } from "../util/filesystem"
 import { ModelsDev } from "../provider/models"
 import { mergeDeep, pipe } from "remeda"

packages/opencode/src/file/fzf.ts

@@ -1,7 +1,7 @@
 import path from "path"
 import { Global } from "../global"
 import fs from "fs/promises"
-import z from "zod/v4"
+import z from "zod"
 import { NamedError } from "../util/error"
 import { lazy } from "../util/lazy"
 import { Log } from "../util/log"

packages/opencode/src/file/index.ts

@@ -1,6 +1,7 @@
-import z from "zod/v4"
+import z from "zod"
 import { Bus } from "../bus"
 import { $ } from "bun"
+import type { BunFile } from "bun"
 import { formatPatch, structuredPatch } from "diff"
 import path from "path"
 import fs from "fs"
@@ -41,6 +42,7 @@ export namespace File {
 
   export const Content = z
     .object({
+      type: z.literal("text"),
       content: z.string(),
       diff: z.string().optional(),
       patch: z
@@ -61,12 +63,53 @@ export namespace File {
           index: z.string().optional(),
         })
         .optional(),
+      encoding: z.literal("base64").optional(),
+      mimeType: z.string().optional(),
     })
     .meta({
       ref: "FileContent",
     })
   export type Content = z.infer<typeof Content>
 
+  async function shouldEncode(file: BunFile): Promise<boolean> {
+    const type = file.type?.toLowerCase()
+    if (!type) return false
+
+    if (type.startsWith("text/")) return false
+    if (type.includes("charset=")) return false
+
+    const parts = type.split("/", 2)
+    const top = parts[0]
+    const rest = parts[1] ?? ""
+    const sub = rest.split(";", 1)[0]
+
+    const tops = ["image", "audio", "video", "font", "model", "multipart"]
+    if (tops.includes(top)) return true
+
+    if (type === "application/octet-stream") return true
+
+    const bins = [
+      "zip",
+      "gzip",
+      "bzip",
+      "compressed",
+      "binary",
+      "stream",
+      "pdf",
+      "msword",
+      "powerpoint",
+      "excel",
+      "ogg",
+      "exe",
+      "dmg",
+      "iso",
+      "rar",
+    ]
+    if (bins.some((mark) => sub.includes(mark))) return true
+
+    return false
+  }
+
   export const Event = {
     Edited: Bus.event(
       "file.edited",
@@ -188,14 +231,30 @@ export namespace File {
     }))
   }
 
-  export async function read(file: string) {
+  export async function read(file: string): Promise<Content> {
     using _ = log.time("read", { file })
     const project = Instance.project
     const full = path.join(Instance.directory, file)
-    const content = await Bun.file(full)
+    const bunFile = Bun.file(full)
+
+    if (!(await bunFile.exists())) {
+      return { type: "text", content: "" }
+    }
+
+    const encode = await shouldEncode(bunFile)
+
+    if (encode) {
+      const buffer = await bunFile.arrayBuffer().catch(() => new ArrayBuffer(0))
+      const content = Buffer.from(buffer).toString("base64")
+      const mimeType = bunFile.type || "application/octet-stream"
+      return { type: "text", content, mimeType, encoding: "base64" }
+    }
+
+    const content = await bunFile
       .text()
       .catch(() => "")
       .then((x) => x.trim())
+
     if (project.vcs === "git") {
       let diff = await $`git diff ${file}`.cwd(Instance.directory).quiet().nothrow().text()
       if (!diff.trim()) diff = await $`git diff --staged ${file}`.cwd(Instance.directory).quiet().nothrow().text()
@@ -206,10 +265,10 @@ export namespace File {
           ignoreWhitespace: true,
         })
         const diff = formatPatch(patch)
-        return { content, patch, diff }
+        return { type: "text", content, patch, diff }
       }
     }
-    return { content }
+    return { type: "text", content }
   }
 
   export async function list(dir?: string) {

packages/opencode/src/file/ripgrep.ts

@@ -2,7 +2,7 @@
 import path from "path"
 import { Global } from "../global"
 import fs from "fs/promises"
-import z from "zod/v4"
+import z from "zod"
 import { NamedError } from "../util/error"
 import { lazy } from "../util/lazy"
 import { $ } from "bun"
@@ -211,6 +211,16 @@ export namespace Ripgrep {
       }
     }
 
+    // Bun.spawn should throw this, but it incorrectly reports that the executable does not exist.
+    // See https://github.com/oven-sh/bun/issues/24012
+    if (!(await fs.stat(input.cwd).catch(() => undefined))?.isDirectory()) {
+      throw Object.assign(new Error(`No such file or directory: '${input.cwd}'`), {
+        code: "ENOENT",
+        errno: -2,
+        path: input.cwd,
+      })
+    }
+
     const proc = Bun.spawn(args, {
       cwd: input.cwd,
       stdout: "pipe",

packages/opencode/src/file/watcher.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { Bus } from "../bus"
 import { Flag } from "../flag/flag"
 import { Instance } from "../project/instance"

packages/opencode/src/flag/flag.ts

@@ -9,9 +9,11 @@ export namespace Flag {
   export const OPENCODE_DISABLE_LSP_DOWNLOAD = truthy("OPENCODE_DISABLE_LSP_DOWNLOAD")
   export const OPENCODE_ENABLE_EXPERIMENTAL_MODELS = truthy("OPENCODE_ENABLE_EXPERIMENTAL_MODELS")
   export const OPENCODE_DISABLE_AUTOCOMPACT = truthy("OPENCODE_DISABLE_AUTOCOMPACT")
+  export const OPENCODE_FAKE_VCS = process.env["OPENCODE_FAKE_VCS"]
 
   // Experimental
   export const OPENCODE_EXPERIMENTAL_WATCHER = truthy("OPENCODE_EXPERIMENTAL_WATCHER")
+  export const OPENCODE_EXPERIMENTAL_TURN_SUMMARY = truthy("OPENCODE_EXPERIMENTAL_TURN_SUMMARY")
   export const OPENCODE_EXPERIMENTAL_NO_BOOTSTRAP = truthy("OPENCODE_EXPERIMENTAL_NO_BOOTSTRAP")
 
   function truthy(key: string) {

packages/opencode/src/id/id.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { randomBytes } from "crypto"
 
 export namespace Identifier {

packages/opencode/src/ide/index.ts

@@ -1,5 +1,5 @@
 import { spawn } from "bun"
-import z from "zod/v4"
+import z from "zod"
 import { NamedError } from "../util/error"
 import { Log } from "../util/log"
 import { Bus } from "../bus"

packages/opencode/src/index.ts

@@ -19,6 +19,8 @@ import { McpCommand } from "./cli/cmd/mcp"
 import { GithubCommand } from "./cli/cmd/github"
 import { ExportCommand } from "./cli/cmd/export"
 import { AttachCommand } from "./cli/cmd/attach"
+import { AcpCommand } from "./cli/cmd/acp"
+import { EOL } from "os"
 
 const cancel = new AbortController()
 
@@ -67,6 +69,7 @@ const cli = yargs(hideBin(process.argv))
     })
   })
   .usage("\n" + UI.logo())
+  .command(AcpCommand)
   .command(McpCommand)
   .command(TuiCommand)
   .command(AttachCommand)
@@ -127,7 +130,10 @@ try {
   Log.Default.error("fatal", data)
   const formatted = FormatError(e)
   if (formatted) UI.error(formatted)
-  if (formatted === undefined) UI.error("Unexpected error, check log file at " + Log.file() + " for more details")
+  if (formatted === undefined) {
+    UI.error("Unexpected error, check log file at " + Log.file() + " for more details" + EOL)
+    console.error(e)
+  }
   process.exitCode = 1
 }
 

packages/opencode/src/installation/index.ts

@@ -1,6 +1,6 @@
 import path from "path"
 import { $ } from "bun"
-import z from "zod/v4"
+import z from "zod"
 import { NamedError } from "../util/error"
 import { Bus } from "../bus"
 import { Log } from "../util/log"

packages/opencode/src/lsp/client.ts

@@ -4,7 +4,7 @@ import type { Diagnostic as VSCodeDiagnostic } from "vscode-languageserver-types
 import { Log } from "../util/log"
 import { LANGUAGE_EXTENSIONS } from "./language"
 import { Bus } from "../bus"
-import z from "zod/v4"
+import z from "zod"
 import type { LSPServer } from "./server"
 import { NamedError } from "../util/error"
 import { withTimeout } from "../util/timeout"

packages/opencode/src/lsp/index.ts

@@ -2,7 +2,7 @@ import { Log } from "../util/log"
 import { LSPClient } from "./client"
 import path from "path"
 import { LSPServer } from "./server"
-import z from "zod/v4"
+import z from "zod"
 import { Config } from "../config/config"
 import { spawn } from "child_process"
 import { Instance } from "../project/instance"

packages/opencode/src/lsp/server.ts

@@ -838,4 +838,135 @@ export namespace LSPServer {
       }
     },
   }
+
+  export const LuaLS: Info = {
+    id: "lua-ls",
+    root: NearestRoot([
+      ".luarc.json",
+      ".luarc.jsonc",
+      ".luacheckrc",
+      ".stylua.toml",
+      "stylua.toml",
+      "selene.toml",
+      "selene.yml",
+    ]),
+    extensions: [".lua"],
+    async spawn(root) {
+      let bin = Bun.which("lua-language-server", {
+        PATH: process.env["PATH"] + ":" + Global.Path.bin,
+      })
+
+      if (!bin) {
+        if (Flag.OPENCODE_DISABLE_LSP_DOWNLOAD) return
+        log.info("downloading lua-language-server from GitHub releases")
+
+        const releaseResponse = await fetch("https://api.github.com/repos/LuaLS/lua-language-server/releases/latest")
+        if (!releaseResponse.ok) {
+          log.error("Failed to fetch lua-language-server release info")
+          return
+        }
+
+        const release = await releaseResponse.json()
+
+        const platform = process.platform
+        const arch = process.arch
+        let assetName = ""
+
+        let lualsArch: string = arch
+        if (arch === "arm64") lualsArch = "arm64"
+        else if (arch === "x64") lualsArch = "x64"
+        else if (arch === "ia32") lualsArch = "ia32"
+
+        let lualsPlatform: string = platform
+        if (platform === "darwin") lualsPlatform = "darwin"
+        else if (platform === "linux") lualsPlatform = "linux"
+        else if (platform === "win32") lualsPlatform = "win32"
+
+        const ext = platform === "win32" ? "zip" : "tar.gz"
+
+        assetName = `lua-language-server-${release.tag_name}-${lualsPlatform}-${lualsArch}.${ext}`
+
+        const supportedCombos = [
+          "darwin-arm64.tar.gz",
+          "darwin-x64.tar.gz",
+          "linux-x64.tar.gz",
+          "linux-arm64.tar.gz",
+          "win32-x64.zip",
+          "win32-ia32.zip",
+        ]
+
+        const assetSuffix = `${lualsPlatform}-${lualsArch}.${ext}`
+        if (!supportedCombos.includes(assetSuffix)) {
+          log.error(`Platform ${platform} and architecture ${arch} is not supported by lua-language-server`)
+          return
+        }
+
+        const asset = release.assets.find((a: any) => a.name === assetName)
+        if (!asset) {
+          log.error(`Could not find asset ${assetName} in latest lua-language-server release`)
+          return
+        }
+
+        const downloadUrl = asset.browser_download_url
+        const downloadResponse = await fetch(downloadUrl)
+        if (!downloadResponse.ok) {
+          log.error("Failed to download lua-language-server")
+          return
+        }
+
+        const tempPath = path.join(Global.Path.bin, assetName)
+        await Bun.file(tempPath).write(downloadResponse)
+
+        // Unlike zls which is a single self-contained binary,
+        // lua-language-server needs supporting files (meta/, locale/, etc.)
+        // Extract entire archive to dedicated directory to preserve all files
+        const installDir = path.join(Global.Path.bin, `lua-language-server-${lualsArch}-${lualsPlatform}`)
+
+        // Remove old installation if exists
+        const stats = await fs.stat(installDir).catch(() => undefined)
+        if (stats) {
+          await fs.rm(installDir, { force: true, recursive: true })
+        }
+
+        await fs.mkdir(installDir, { recursive: true })
+
+        if (ext === "zip") {
+          const ok = await $`unzip -o -q ${tempPath} -d ${installDir}`.quiet().catch((error) => {
+            log.error("Failed to extract lua-language-server archive", { error })
+          })
+          if (!ok) return
+        } else {
+          const ok = await $`tar -xzf ${tempPath} -C ${installDir}`.quiet().catch((error) => {
+            log.error("Failed to extract lua-language-server archive", { error })
+          })
+          if (!ok) return
+        }
+
+        await fs.rm(tempPath, { force: true })
+
+        // Binary is located in bin/ subdirectory within the extracted archive
+        bin = path.join(installDir, "bin", "lua-language-server" + (platform === "win32" ? ".exe" : ""))
+
+        if (!(await Bun.file(bin).exists())) {
+          log.error("Failed to extract lua-language-server binary")
+          return
+        }
+
+        if (platform !== "win32") {
+          const ok = await $`chmod +x ${bin}`.quiet().catch((error) => {
+            log.error("Failed to set executable permission for lua-language-server binary", { error })
+          })
+          if (!ok) return
+        }
+
+        log.info(`installed lua-language-server`, { bin })
+      }
+
+      return {
+        process: spawn(bin, {
+          cwd: root,
+        }),
+      }
+    },
+  }
 }

packages/opencode/src/mcp/index.ts

@@ -5,7 +5,7 @@ import { StdioClientTransport } from "@modelcontextprotocol/sdk/client/stdio.js"
 import { Config } from "../config/config"
 import { Log } from "../util/log"
 import { NamedError } from "../util/error"
-import z from "zod/v4"
+import z from "zod"
 import { Session } from "../session"
 import { Bus } from "../bus"
 import { Instance } from "../project/instance"
@@ -26,122 +26,22 @@ export namespace MCP {
   const state = Instance.state(
     async () => {
       const cfg = await Config.get()
+      const config = cfg.mcp ?? {}
       const clients: {
         [name: string]: MCPClient
       } = {}
-      for (const [key, mcp] of Object.entries(cfg.mcp ?? {})) {
-        if (mcp.enabled === false) {
-          log.info("mcp server disabled", { key })
-          continue
-        }
-        log.info("found", { key, type: mcp.type })
-        if (mcp.type === "remote") {
-          const transports = [
-            {
-              name: "StreamableHTTP",
-              transport: new StreamableHTTPClientTransport(new URL(mcp.url), {
-                requestInit: {
-                  headers: mcp.headers,
-                },
-              }),
-            },
-            {
-              name: "SSE",
-              transport: new SSEClientTransport(new URL(mcp.url), {
-                requestInit: {
-                  headers: mcp.headers,
-                },
-              }),
-            },
-          ]
-          let lastError: Error | undefined
-          for (const { name, transport } of transports) {
-            const client = await experimental_createMCPClient({
-              name: "opencode",
-              transport,
-            }).catch((error) => {
-              lastError = error instanceof Error ? error : new Error(String(error))
-              log.debug("transport connection failed", {
-                key,
-                transport: name,
-                url: mcp.url,
-                error: lastError.message,
-              })
-              return null
-            })
-            if (client) {
-              log.debug("transport connection succeeded", { key, transport: name })
-              clients[key] = client
-              break
-            }
-          }
-          if (!clients[key]) {
-            const errorMessage = lastError
-              ? `MCP server ${key} failed to connect: ${lastError.message}`
-              : `MCP server ${key} failed to connect to ${mcp.url}`
-            log.error("remote mcp connection failed", { key, url: mcp.url, error: lastError?.message })
-            Bus.publish(Session.Event.Error, {
-              error: {
-                name: "UnknownError",
-                data: {
-                  message: errorMessage,
-                },
-              },
-            })
-          }
-        }
 
-        if (mcp.type === "local") {
-          const [cmd, ...args] = mcp.command
-          const client = await experimental_createMCPClient({
-            name: "opencode",
-            transport: new StdioClientTransport({
-              stderr: "ignore",
-              command: cmd,
-              args,
-              env: {
-                ...process.env,
-                ...(cmd === "opencode" ? { BUN_BE_BUN: "1" } : {}),
-                ...mcp.environment,
-              },
-            }),
-          }).catch((error) => {
-            const errorMessage =
-              error instanceof Error
-                ? `MCP server ${key} failed to start: ${error.message}`
-                : `MCP server ${key} failed to start`
-            log.error("local mcp startup failed", {
-              key,
-              command: mcp.command,
-              error: error instanceof Error ? error.message : String(error),
-            })
-            Bus.publish(Session.Event.Error, {
-              error: {
-                name: "UnknownError",
-                data: {
-                  message: errorMessage,
-                },
-              },
-            })
-            return null
-          })
-          if (client) {
-            clients[key] = client
-          }
-        }
-      }
-
-      for (const [key, client] of Object.entries(clients)) {
-        const result = await withTimeout(client.tools(), 5000).catch(() => {})
-        if (!result) {
-          log.warn("mcp client verification failed, removing client", { key })
-          delete clients[key]
-        }
-      }
+      await Promise.all(
+        Object.entries(config).map(async ([key, mcp]) => {
+          const result = await create(key, mcp).catch(() => undefined)
+          if (!result) return
+          clients[key] = result.client
+        }),
+      )
 
       return {
         clients,
-        config: cfg.mcp ?? {},
+        config,
       }
     },
     async (state) => {
@@ -151,6 +51,133 @@ export namespace MCP {
     },
   )
 
+  export async function add(name: string, mcp: Config.Mcp) {
+    const s = await state()
+    const result = await create(name, mcp)
+    if (!result) return
+    s.clients[name] = result.client
+  }
+
+  async function create(name: string, mcp: Config.Mcp) {
+    if (mcp.enabled === false) {
+      log.info("mcp server disabled", { name })
+      return
+    }
+    log.info("found", { name, type: mcp.type })
+
+    let mcpClient: MCPClient | undefined
+
+    if (mcp.type === "remote") {
+      const transports = [
+        {
+          name: "StreamableHTTP",
+          transport: new StreamableHTTPClientTransport(new URL(mcp.url), {
+            requestInit: {
+              headers: mcp.headers,
+            },
+          }),
+        },
+        {
+          name: "SSE",
+          transport: new SSEClientTransport(new URL(mcp.url), {
+            requestInit: {
+              headers: mcp.headers,
+            },
+          }),
+        },
+      ]
+      let lastError: Error | undefined
+      for (const { name, transport } of transports) {
+        const client = await experimental_createMCPClient({
+          name: "opencode",
+          transport,
+        }).catch((error) => {
+          lastError = error instanceof Error ? error : new Error(String(error))
+          log.debug("transport connection failed", {
+            name,
+            transport: name,
+            url: mcp.url,
+            error: lastError.message,
+          })
+          return null
+        })
+        if (client) {
+          log.debug("transport connection succeeded", { name, transport: name })
+          mcpClient = client
+          break
+        }
+      }
+      if (!mcpClient) {
+        const errorMessage = lastError
+          ? `MCP server ${name} failed to connect: ${lastError.message}`
+          : `MCP server ${name} failed to connect to ${mcp.url}`
+        log.error("remote mcp connection failed", { name, url: mcp.url, error: lastError?.message })
+        Bus.publish(Session.Event.Error, {
+          error: {
+            name: "UnknownError",
+            data: {
+              message: errorMessage,
+            },
+          },
+        })
+      }
+    }
+
+    if (mcp.type === "local") {
+      const [cmd, ...args] = mcp.command
+      const client = await experimental_createMCPClient({
+        name: "opencode",
+        transport: new StdioClientTransport({
+          stderr: "ignore",
+          command: cmd,
+          args,
+          env: {
+            ...process.env,
+            ...(cmd === "opencode" ? { BUN_BE_BUN: "1" } : {}),
+            ...mcp.environment,
+          },
+        }),
+      }).catch((error) => {
+        const errorMessage =
+          error instanceof Error
+            ? `MCP server ${name} failed to start: ${error.message}`
+            : `MCP server ${name} failed to start`
+        log.error("local mcp startup failed", {
+          name,
+          command: mcp.command,
+          error: error instanceof Error ? error.message : String(error),
+        })
+        Bus.publish(Session.Event.Error, {
+          error: {
+            name: "UnknownError",
+            data: {
+              message: errorMessage,
+            },
+          },
+        })
+        return null
+      })
+      if (client) {
+        mcpClient = client
+      }
+    }
+
+    if (!mcpClient) {
+      log.warn("mcp client not initialized", { name })
+      return
+    }
+
+    const result = await withTimeout(mcpClient.tools(), 5000).catch(() => {})
+    if (!result) {
+      log.warn("mcp client verification failed, dropping client", { name })
+      return
+    }
+
+    return {
+      client: mcpClient,
+    }
+  }
+
   export async function status() {
     return state().then((state) => {
       const result: Record<string, "connected" | "failed" | "disabled"> = {}

packages/opencode/src/permission/index.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { Bus } from "../bus"
 import { Log } from "../util/log"
 import { Identifier } from "../id/id"

packages/opencode/src/project/project.ts

@@ -1,9 +1,10 @@
-import z from "zod/v4"
+import z from "zod"
 import { Filesystem } from "../util/filesystem"
 import path from "path"
 import { $ } from "bun"
 import { Storage } from "../storage/storage"
 import { Log } from "../util/log"
+import { Flag } from "@/flag/flag"
 
 export namespace Project {
   const log = Log.create({ service: "project" })
@@ -31,6 +32,7 @@ export namespace Project {
       const project: Info = {
         id: "global",
         worktree: "/",
+        vcs: Info.shape.vcs.parse(Flag.OPENCODE_FAKE_VCS),
         time: {
           created: Date.now(),
         },

packages/opencode/src/provider/models.ts

@@ -1,7 +1,7 @@
 import { Global } from "../global"
 import { Log } from "../util/log"
 import path from "path"
-import z from "zod/v4"
+import z from "zod"
 import { data } from "./models-macro" with { type: "macro" }
 import { Installation } from "../installation"
 

packages/opencode/src/provider/provider.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import path from "path"
 import { Config } from "../config/config"
 import { mergeDeep, sortBy } from "remeda"
@@ -95,7 +95,14 @@ export namespace Provider {
 
           switch (regionPrefix) {
             case "us": {
-              const modelRequiresPrefix = ["claude", "deepseek"].some((m) => modelID.includes(m))
+              const modelRequiresPrefix = [
+                "nova-micro",
+                "nova-lite",
+                "nova-pro",
+                "nova-premier",
+                "claude",
+                "deepseek",
+              ].some((m) => modelID.includes(m))
               const isGovCloud = region.startsWith("us-gov")
               if (modelRequiresPrefix && !isGovCloud) {
                 modelID = `${regionPrefix}.${modelID}`
@@ -121,9 +128,10 @@ export namespace Provider {
             }
             case "ap": {
               const isAustraliaRegion = ["ap-southeast-2", "ap-southeast-4"].includes(region)
-              if (isAustraliaRegion && ["anthropic.claude-sonnet-4-5", "anthropic.claude-haiku"].some((m) =>
-                modelID.includes(m),
-              )) {
+              if (
+                isAustraliaRegion &&
+                ["anthropic.claude-sonnet-4-5", "anthropic.claude-haiku"].some((m) => modelID.includes(m))
+              ) {
                 regionPrefix = "au"
                 modelID = `${regionPrefix}.${modelID}`
               } else {
@@ -273,31 +281,31 @@ export namespace Provider {
           cost:
             !model.cost && !existing?.cost
               ? {
-                input: 0,
-                output: 0,
-                cache_read: 0,
-                cache_write: 0,
-              }
+                  input: 0,
+                  output: 0,
+                  cache_read: 0,
+                  cache_write: 0,
+                }
               : {
-                cache_read: 0,
-                cache_write: 0,
-                ...existing?.cost,
-                ...model.cost,
-              },
+                  cache_read: 0,
+                  cache_write: 0,
+                  ...existing?.cost,
+                  ...model.cost,
+                },
           options: {
             ...existing?.options,
             ...model.options,
           },
           limit: model.limit ??
             existing?.limit ?? {
-            context: 0,
-            output: 0,
-          },
+              context: 0,
+              output: 0,
+            },
           modalities: model.modalities ??
             existing?.modalities ?? {
-            input: ["text"],
-            output: ["text"],
-          },
+              input: ["text"],
+              output: ["text"],
+            },
           provider: model.provider ?? existing?.provider,
         }
         if (model.id && model.id !== modelID) {
@@ -414,14 +422,14 @@ export namespace Provider {
       const modPath =
         provider.id === "google-vertex-anthropic" ? `${installedPath}/dist/anthropic/index.mjs` : installedPath
       const mod = await import(modPath)
-      if (options["timeout"] !== undefined) {
+      if (options["timeout"] !== undefined && options["timeout"] !== null) {
         // Only override fetch if user explicitly sets timeout
         options["fetch"] = async (input: any, init?: BunFetchRequestInit) => {
           const { signal, ...rest } = init ?? {}
 
           const signals: AbortSignal[] = []
           if (signal) signals.push(signal)
-          signals.push(AbortSignal.timeout(options["timeout"]))
+          if (options["timeout"] !== false) signals.push(AbortSignal.timeout(options["timeout"]))
 
           const combined = signals.length > 1 ? AbortSignal.any(signals) : signals[0]
 
@@ -509,7 +517,11 @@ export namespace Provider {
 
     const provider = await state().then((state) => state.providers[providerID])
     if (!provider) return
-    const priority = ["3-5-haiku", "3.5-haiku", "gemini-2.5-flash", "gpt-5-nano"]
+    let priority = ["claude-haiku-4-5", "claude-haiku-4.5", "3-5-haiku", "3.5-haiku", "gemini-2.5-flash", "gpt-5-nano"]
+    // claude-haiku-4.5 is considered a premium model in github copilot, we shouldn't use premium requests for title gen
+    if (providerID === "github-copilot") {
+      priority = priority.filter((m) => m !== "claude-haiku-4.5")
+    }
     for (const item of priority) {
       for (const model of Object.keys(provider.info.models)) {
         if (model.includes(item)) return getModel(providerID, model)

packages/opencode/src/provider/transform.ts

@@ -75,7 +75,7 @@ export namespace ProviderTransform {
 
   export function temperature(_providerID: string, modelID: string) {
     if (modelID.toLowerCase().includes("qwen")) return 0.55
-    if (modelID.toLowerCase().includes("claude")) return 1
+    if (modelID.toLowerCase().includes("claude")) return undefined
     return 0
   }
 
@@ -92,19 +92,45 @@ export namespace ProviderTransform {
     }
 
     if (modelID.includes("gpt-5") && !modelID.includes("gpt-5-chat")) {
-      result["reasoningEffort"] = "medium"
+      if (!modelID.includes("codex") && !modelID.includes("gpt-5-pro")) {
+        result["reasoningEffort"] = "medium"
+      }
+
       if (providerID !== "azure") {
         result["textVerbosity"] = modelID.includes("codex") ? "medium" : "low"
       }
+
       if (providerID === "opencode") {
         result["promptCacheKey"] = sessionID
         result["include"] = ["reasoning.encrypted_content"]
-        result["reasoningSummary"] = "detailed"
+        result["reasoningSummary"] = "auto"
       }
     }
     return result
   }
 
+  export function providerOptions(npm: string | undefined, providerID: string, options: { [x: string]: any }) {
+    switch (npm) {
+      case "@ai-sdk/openai":
+      case "@ai-sdk/azure":
+        return {
+          ["openai" as string]: options,
+        }
+      case "@ai-sdk/amazon-bedrock":
+        return {
+          ["bedrock" as string]: options,
+        }
+      case "@ai-sdk/anthropic":
+        return {
+          ["anthropic" as string]: options,
+        }
+      default:
+        return {
+          [providerID]: options,
+        }
+    }
+  }
+
   export function maxOutputTokens(
     providerID: string,
     options: Record<string, any>,

packages/opencode/src/server/server.ts

@@ -3,9 +3,9 @@ import { Bus } from "../bus"
 import { describeRoute, generateSpecs, validator, resolver, openAPIRouteHandler } from "hono-openapi"
 import { Hono } from "hono"
 import { cors } from "hono/cors"
-import { streamSSE } from "hono/streaming"
+import { stream, streamSSE } from "hono/streaming"
 import { Session } from "../session"
-import z from "zod/v4"
+import z from "zod"
 import { Provider } from "../provider/provider"
 import { mapValues } from "remeda"
 import { NamedError } from "../util/error"
@@ -35,6 +35,8 @@ import { InstanceBootstrap } from "../project/bootstrap"
 import { MCP } from "../mcp"
 import { Storage } from "../storage/storage"
 import type { ContentfulStatusCode } from "hono/utils/http-status"
+import { Snapshot } from "@/snapshot"
+import { SessionSummary } from "@/session/summary"
 
 const ERRORS = {
   400: {
@@ -608,6 +610,44 @@ export namespace Server {
           return c.json(session)
         },
       )
+      .get(
+        "/session/:id/diff",
+        describeRoute({
+          description: "Get the diff that resulted from this user message",
+          operationId: "session.diff",
+          responses: {
+            200: {
+              description: "Successfully retrieved diff",
+              content: {
+                "application/json": {
+                  schema: resolver(Snapshot.FileDiff.array()),
+                },
+              },
+            },
+          },
+        }),
+        validator(
+          "param",
+          z.object({
+            id: SessionSummary.diff.schema.shape.sessionID,
+          }),
+        ),
+        validator(
+          "query",
+          z.object({
+            messageID: SessionSummary.diff.schema.shape.messageID,
+          }),
+        ),
+        async (c) => {
+          const query = c.req.valid("query")
+          const params = c.req.valid("param")
+          const result = await SessionSummary.diff({
+            sessionID: params.id,
+            messageID: query.messageID,
+          })
+          return c.json(result)
+        },
+      )
       .delete(
         "/session/:id/share",
         describeRoute({
@@ -734,7 +774,10 @@ export namespace Server {
         ),
         async (c) => {
           const params = c.req.valid("param")
-          const message = await Session.getMessage({ sessionID: params.id, messageID: params.messageID })
+          const message = await Session.getMessage({
+            sessionID: params.id,
+            messageID: params.messageID,
+          })
           return c.json(message)
         },
       )
@@ -768,10 +811,14 @@ export namespace Server {
         ),
         validator("json", SessionPrompt.PromptInput.omit({ sessionID: true })),
         async (c) => {
-          const sessionID = c.req.valid("param").id
-          const body = c.req.valid("json")
-          const msg = await SessionPrompt.prompt({ ...body, sessionID })
-          return c.json(msg)
+          c.status(200)
+          c.header("Content-Type", "application/json")
+          return stream(c, async (stream) => {
+            const sessionID = c.req.valid("param").id
+            const body = c.req.valid("json")
+            const msg = await SessionPrompt.prompt({ ...body, sessionID })
+            stream.write(JSON.stringify(msg))
+          })
         },
       )
       .post(
@@ -868,7 +915,10 @@ export namespace Server {
         async (c) => {
           const id = c.req.valid("param").id
           log.info("revert", c.req.valid("json"))
-          const session = await SessionRevert.revert({ sessionID: id, ...c.req.valid("json") })
+          const session = await SessionRevert.revert({
+            sessionID: id,
+            ...c.req.valid("json"),
+          })
           return c.json(session)
         },
       )
@@ -929,7 +979,11 @@ export namespace Server {
           const params = c.req.valid("param")
           const id = params.id
           const permissionID = params.permissionID
-          Permission.respond({ sessionID: id, permissionID, response: c.req.valid("json").response })
+          Permission.respond({
+            sessionID: id,
+            permissionID,
+            response: c.req.valid("json").response,
+          })
           return c.json(true)
         },
       )

packages/opencode/src/session/compaction.ts

@@ -1,4 +1,4 @@
-import { streamText, type ModelMessage, LoadAPIKeyError } from "ai"
+import { streamText, type ModelMessage, LoadAPIKeyError, type StreamTextResult, type Tool as AITool } from "ai"
 import { Session } from "."
 import { Identifier } from "../id/id"
 import { Instance } from "../project/instance"
@@ -7,14 +7,15 @@ import { defer } from "../util/defer"
 import { MessageV2 } from "./message-v2"
 import { SystemPrompt } from "./system"
 import { Bus } from "../bus"
-import z from "zod/v4"
+import z from "zod"
 import type { ModelsDev } from "../provider/models"
 import { SessionPrompt } from "./prompt"
 import { Flag } from "../flag/flag"
 import { Token } from "../util/token"
 import { Log } from "../util/log"
 import { SessionLock } from "./lock"
-import { NamedError } from "../util/error"
+import { ProviderTransform } from "@/provider/transform"
+import { SessionRetry } from "./retry"
 
 export namespace SessionCompaction {
   const log = Log.create({ service: "session.compaction" })
@@ -40,6 +41,7 @@ export namespace SessionCompaction {
 
   export const PRUNE_MINIMUM = 20_000
   export const PRUNE_PROTECT = 40_000
+  const MAX_RETRIES = 10
 
   // goes backwards through parts until there are 40_000 tokens worth of tool
   // calls. then erases output of previous tool calls. idea is to throw away old
@@ -97,7 +99,7 @@ export namespace SessionCompaction {
         draft.time.compacting = undefined
       })
     })
-    const toSummarize = await Session.messages(input.sessionID).then(MessageV2.filterSummarized)
+    const toSummarize = await Session.messages(input.sessionID).then(MessageV2.filterCompacted)
     const model = await Provider.getModel(input.providerID, input.modelID)
     const system = [
       ...SystemPrompt.summarize(model.providerID),
@@ -108,6 +110,7 @@ export namespace SessionCompaction {
     const msg = (await Session.updateMessage({
       id: Identifier.ascending("message"),
       role: "assistant",
+      parentID: toSummarize.findLast((m) => m.info.role === "user")?.info.id!,
       sessionID: input.sessionID,
       system,
       mode: "build",
@@ -140,114 +143,178 @@ export namespace SessionCompaction {
       },
     })) as MessageV2.TextPart
 
-    const stream = streamText({
-      maxRetries: 10,
-      model: model.language,
-      providerOptions: {
-        [model.npm === "@ai-sdk/openai" ? "openai" : model.providerID]: model.info.options,
-      },
-      abortSignal: signal,
-      onError(error) {
-        log.error("stream error", {
-          error,
-        })
-      },
-      messages: [
-        ...system.map(
-          (x): ModelMessage => ({
-            role: "system",
-            content: x,
-          }),
-        ),
-        ...MessageV2.toModelMessage(toSummarize),
-        {
-          role: "user",
-          content: [
-            {
-              type: "text",
-              text: "Provide a detailed but concise summary of our conversation above. Focus on information that would be helpful for continuing the conversation, including what we did, what we're doing, which files we're working on, and what we're going to do next.",
-            },
-          ],
+    const doStream = () =>
+      streamText({
+        // set to 0, we handle loop
+        maxRetries: 0,
+        model: model.language,
+        providerOptions: ProviderTransform.providerOptions(model.npm, model.providerID, model.info.options),
+        abortSignal: signal,
+        onError(error) {
+          log.error("stream error", {
+            error,
+          })
         },
-      ],
-    })
+        tools: model.info.tool_call ? {} : undefined,
+        messages: [
+          ...system.map(
+            (x): ModelMessage => ({
+              role: "system",
+              content: x,
+            }),
+          ),
+          ...MessageV2.toModelMessage(toSummarize),
+          {
+            role: "user",
+            content: [
+              {
+                type: "text",
+                text: "Provide a detailed but concise summary of our conversation above. Focus on information that would be helpful for continuing the conversation, including what we did, what we're doing, which files we're working on, and what we're going to do next.",
+              },
+            ],
+          },
+        ],
+      })
 
-    try {
-      for await (const value of stream.fullStream) {
-        signal.throwIfAborted()
-        switch (value.type) {
-          case "text-delta":
-            part.text += value.text
-            if (value.providerMetadata) part.metadata = value.providerMetadata
-            if (part.text) await Session.updatePart(part)
-            continue
-          case "text-end": {
-            part.text = part.text.trimEnd()
-            part.time = {
-              start: Date.now(),
-              end: Date.now(),
+    // TODO: reduce duplication between compaction.ts & prompt.ts
+    const process = async (
+      stream: StreamTextResult<Record<string, AITool>, never>,
+      retries: { count: number; max: number },
+    ) => {
+      let shouldRetry = false
+      try {
+        for await (const value of stream.fullStream) {
+          signal.throwIfAborted()
+          switch (value.type) {
+            case "text-delta":
+              part.text += value.text
+              if (value.providerMetadata) part.metadata = value.providerMetadata
+              if (part.text)
+                await Session.updatePart({
+                  part,
+                  delta: value.text,
+                })
+              continue
+            case "text-end": {
+              part.text = part.text.trimEnd()
+              part.time = {
+                start: Date.now(),
+                end: Date.now(),
+              }
+              if (value.providerMetadata) part.metadata = value.providerMetadata
+              await Session.updatePart(part)
+              continue
             }
-            if (value.providerMetadata) part.metadata = value.providerMetadata
-            await Session.updatePart(part)
-            continue
+            case "finish-step": {
+              const usage = Session.getUsage({
+                model: model.info,
+                usage: value.usage,
+                metadata: value.providerMetadata,
+              })
+              msg.cost += usage.cost
+              msg.tokens = usage.tokens
+              await Session.updateMessage(msg)
+              continue
+            }
+            case "error":
+              throw value.error
+            default:
+              continue
           }
-          case "finish-step": {
-            const usage = Session.getUsage({
-              model: model.info,
-              usage: value.usage,
-              metadata: value.providerMetadata,
-            })
-            msg.cost += usage.cost
-            msg.tokens = usage.tokens
-            await Session.updateMessage(msg)
-            continue
-          }
-          case "error":
-            throw value.error
-          default:
-            continue
+        }
+      } catch (e) {
+        log.error("compaction error", {
+          error: e,
+        })
+        const error = MessageV2.fromError(e, { providerID: input.providerID })
+        if (retries.count < retries.max && MessageV2.APIError.isInstance(error) && error.data.isRetryable) {
+          shouldRetry = true
+          await Session.updatePart({
+            id: Identifier.ascending("part"),
+            messageID: msg.id,
+            sessionID: msg.sessionID,
+            type: "retry",
+            attempt: retries.count + 1,
+            time: {
+              created: Date.now(),
+            },
+            error,
+          })
+        } else {
+          msg.error = error
+          Bus.publish(Session.Event.Error, {
+            sessionID: msg.sessionID,
+            error: msg.error,
+          })
         }
       }
-    } catch (e) {
-      log.error("compaction error", {
-        error: e,
-      })
-      switch (true) {
-        case e instanceof DOMException && e.name === "AbortError":
-          msg.error = new MessageV2.AbortedError(
-            { message: e.message },
-            {
-              cause: e,
-            },
-          ).toObject()
-          break
-        case MessageV2.OutputLengthError.isInstance(e):
-          msg.error = e
-          break
-        case LoadAPIKeyError.isInstance(e):
-          msg.error = new MessageV2.AuthError(
-            {
-              providerID: model.providerID,
-              message: e.message,
-            },
-            { cause: e },
-          ).toObject()
-          break
-        case e instanceof Error:
-          msg.error = new NamedError.Unknown({ message: e.toString() }, { cause: e }).toObject()
-          break
-        default:
-          msg.error = new NamedError.Unknown({ message: JSON.stringify(e) }, { cause: e })
+
+      const parts = await Session.getParts(msg.id)
+      return {
+        info: msg,
+        parts,
+        shouldRetry,
+      }
+    }
+
+    let stream = doStream()
+    let result = await process(stream, {
+      count: 0,
+      max: MAX_RETRIES,
+    })
+    if (result.shouldRetry) {
+      for (let retry = 1; retry < MAX_RETRIES; retry++) {
+        const lastRetryPart = result.parts.findLast((p) => p.type === "retry")
+
+        if (lastRetryPart) {
+          const delayMs = SessionRetry.getRetryDelayInMs(lastRetryPart.error, retry)
+
+          log.info("retrying with backoff", {
+            attempt: retry,
+            delayMs,
+          })
+
+          const stop = await SessionRetry.sleep(delayMs, signal)
+            .then(() => false)
+            .catch((error) => {
+              if (error instanceof DOMException && error.name === "AbortError") {
+                const err = new MessageV2.AbortedError(
+                  { message: error.message },
+                  {
+                    cause: error,
+                  },
+                ).toObject()
+                result.info.error = err
+                Bus.publish(Session.Event.Error, {
+                  sessionID: result.info.sessionID,
+                  error: result.info.error,
+                })
+                return true
+              }
+              throw error
+            })
+
+          if (stop) break
+        }
+
+        stream = doStream()
+        result = await process(stream, {
+          count: retry,
+          max: MAX_RETRIES,
+        })
+        if (!result.shouldRetry) {
+          break
+        }
       }
-      Bus.publish(Session.Event.Error, {
-        sessionID: input.sessionID,
-        error: msg.error,
-      })
     }
 
     msg.time.completed = Date.now()
 
-    if (!msg.error || MessageV2.AbortedError.isInstance(msg.error)) {
+    if (
+      !msg.error ||
+      (MessageV2.AbortedError.isInstance(msg.error) &&
+        result.parts.some((part) => part.type === "text" && part.text.length > 0))
+    ) {
       msg.summary = true
       Bus.publish(Event.Compacted, {
         sessionID: input.sessionID,
@@ -257,7 +324,7 @@ export namespace SessionCompaction {
 
     return {
       info: msg,
-      parts: [part],
+      parts: result.parts,
     }
   }
 }

packages/opencode/src/session/index.ts

@@ -1,5 +1,5 @@
 import { Decimal } from "decimal.js"
-import z from "zod/v4"
+import z from "zod"
 import { type LanguageModelUsage, type ProviderMetadata } from "ai"
 
 import PROMPT_INITIALIZE from "../session/prompt/initialize.txt"
@@ -18,6 +18,7 @@ import { Project } from "../project/project"
 import { Instance } from "../project/instance"
 import { SessionPrompt } from "./prompt"
 import { fn } from "@/util/fn"
+import { Snapshot } from "@/snapshot"
 
 export namespace Session {
   const log = Log.create({ service: "session" })
@@ -35,6 +36,11 @@ export namespace Session {
       projectID: z.string(),
       directory: z.string(),
       parentID: Identifier.schema("session").optional(),
+      summary: z
+        .object({
+          diffs: Snapshot.FileDiff.array(),
+        })
+        .optional(),
       share: z
         .object({
           url: z.string(),
@@ -72,6 +78,12 @@ export namespace Session {
   export type ShareInfo = z.output<typeof ShareInfo>
 
   export const Event = {
+    Created: Bus.event(
+      "session.created",
+      z.object({
+        info: Info,
+      }),
+    ),
     Updated: Bus.event(
       "session.updated",
       z.object({
@@ -161,6 +173,9 @@ export namespace Session {
     }
     log.info("created", result)
     await Storage.write(["session", Instance.project.id, result.id], result)
+    Bus.publish(Event.Created, {
+      info: result,
+    })
     const cfg = await Config.get()
     if (!result.parentID && (Flag.OPENCODE_AUTO_SHARE || cfg.share === "auto"))
       share(result.id)
@@ -334,10 +349,25 @@ export namespace Session {
     },
   )
 
-  export const updatePart = fn(MessageV2.Part, async (part) => {
+  const UpdatePartInput = z.union([
+    MessageV2.Part,
+    z.object({
+      part: MessageV2.TextPart,
+      delta: z.string(),
+    }),
+    z.object({
+      part: MessageV2.ReasoningPart,
+      delta: z.string(),
+    }),
+  ])
+
+  export const updatePart = fn(UpdatePartInput, async (input) => {
+    const part = "delta" in input ? input.part : input
+    const delta = "delta" in input ? input.delta : undefined
     await Storage.write(["part", part.messageID, part.id], part)
     Bus.publish(MessageV2.Event.PartUpdated, {
       part,
+      delta,
     })
     return part
   })

packages/opencode/src/session/lock.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { Instance } from "../project/instance"
 import { Log } from "../util/log"
 import { NamedError } from "../util/error"

packages/opencode/src/session/message-v2.ts

@@ -1,10 +1,11 @@
-import z from "zod/v4"
+import z from "zod"
 import { Bus } from "../bus"
 import { NamedError } from "../util/error"
 import { Message } from "./message"
-import { convertToModelMessages, type ModelMessage, type UIMessage } from "ai"
+import { APICallError, convertToModelMessages, LoadAPIKeyError, type ModelMessage, type UIMessage } from "ai"
 import { Identifier } from "../id/id"
 import { LSP } from "../lsp"
+import { Snapshot } from "@/snapshot"
 
 export namespace MessageV2 {
   export const OutputLengthError = NamedError.create("MessageOutputLengthError", z.object({}))
@@ -16,6 +17,17 @@ export namespace MessageV2 {
       message: z.string(),
     }),
   )
+  export const APIError = NamedError.create(
+    "APIError",
+    z.object({
+      message: z.string(),
+      statusCode: z.number().optional(),
+      isRetryable: z.boolean(),
+      responseHeaders: z.record(z.string(), z.string()).optional(),
+      responseBody: z.string().optional(),
+    }),
+  )
+  export type APIError = z.infer<typeof APIError.Schema>
 
   const PartBase = z.object({
     id: z.string(),
@@ -128,8 +140,21 @@ export namespace MessageV2 {
   })
   export type AgentPart = z.infer<typeof AgentPart>
 
+  export const RetryPart = PartBase.extend({
+    type: z.literal("retry"),
+    attempt: z.number(),
+    error: APIError.Schema,
+    time: z.object({
+      created: z.number(),
+    }),
+  }).meta({
+    ref: "RetryPart",
+  })
+  export type RetryPart = z.infer<typeof RetryPart>
+
   export const StepStartPart = PartBase.extend({
     type: z.literal("step-start"),
+    snapshot: z.string().optional(),
   }).meta({
     ref: "StepStartPart",
   })
@@ -137,6 +162,8 @@ export namespace MessageV2 {
 
   export const StepFinishPart = PartBase.extend({
     type: z.literal("step-finish"),
+    reason: z.string(),
+    snapshot: z.string().optional(),
     cost: z.number(),
     tokens: z.object({
       input: z.number(),
@@ -239,6 +266,13 @@ export namespace MessageV2 {
     time: z.object({
       created: z.number(),
     }),
+    summary: z
+      .object({
+        title: z.string().optional(),
+        body: z.string().optional(),
+        diffs: Snapshot.FileDiff.array(),
+      })
+      .optional(),
   }).meta({
     ref: "UserMessage",
   })
@@ -255,6 +289,7 @@ export namespace MessageV2 {
       SnapshotPart,
       PatchPart,
       AgentPart,
+      RetryPart,
     ])
     .meta({
       ref: "Part",
@@ -273,9 +308,11 @@ export namespace MessageV2 {
         NamedError.Unknown.Schema,
         OutputLengthError.Schema,
         AbortedError.Schema,
+        APIError.Schema,
       ])
       .optional(),
     system: z.string().array(),
+    parentID: z.string(),
     modelID: z.string(),
     providerID: z.string(),
     mode: z.string(),
@@ -322,6 +359,7 @@ export namespace MessageV2 {
       "message.part.updated",
       z.object({
         part: Part,
+        delta: z.string().optional(),
       }),
     ),
     PartRemoved: Bus.event(
@@ -344,6 +382,7 @@ export namespace MessageV2 {
     if (v1.role === "assistant") {
       const info: Assistant = {
         id: v1.id,
+        parentID: "",
         sessionID: v1.metadata.sessionID,
         role: "assistant",
         time: {
@@ -593,9 +632,46 @@ export namespace MessageV2 {
     return convertToModelMessages(result)
   }
 
-  export function filterSummarized(msgs: { info: MessageV2.Info; parts: MessageV2.Part[] }[]) {
+  export function filterCompacted(msgs: { info: MessageV2.Info; parts: MessageV2.Part[] }[]) {
     const i = msgs.findLastIndex((m) => m.info.role === "assistant" && !!m.info.summary)
     if (i === -1) return msgs.slice()
     return msgs.slice(i)
   }
+
+  export function fromError(e: unknown, ctx: { providerID: string }) {
+    switch (true) {
+      case e instanceof DOMException && e.name === "AbortError":
+        return new MessageV2.AbortedError(
+          { message: e.message },
+          {
+            cause: e,
+          },
+        ).toObject()
+      case MessageV2.OutputLengthError.isInstance(e):
+        return e
+      case LoadAPIKeyError.isInstance(e):
+        return new MessageV2.AuthError(
+          {
+            providerID: ctx.providerID,
+            message: e.message,
+          },
+          { cause: e },
+        ).toObject()
+      case APICallError.isInstance(e):
+        return new MessageV2.APIError(
+          {
+            message: e.message,
+            statusCode: e.statusCode,
+            isRetryable: e.isRetryable,
+            responseHeaders: e.responseHeaders,
+            responseBody: e.responseBody,
+          },
+          { cause: e },
+        ).toObject()
+      case e instanceof Error:
+        return new NamedError.Unknown({ message: e.toString() }, { cause: e }).toObject()
+      default:
+        return new NamedError.Unknown({ message: JSON.stringify(e) }, { cause: e })
+    }
+  }
 }

packages/opencode/src/session/message.ts

@@ -1,4 +1,4 @@
-import z from "zod/v4"
+import z from "zod"
 import { NamedError } from "../util/error"
 
 export namespace Message {

packages/opencode/src/session/prompt.ts

@@ -1,7 +1,7 @@
 import path from "path"
 import os from "os"
 import fs from "fs/promises"
-import z from "zod/v4"
+import z from "zod"
 import { Identifier } from "../id/id"
 import { MessageV2 } from "./message-v2"
 import { Log } from "../util/log"
@@ -17,7 +17,6 @@ import {
   tool,
   wrapLanguageModel,
   type StreamTextResult,
-  LoadAPIKeyError,
   stepCountIs,
   jsonSchema,
 } from "ai"
@@ -28,6 +27,7 @@ import { Bus } from "../bus"
 import { ProviderTransform } from "../provider/transform"
 import { SystemPrompt } from "./system"
 import { Plugin } from "../plugin"
+import { SessionRetry } from "./retry"
 
 import PROMPT_PLAN from "../session/prompt/plan.txt"
 import BUILD_SWITCH from "../session/prompt/build-switch.txt"
@@ -44,16 +44,17 @@ import { TaskTool } from "../tool/task"
 import { FileTime } from "../file/time"
 import { Permission } from "../permission"
 import { Snapshot } from "../snapshot"
-import { NamedError } from "../util/error"
 import { ulid } from "ulid"
 import { spawn } from "child_process"
 import { Command } from "../command"
 import { $, fileURLToPath } from "bun"
 import { ConfigMarkdown } from "../config/markdown"
+import { SessionSummary } from "./summary"
 
 export namespace SessionPrompt {
   const log = Log.create({ service: "session.prompt" })
   export const OUTPUT_TOKEN_MAX = 32_000
+  const MAX_RETRIES = 10
 
   export const Event = {
     Idle: Bus.event(
@@ -93,6 +94,7 @@ export namespace SessionPrompt {
       })
       .optional(),
     agent: z.string().optional(),
+    noReply: z.boolean().optional(),
     system: z.string().optional(),
     tools: z.record(z.string(), z.boolean()).optional(),
     parts: z.array(
@@ -141,6 +143,11 @@ export namespace SessionPrompt {
     const userMsg = await createUserMessage(input)
     await Session.touch(input.sessionID)
 
+    // Early return for context-only messages (no AI inference)
+    if (input.noReply) {
+      return userMsg
+    }
+
     if (isBusy(input.sessionID)) {
       return new Promise((resolve) => {
         const queue = state().queued.get(input.sessionID) ?? []
@@ -215,7 +222,9 @@ export namespace SessionPrompt {
         }),
         (messages) => insertReminders({ messages, agent }),
       )
-      if (step === 0)
+      step++
+      await processor.next(msgs.findLast((m) => m.info.role === "user")?.info.id!)
+      if (step === 1) {
         ensureTitle({
           session,
           history: msgs,
@@ -223,100 +232,153 @@ export namespace SessionPrompt {
           providerID: model.providerID,
           modelID: model.info.id,
         })
-      step++
-      await processor.next()
+        SessionSummary.summarize({
+          sessionID: input.sessionID,
+          messageID: userMsg.info.id,
+        })
+      }
       await using _ = defer(async () => {
         await processor.end()
       })
-      const stream = streamText({
-        onError(error) {
-          log.error("stream error", {
-            error,
-          })
-        },
-        async experimental_repairToolCall(input) {
-          const lower = input.toolCall.toolName.toLowerCase()
-          if (lower !== input.toolCall.toolName && tools[lower]) {
-            log.info("repairing tool call", {
-              tool: input.toolCall.toolName,
-              repaired: lower,
+      const doStream = () =>
+        streamText({
+          onError(error) {
+            log.error("stream error", {
+              error,
             })
+          },
+          async experimental_repairToolCall(input) {
+            const lower = input.toolCall.toolName.toLowerCase()
+            if (lower !== input.toolCall.toolName && tools[lower]) {
+              log.info("repairing tool call", {
+                tool: input.toolCall.toolName,
+                repaired: lower,
+              })
+              return {
+                ...input.toolCall,
+                toolName: lower,
+              }
+            }
             return {
               ...input.toolCall,
-              toolName: lower,
+              input: JSON.stringify({
+                tool: input.toolCall.toolName,
+                error: input.error.message,
+              }),
+              toolName: "invalid",
             }
-          }
-          return {
-            ...input.toolCall,
-            input: JSON.stringify({
-              tool: input.toolCall.toolName,
-              error: input.error.message,
-            }),
-            toolName: "invalid",
-          }
-        },
-        headers:
-          model.providerID === "opencode"
-            ? {
-                "x-opencode-session": input.sessionID,
-                "x-opencode-request": userMsg.info.id,
-              }
-            : undefined,
-        maxRetries: 10,
-        activeTools: Object.keys(tools).filter((x) => x !== "invalid"),
-        maxOutputTokens: ProviderTransform.maxOutputTokens(
-          model.providerID,
-          params.options,
-          model.info.limit.output,
-          OUTPUT_TOKEN_MAX,
-        ),
-        abortSignal: abort.signal,
-        providerOptions: {
-          [model.npm === "@ai-sdk/openai" ? "openai" : model.providerID]: params.options,
-        },
-        stopWhen: stepCountIs(1),
-        temperature: params.temperature,
-        topP: params.topP,
-        messages: [
-          ...system.map(
-            (x): ModelMessage => ({
-              role: "system",
-              content: x,
-            }),
-          ),
-          ...MessageV2.toModelMessage(
-            msgs.filter((m) => {
-              if (m.info.role !== "assistant" || m.info.error === undefined) {
-                return true
-              }
-              if (
-                MessageV2.AbortedError.isInstance(m.info.error) &&
-                m.parts.some((part) => part.type !== "step-start" && part.type !== "reasoning")
-              ) {
-                return true
-              }
-
-              return false
-            }),
-          ),
-        ],
-        tools: model.info.tool_call === false ? undefined : tools,
-        model: wrapLanguageModel({
-          model: model.language,
-          middleware: [
-            {
-              async transformParams(args) {
-                if (args.type === "stream") {
-                  // @ts-expect-error
-                  args.params.prompt = ProviderTransform.message(args.params.prompt, model.providerID, model.modelID)
+          },
+          headers:
+            model.providerID === "opencode"
+              ? {
+                  "x-opencode-session": input.sessionID,
+                  "x-opencode-request": userMsg.info.id,
                 }
-                return args.params
-              },
-            },
+              : undefined,
+          // set to 0, we handle loop
+          maxRetries: 0,
+          activeTools: Object.keys(tools).filter((x) => x !== "invalid"),
+          maxOutputTokens: ProviderTransform.maxOutputTokens(
+            model.providerID,
+            params.options,
+            model.info.limit.output,
+            OUTPUT_TOKEN_MAX,
+          ),
+          abortSignal: abort.signal,
+          providerOptions: ProviderTransform.providerOptions(model.npm, model.providerID, params.options),
+          stopWhen: stepCountIs(1),
+          temperature: params.temperature,
+          topP: params.topP,
+          messages: [
+            ...system.map(
+              (x): ModelMessage => ({
+                role: "system",
+                content: x,
+              }),
+            ),
+            ...MessageV2.toModelMessage(
+              msgs.filter((m) => {
+                if (m.info.role !== "assistant" || m.info.error === undefined) {
+                  return true
+                }
+                if (
+                  MessageV2.AbortedError.isInstance(m.info.error) &&
+                  m.parts.some((part) => part.type !== "step-start" && part.type !== "reasoning")
+                ) {
+                  return true
+                }
+
+                return false
+              }),
+            ),
           ],
-        }),
+          tools: model.info.tool_call === false ? undefined : tools,
+          model: wrapLanguageModel({
+            model: model.language,
+            middleware: [
+              {
+                async transformParams(args) {
+                  if (args.type === "stream") {
+                    // @ts-expect-error
+                    args.params.prompt = ProviderTransform.message(args.params.prompt, model.providerID, model.modelID)
+                  }
+                  return args.params
+                },
+              },
+            ],
+          }),
+        })
+
+      let stream = doStream()
+      let result = await processor.process(stream, {
+        count: 0,
+        max: MAX_RETRIES,
       })
-      const result = await processor.process(stream)
+      if (result.shouldRetry) {
+        for (let retry = 1; retry < MAX_RETRIES; retry++) {
+          const lastRetryPart = result.parts.findLast((p) => p.type === "retry")
+
+          if (lastRetryPart) {
+            const delayMs = SessionRetry.getRetryDelayInMs(lastRetryPart.error, retry)
+
+            log.info("retrying with backoff", {
+              attempt: retry,
+              delayMs,
+            })
+
+            const stop = await SessionRetry.sleep(delayMs, abort.signal)
+              .then(() => false)
+              .catch((error) => {
+                if (error instanceof DOMException && error.name === "AbortError") {
+                  const err = new MessageV2.AbortedError(
+                    { message: error.message },
+                    {
+                      cause: error,
+                    },
+                  ).toObject()
+                  result.info.error = err
+                  Bus.publish(Session.Event.Error, {
+                    sessionID: result.info.sessionID,
+                    error: result.info.error,
+                  })
+                  return true
+                }
+                throw error
+              })
+
+            if (stop) break
+          }
+
+          stream = doStream()
+          result = await processor.process(stream, {
+            count: retry,
+            max: MAX_RETRIES,
+          })
+          if (!result.shouldRetry) {
+            break
+          }
+        }
+      }
       await processor.end()
 
       const queued = state().queued.get(input.sessionID) ?? []
@@ -346,7 +408,7 @@ export namespace SessionPrompt {
     providerID: string
     signal: AbortSignal
   }) {
-    let msgs = await Session.messages(input.sessionID).then(MessageV2.filterSummarized)
+    let msgs = await Session.messages(input.sessionID).then(MessageV2.filterCompacted)
     const lastAssistant = msgs.findLast((msg) => msg.info.role === "assistant")
     if (
       lastAssistant?.info.role === "assistant" &&
@@ -521,10 +583,7 @@ export namespace SessionPrompt {
           },
         )
         const result = await execute(args, opts)
-        const output = result.content
-          .filter((x: any) => x.type === "text")
-          .map((x: any) => x.text)
-          .join("\n\n")
+
         await Plugin.trigger(
           "tool.execute.after",
           {
@@ -535,6 +594,11 @@ export namespace SessionPrompt {
           result,
         )
 
+        const output = result.content
+          .filter((x: any) => x.type === "text")
+          .map((x: any) => x.text)
+          .join("\n\n")
+
         return {
           title: "",
           metadata: {},
@@ -833,9 +897,10 @@ export namespace SessionPrompt {
     let snapshot: string | undefined
     let blocked = false
 
-    async function createMessage() {
+    async function createMessage(parentID: string) {
       const msg: MessageV2.Info = {
         id: Identifier.ascending("message"),
+        parentID,
         role: "assistant",
         system: input.system,
         mode: input.agent,
@@ -871,11 +936,11 @@ export namespace SessionPrompt {
           assistantMsg = undefined
         }
       },
-      async next() {
+      async next(parentID: string) {
         if (assistantMsg) {
           throw new Error("end previous assistant message first")
         }
-        assistantMsg = await createMessage()
+        assistantMsg = await createMessage(parentID)
         return assistantMsg
       },
       get message() {
@@ -885,9 +950,10 @@ export namespace SessionPrompt {
       partFromToolCall(toolCallID: string) {
         return toolcalls[toolCallID]
       },
-      async process(stream: StreamTextResult<Record<string, AITool>, never>) {
+      async process(stream: StreamTextResult<Record<string, AITool>, never>, retries: { count: number; max: number }) {
         log.info("process")
         if (!assistantMsg) throw new Error("call next() first before processing")
+        let shouldRetry = false
         try {
           let currentText: MessageV2.TextPart | undefined
           let reasoningMap: Record<string, MessageV2.ReasoningPart> = {}
@@ -923,7 +989,7 @@ export namespace SessionPrompt {
                   const part = reasoningMap[value.id]
                   part.text += value.text
                   if (value.providerMetadata) part.metadata = value.providerMetadata
-                  if (part.text) await Session.updatePart(part)
+                  if (part.text) await Session.updatePart({ part, delta: value.text })
                 }
                 break
 
@@ -1000,6 +1066,7 @@ export namespace SessionPrompt {
                       attachments: value.output.attachments,
                     },
                   })
+
                   delete toolcalls[value.toolCallId]
                 }
                 break
@@ -1021,6 +1088,7 @@ export namespace SessionPrompt {
                       },
                     },
                   })
+
                   if (value.error instanceof Permission.RejectedError) {
                     blocked = true
                   }
@@ -1032,13 +1100,14 @@ export namespace SessionPrompt {
                 throw value.error
 
               case "start-step":
+                snapshot = await Snapshot.track()
                 await Session.updatePart({
                   id: Identifier.ascending("part"),
                   messageID: assistantMsg.id,
                   sessionID: assistantMsg.sessionID,
+                  snapshot,
                   type: "step-start",
                 })
-                snapshot = await Snapshot.track()
                 break
 
               case "finish-step":
@@ -1051,6 +1120,8 @@ export namespace SessionPrompt {
                 assistantMsg.tokens = usage.tokens
                 await Session.updatePart({
                   id: Identifier.ascending("part"),
+                  reason: value.finishReason,
+                  snapshot: await Snapshot.track(),
                   messageID: assistantMsg.id,
                   sessionID: assistantMsg.sessionID,
                   type: "step-finish",
@@ -1072,6 +1143,10 @@ export namespace SessionPrompt {
                   }
                   snapshot = undefined
                 }
+                SessionSummary.summarize({
+                  sessionID: input.sessionID,
+                  messageID: assistantMsg.parentID,
+                })
                 break
 
               case "text-start":
@@ -1092,7 +1167,11 @@ export namespace SessionPrompt {
                 if (currentText) {
                   currentText.text += value.text
                   if (value.providerMetadata) currentText.metadata = value.providerMetadata
-                  if (currentText.text) await Session.updatePart(currentText)
+                  if (currentText.text)
+                    await Session.updatePart({
+                      part: currentText,
+                      delta: value.text,
+                    })
                 }
                 break
 
@@ -1125,37 +1204,27 @@ export namespace SessionPrompt {
           log.error("process", {
             error: e,
           })
-          switch (true) {
-            case e instanceof DOMException && e.name === "AbortError":
-              assistantMsg.error = new MessageV2.AbortedError(
-                { message: e.message },
-                {
-                  cause: e,
-                },
-              ).toObject()
-              break
-            case MessageV2.OutputLengthError.isInstance(e):
-              assistantMsg.error = e
-              break
-            case LoadAPIKeyError.isInstance(e):
-              assistantMsg.error = new MessageV2.AuthError(
-                {
-                  providerID: input.providerID,
-                  message: e.message,
-                },
-                { cause: e },
-              ).toObject()
-              break
-            case e instanceof Error:
-              assistantMsg.error = new NamedError.Unknown({ message: e.toString() }, { cause: e }).toObject()
-              break
-            default:
-              assistantMsg.error = new NamedError.Unknown({ message: JSON.stringify(e) }, { cause: e })
+          const error = MessageV2.fromError(e, { providerID: input.providerID })
+          if (retries.count < retries.max && MessageV2.APIError.isInstance(error) && error.data.isRetryable) {
+            shouldRetry = true
+            await Session.updatePart({
+              id: Identifier.ascending("part"),
+              messageID: assistantMsg.id,
+              sessionID: assistantMsg.sessionID,
+              type: "retry",
+              attempt: retries.count + 1,
+              time: {
+                created: Date.now(),
+              },
+              error,
+            })
+          } else {
+            assistantMsg.error = error
+            Bus.publish(Session.Event.Error, {
+              sessionID: assistantMsg.sessionID,
+              error: assistantMsg.error,
+            })
           }
-          Bus.publish(Session.Event.Error, {
-            sessionID: assistantMsg.sessionID,
-            error: assistantMsg.error,
-          })
         }
         const p = await Session.getParts(assistantMsg.id)
         for (const part of p) {
@@ -1174,9 +1243,11 @@ export namespace SessionPrompt {
             })
           }
         }
-        assistantMsg.time.completed = Date.now()
+        if (!shouldRetry) {
+          assistantMsg.time.completed = Date.now()
+        }
         await Session.updateMessage(assistantMsg)
-        return { info: assistantMsg, parts: p, blocked }
+        return { info: assistantMsg, parts: p, blocked, shouldRetry }
       },
     }
     return result
@@ -1242,6 +1313,7 @@ export namespace SessionPrompt {
     const msg: MessageV2.Assistant = {
       id: Identifier.ascending("message"),
       sessionID: input.sessionID,
+      parentID: userMsg.id,
       system: [],
       mode: input.agent,
       cost: 0,
@@ -1514,6 +1586,7 @@ export namespace SessionPrompt {
       const assistantMsg: MessageV2.Assistant = {
         id: Identifier.ascending("message"),
         sessionID: input.sessionID,
+        parentID: userMsg.id,
         system: [],
         mode: agentName,
         cost: 0,
@@ -1637,9 +1710,7 @@ export namespace SessionPrompt {
     }
     generateText({
       maxOutputTokens: small.info.reasoning ? 1500 : 20,
-      providerOptions: {
-        [small.providerID]: options,
-      },
+      providerOptions: ProviderTransform.providerOptions(small.npm, small.providerID, options),
       messages: [
         ...SystemPrompt.title(small.providerID).map(
           (x): ModelMessage => ({
@@ -1666,9 +1737,15 @@ export namespace SessionPrompt {
       .then((result) => {
         if (result.text)
           return Session.update(input.session.id, (draft) => {
-            const cleaned = result.text.replace(/<think>[\s\S]*?<\/think>\s*/g, "")
+            const cleaned = result.text
+              .replace(/<think>[\s\S]*?<\/think>\s*/g, "")
+              .split("\n")
+              .map((line) => line.trim())
+              .find((line) => line.length > 0)
+            if (!cleaned) return
+
             const title = cleaned.length > 100 ? cleaned.substring(0, 97) + "..." : cleaned
-            draft.title = title.trim()
+            draft.title = title
           })
       })
       .catch((error) => {

packages/opencode/src/session/prompt/anthropic.txt

@@ -1,81 +1,24 @@
+You are OpenCode, the best coding agent on the planet.
+
 You are an interactive CLI tool that helps users with software engineering tasks. Use the instructions below and the tools available to you to assist the user.
 
 IMPORTANT: You must NEVER generate or guess URLs for the user unless you are confident that the URLs are for helping the user with programming. You may use URLs provided by the user in their messages or local files.
 
-If the user asks for help or wants to give feedback inform them of the following: 
-- /help: Get help with using opencode
-- To give feedback, users should report the issue at https://github.com/sst/opencode/issues
+If the user asks for help or wants to give feedback inform them of the following:
+- ctrl+p to list available actions
+- To give feedback, users should report the issue at
+  https://github.com/sst/opencode
+
+When the user directly asks about OpenCode (eg. "can OpenCode do...", "does OpenCode have..."), or asks in second person (eg. "are you able...", "can you do..."), or asks how to use a specific OpenCode feature (eg. implement a hook, write a slash command, or install an MCP server), use the WebFetch tool to gather information to answer the question from OpenCode docs. The list of available docs is available at https://opencode.ai/docs
 
 # Tone and style
-You should be concise, direct, and to the point.
-You should be concise, direct, and to the point, while providing complete information and matching the level of detail you provide in your response with the level of complexity of the user's query or the work you have completed.
-IMPORTANT: You should minimize output tokens as much as possible while maintaining helpfulness, quality, and accuracy. Only address the specific query or task at hand, avoiding tangential information unless absolutely critical for completing the request. If you can answer in 1-3 sentences or a short paragraph, please do.
-IMPORTANT: You should NOT answer with unnecessary preamble or postamble (such as explaining your code or summarizing your action), unless the user asks you to.
-Do not add additional code explanation summary unless requested by the user. After working on a file, just stop, rather than providing an explanation of what you did.
-Answer the user's question directly, without elaboration, explanation, or details. One word answers are best. Avoid introductions, conclusions, and explanations. You MUST avoid text before/after your response, such as "The answer is <answer>.", "Here is the content of the file..." or "Based on the information provided, the answer is..." or "Here is what I will do next...". Here are some examples to demonstrate appropriate verbosity:
-<example>
-user: 2 + 2
-assistant: 4
-</example>
-
-<example>
-user: what is 2+2?
-assistant: 4
-</example>
-
-<example>
-user: is 11 a prime number?
-assistant: Yes
-</example>
-
-<example>
-user: what command should I run to list files in the current directory?
-assistant: ls
-</example>
-
-<example>
-user: what command should I run to watch files in the current directory?
-assistant: [use the ls tool to list the files in the current directory, then read docs/commands in the relevant file to find out how to watch files]
-npm run dev
-</example>
-
-<example>
-user: How many golf balls fit inside a jetta?
-assistant: 150000
-</example>
-
-<example>
-user: what files are in the directory src/?
-assistant: [runs ls and sees foo.c, bar.c, baz.c]
-user: which file contains the implementation of foo?
-assistant: src/foo.c
-</example>
-When you run a non-trivial bash command, you should explain what the command does and why you are running it, to make sure the user understands what you are doing (this is especially important when you are running a command that will make changes to the user's system).
-Remember that your output will be displayed on a command line interface. Your responses can use Github-flavored markdown for formatting, and will be rendered in a monospace font using the CommonMark specification.
-Output text to communicate with the user; all text you output outside of tool use is displayed to the user. Only use tools to complete tasks. Never use tools like Bash or code comments as means to communicate with the user during the session.
-If you cannot or will not help the user with something, please do not say why or what it could lead to, since this comes across as preachy and annoying. Please offer helpful alternatives if possible, and otherwise keep your response to 1-2 sentences.
-Only use emojis if the user explicitly requests it. Avoid using emojis in all communication unless asked.
-IMPORTANT: Keep your responses short, since they will be displayed on a command line interface.
-
-# Proactiveness
-You are allowed to be proactive, but only when the user asks you to do something. You should strive to strike a balance between:
-- Doing the right thing when asked, including taking actions and follow-up actions
-- Not surprising the user with actions you take without asking
-For example, if the user asks you how to approach something, you should do your best to answer their question first, and not immediately jump into taking actions.
+- Only use emojis if the user explicitly requests it. Avoid using emojis in all communication unless asked.
+- Your output will be displayed on a command line interface. Your responses should be short and concise. You can use Github-flavored markdown for formatting, and will be rendered in a monospace font using the CommonMark specification.
+- Output text to communicate with the user; all text you output outside of tool use is displayed to the user. Only use tools to complete tasks. Never use tools like Bash or code comments as means to communicate with the user during the session.
+- NEVER create files unless they're absolutely necessary for achieving your goal. ALWAYS prefer editing an existing file to creating a new one. This includes markdown files.
 
 # Professional objectivity
-Prioritize technical accuracy and truthfulness over validating the user's beliefs. Focus on facts and problem-solving, providing direct, objective technical info without any unnecessary superlatives, praise, or emotional validation. It is best for the user if Claude honestly applies the same rigorous standards to all ideas and disagrees when necessary, even if it may not be what the user wants to hear. Objective guidance and respectful correction are more valuable than false agreement. Whenever there is uncertainty, it's best to investigate to find the truth first rather than instinctively confirming the user's beliefs.
-
-# Following conventions
-When making changes to files, first understand the file's code conventions. Mimic code style, use existing libraries and utilities, and follow existing patterns.
-- NEVER assume that a given library is available, even if it is well known. Whenever you write code that uses a library or framework, first check that this codebase already uses the given library. For example, you might look at neighboring files, or check the package.json (or cargo.toml, and so on depending on the language).
-- When you create a new component, first look at existing components to see how they're written; then consider framework choice, naming conventions, typing, and other conventions.
-- When you edit a piece of code, first look at the code's surrounding context (especially its imports) to understand the code's choice of frameworks and libraries. Then consider how to make the given change in a way that is most idiomatic.
-- Always follow security best practices. Never introduce code that exposes or logs secrets and keys. Never commit secrets or keys to the repository.
-
-# Code style
-- IMPORTANT: DO NOT ADD ***ANY*** COMMENTS unless asked
-
+Prioritize technical accuracy and truthfulness over validating the user's beliefs. Focus on facts and problem-solving, providing direct, objective technical info without any unnecessary superlatives, praise, or emotional validation. It is best for the user if OpenCode honestly applies the same rigorous standards to all ideas and disagrees when necessary, even if it may not be what the user wants to hear. Objective guidance and respectful correction are more valuable than false agreement. Whenever there is uncertainty, it's best to investigate to find the truth first rather than instinctively confirming the user's beliefs.
 
 # Task Management
 You have access to the TodoWrite tools to help you manage and plan tasks. Use these tools VERY frequently to ensure that you are tracking your tasks and giving the user visibility into your progress.
@@ -87,7 +30,7 @@ Examples:
 
 <example>
 user: Run the build and fix any type errors
-assistant: I'm going to use the TodoWrite tool to write the following items to the todo list: 
+assistant: I'm going to use the TodoWrite tool to write the following items to the todo list:
 - Run the build
 - Fix any type errors
 
@@ -107,7 +50,6 @@ In the above example, the assistant completes all the tasks, including the 10 er
 
 <example>
 user: Help me write a new feature that allows users to track their usage metrics and export them to various formats
-
 assistant: I'll help you implement a usage metrics tracking and export feature. Let me first use the TodoWrite tool to plan this task.
 Adding the following todos to the todo list:
 1. Research existing metrics tracking in the codebase
@@ -124,23 +66,32 @@ I've found some existing telemetry code. Let me mark the first todo as in_progre
 [Assistant continues implementing the feature step by step, marking todos as in_progress and completed as they go]
 </example>
 
+
 # Doing tasks
 The user will primarily request you perform software engineering tasks. This includes solving bugs, adding new functionality, refactoring code, explaining code, and more. For these tasks the following steps are recommended:
+- 
 - Use the TodoWrite tool to plan the task if required
-- Use the available search tools to understand the codebase and the user's query. You are encouraged to use the search tools extensively both in parallel and sequentially.
-- Implement the solution using all tools available to you
-- Verify the solution if possible with tests. NEVER assume specific test framework or test script. Check the README or search codebase to determine the testing approach.
-- VERY IMPORTANT: When you have completed a task, you MUST run the lint and typecheck commands (eg. npm run lint, npm run typecheck, ruff, etc.) with Bash if they were provided to you to ensure your code is correct. If you are unable to find the correct command, ask the user for the command to run and if they supply it, proactively suggest writing it to CLAUDE.md so that you will know to run it next time.
-NEVER commit changes unless the user explicitly asks you to. It is VERY IMPORTANT to only commit when explicitly asked, otherwise the user will feel that you are being too proactive.
 
-- Tool results and user messages may include <system-reminder> tags. <system-reminder> tags contain useful information and reminders. They are NOT part of the user's provided input or the tool result.
+- Tool results and user messages may include <system-reminder> tags. <system-reminder> tags contain useful information and reminders. They are automatically added by the system, and bear no direct relation to the specific tool results or user messages in which they appear.
+
 
 # Tool usage policy
 - When doing file search, prefer to use the Task tool in order to reduce context usage.
 - You should proactively use the Task tool with specialized agents when the task at hand matches the agent's description.
 
 - When WebFetch returns a message about a redirect to a different host, you should immediately make a new WebFetch request with the redirect URL provided in the response.
-- You have the capability to call multiple tools in a single response. When multiple independent pieces of information are requested, batch your tool calls together for optimal performance. When making multiple bash tool calls, you MUST send a single message with multiple tools calls to run the calls in parallel. For example, if you need to run "git status" and "git diff", send a single message with two tool calls to run the calls in parallel.
+- You can call multiple tools in a single response. If you intend to call multiple tools and there are no dependencies between them, make all independent tool calls in parallel. Maximize use of parallel tool calls where possible to increase efficiency. However, if some tool calls depend on previous calls to inform dependent values, do NOT call these tools in parallel and instead call them sequentially. For instance, if one operation must complete before another starts, run these operations sequentially instead. Never use placeholders or guess missing parameters in tool calls.
+- If the user specifies that they want you to run tools "in parallel", you MUST send a single message with multiple tool use content blocks. For example, if you need to launch multiple agents in parallel, send a single message with multiple Task tool calls.
+- Use specialized tools instead of bash commands when possible, as this provides a better user experience. For file operations, use dedicated tools: Read for reading files instead of cat/head/tail, Edit for editing instead of sed/awk, and Write for creating files instead of cat with heredoc or echo redirection. Reserve bash tools exclusively for actual system commands and terminal operations that require shell execution. NEVER use bash echo or other command-line tools to communicate thoughts, explanations, or instructions to the user. Output all communication directly in your response text instead.
+- VERY IMPORTANT: When exploring the codebase to gather context or to answer a question that is not a needle query for a specific file/class/function, it is CRITICAL that you use the Task tool instead of running search commands directly.
+<example>
+user: Where are errors from the client handled?
+assistant: [Uses the Task tool to find the files that handle client errors instead of using Glob or Grep directly]
+</example>
+<example>
+user: What is the codebase structure?
+assistant: [Uses the Task tool]
+</example>
 
 IMPORTANT: Always use the TodoWrite tool to plan and track tasks throughout the conversation.