x.id === id || x.id === "suggested." + id)
+ if (!option?.keybind) return ""
+ return formatKeybind(option.keybind)
+ },
show: showPalette,
keybinds(enabled: boolean) {
setSuspendCount((count) => count + (enabled ? -1 : 1))
diff --git a/packages/desktop/src/context/global-sdk.tsx b/packages/desktop/src/context/global-sdk.tsx
index 0d301d2f3..3732ca085 100644
--- a/packages/desktop/src/context/global-sdk.tsx
+++ b/packages/desktop/src/context/global-sdk.tsx
@@ -1,31 +1,32 @@
import { createOpencodeClient, type Event } from "@opencode-ai/sdk/v2/client"
import { createSimpleContext } from "@opencode-ai/ui/context"
import { createGlobalEmitter } from "@solid-primitives/event-bus"
-import { onCleanup } from "solid-js"
+import { usePlatform } from "./platform"
export const { use: useGlobalSDK, provider: GlobalSDKProvider } = createSimpleContext({
name: "GlobalSDK",
init: (props: { url: string }) => {
- const abort = new AbortController()
- const sdk = createOpencodeClient({
+ const eventSdk = createOpencodeClient({
baseUrl: props.url,
- signal: abort.signal,
- throwOnError: true,
+ // signal: AbortSignal.timeout(1000 * 60 * 10),
})
-
const emitter = createGlobalEmitter<{
[key: string]: Event
}>()
- sdk.global.event().then(async (events) => {
+ eventSdk.global.event().then(async (events) => {
for await (const event of events.stream) {
// console.log("event", event)
emitter.emit(event.directory ?? "global", event.payload)
}
})
- onCleanup(() => {
- abort.abort()
+ const platform = usePlatform()
+ const sdk = createOpencodeClient({
+ baseUrl: props.url,
+ signal: AbortSignal.timeout(1000 * 60 * 10),
+ fetch: platform.fetch,
+ throwOnError: true,
})
return { url: props.url, client: sdk, event: emitter }
diff --git a/packages/desktop/src/context/global-sync.tsx b/packages/desktop/src/context/global-sync.tsx
index 9e716f4d9..27a89e7bc 100644
--- a/packages/desktop/src/context/global-sync.tsx
+++ b/packages/desktop/src/context/global-sync.tsx
@@ -18,9 +18,12 @@ import {
} from "@opencode-ai/sdk/v2/client"
import { createStore, produce, reconcile } from "solid-js/store"
import { Binary } from "@opencode-ai/util/binary"
+import { retry } from "@opencode-ai/util/retry"
import { useGlobalSDK } from "./global-sdk"
import { ErrorPage, type InitError } from "../pages/error"
import { createContext, useContext, onMount, type ParentProps, Switch, Match } from "solid-js"
+import { showToast } from "@opencode-ai/ui/toast"
+import { getFilename } from "@opencode-ai/util/path"
type State = {
ready: boolean
@@ -72,6 +75,7 @@ function createGlobalSync() {
const children: Record
>> = {}
function child(directory: string) {
+ if (!directory) console.error("No directory provided")
if (!children[directory]) {
setGlobalStore("children", directory, {
project: "",
@@ -107,7 +111,7 @@ function createGlobalSync() {
.slice()
.filter((s) => !s.time.archived)
.sort((a, b) => a.id.localeCompare(b.id))
- // Include sessions up to the limit, plus any updated in the last hour
+ // Include up to the limit, plus any updated in the last 4 hours
const sessions = nonArchived.filter((s, i) => {
if (i < store.limit) return true
const updated = new Date(s.time.updated).getTime()
@@ -117,11 +121,13 @@ function createGlobalSync() {
})
.catch((err) => {
console.error("Failed to load sessions", err)
- setGlobalStore("error", err)
+ const project = getFilename(directory)
+ showToast({ title: `Failed to load sessions for ${project}`, description: err.message })
})
}
async function bootstrapInstance(directory: string) {
+ if (!directory) return
const [, setStore] = child(directory)
const sdk = createOpencodeClient({
baseUrl: globalSDK.url,
@@ -140,7 +146,7 @@ function createGlobalSync() {
changes: () => sdk.file.status().then((x) => setStore("changes", x.data!)),
node: () => sdk.file.list({ path: "/" }).then((x) => setStore("node", x.data!)),
}
- await Promise.all(Object.values(load).map((p) => p().catch((e) => setGlobalStore("error", e))))
+ await Promise.all(Object.values(load).map((p) => retry(p).catch((e) => setGlobalStore("error", e))))
.then(() => setStore("ready", true))
.catch((e) => setGlobalStore("error", e))
}
@@ -290,21 +296,29 @@ function createGlobalSync() {
async function bootstrap() {
return Promise.all([
- globalSDK.client.path.get().then((x) => {
- setGlobalStore("path", x.data!)
- }),
- globalSDK.client.project.list().then(async (x) => {
- setGlobalStore(
- "project",
- x.data!.filter((p) => !p.worktree.includes("opencode-test")).sort((a, b) => a.id.localeCompare(b.id)),
- )
- }),
- globalSDK.client.provider.list().then((x) => {
- setGlobalStore("provider", x.data ?? {})
- }),
- globalSDK.client.provider.auth().then((x) => {
- setGlobalStore("provider_auth", x.data ?? {})
- }),
+ retry(() =>
+ globalSDK.client.path.get().then((x) => {
+ setGlobalStore("path", x.data!)
+ }),
+ ),
+ retry(() =>
+ globalSDK.client.project.list().then(async (x) => {
+ setGlobalStore(
+ "project",
+ x.data!.filter((p) => !p.worktree.includes("opencode-test")).sort((a, b) => a.id.localeCompare(b.id)),
+ )
+ }),
+ ),
+ retry(() =>
+ globalSDK.client.provider.list().then((x) => {
+ setGlobalStore("provider", x.data ?? {})
+ }),
+ ),
+ retry(() =>
+ globalSDK.client.provider.auth().then((x) => {
+ setGlobalStore("provider_auth", x.data ?? {})
+ }),
+ ),
])
.then(() => setGlobalStore("ready", true))
.catch((e) => setGlobalStore("error", e))
diff --git a/packages/desktop/src/context/layout.tsx b/packages/desktop/src/context/layout.tsx
index 01e0bdf52..8bfc8aa21 100644
--- a/packages/desktop/src/context/layout.tsx
+++ b/packages/desktop/src/context/layout.tsx
@@ -27,6 +27,8 @@ type SessionTabs = {
all: string[]
}
+export type LocalProject = Partial & { worktree: string; expanded: boolean }
+
export const { use: useLayout, provider: LayoutProvider } = createSimpleContext({
name: "Layout",
init: () => {
@@ -44,8 +46,8 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
opened: false,
height: 280,
},
- review: {
- state: "pane" as "pane" | "tab",
+ session: {
+ width: 600,
},
sessionTabs: {} as Record,
}),
@@ -61,21 +63,22 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
function enrich(project: { worktree: string; expanded: boolean }) {
const metadata = globalSync.data.project.find((x) => x.worktree === project.worktree)
- if (!metadata) return []
return [
{
...project,
- ...metadata,
+ ...(metadata ?? {}),
},
]
}
- function colorize(project: Project & { expanded: boolean }) {
+ function colorize(project: LocalProject) {
if (project.icon?.color) return project
const color = pickAvailableColor()
usedColors.add(color)
project.icon = { ...project.icon, color }
- globalSdk.client.project.update({ projectID: project.id, icon: { color } })
+ if (project.id) {
+ globalSdk.client.project.update({ projectID: project.id, icon: { color } })
+ }
return project
}
@@ -95,7 +98,9 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
projects: {
list,
open(directory: string) {
- if (store.projects.find((x) => x.worktree === directory)) return
+ if (store.projects.find((x) => x.worktree === directory)) {
+ return
+ }
globalSync.project.loadSessions(directory)
setStore("projects", (x) => [{ worktree: directory, expanded: true }, ...x])
},
@@ -151,13 +156,14 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
setStore("terminal", "height", height)
},
},
- review: {
- state: createMemo(() => store.review?.state ?? "closed"),
- pane() {
- setStore("review", "state", "pane")
- },
- tab() {
- setStore("review", "state", "tab")
+ session: {
+ width: createMemo(() => store.session?.width ?? 600),
+ resize(width: number) {
+ if (!store.session) {
+ setStore("session", { width })
+ } else {
+ setStore("session", "width", width)
+ }
},
},
tabs(sessionKey: string) {
@@ -181,14 +187,6 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext(
}
},
async open(tab: string) {
- if (tab === "chat") {
- if (!store.sessionTabs[sessionKey]) {
- setStore("sessionTabs", sessionKey, { all: [], active: undefined })
- } else {
- setStore("sessionTabs", sessionKey, "active", undefined)
- }
- return
- }
const current = store.sessionTabs[sessionKey] ?? { all: [] }
if (tab !== "review") {
if (!current.all.includes(tab)) {
diff --git a/packages/desktop/src/context/local.tsx b/packages/desktop/src/context/local.tsx
index 2ea4de524..69807a2f4 100644
--- a/packages/desktop/src/context/local.tsx
+++ b/packages/desktop/src/context/local.tsx
@@ -337,6 +337,7 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({
const load = async (path: string) => {
const relativePath = relative(path)
await sdk.client.file.read({ path: relativePath }).then((x) => {
+ if (!store.node[relativePath]) return
setStore(
"node",
relativePath,
@@ -359,7 +360,7 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({
const init = async (path: string) => {
const relativePath = relative(path)
if (!store.node[relativePath]) await fetch(path)
- if (store.node[relativePath].loaded) return
+ if (store.node[relativePath]?.loaded) return
return load(relativePath)
}
@@ -379,7 +380,7 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({
context.addActive()
if (options?.pinned) setStore("node", path, "pinned", true)
if (options?.view && store.node[relativePath].view === undefined) setStore("node", path, "view", options.view)
- if (store.node[relativePath].loaded) return
+ if (store.node[relativePath]?.loaded) return
return load(relativePath)
}
@@ -425,7 +426,7 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({
init,
expand(path: string) {
setStore("node", path, "expanded", true)
- if (store.node[path].loaded) return
+ if (store.node[path]?.loaded) return
setStore("node", path, "loaded", true)
list(path)
},
diff --git a/packages/desktop/src/context/platform.tsx b/packages/desktop/src/context/platform.tsx
index 2ac9f64d4..73d4c7f3e 100644
--- a/packages/desktop/src/context/platform.tsx
+++ b/packages/desktop/src/context/platform.tsx
@@ -5,6 +5,12 @@ export type Platform = {
/** Platform discriminator */
platform: "web" | "tauri"
+ /** Open a URL in the default browser */
+ openLink(url: string): void
+
+ /** Restart the app */
+ restart(): Promise
+
/** Open native directory picker dialog (Tauri only) */
openDirectoryPickerDialog?(opts?: { title?: string; multiple?: boolean }): Promise
@@ -14,9 +20,6 @@ export type Platform = {
/** Save file picker dialog (Tauri only) */
saveFilePickerDialog?(opts?: { title?: string; defaultPath?: string }): Promise
- /** Open a URL in the default browser */
- openLink(url: string): void
-
/** Storage mechanism, defaults to localStorage */
storage?: (name?: string) => SyncStorage | AsyncStorage
@@ -25,6 +28,9 @@ export type Platform = {
/** Install updates (Tauri only) */
update?(): Promise
+
+ /** Fetch override */
+ fetch?: typeof fetch
}
export const { use: usePlatform, provider: PlatformProvider } = createSimpleContext({
diff --git a/packages/desktop/src/context/sdk.tsx b/packages/desktop/src/context/sdk.tsx
index 0e556167b..4d1c797c9 100644
--- a/packages/desktop/src/context/sdk.tsx
+++ b/packages/desktop/src/context/sdk.tsx
@@ -1,17 +1,18 @@
import { createOpencodeClient, type Event } from "@opencode-ai/sdk/v2/client"
import { createSimpleContext } from "@opencode-ai/ui/context"
import { createGlobalEmitter } from "@solid-primitives/event-bus"
-import { onCleanup } from "solid-js"
import { useGlobalSDK } from "./global-sdk"
+import { usePlatform } from "./platform"
export const { use: useSDK, provider: SDKProvider } = createSimpleContext({
name: "SDK",
init: (props: { directory: string }) => {
+ const platform = usePlatform()
const globalSDK = useGlobalSDK()
- const abort = new AbortController()
const sdk = createOpencodeClient({
baseUrl: globalSDK.url,
- signal: abort.signal,
+ signal: AbortSignal.timeout(1000 * 60 * 10),
+ fetch: platform.fetch,
directory: props.directory,
throwOnError: true,
})
@@ -24,10 +25,6 @@ export const { use: useSDK, provider: SDKProvider } = createSimpleContext({
emitter.emit(event.type, event)
})
- onCleanup(() => {
- abort.abort()
- })
-
return { directory: props.directory, client: sdk, event: emitter, url: globalSDK.url }
},
})
diff --git a/packages/desktop/src/context/sync.tsx b/packages/desktop/src/context/sync.tsx
index cb782c24b..941b8b629 100644
--- a/packages/desktop/src/context/sync.tsx
+++ b/packages/desktop/src/context/sync.tsx
@@ -1,6 +1,7 @@
import { produce } from "solid-js/store"
import { createMemo } from "solid-js"
import { Binary } from "@opencode-ai/util/binary"
+import { retry } from "@opencode-ai/util/retry"
import { createSimpleContext } from "@opencode-ai/ui/context"
import { useGlobalSync } from "./global-sync"
import { useSDK } from "./sdk"
@@ -33,14 +34,13 @@ export const { use: useSync, provider: SyncProvider } = createSimpleContext({
},
addOptimisticMessage(input: {
sessionID: string
- text: string
+ messageID: string
parts: Part[]
agent: string
model: { providerID: string; modelID: string }
}) {
- const messageID = crypto.randomUUID()
const message: Message = {
- id: messageID,
+ id: input.messageID,
sessionID: input.sessionID,
role: "user",
time: { created: Date.now() },
@@ -53,24 +53,19 @@ export const { use: useSync, provider: SyncProvider } = createSimpleContext({
if (!messages) {
draft.message[input.sessionID] = [message]
} else {
- const result = Binary.search(messages, messageID, (m) => m.id)
+ const result = Binary.search(messages, input.messageID, (m) => m.id)
messages.splice(result.index, 0, message)
}
- draft.part[messageID] = input.parts.map((part, i) => ({
- ...part,
- id: `${messageID}-${i}`,
- sessionID: input.sessionID,
- messageID,
- }))
+ draft.part[input.messageID] = input.parts.slice()
}),
)
},
async sync(sessionID: string, _isRetry = false) {
const [session, messages, todo, diff] = await Promise.all([
- sdk.client.session.get({ sessionID }, { throwOnError: true }),
- sdk.client.session.messages({ sessionID, limit: 100 }),
- sdk.client.session.todo({ sessionID }),
- sdk.client.session.diff({ sessionID }),
+ retry(() => sdk.client.session.get({ sessionID })),
+ retry(() => sdk.client.session.messages({ sessionID, limit: 100 })),
+ retry(() => sdk.client.session.todo({ sessionID })),
+ retry(() => sdk.client.session.diff({ sessionID })),
])
setStore(
produce((draft) => {
diff --git a/packages/desktop/src/entry.tsx b/packages/desktop/src/entry.tsx
index eec6396e9..ecbce9815 100644
--- a/packages/desktop/src/entry.tsx
+++ b/packages/desktop/src/entry.tsx
@@ -15,6 +15,9 @@ const platform: Platform = {
openLink(url: string) {
window.open(url, "_blank")
},
+ restart: async () => {
+ window.location.reload()
+ },
}
render(
diff --git a/packages/desktop/src/index.css b/packages/desktop/src/index.css
index 5481cb604..e40f0842b 100644
--- a/packages/desktop/src/index.css
+++ b/packages/desktop/src/index.css
@@ -1,11 +1,6 @@
@import "@opencode-ai/ui/styles/tailwind";
:root {
- html,
- body {
- touch-action: manipulation;
- }
-
a {
cursor: default;
}
diff --git a/packages/desktop/src/pages/error.tsx b/packages/desktop/src/pages/error.tsx
index 27c30870a..c7330c298 100644
--- a/packages/desktop/src/pages/error.tsx
+++ b/packages/desktop/src/pages/error.tsx
@@ -1,5 +1,6 @@
import { TextField } from "@opencode-ai/ui/text-field"
import { Logo } from "@opencode-ai/ui/logo"
+import { Button } from "@opencode-ai/ui/button"
import { Component } from "solid-js"
import { usePlatform } from "@/context/platform"
import { Icon } from "@opencode-ai/ui/icon"
@@ -9,9 +10,17 @@ export type InitError = {
data: Record
}
-function formatError(error: InitError | undefined): string {
- if (!error) return "Unknown error"
+function isInitError(error: unknown): error is InitError {
+ return (
+ typeof error === "object" &&
+ error !== null &&
+ "name" in error &&
+ "data" in error &&
+ typeof (error as InitError).data === "object"
+ )
+}
+function formatInitError(error: InitError): string {
const data = error.data
switch (error.name) {
case "MCPFailed":
@@ -53,16 +62,44 @@ function formatError(error: InitError | undefined): string {
}
}
+function formatErrorChain(error: unknown, depth = 0): string {
+ if (!error) return "Unknown error"
+
+ const indent = depth > 0 ? `\n${"─".repeat(40)}\nCaused by:\n` : ""
+
+ if (isInitError(error)) {
+ return indent + formatInitError(error)
+ }
+
+ if (error instanceof Error) {
+ const parts = [indent + `${error.name}: ${error.message}`]
+ if (error.stack) {
+ parts.push(error.stack)
+ }
+ if (error.cause) {
+ parts.push(formatErrorChain(error.cause, depth + 1))
+ }
+ return parts.join("\n\n")
+ }
+
+ if (typeof error === "string") return indent + error
+ return indent + JSON.stringify(error, null, 2)
+}
+
+function formatError(error: unknown): string {
+ return formatErrorChain(error, 0)
+}
+
interface ErrorPageProps {
- error: InitError | undefined
+ error: unknown
}
export const ErrorPage: Component = (props) => {
const platform = usePlatform()
return (
-
+
-
+
Something went wrong
An error occurred while loading the application.
@@ -76,6 +113,9 @@ export const ErrorPage: Component
= (props) => {
label="Error Details"
hideLabel
/>
+
Please report this error to the OpenCode team
+ 
