fix(desktop): hide sessions during removal

packages/app/src/home/sessions/controller.tsx

@@ -5,7 +5,6 @@ import { DialogFooter, DialogHeader, DialogTitleGroup, Dialog } from "@opencode-
 import { skipToken, useQuery, useQueryClient } from "@tanstack/solid-query"
 import { DateTime } from "luxon"
 import { type Accessor, createEffect, createMemo, type JSX, startTransition, untrack } from "solid-js"
-import { createStore } from "solid-js/store"
 import { notifySessionTabsRemoved } from "@/shell/titlebar/session-events"
 import { useCommand } from "@/shell/commands/command"
 import { loadHomeSessionIndex, mergeHomeSessionIndex, retainHomeSessions } from "@/home/sessions/index"
@@ -43,7 +42,6 @@ export function createHomeSessionsController(home: HomeController) {
  const dialog = useDialog()
  const language = useLanguage()
  const queryClient = useQueryClient()
- const [removed, setRemoved] = createStore({ keys: [] as string[] })
  const projectDirectories = createMemo(() => {
  const selected = home.selection.value().directory
  if (!selected) return
@@ -70,10 +68,9 @@ export function createHomeSessionsController(home: HomeController) {
  const ctx = home.server.focusedContext()
  const conn = home.server.focused()
  if (!ctx || !conn) return []
- const server = ServerConnection.key(conn)
  return retainHomeSessions(
-mergeHomeSessionIndex(sessionLoad.isPending ? [] : (sessionLoad.data?.() ?? []), ctx.data.session.list()).filter(
-(session) => !removed.keys.includes(`${server}\0${session.id}`),
+ ctx.data.session.apply(
+mergeHomeSessionIndex(sessionLoad.isPending ? [] : (sessionLoad.data?.() ?? []), ctx.data.session.list()),
  ),
  HOME_SESSION_LIMIT,
  Date.now(),
@@ -192,15 +189,9 @@ export function createHomeSessionsController(home: HomeController) {
  const ctx = conn ? home.server.context(conn) : undefined
  if (!conn || !ctx) return false
  const ids = [...removedSessionIDs(ctx.data.session.list(), session.id)]
- await queryClient.cancelQueries({ queryKey: ["home-sessions", conn], exact: true })
- return ctx.sdk.api.session
- .remove({ sessionID: session.id })
+ return ctx.data.session
+ .remove(session.id)
  .then(() => {
- const removedIDs = new Set(ids)
- setRemoved("keys", (current) => [...new Set([...current, ...ids.map((id) => `${server}\0${id}`)])])
- queryClient.setQueryData<SessionInfo[]>(["home-sessions", conn], (current) =>
- current?.filter((item) => !removedIDs.has(item.id)),
- )
  notifySessionTabsRemoved({
  server: ServerConnection.key(conn),
  directory: session.location.directory,
@@ -216,9 +207,6 @@ export function createHomeSessionsController(home: HomeController) {
  return false
  })
  .finally(() => {
- // Always refetch: the pre-mutation cancel may have aborted an
- // in-flight index fetch, and a failed delete must not leave the
- // index unloaded either.
  void queryClient.invalidateQueries({ queryKey: ["home-sessions", conn], exact: true })
  })
  }

packages/app/src/runtime/server/data.test.ts

@@ -0,0 +1,33 @@
+import { expect, test } from "bun:test"
+import type { SessionInfo } from "@opencode-ai/client/promise"
+import { createSessionMutations } from "./data"
+
+const session = { id: "ses_test" } as SessionInfo
+
+test("keeps a successful removal applied until its event arrives", async () => {
+ const release = Promise.withResolvers<void>()
+ const mutation = createSessionMutations(async () => release.promise)
+
+ const request = mutation.remove(session.id)
+ expect(mutation.apply([session])).toEqual([])
+ release.resolve()
+ await request
+ expect(mutation.apply([session])).toEqual([])
+
+ mutation.deleted(session.id)
+ expect(mutation.apply([session])).toEqual([session])
+})
+
+test("rolls back a failed removal", async () => {
+ const release = Promise.withResolvers<void>()
+ const mutation = createSessionMutations(async () => {
+ await release.promise
+ throw new Error("offline")
+ })
+
+ const request = mutation.remove(session.id)
+ expect(mutation.apply([session])).toEqual([])
+ release.resolve()
+ await expect(request).rejects.toThrow("offline")
+ expect(mutation.apply([session])).toEqual([session])
+})

packages/app/src/runtime/server/data.ts

@@ -0,0 +1,51 @@
+import type { Data } from "@opencode-ai/client/solid"
+import type { SessionInfo } from "@opencode-ai/client/promise"
+import { onCleanup } from "solid-js"
+import { createStore } from "solid-js/store"
+
+type SessionMutation = { readonly id: string; readonly type: "remove"; readonly sessionID: string }
+
+export function createDesktopData(input: { data: Data; remove: (sessionID: string) => Promise<void> }) {
+ const mutation = createSessionMutations(input.remove)
+ onCleanup(input.data.on("session.deleted", (event) => mutation.deleted(event.data.sessionID)))
+
+ return {
+ ...input.data,
+ session: {
+ ...input.data.session,
+ list: () => mutation.apply(input.data.session.list()),
+ apply: mutation.apply,
+ remove: mutation.remove,
+ },
+ }
+}
+
+export function createSessionMutations(remove: (sessionID: string) => Promise<void>) {
+ const [store, setStore] = createStore({ session: [] as SessionMutation[] })
+
+ const clear = (id: string) => {
+ setStore("session", (current) => current.filter((mutation) => mutation.id !== id))
+ }
+
+ return {
+ apply(sessions: readonly SessionInfo[]) {
+ const removed = new Set(
+ store.session.flatMap((mutation) => (mutation.type === "remove" ? [mutation.sessionID] : [])),
+ )
+ return removed.size === 0 ? [...sessions] : sessions.filter((session) => !removed.has(session.id))
+ },
+ remove(sessionID: string) {
+ const mutation = { id: crypto.randomUUID(), type: "remove" as const, sessionID }
+ setStore("session", (current) => [...current, mutation])
+ return Promise.resolve()
+ .then(() => remove(sessionID))
+ .catch((error) => {
+ clear(mutation.id)
+ throw error
+ })
+ },
+ deleted(sessionID: string) {
+ setStore("session", (current) => current.filter((mutation) => mutation.sessionID !== sessionID))
+ },
+ }
+}

packages/app/src/runtime/server/runtime.tsx

@@ -11,6 +11,7 @@ import type { ServerScope } from "@/runtime/server/scope"
 import { createPermissionAutoApprover } from "@/session/requests/auto-approve"
 import { createServerNotificationState } from "@/shell/notifications/notification"
 import { Persist, persisted } from "@/runtime/persistence/storage"
+import { createDesktopData } from "./data"
 
 export const { use: useGlobal, provider: GlobalProvider } = createSimpleContext({
  name: "Global",
@@ -134,7 +135,7 @@ function createServerController(
 ) {
  const connKey = ServerConnection.key(conn)
  const sdk = createServerSdkContext(conn, scope)
- const data = createData({
+ const source = createData({
  api: () => sdk.api,
  event: {
  on: sdk.event.on,
@@ -143,6 +144,10 @@ function createServerController(
  connection: sdk.connection,
  directory: "",
  })
+ const data = createDesktopData({
+ data: source,
+ remove: (sessionID) => sdk.api.session.remove({ sessionID }),
+ })
  const sync = createServerSyncContext(sdk, data)
  createPermissionAutoApprover({ sdk, data })
  const notification = createServerNotificationState({ sdk, data, key: connKey })

packages/app/src/session/timeline/controller.tsx

@@ -168,15 +168,15 @@ export function createTimelineController(input: { session: TimelineSessionSource
  const sessions = data.session.list().filter((item) => !item.parentID && !item.time?.archived)
  const index = sessions.findIndex((item) => item.id === id)
  const next = index === -1 ? undefined : (sessions[index + 1] ?? sessions[index - 1])
- const success = await serverSDK.api.session
- .remove({ sessionID: id })
+ const removed = removedSessionIDs(data.session.list(), id)
+ const success = await data.session
+ .remove(id)
  .then(() => true)
  .catch((error) => {
  showToast({ title: language.t("session.delete.failed.title"), description: errorMessage(error) })
  return false
  })
  if (!success) return false
- const removed = removedSessionIDs(data.session.list(), id)
  void navigateAfterRemoval(id, session.parentID, next?.id)
  notifySessionTabsRemoved({ server: server.key, directory: sdk().directory, sessionIDs: [...removed] })
  return true