- {/* Left Column: Chat + Bottom Panel */}
-
- {/* Chat Area */}
-
- {/* Header Overlay */}
-
-
- setSidebarExpanded(true)}
- modelSelectorRef={modelSelectorRef}
- />
+ {sidebarExpanded && (
+
+ )}
+
+
+
-
-
- {/* Scrollable Area */}
-
-
+
+ ) : (
+ <>
+
-
-
- {/* Floating Input Box */}
-
- {/* Double-Esc cancel hint */}
- {showCancelHint && (
-
-
- Press
Esc again to stop
+
+
-
- {/* Permission Dialog */}
- {pendingPermissionRequests.length > 0 && (
-
handlePermissionReply(pendingPermissionRequests[0].id, reply, effectiveDirectory)}
- queueLength={pendingPermissionRequests.length}
- isReplying={isReplying}
- currentSessionId={routeSessionId}
- />
- )}
-
- {/* Question Dialog */}
- {pendingPermissionRequests.length === 0 && pendingQuestionRequests.length > 0 && (
- handleQuestionReply(pendingQuestionRequests[0].id, answers, effectiveDirectory)}
- onReject={() => handleQuestionReject(pendingQuestionRequests[0].id, effectiveDirectory)}
- queueLength={pendingQuestionRequests.length}
- isReplying={isReplying}
- />
- )}
-
- {/* Bottom Panel */}
-
+
+
+
+ )}
+
- {/* Right Panel - 占满整个高度 */}
-
-
-
- {/* Settings Dialog */}
-
-
- {/* Command Palette */}
-
setCommandPaletteOpen(false)}
- commands={commands}
- />
+
+
+ setCommandPaletteOpen(false)}
+ commands={commands}
+ />
+
+
+
+
+
+
)
}
diff --git a/src/api/agent.ts b/src/api/agent.ts
index 3f609c99..5e4a977a 100644
--- a/src/api/agent.ts
+++ b/src/api/agent.ts
@@ -1,17 +1,18 @@
// ============================================
// Agent API Functions
-// 基于 OpenAPI: /agent 相关接口
+// 基于 @opencode-ai/sdk: /agent 相关接口
// ============================================
-import { get } from './http'
+import { getSDKClient, unwrap } from './sdk'
import { formatPathForApi } from '../utils/directoryUtils'
import type { ApiAgent } from './types'
/**
- * GET /agent - 获取 agent 列表
+ * 获取 agent 列表
*/
export async function getAgents(directory?: string): Promise
{
- return get('/agent', { directory: formatPathForApi(directory) })
+ const sdk = getSDKClient()
+ return unwrap(await sdk.app.agents({ directory: formatPathForApi(directory) }))
}
/**
diff --git a/src/api/client.ts b/src/api/client.ts
index 5ffc248a..61518832 100644
--- a/src/api/client.ts
+++ b/src/api/client.ts
@@ -1,19 +1,25 @@
// ============================================
// API Client for OpenCode Backend
-// 基于 OpenAPI: /config, /project, /provider 相关接口
+// 基于 @opencode-ai/sdk: /config, /project, /provider 相关接口
// ============================================
-import { get, patch } from './http'
+import { getSDKClient, unwrap } from './sdk'
import { formatPathForApi } from '../utils/directoryUtils'
-import type {
- ProvidersResponse,
- ModelInfo,
- ApiProject,
- ApiPath,
-} from './types'
+import type { ModelInfo, ApiProject, ApiPath } from './types'
-// Re-export API_BASE for backward compatibility
-export { API_BASE } from './http'
+function isRecord(value: unknown): value is Record {
+ return !!value && typeof value === 'object' && !Array.isArray(value)
+}
+
+function requireRecord(value: unknown, message: string): Record {
+ if (isRecord(value)) return value
+ throw new Error(message)
+}
+
+function requireArray(value: unknown, message: string): T[] {
+ if (Array.isArray(value)) return value as T[]
+ throw new Error(message)
+}
// Re-export all types
export * from './types'
@@ -41,31 +47,45 @@ export * from './lsp'
// ============================================
// Model API Functions
-// 基于 OpenAPI: GET /config/providers
+// 基于 SDK: config.providers()
// ============================================
export async function getActiveModels(directory?: string): Promise {
- const data = await get('/config/providers', {
- directory: formatPathForApi(directory)
- })
+ const sdk = getSDKClient()
+ const data = requireRecord(
+ unwrap(await sdk.config.providers({ directory: formatPathForApi(directory) })),
+ 'Invalid OpenCode providers response',
+ )
+ const providers = requireArray>(data.providers, 'Invalid OpenCode providers response')
const models: ModelInfo[] = []
- for (const provider of data.providers) {
- for (const [, model] of Object.entries(provider.models)) {
+ for (const provider of providers) {
+ const providerModels = isRecord(provider.models) ? provider.models : {}
+ for (const [, rawModel] of Object.entries(providerModels)) {
+ if (!isRecord(rawModel)) continue
+ const model = rawModel
if (model.status === 'active') {
- const variants = model.variants ? Object.keys(model.variants) : []
-
+ const limit = isRecord(model.limit) ? model.limit : {}
+ const capabilities = isRecord(model.capabilities) ? model.capabilities : {}
+ const inputCapabilities = isRecord(capabilities.input) ? capabilities.input : {}
+ const variants = isRecord(model.variants) ? Object.keys(model.variants) : []
+ const modelId = typeof model.id === 'string' ? model.id : ''
+ if (!modelId) continue
+
models.push({
- id: model.id,
- name: model.name,
- providerId: provider.id,
- providerName: provider.name,
- family: model.family,
- contextLimit: model.limit.context,
- outputLimit: model.limit.output,
- supportsReasoning: model.capabilities.reasoning,
- supportsImages: model.capabilities.input.image,
- supportsToolcall: model.capabilities.toolcall,
+ id: modelId,
+ name: typeof model.name === 'string' ? model.name : modelId,
+ providerId: typeof provider.id === 'string' ? provider.id : '',
+ providerName: typeof provider.name === 'string' ? provider.name : typeof provider.id === 'string' ? provider.id : '',
+ family: typeof model.family === 'string' ? model.family : '',
+ contextLimit: typeof limit.context === 'number' ? limit.context : 0,
+ outputLimit: typeof limit.output === 'number' ? limit.output : 0,
+ supportsReasoning: capabilities.reasoning === true,
+ supportsImages: inputCapabilities.image === true,
+ supportsPdf: inputCapabilities.pdf === true,
+ supportsAudio: inputCapabilities.audio === true,
+ supportsVideo: inputCapabilities.video === true,
+ supportsToolcall: capabilities.toolcall === true,
variants,
})
}
@@ -76,45 +96,63 @@ export async function getActiveModels(directory?: string): Promise
}
export async function getDefaultModels(directory?: string): Promise> {
- const data = await get('/config/providers', {
- directory: formatPathForApi(directory)
- })
- return data.default
+ const sdk = getSDKClient()
+ const data = requireRecord(
+ unwrap(await sdk.config.providers({ directory: formatPathForApi(directory) })),
+ 'Invalid OpenCode providers response',
+ )
+ const defaults = requireRecord(data.default, 'Invalid OpenCode default model response')
+ return Object.fromEntries(Object.entries(defaults).filter((entry): entry is [string, string] => typeof entry[1] === 'string'))
}
// ============================================
// Project API Functions
-// 基于 OpenAPI: /project, /project/current, /project/{projectID}
+// 基于 SDK: project.*
// ============================================
/**
- * GET /project/current - 获取当前项目
+ * 获取当前项目
*/
export async function getCurrentProject(directory?: string): Promise {
- return get('/project/current', { directory: formatPathForApi(directory) })
+ const sdk = getSDKClient()
+ return unwrap(await sdk.project.current({ directory: formatPathForApi(directory) }))
}
/**
- * GET /project - 获取项目列表
+ * 获取项目列表
*/
export async function getProjects(directory?: string): Promise {
- return get('/project', { directory: formatPathForApi(directory) })
+ const sdk = getSDKClient()
+ return requireArray(unwrap(await sdk.project.list({ directory: formatPathForApi(directory) })), 'Invalid OpenCode project list response')
+}
+
+/**
+ * 初始化 Git 仓库
+ */
+export async function initGitProject(directory?: string): Promise {
+ const sdk = getSDKClient()
+ return unwrap(await sdk.project.initGit({ directory: formatPathForApi(directory) }))
}
/**
- * PATCH /project/{projectID} - 更新项目
+ * 更新项目
*/
export async function updateProject(
- projectId: string,
+ projectId: string,
params: {
name?: string
icon?: { url?: string; override?: string; color?: string }
},
- directory?: string
+ directory?: string,
): Promise {
- return patch(`/project/${projectId}`, {
- directory: formatPathForApi(directory)
- }, params)
+ const sdk = getSDKClient()
+ return unwrap(
+ await sdk.project.update({
+ projectID: projectId,
+ directory: formatPathForApi(directory),
+ ...params,
+ }),
+ )
}
// ============================================
@@ -122,5 +160,6 @@ export async function updateProject(
// ============================================
export async function getPath(): Promise {
- return get('/path')
+ const sdk = getSDKClient()
+ return requireRecord(unwrap(await sdk.path.get()), 'Invalid OpenCode path response') as unknown as ApiPath
}
diff --git a/src/api/command.test.ts b/src/api/command.test.ts
new file mode 100644
index 00000000..8d03f54f
--- /dev/null
+++ b/src/api/command.test.ts
@@ -0,0 +1,48 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { getCommands } from './command'
+
+const listMock = vi.fn()
+
+vi.mock('./sdk', () => ({
+ getSDKClient: () => ({
+ command: {
+ list: (...args: unknown[]) => listMock(...args),
+ },
+ }),
+ unwrap: (result: { data?: unknown }) => result.data,
+}))
+
+vi.mock('../store/serverStore', () => ({
+ serverStore: {
+ getActiveServerId: () => 'test-server',
+ },
+}))
+
+describe('getCommands', () => {
+ beforeEach(() => {
+ listMock.mockReset()
+ })
+
+ it('marks frontend and api commands with stable sources', async () => {
+ listMock.mockResolvedValue({ data: [{ name: 'review', description: 'Run project review' }] })
+
+ const commands = await getCommands('/workspace/project')
+
+ expect(commands).toEqual([
+ { name: 'review', description: 'Run project review', source: 'api' },
+ { name: 'new', description: 'Create a new chat session', source: 'frontend' },
+ { name: 'compact', description: 'Compact session by summarizing conversation history', source: 'frontend' },
+ ])
+ })
+
+ it('keeps API commands as api commands even if names overlap frontend commands', async () => {
+ listMock.mockResolvedValue({ data: [{ name: 'compact', description: 'Native compact command' }] })
+
+ const commands = await getCommands('/workspace/project-overlap')
+
+ expect(commands).toEqual([
+ { name: 'compact', description: 'Native compact command', source: 'api' },
+ { name: 'new', description: 'Create a new chat session', source: 'frontend' },
+ ])
+ })
+})
diff --git a/src/api/command.ts b/src/api/command.ts
index a20623a8..6e3aec8c 100644
--- a/src/api/command.ts
+++ b/src/api/command.ts
@@ -2,38 +2,95 @@
// Command API - 命令列表和执行
// ============================================
-import { get, post } from './http'
+import { getSDKClient, unwrap } from './sdk'
import { formatPathForApi } from '../utils/directoryUtils'
+import { serverStore } from '../store/serverStore'
+import i18n from '../i18n'
export interface Command {
name: string
description?: string
keybind?: string
+ source: 'frontend' | 'api'
+}
+
+type ApiCommand = Omit
+
+// Frontend-added slash commands that do not come from GET /command.
+// These are executed locally or via dedicated session actions.
+function getFrontendCommands(): Command[] {
+ return [
+ { name: 'new', description: i18n.t('commands:slashCommand.newSessionDesc'), source: 'frontend' },
+ { name: 'compact', description: i18n.t('commands:slashCommand.compactDesc'), source: 'frontend' },
+ ]
+}
+
+const COMMAND_CACHE_TTL_MS = 10_000
+
+const commandCache = new Map()
+const commandInflight = new Map>()
+
+function getCommandCacheKey(directory?: string): string {
+ return `${serverStore.getActiveServerId()}::${i18n.resolvedLanguage || i18n.language}::${formatPathForApi(directory) ?? ''}`
+}
+
+async function fetchCommands(directory?: string): Promise {
+ let apiCommands: ApiCommand[] = []
+ try {
+ const sdk = getSDKClient()
+ apiCommands = unwrap(await sdk.command.list({ directory: formatPathForApi(directory) })) ?? []
+ } catch {
+ // Backend unreachable — frontend commands still available
+ }
+ const frontendCommands = getFrontendCommands()
+ const commandsFromApi: Command[] = apiCommands.map(command => ({ ...command, source: 'api' }))
+ const apiNames = new Set(commandsFromApi.map(c => c.name))
+ return [...commandsFromApi, ...frontendCommands.filter(c => !apiNames.has(c.name))]
}
-/**
- * 获取可用命令列表
- */
export async function getCommands(directory?: string): Promise {
- return get('/command', { directory: formatPathForApi(directory) })
+ const key = getCommandCacheKey(directory)
+ const now = Date.now()
+ const cached = commandCache.get(key)
+ if (cached && cached.expiresAt > now) {
+ return cached.data
+ }
+
+ const inflight = commandInflight.get(key)
+ if (inflight) {
+ return inflight
+ }
+
+ const request = fetchCommands(directory)
+ .then(data => {
+ commandCache.set(key, { data, expiresAt: Date.now() + COMMAND_CACHE_TTL_MS })
+ return data
+ })
+ .finally(() => {
+ commandInflight.delete(key)
+ })
+
+ commandInflight.set(key, request)
+ return request
+}
+
+export async function prefetchCommands(directory?: string): Promise {
+ await getCommands(directory)
}
-/**
- * POST /session/{sessionID}/command - 执行斜杠命令
- * @param sessionId Session ID
- * @param command 命令名（不含 /，如 "help"）
- * @param args 命令参数
- * @param directory 工作目录
- */
export async function executeCommand(
sessionId: string,
command: string,
args: string = '',
- directory?: string
+ directory?: string,
): Promise {
- return post(
- `/session/${sessionId}/command`,
- { directory: formatPathForApi(directory) },
- { command, arguments: args }
+ const sdk = getSDKClient()
+ return unwrap(
+ await sdk.session.command({
+ sessionID: sessionId,
+ directory: formatPathForApi(directory),
+ command,
+ arguments: args,
+ }),
)
}
diff --git a/src/api/config.ts b/src/api/config.ts
index b0c2d85c..e11f8f14 100644
--- a/src/api/config.ts
+++ b/src/api/config.ts
@@ -2,27 +2,48 @@
// Config API - 配置管理
// ============================================
-import { get, patch } from './http'
+import { getSDKClient, unwrap } from './sdk'
import { formatPathForApi } from '../utils/directoryUtils'
import type { Config } from '../types/api/config'
+import type { ProvidersResponse } from '../types/api/model'
/**
* 获取当前配置
*/
export async function getConfig(directory?: string): Promise