diff --git a/bun.lock b/bun.lock index 9f154f0..0d599cb 100644 --- a/bun.lock +++ b/bun.lock @@ -5,9 +5,13 @@ "": { "name": "gateway-checker", "dependencies": { + "@ai-sdk/anthropic": "^3.0.81", + "@ai-sdk/openai": "^3.0.66", + "@ai-sdk/openai-compatible": "^2.0.48", "@ant-design/icons": "^6.2.3", "@sinclair/typebox": "^0.34.49", "@tanstack/react-query": "^5.100.14", + "ai": "^6.0.193", "ajv": "^8.20.0", "antd": "^6.4.3", "drizzle-orm": "^0.45.2", @@ -51,6 +55,18 @@ }, }, "packages": { + "@ai-sdk/anthropic": ["@ai-sdk/anthropic@3.0.81", "", { "dependencies": { "@ai-sdk/provider": "3.0.10", "@ai-sdk/provider-utils": "4.0.27" }, "peerDependencies": { "zod": "^3.25.76 || ^4.1.8" } }, "sha512-B1JDd9Ugq9R5AgIaW3674lhGCMMYJcPUxnrZh8fzbGojgg4QvHFRv6eZahGQAUsmGHbcf74G9bdSBDLWQGY2GA=="], + + "@ai-sdk/gateway": ["@ai-sdk/gateway@3.0.121", "", { "dependencies": { "@ai-sdk/provider": "3.0.10", "@ai-sdk/provider-utils": "4.0.27", "@vercel/oidc": "3.2.0" }, "peerDependencies": { "zod": "^3.25.76 || ^4.1.8" } }, "sha512-uY248djJRxa5W68MHiyqO8WLdOeKQoRClGg7PVX/VPhVW8SJNM7/l5DcrA5WAM3YfQrLyNkgZa2VOu8T0t8LUw=="], + + "@ai-sdk/openai": ["@ai-sdk/openai@3.0.66", "", { "dependencies": { "@ai-sdk/provider": "3.0.10", "@ai-sdk/provider-utils": "4.0.27" }, "peerDependencies": { "zod": "^3.25.76 || ^4.1.8" } }, "sha512-n9mZ7PbU7O2zN8UMcx495Gfx7sE/rL4KS+o5JzBOUbYJCuwEIxKO6yJaUkxa4r6IyiLxyGib0jegZw91Hh0diA=="], + + "@ai-sdk/openai-compatible": ["@ai-sdk/openai-compatible@2.0.48", "", { "dependencies": { "@ai-sdk/provider": "3.0.10", "@ai-sdk/provider-utils": "4.0.27" }, "peerDependencies": { "zod": "^3.25.76 || ^4.1.8" } }, "sha512-z9MC6M4Oh/yUY/F/eszOtO8wc2nMz99XmZQKd2gWTtyIfe716xTfrKe3aYZKg20NZDtyjqPPKPSR+wqz7q1T7Q=="], + + "@ai-sdk/provider": ["@ai-sdk/provider@3.0.10", "", { "dependencies": { "json-schema": "^0.4.0" } }, "sha512-Q3BZ27qfpYqnCYGvE3vt+Qi6LGOF9R5Nmzn+9JoM1lCRsD9mYaIhfJLkSunN48nfGXJ6n+XNV0J/XVpqGQl7Dw=="], + + "@ai-sdk/provider-utils": ["@ai-sdk/provider-utils@4.0.27", "", { "dependencies": { "@ai-sdk/provider": "3.0.10", "@standard-schema/spec": "^1.1.0", "eventsource-parser": "^3.0.8" }, "peerDependencies": { "zod": "^3.25.76 || ^4.1.8" } }, "sha512-ubkAJ+xODouwtmN1tYlvTPphH1hPOBfZaEQe8U7skGvFAnIRs9PPpsq57bC2+Ky/MB4yzhd6YOsxTAx9sGpazw=="], + "@ant-design/colors": ["@ant-design/colors@8.0.1", "", { "dependencies": { "@ant-design/fast-color": "^3.0.0" } }, "sha512-foPVl0+SWIslGUtD/xBr1p9U4AKzPhNYEseXYRRo5QSzGACYZrQbe11AYJbYfAWnWSpGBx6JjBmSeugUsD9vqQ=="], "@ant-design/cssinjs": ["@ant-design/cssinjs@2.1.2", "", { "dependencies": { "@babel/runtime": "^7.11.1", "@emotion/hash": "^0.8.0", "@emotion/unitless": "^0.7.5", "@rc-component/util": "^1.4.0", "clsx": "^2.1.1", "csstype": "^3.1.3", "stylis": "^4.3.4" }, "peerDependencies": { "react": ">=16.0.0", "react-dom": ">=16.0.0" } }, "sha512-2Hy8BnCEH31xPeSLbhhB2ctCPXE2ZnASdi+KbSeS79BNbUhL9hAEe20SkUk+BR8aKTmqb6+FKFruk7w8z0VoRQ=="], @@ -265,6 +281,8 @@ "@napi-rs/wasm-runtime": ["@napi-rs/wasm-runtime@0.2.12", "https://registry.npmmirror.com/@napi-rs/wasm-runtime/-/wasm-runtime-0.2.12.tgz", { "dependencies": { "@emnapi/core": "^1.4.3", "@emnapi/runtime": "^1.4.3", "@tybys/wasm-util": "^0.10.0" } }, "sha512-ZVWUcfwY4E/yPitQJl481FjFo3K22D6qF0DuFH6Y/nbnE11GY5uguDxZMGXPQ8WQ0128MXQD7TnfHyK4oWoIJQ=="], + "@opentelemetry/api": ["@opentelemetry/api@1.9.1", "", {}, "sha512-gLyJlPHPZYdAk1JENA9LeHejZe1Ti77/pTeFm/nMXmQH/HFZlcS/O2XJB+L8fkbrNSqhdtlvjBVjxwUYanNH5Q=="], + "@oxc-project/types": ["@oxc-project/types@0.132.0", "", {}, "sha512-FESMOxil5Se014ui/Eq8fT5uHJo6nIRwH0PfJrZJXs6Gek3ZVFOrpUv3YIZT20m+extU98Hg1Ym72U58rlsxUQ=="], "@pinojs/redact": ["@pinojs/redact@0.4.0", "https://registry.npmmirror.com/@pinojs/redact/-/redact-0.4.0.tgz", {}, "sha512-k2ENnmBugE/rzQfEcdWHcCY+/FM3VLzH9cYEsbdsoqrvzAKRhUZeRNhAZvB8OitQJ1TBed3yqWtdjzS6wJKBwg=="], @@ -515,12 +533,16 @@ "@unrs/resolver-binding-win32-x64-msvc": ["@unrs/resolver-binding-win32-x64-msvc@1.11.1", "https://registry.npmmirror.com/@unrs/resolver-binding-win32-x64-msvc/-/resolver-binding-win32-x64-msvc-1.11.1.tgz", { "os": "win32", "cpu": "x64" }, "sha512-lrW200hZdbfRtztbygyaq/6jP6AKE8qQN2KvPcJ+x7wiD038YtnYtZ82IMNJ69GJibV7bwL3y9FgK+5w/pYt6g=="], + "@vercel/oidc": ["@vercel/oidc@3.2.0", "", {}, "sha512-UycprH3T6n3jH0k44NHMa7pnFHGu/N05MjojYr+Mc6I7obkoLIJujSWwin1pCvdy/eOxrI/l3uDLQsmcrOb4ug=="], + "@vitejs/plugin-react": ["@vitejs/plugin-react@6.0.2", "https://registry.npmmirror.com/@vitejs/plugin-react/-/plugin-react-6.0.2.tgz", { "dependencies": { "@rolldown/pluginutils": "^1.0.0" }, "peerDependencies": { "@rolldown/plugin-babel": "^0.1.7 || ^0.2.0", "babel-plugin-react-compiler": "^1.0.0", "vite": "^8.0.0" }, "optionalPeers": ["@rolldown/plugin-babel", "babel-plugin-react-compiler"] }, "sha512-DlSMqo4WhThw4vB8Mpn0Woe9J+Jfq1geJ61AKW0QEgLzGMNwtIMdxbDUzLxcun8W7NbJO0e2Jg/Nxm3cCSVzzg=="], "acorn": ["acorn@8.16.0", "https://registry.npmmirror.com/acorn/-/acorn-8.16.0.tgz", { "bin": { "acorn": "bin/acorn" } }, "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw=="], "acorn-jsx": ["acorn-jsx@5.3.2", "https://registry.npmmirror.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz", { "peerDependencies": { "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0" } }, "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ=="], + "ai": ["ai@6.0.193", "", { "dependencies": { "@ai-sdk/gateway": "3.0.121", "@ai-sdk/provider": "3.0.10", "@ai-sdk/provider-utils": "4.0.27", "@opentelemetry/api": "^1.9.0" }, "peerDependencies": { "zod": "^3.25.76 || ^4.1.8" } }, "sha512-VQOTOse8+X8kMtg61DNSXlYJzwOW4NjMLDJNk/qxClWsFe4oiyFJDHGGG1oezfGcFzuYuQe/8Z7r4kwiZWh2YQ=="], + "ajv": ["ajv@8.20.0", "https://registry.npmmirror.com/ajv/-/ajv-8.20.0.tgz", { "dependencies": { "fast-deep-equal": "^3.1.3", "fast-uri": "^3.0.1", "json-schema-traverse": "^1.0.0", "require-from-string": "^2.0.2" } }, "sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA=="], "ansi-escapes": ["ansi-escapes@7.3.0", "https://registry.npmmirror.com/ansi-escapes/-/ansi-escapes-7.3.0.tgz", { "dependencies": { "environment": "^1.0.0" } }, "sha512-BvU8nYgGQBxcmMuEeUEmNTvrMVjJNSH7RgW24vXexN4Ven6qCvy4TntnvlnwnMLTVlcRQQdbRY8NKnaIoeWDNg=="], @@ -753,6 +775,8 @@ "eventemitter3": ["eventemitter3@5.0.4", "https://registry.npmmirror.com/eventemitter3/-/eventemitter3-5.0.4.tgz", {}, "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw=="], + "eventsource-parser": ["eventsource-parser@3.1.0", "", {}, "sha512-kJezFj9YFAMLeORyi7aCLxLbD5/qWMQnoMVlVPyHIll7lgRJCc3JVln9Vgl9nwQi0YkMnhdGTMNn7CkRRAptMg=="], + "fast-copy": ["fast-copy@4.0.3", "https://registry.npmmirror.com/fast-copy/-/fast-copy-4.0.3.tgz", {}, "sha512-58apWr0GUiDFM8+3afrO6eYwJBn9ZAhDOzG3L+/9llab/haCARS2UIfffmOurYLwbgDRs8n0rfr6qAAPEAuAQw=="], "fast-deep-equal": ["fast-deep-equal@3.1.3", "https://registry.npmmirror.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", {}, "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="], @@ -931,6 +955,8 @@ "json-parse-even-better-errors": ["json-parse-even-better-errors@2.3.1", "https://registry.npmmirror.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz", {}, "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w=="], + "json-schema": ["json-schema@0.4.0", "", {}, "sha512-es94M3nTIfsEPisRafak+HDLfHXnKBhV3vU5eqPcS3flIWqcxJWgXHXiey3YrpaNsanY5ei1VoYEbOzijuq9BA=="], + "json-schema-traverse": ["json-schema-traverse@1.0.0", "https://registry.npmmirror.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz", {}, "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="], "json-stable-stringify-without-jsonify": ["json-stable-stringify-without-jsonify@1.0.1", "https://registry.npmmirror.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz", {}, "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw=="], diff --git a/context.md b/context.md new file mode 100644 index 0000000..afbae13 --- /dev/null +++ b/context.md @@ -0,0 +1,129 @@ +# add-model-management 当前进度 + +## 变更信息 + +- **Change**: `openspec/changes/add-model-management/` +- **Workflow**: fast-drive (design.md + tasks.md) +- **状态**: apply-review 修复进行中，有一个阻塞问题 + +## 已完成工作 + +### 核心功能（54/54 tasks 全部标记 [x]） + +所有代码已实现并通过验证： + +- DB Schema: providers + models 表（含 FK、唯一索引） +- 数据访问层: `src/server/db/providers.ts`, `src/server/db/models.ts` +- 后端路由: 15 个路由（providers 8 + models 7）注册在 `src/server/server.ts` +- AI 服务层: `src/server/ai/registry.ts`（含 `testProviderConnection` + `buildProviderRegistry`）, `src/server/ai/types.ts` +- 共享类型: `src/shared/api.ts`（含 `MODEL_CAPABILITIES` 常量） +- 前端 Hooks: `src/web/hooks/use-providers.ts`, `src/web/hooks/use-models.ts` +- 前端页面: `src/web/pages/models/`（6 个组件 + index） +- 前端路由+菜单: `src/web/routes.tsx`, `src/web/consoles/admin/menu.tsx` +- 测试: 10 个测试文件（66 个测试用例） +- 文档: backend.md, frontend.md, architecture.md, README.md 已更新 + +### apply-review 修复（进行中） + +已完成的修复： + +- ✅ **registry.ts 补充 `buildProviderRegistry`**: 新增从 DB 查询启用供应商构建 AI SDK Provider Registry 的函数 +- ✅ **Q1 统一错误响应**: `providers/get.ts` 和 `models/get.ts` 改用 `createApiError()` +- ✅ **Q2 提取共享常量**: `MODEL_CAPABILITIES` 从 `shared/api.ts` 导出，`models/create.ts` 和 `models/update.ts` 不再重复定义 +- ✅ **Q3 清理重复测试**: `tests/web/hooks/use-models.test.ts` 移除了残留的 provider 相关测试 +- ✅ **文档修正**: `docs/development/backend.md` 中 `buildProviderRegistry` 签名已更新为 `(db)` 而非 `(config)` +- ✅ **design.md + tasks.md 更新**: tasks 6.1 和 design 执行计划第 12 项已反映 registry 完整范围 + +## 阻塞问题 + +### `bun test` 无法解析 `createProviderRegistry` + +**现象**: 运行 `bun test tests/server/ai/registry.test.ts` 时报错： + +``` +SyntaxError: Export named 'createProviderRegistry' not found in module '...\node_modules\ai\dist\index.mjs' +``` + +**已确认**: + +- `createProviderRegistry` 在 `node_modules/ai/dist/index.mjs` 中存在 +- `bun -e "import { createProviderRegistry } from 'ai'; ..."` 正常工作 +- `bun run typecheck` 通过（类型存在） +- 问题仅出现在 `bun test` 环境 +- 此前 registry.ts 只导入 `generateText` 时测试正常；添加 `createProviderRegistry` 后全部 registry 测试失败 + +**可能原因**: Bun 1.3.14 的 `bun test` ESM 模块解析缓存问题，或 `mock.module("ai", ...)` 与静态导入 `createProviderRegistry` 的交互问题 + +**建议尝试方向**: + +1. 清除 Bun 缓存: `rm -rf node_modules/.cache` +2. 升级 Bun 版本 +3. 改用动态导入 `const { createProviderRegistry } = await import("ai")` 在 `buildProviderRegistry` 函数内部 +4. 将 `buildProviderRegistry` 的测试改为不 mock `ai` 模块（因为 `createProviderRegistry` 不需要 mock，只有 `generateText` 需要） +5. 将 registry 拆为两个文件：`connection-test.ts`（mock generateText）和 `registry.ts`（不 mock） + +## 质量状态 + +- `bun run typecheck`: ✅ 0 errors +- `bun run lint`: ✅ 0 errors（修复后） +- 模型管理相关测试: ❌ 62/66 pass（4 个 registry 测试因上述问题失败，其他 62 个全部通过） +- 已有 projects.test.tsx 有一个预存超时问题（与本次变更无关） + +## 文件清单 + +### 新增文件（untracked） + +``` +drizzle/0001_wooden_rocket_raccoon.sql +drizzle/meta/0001_snapshot.json +src/server/ai/registry.ts +src/server/ai/types.ts +src/server/db/models.ts +src/server/db/providers.ts +src/server/routes/models/{create,delete,disable,enable,get,list,update}.ts +src/server/routes/providers/{create,delete,disable,enable,get,list,test,update}.ts +src/web/hooks/use-models.ts +src/web/hooks/use-providers.ts +src/web/pages/models/index.tsx +src/web/pages/models/components/{ModelFormModal,ModelTable,ModelToolbar,ProviderFormModal,ProviderTable,ProviderToolbar}.tsx +tests/server/ai/registry.test.ts +tests/server/db/models.test.ts +tests/server/db/providers.test.ts +tests/server/routes/models.test.ts +tests/server/routes/providers.test.ts +tests/web/components/ModelTable.test.tsx +tests/web/components/ProviderTable.test.tsx +tests/web/hooks/use-models.test.ts +tests/web/hooks/use-providers.test.ts +tests/web/routes/models.test.tsx +``` + +### 修改文件（modified） + +``` +bun.lock +docs/development/README.md +docs/development/architecture.md +docs/development/backend.md +docs/development/frontend.md +drizzle/meta/_journal.json +package.json +src/server/db/schema.ts +src/server/server.ts +src/shared/api.ts +src/web/consoles/admin/menu.tsx +src/web/routes.tsx +``` + +### OpenSpec 变更文档 + +``` +openspec/changes/add-model-management/design.md +openspec/changes/add-model-management/tasks.md +``` + +## 后续步骤 + +1. 解决 `bun test` 与 `createProviderRegistry` 的兼容问题 +2. 确保所有 66+ 测试通过 +3. 归档变更（`/opsx-archive`） diff --git a/docs/development/README.md b/docs/development/README.md index 721e1d2..3f900ee 100644 --- a/docs/development/README.md +++ b/docs/development/README.md @@ -75,6 +75,7 @@ | ------------------- | -------------------------------------------------------------------- | | `src/server/` | Bun 后端代码，不能 import src/web/，HTML import 集成除外 | | `src/server/db/` | SQLite 数据库模块，包含 schema、connection、migration 和 data access | +| `src/server/ai/` | AI Provider Registry 构建与连接测试 | | `src/web/` | React 前端，不能 import src/server/ 运行时实现 | | `src/shared/` | 前后端共享 TypeScript 类型 | | `scripts/` | 独立运行脚本，可 import 项目源码 | diff --git a/docs/development/architecture.md b/docs/development/architecture.md index d359d70..3fe41f6 100644 --- a/docs/development/architecture.md +++ b/docs/development/architecture.md @@ -18,6 +18,11 @@ src/ load-migrations.ts 从文件系统加载 migration SQL migrate.ts migration 执行器（备份 + 事务应用） projects.ts 项目数据访问函数 + providers.ts 供应商数据访问函数 + models.ts 模型数据访问函数 + ai/ AI 服务层 + types.ts AI 配置类型定义 + registry.ts AI Provider Registry 构建与连接测试 dev.ts 开发模式启动入口 main.ts 生产模式启动入口 server.ts HTTP server 启动工厂（Bun.serve routes 声明式路由） @@ -27,6 +32,8 @@ src/ logger.ts 结构化日志（基于 pino + pino-roll） version.ts 运行时版本号读取 routes/ API 路由处理器 + providers/ 供应商 CRUD 路由 + models/ 模型 CRUD 路由 shared/ api.ts 前后端共享 TypeScript 类型定义 app.ts 应用全局常量（name、title、subtitle、description） @@ -37,6 +44,7 @@ src/ routes.tsx 路由配置 styles.css 全局样式 pages/ 页面组件 + models/ 模型管理页面 components/ UI 组件 hooks/ React Hooks utils/ 前端工具函数 @@ -93,6 +101,7 @@ Request | `src/server/server.ts` | Bun HTTP server 和 routes 注册 | | `src/server/routes/` | API handler，按端点拆分 | | `src/server/db/` | SQLite 连接、schema、migration 和 data access | +| `src/server/ai/` | AI Provider Registry 构建与连接测试 | | `src/server/config/` | 配置解析模块（types、variables、schema） | | `src/web/` | React 前端 | | `src/shared/api.ts` | 前后端共享 API 类型 | diff --git a/docs/development/backend.md b/docs/development/backend.md index 0f3ce52..6ee60ff 100644 --- a/docs/development/backend.md +++ b/docs/development/backend.md @@ -62,7 +62,36 @@ middleware.ts 提供 API 参数校验函数： ### 数据访问 -`src/server/db/projects.ts` 提供项目数据访问函数，输入输出使用 `src/shared/api.ts` 的类型。函数内部使用 Drizzle query builder 包装 `bun:sqlite` Database。 +`src/server/db/projects.ts` 提供项目数据访问函数，`src/server/db/providers.ts` 提供供应商数据访问函数，`src/server/db/models.ts` 提供模型数据访问函数。输入输出使用 `src/shared/api.ts` 的类型。函数内部使用 Drizzle query builder 包装 `bun:sqlite` Database。 + +## AI 服务层 + +`src/server/ai/` 提供 AI Provider Registry 构建与连接测试能力。 + +### 类型定义 + +`src/server/ai/types.ts` 定义 AI 配置类型： + +- `AIProviderConfig` — 供应商配置（name、type、baseUrl、apiKey） +- `AIModelConfig` — 模型配置（providerId、modelId、capabilities） +- `AIRegistryConfig` — Registry 构建配置（providers、models） + +### Registry 构建 + +`src/server/ai/registry.ts` 提供： + +- `buildProviderRegistry(db)` — 从 DB 查询启用的供应商，构建 Vercel AI SDK Provider Registry +- `testProviderConnection(config)` — 使用 generateText 测试供应商连接 + +每次 AI 调用时从 DB 查询 providers，构建 registry 后通过 `registry.languageModel('providerId:modelId')` 获取模型实例。不使用缓存层。 + +### 支持的供应商类型 + +| type | AI SDK factory | +| ------------------- | --------------------------------------------------- | +| `openai` | `createOpenAI({ apiKey, baseURL })` | +| `anthropic` | `createAnthropic({ apiKey, baseURL })` | +| `openai-compatible` | `createOpenAICompatible({ name, apiKey, baseURL })` | ## 类型规范 diff --git a/docs/development/frontend.md b/docs/development/frontend.md index d0e7284..56643b2 100644 --- a/docs/development/frontend.md +++ b/docs/development/frontend.md @@ -122,12 +122,12 @@ token 和 CSS 变量规则： 前端提供两个入口外壳，共享通用 Console Shell 组件： -- **Admin（管理台）**：`src/web/consoles/admin/AdminConsoleLayout.tsx`，菜单配置在 `menu.tsx`，路由 `/` 和 `/projects`。 +- **Admin（管理台）**：`src/web/consoles/admin/AdminConsoleLayout.tsx`，菜单配置在 `menu.tsx`，路由 `/`、`/projects`、`/models`。 - **Workbench（工作台）**：`src/web/consoles/workbench/WorkbenchProjectGate.tsx` → `WorkbenchConsoleLayout.tsx`，菜单配置和路由构造在 `routes.ts`，路由 `/workbench/:projectId`。 通用 Console Shell（`src/web/components/ConsoleShell/ConsoleShell.tsx`）包含 Layout、Header、Sider、Content、主题切换、版本展示和侧边栏折叠状态，由 Admin 和 Workbench 复用。Header 显示品牌名、版本号和控制台标题（Admin 显示"管理台"，Workbench 显示"工作台 · 项目名"）。 -Sidebar（`src/web/components/Sidebar/index.tsx`）是纯展示/导航组件，通过 `menuItems` props 接收菜单配置，由调用方决定菜单内容和路径。Admin 传入静态路径 `/`、`/projects`；Workbench 通过 route builder（`buildWorkbenchPath`）将相对菜单路径拼成 `/workbench/:projectId` 的子路径。 +Sidebar（`src/web/components/Sidebar/index.tsx`）是纯展示/导航组件，通过 `menuItems` props 接收菜单配置，由调用方决定菜单内容和路径。Admin 传入静态路径 `/`、`/projects`、`/models`；Workbench 通过 route builder（`buildWorkbenchPath`）将相对菜单路径拼成 `/workbench/:projectId` 的子路径。 Workbench 项目上下文通过 `ProjectContext` 提供，在 `WorkbenchProjectGate` 中从 URL path param 读取 `projectId`，通过 `useProject(projectId)` 加载项目，仅 active 项目渲染工作台布局，不存在或 archived 项目显示"项目不存在或不可访问"。 diff --git a/drizzle/0001_wooden_rocket_raccoon.sql b/drizzle/0001_wooden_rocket_raccoon.sql new file mode 100644 index 0000000..603ceb7 --- /dev/null +++ b/drizzle/0001_wooden_rocket_raccoon.sql @@ -0,0 +1,30 @@ +CREATE TABLE `providers` ( + `api_key` text NOT NULL, + `base_url` text NOT NULL, + `created_at` text NOT NULL, + `enabled` integer DEFAULT 1 NOT NULL, + `id` text PRIMARY KEY NOT NULL, + `name` text NOT NULL, + `type` text DEFAULT 'openai-compatible' NOT NULL, + `updated_at` text NOT NULL +); +--> statement-breakpoint +CREATE UNIQUE INDEX `providers_name_unique` ON `providers` (`name`); +--> statement-breakpoint +CREATE TABLE `models` ( + `capabilities` text NOT NULL, + `context_length` integer, + `created_at` text NOT NULL, + `enabled` integer DEFAULT 1 NOT NULL, + `id` text PRIMARY KEY NOT NULL, + `max_output_tokens` integer, + `model_id` text NOT NULL, + `name` text NOT NULL, + `provider_id` text NOT NULL, + `updated_at` text NOT NULL, + FOREIGN KEY (`provider_id`) REFERENCES `providers`(`id`) ON UPDATE no action ON DELETE no action +); +--> statement-breakpoint +CREATE UNIQUE INDEX `models_provider_id_model_id_unique` ON `models` (`provider_id`,`model_id`); +--> statement-breakpoint +CREATE INDEX `models_provider_id_idx` ON `models` (`provider_id`); diff --git a/drizzle/meta/0001_snapshot.json b/drizzle/meta/0001_snapshot.json new file mode 100644 index 0000000..bed725b --- /dev/null +++ b/drizzle/meta/0001_snapshot.json @@ -0,0 +1,292 @@ +{ + "version": "6", + "dialect": "sqlite", + "id": "3ce8499a-1b73-4fbd-a2ec-0f872646136a", + "prevId": "7c940c6c-2dd6-4509-aad1-90aa48887cb9", + "tables": { + "models": { + "name": "models", + "columns": { + "capabilities": { + "name": "capabilities", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "context_length": { + "name": "context_length", + "type": "integer", + "primaryKey": false, + "notNull": false, + "autoincrement": false + }, + "created_at": { + "name": "created_at", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "enabled": { + "name": "enabled", + "type": "integer", + "primaryKey": false, + "notNull": true, + "autoincrement": false, + "default": true + }, + "id": { + "name": "id", + "type": "text", + "primaryKey": true, + "notNull": true, + "autoincrement": false + }, + "max_output_tokens": { + "name": "max_output_tokens", + "type": "integer", + "primaryKey": false, + "notNull": false, + "autoincrement": false + }, + "model_id": { + "name": "model_id", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "name": { + "name": "name", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "provider_id": { + "name": "provider_id", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "updated_at": { + "name": "updated_at", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + } + }, + "indexes": { + "models_provider_id_model_id_unique": { + "name": "models_provider_id_model_id_unique", + "columns": ["provider_id", "model_id"], + "isUnique": true + }, + "models_provider_id_idx": { + "name": "models_provider_id_idx", + "columns": ["provider_id"], + "isUnique": false + } + }, + "foreignKeys": { + "models_provider_id_providers_id_fk": { + "name": "models_provider_id_providers_id_fk", + "tableFrom": "models", + "tableTo": "providers", + "columnsFrom": ["provider_id"], + "columnsTo": ["id"], + "onDelete": "no action", + "onUpdate": "no action" + } + }, + "compositePrimaryKeys": {}, + "uniqueConstraints": {}, + "checkConstraints": {} + }, + "projects": { + "name": "projects", + "columns": { + "archived_at": { + "name": "archived_at", + "type": "text", + "primaryKey": false, + "notNull": false, + "autoincrement": false + }, + "created_at": { + "name": "created_at", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "description": { + "name": "description", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false, + "default": "''" + }, + "id": { + "name": "id", + "type": "text", + "primaryKey": true, + "notNull": true, + "autoincrement": false + }, + "name": { + "name": "name", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "status": { + "name": "status", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false, + "default": "'active'" + }, + "updated_at": { + "name": "updated_at", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + } + }, + "indexes": { + "projects_name_unique": { + "name": "projects_name_unique", + "columns": ["name"], + "isUnique": true + } + }, + "foreignKeys": {}, + "compositePrimaryKeys": {}, + "uniqueConstraints": {}, + "checkConstraints": {} + }, + "providers": { + "name": "providers", + "columns": { + "api_key": { + "name": "api_key", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "base_url": { + "name": "base_url", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "created_at": { + "name": "created_at", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "enabled": { + "name": "enabled", + "type": "integer", + "primaryKey": false, + "notNull": true, + "autoincrement": false, + "default": true + }, + "id": { + "name": "id", + "type": "text", + "primaryKey": true, + "notNull": true, + "autoincrement": false + }, + "name": { + "name": "name", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "type": { + "name": "type", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false, + "default": "'openai-compatible'" + }, + "updated_at": { + "name": "updated_at", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + } + }, + "indexes": { + "providers_name_unique": { + "name": "providers_name_unique", + "columns": ["name"], + "isUnique": true + } + }, + "foreignKeys": {}, + "compositePrimaryKeys": {}, + "uniqueConstraints": {}, + "checkConstraints": {} + }, + "schema_migrations": { + "name": "schema_migrations", + "columns": { + "applied_at": { + "name": "applied_at", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "checksum": { + "name": "checksum", + "type": "text", + "primaryKey": false, + "notNull": true, + "autoincrement": false + }, + "id": { + "name": "id", + "type": "text", + "primaryKey": true, + "notNull": true, + "autoincrement": false + } + }, + "indexes": {}, + "foreignKeys": {}, + "compositePrimaryKeys": {}, + "uniqueConstraints": {}, + "checkConstraints": {} + } + }, + "views": {}, + "enums": {}, + "_meta": { + "schemas": {}, + "tables": {}, + "columns": {} + }, + "internal": { + "indexes": {} + } +} diff --git a/drizzle/meta/_journal.json b/drizzle/meta/_journal.json index 0730729..bbb84c0 100644 --- a/drizzle/meta/_journal.json +++ b/drizzle/meta/_journal.json @@ -8,6 +8,13 @@ "when": 1779873780188, "tag": "0000_cheerful_switch", "breakpoints": true + }, + { + "idx": 1, + "version": "6", + "when": 1780018783514, + "tag": "0001_wooden_rocket_raccoon", + "breakpoints": true } ] } diff --git a/openspec/changes/add-model-management/.openspec.yaml b/openspec/changes/add-model-management/.openspec.yaml new file mode 100644 index 0000000..b12d93e --- /dev/null +++ b/openspec/changes/add-model-management/.openspec.yaml @@ -0,0 +1,2 @@ +schema: fast-drive +created: 2026-05-29 diff --git a/openspec/changes/add-model-management/design.md b/openspec/changes/add-model-management/design.md new file mode 100644 index 0000000..7068676 --- /dev/null +++ b/openspec/changes/add-model-management/design.md @@ -0,0 +1,225 @@ +## 背景 + +Alfred·阿福定位为"基于 AI 的信息综合处理平台"，但当前项目（v0.1.0）没有任何 AI/LLM 集成。项目已完成基础架构（Bun 全栈、SQLite + Drizzle ORM、React 19 + Ant Design 6 + React Router 7、TanStack React Query），并拥有管理控制台（Dashboard + 项目管理）和工作台控制台。 + +本次变更在管理控制台中新增"模型管理"功能，让用户能够配置 AI 供应商和模型，为后续所有 AI 功能提供基础设施。这是项目 AI 能力的第一个里程碑。 + +**当前状态：** +- 后端：`src/server/` 使用 Bun.serve()，路由在 `routes/` 目录按功能拆分，DB schema 在 `src/server/db/schema.ts`，数据访问层在 `src/server/db/projects.ts` +- 前端：`src/web/` 使用 console 模式，admin 菜单在 `consoles/admin/menu.tsx`，页面在 `pages/` 目录 +- 零 AI/LLM 相关代码 + +## 讨论记录 + +- 已确认结论： + - 使用 Vercel AI SDK（`ai` + `@ai-sdk/openai` + `@ai-sdk/anthropic` + `@ai-sdk/openai-compatible`）作为统一 AI 调用层 + - 三种供应商类型：`openai`、`anthropic`、`openai-compatible`（覆盖 DeepSeek、Qwen、Ollama 等） + - API Key 明文存储于 SQLite，可接受（本地/自部署单用户工具） + - AI 注册表不使用缓存层：每次 AI 调用时从 DB 查询供应商+模型 → 构建 `createProviderRegistry` → 调用 AI SDK（开销 ~1ms，远小于网络 I/O） + - 功能调用（function calling）视为基础能力，不列入 capability 标签 +- 用户偏好： + - 前端使用 antd `Tabs` 组件在同一页面内展示供应商和模型两个标签页 + - 供应商表单中 type 默认值为 `openai-compatible`，baseURL 不设默认值 + - 连通性测试为可选功能，不阻塞模型创建 +- 约束： + - 严格遵循现有代码模式（路由拆分、数据访问函数、hooks、页面组件结构） + - 不引入新的样式系统 +- 被否决方案： + - API Key 加密存储：对本地/自部署单用户场景过度设计 + - AI 注册表缓存：增加复杂度但收益极小（~1ms vs 数百毫秒网络 I/O） + - LangChain 等重量级框架：Vercel AI SDK 更轻量且 API 更统一 + +## 需求 + +| 需求 | 验收标准 | +| ---- | -------- | +| 供应商 CRUD | 管理员可新增、查看、编辑、删除供应商（名称、类型、baseURL、apiKey） | +| 供应商类型支持 | 支持 openai、anthropic、openai-compatible 三种类型，各自对应 AI SDK 不同 provider 工厂 | +| 模型 CRUD | 管理员可新增、查看、编辑、删除模型（名称、所属供应商、modelId、能力标签、可选参数） | +| 能力标签多选 | 模型表单中可多选能力标签（text / reasoning / image-generation / video-generation / audio-generation / image-recognition / video-recognition / audio-recognition） | +| 连通性测试 | 供应商编辑/创建时可测试 API 连通性，返回成功/失败提示 | +| 模型启用/禁用 | 供应商和模型均可启用/禁用，不影响数据 | +| 管理控制台菜单 | Admin 控制台侧栏新增"模型管理"菜单项 | +| AI 注册表服务 | 后端提供 AI 注册表构建服务，按需从 DB 查询构建，供后续 AI 功能调用 | +| 级联约束 | 删除供应商时，若存在关联模型则阻止删除，用户需先处理关联模型 | + +## 数据模型规格 + +### providers 表 + +| 字段 | 类型 | 约束 | 说明 | +| ---- | ---- | ---- | ---- | +| id | TEXT | PK, UUID | 自动生成 | +| name | TEXT | NOT NULL, UNIQUE | 供应商显示名称 | +| type | TEXT | NOT NULL | 枚举：`openai` \| `anthropic` \| `openai-compatible`，默认 `openai-compatible` | +| baseUrl | TEXT | NOT NULL | API 基础 URL，不设默认值，由用户填写 | +| apiKey | TEXT | NOT NULL | API 密钥，明文存储，GET 接口完整返回 | +| enabled | INTEGER | NOT NULL, DEFAULT 1 | 1=启用, 0=禁用 | +| createdAt | TEXT | NOT NULL | ISO 8601 时间戳 | +| updatedAt | TEXT | NOT NULL | ISO 8601 时间戳 | + +### models 表 + +| 字段 | 类型 | 约束 | 说明 | +| ---- | ---- | ---- | ---- | +| id | TEXT | PK, UUID | 自动生成 | +| name | TEXT | NOT NULL | 模型显示名称 | +| providerId | TEXT | NOT NULL, FK → providers.id | 所属供应商 | +| modelId | TEXT | NOT NULL | API 调用用的模型标识（如 `gpt-4o`） | +| capabilities | TEXT | NOT NULL | JSON 数组，能力标签（见下方定义） | +| contextLength | INTEGER | 可选 | 上下文窗口长度 | +| maxOutputTokens | INTEGER | 可选 | 最大输出 token 数 | +| enabled | INTEGER | NOT NULL, DEFAULT 1 | 1=启用, 0=禁用 | +| createdAt | TEXT | NOT NULL | ISO 8601 时间戳 | +| updatedAt | TEXT | NOT NULL | ISO 8601 时间戳 | + +**唯一约束：** `(providerId, modelId)` 联合唯一——同一供应商下 modelId 不可重复，不同供应商可以有相同 modelId。 + +**能力标签定义（ModelCapability）：** + +``` +"text" | "reasoning" | "image-generation" | "video-generation" | "audio-generation" | "image-recognition" | "video-recognition" | "audio-recognition" +``` + +存储为 JSON 数组字符串，如 `["text","reasoning","image-recognition"]`。 + +## 目标 / 非目标 + +**目标：** +- 在管理控制台提供完整的供应商和模型管理界面 +- 建立后端 AI 服务层（注册表 + 类型定义），为后续 AI 功能提供可复用基础 +- 完成 Vercel AI SDK 集成的依赖安装和基础配置 +- 新增 DB migration 支持 providers 和 models 表 + +**非目标：** +- 不实现实际的 AI 调用功能（文本生成、图片生成等）——这是后续变更的内容 +- 不实现 API Key 加密存储 +- 不实现供应商/模型的导入导出功能 +- 不实现多用户权限控制 + +## 执行约束 + +- 依赖限制： + - 新增 npm 依赖仅限 `ai`、`@ai-sdk/openai`、`@ai-sdk/anthropic`、`@ai-sdk/openai-compatible` + - 使用 `bun add` 安装，严禁 npm/pnpm + - 优先使用项目已有依赖（Drizzle ORM、antd、TanStack React Query 等） +- 约束： + - 后端遵循 Bun 内置 API > es-toolkit > 三方库优先级 + - 前端遵循 antd 组件默认能力优先，禁止内联 style、覆盖 antd 内部类名 + - Git 提交格式：中文，"类型: 简短描述" +- 质量门禁： + - 新增代码必须编写完善的测试 + - 不允许跳过任何测试 + - 代码变更需执行文档影响分析 +- 相关方： + - 本变更为基础设施层，所有后续 AI 功能变更将依赖本变更的 AI 注册表服务 +- 文档 / 沟通： + - 每次代码变更执行文档影响分析：用户可见行为变更 → `docs/user/`，开发流程/架构变更 → `docs/development/` +- 兼容性 / 连续性： + - 无需考虑向前兼容性 + +## 影响范围 + +| 范围 | Artifacts / 参考资料 | 预期变更 | 备注 | +| ---- | -------------------- | -------- | ---- | +| DB Schema | `src/server/db/schema.ts` | 新增 providers 和 models 表定义 | 遵循现有 projects 表模式 | +| DB Migration | `drizzle/` | 新增 migration SQL 文件 | 自动生成 | +| 数据访问层 | `src/server/db/projects.ts`（参考模式） | 新增 `providers.ts` 和 `models.ts` | CRUD + 启用/禁用 | +| DB 导出 | `src/server/db/index.ts` | 新增 providers 和 models schema 导出 | 遵循现有导出模式 | +| 共享类型 | `src/shared/api.ts` | 新增供应商和模型相关类型定义 | 前后端共用 | +| 后端路由 | `src/server/routes/` | 新增 `providers/` 和 `models/` 目录 | CRUD + 连通性测试 | +| 服务器入口 | `src/server/server.ts` | 注册新路由 | 懒加载导入 | +| AI 服务层 | `src/server/ai/`（新建） | 新增 `registry.ts` 和 `types.ts` | AI 注册表构建服务 | +| 前端菜单 | `src/web/consoles/admin/menu.tsx` | 新增"模型管理"菜单项 | | +| 前端页面 | `src/web/pages/models/`（新建） | 新增模型管理页面（Tabs + 表格 + 表单） | 遵循 projects 页面模式 | +| 前端组件 | `src/web/pages/models/components/`（新建） | ProviderTable、ProviderFormModal、ModelTable、ModelFormModal | | +| 前端路由 | `src/web/routes.tsx` | 新增 `/models` 路由 | | +| 前端 Hooks | `src/web/hooks/` | 新增 `use-providers.ts`、`use-models.ts` | TanStack React Query | +| 依赖 | `package.json` | 新增 `ai`、`@ai-sdk/openai`、`@ai-sdk/anthropic`、`@ai-sdk/openai-compatible` | | +| 测试 | `tests/` | 新增后端路由、数据访问、前端 hooks 和组件测试 | | +| 文档 | `docs/development/backend.md` | 更新后端架构说明，补充 AI 服务层 | 开发文档 | +| 文档 | `docs/development/frontend.md` | 补充模型管理页面组件说明 | 开发文档 | + +## 决策 + +| 决策 | 理由 | 已否决替代方案 | +| ---- | ---- | ---------------- | +| 使用 Vercel AI SDK | 轻量、统一 API、支持多供应商、TypeScript 优先、与 Bun 兼容 | LangChain（过重，API 复杂）、自行封装 fetch（维护成本高，无法统一接口） | +| 三种供应商类型 | 覆盖主流场景：OpenAI（Responses API + Chat Completions API）、Anthropic、OpenAI 兼容协议（DeepSeek/Qwen/Ollama 等） | 仅区分"OpenAI 协议"和"其他"（丢失 Anthropic 特有能力） | +| API Key 明文存储 | 本地/自部署单用户场景，加密增加复杂度但安全性提升有限 | 加密存储（过度设计） | +| AI 注册表不缓存 | DB 查询 + 注册表构建开销 ~1ms，远小于网络 I/O；无缓存则无需处理失效/一致性问题 | 内存缓存（增加复杂度，收益极小） | +| capability 标签用 JSON 数组 | 灵活可扩展，SQLite 中 TEXT 字段存储 JSON 数组 | 关联表（过度设计，标签数量有限且固定） | +| 连通性测试不阻塞操作 | 测试是辅助功能，网络波动不应阻止用户保存配置 | 强制测试通过才能保存（用户体验差） | +| 删除供应商时阻止而非级联删除 | 防止误删导致模型数据丢失，用户需先处理关联模型 | CASCADE 删除（数据安全风险） | +| GET 接口完整返回 apiKey | 本地/自部署单用户场景，前端使用 antd Password 组件隐藏显示，无需脱敏 | apiKey 脱敏返回（增加复杂度，编辑时需额外处理） | +| providerId + modelId 联合唯一 | 同一供应商下 modelId 不可重复，不同供应商可有相同 modelId；符合 AI SDK 注册表 key 格式 `providerId:modelId` | modelId 全局唯一（限制过严）、无约束（可能导致注册表冲突） | +| 连通性测试使用 generateText 最小请求 | 调用 `generateText({ model, prompt: 'hi' })` 验证连通性和 apiKey 有效性，简单直接 | 仅验证 HTTP 连接（不验证 apiKey）、listModels（并非所有供应商支持） | +| 启用/禁用使用 enable/disable 双端点 | 语义明确，与 archive/restore 模式一致；供应商/模型的启用禁用是布尔切换，双端点更清晰 | toggle 单端点（语义含糊，前端需知道当前状态才能确定操作） | +| 供应商 type 默认 openai-compatible | 覆盖最广（DeepSeek/Qwen/Ollama 等），用户只需填写 baseURL 和 apiKey 即可使用 | 默认 openai（限制性强，不适合自部署场景） | +| baseURL 不设默认值 | 不同部署环境的 baseURL 差异大，自动填充可能误导用户填错地址 | 设默认值（看似方便，但可能掩盖配置错误） | + +## 执行计划 + +**阶段 1：基础层（DB + 类型 + 依赖）** +1. 安装 Vercel AI SDK 相关依赖 +2. 在 `src/server/db/schema.ts` 新增 providers 和 models 表定义 +3. 生成 DB migration +4. 在 `src/shared/api.ts` 新增供应商和模型相关类型定义 +5. 在 `src/server/ai/types.ts` 新增 AI 相关类型定义（ModelCapability 等） + +**阶段 2：后端（数据访问 + 路由 + AI 服务）** +6. 新增 `src/server/db/providers.ts` 数据访问函数 +7. 新增 `src/server/db/models.ts` 数据访问函数 +8. 新增 `src/server/routes/providers/` 目录下的 CRUD 路由处理器（含 enable/disable 双端点） +9. 新增 `src/server/routes/models/` 目录下的 CRUD 路由处理器（含 enable/disable 双端点） +10. 新增 `src/server/routes/providers/test.ts` 连通性测试路由 +11. 在 `src/server/server.ts` 注册所有新路由 +12. 新增 `src/server/ai/registry.ts`，包含 `buildProviderRegistry(db)`（从 DB 查询启用的供应商构建 AI SDK Provider Registry）和 `testProviderConnection(config)`（使用 generateText 测试连通性） + +**阶段 3：前端（页面 + 组件 + Hooks）** +13. 新增 `src/web/hooks/use-providers.ts` 和 `src/web/hooks/use-models.ts` +14. 在 `src/web/consoles/admin/menu.tsx` 新增"模型管理"菜单项 +15. 在 `src/web/routes.tsx` 新增 `/models` 路由 +16. 新增 `src/web/pages/models/index.tsx` 页面（Tabs 布局） +17. 新增 `src/web/pages/models/components/ProviderTable.tsx` +18. 新增 `src/web/pages/models/components/ProviderFormModal.tsx` +19. 新增 `src/web/pages/models/components/ModelTable.tsx` +20. 新增 `src/web/pages/models/components/ModelFormModal.tsx` + +**阶段 4：测试** +21. 后端数据访问层测试（providers.ts、models.ts） +22. 后端路由测试（providers/、models/） +23. AI 注册表测试 +24. 前端 hooks 测试 +25. 前端组件测试 + +**阶段 5：文档** +26. 执行文档影响分析，更新 `docs/development/` 相关文档 + +## 验证计划 + +| 需求 / 风险 | 验证方式 | +| ----------- | -------- | +| 供应商 CRUD API | 后端路由测试覆盖创建、查询、更新、删除、启用/禁用 | +| 模型 CRUD API | 后端路由测试覆盖创建、查询、更新、删除、启用/禁用 | +| 供应商删除约束 | 测试删除有关联模型的供应商时返回错误 | +| 连通性测试 API | 测试 mock 场景下的成功/失败响应 | +| AI 注册表构建 | 测试从 DB 数据正确构建 AI SDK provider 实例 | +| DB Migration | 测试 migration 正确创建表和索引 | +| 前端供应商管理 | 组件测试覆盖表格渲染、表单提交、启用/禁用操作 | +| 前端模型管理 | 组件测试覆盖表格渲染、表单提交、能力标签多选 | +| 前端菜单和路由 | 测试菜单项显示和路由跳转 | +| 文档完整性 | 检查 docs/development/ 和 docs/user/ 是否已更新 | + +## 风险 / 权衡 + +- [Vercel AI SDK 与 Bun 的兼容性] -> AI SDK 基于 Web 标准 API，Bun 对 Web API 支持良好；安装后需验证 import 正常 +- [OpenAI-compatible 供应商行为不一致] -> 注册表构建时使用 `createOpenAICompatible` 标准接口；连通性测试帮助用户提前发现问题 +- [API Key 明文存储安全风险] -> 文档中说明安全模型（单用户本地部署）；未来可按需增加加密 +- [migration 与现有数据兼容性] -> 新增表不影响现有 projects 表；migration 为增量操作 + +## 待解决问题 + +| 状态 | 问题 | 所需决策 | +| ---- | ---- | -------- | +| 无 | 无待解决问题。 | 无需决策 | diff --git a/openspec/changes/add-model-management/tasks.md b/openspec/changes/add-model-management/tasks.md new file mode 100644 index 0000000..b9ad430 --- /dev/null +++ b/openspec/changes/add-model-management/tasks.md @@ -0,0 +1,89 @@ +## 1. 上下文审查 + +- [x] 1.1 阅读 design.md，识别范围、需求、决策、执行约束和待解决问题 +- [x] 1.2 审查影响范围中列出的相关文件：`src/server/db/schema.ts`、`src/server/db/projects.ts`、`src/server/server.ts`、`src/shared/api.ts`、`src/web/consoles/admin/menu.tsx`、`src/web/routes.tsx`、`src/web/pages/projects/` +- [x] 1.3 审查现有测试模式：`tests/server/routes/projects.test.ts`、`tests/server/db/projects.test.ts`、`tests/web/hooks/use-projects.test.ts`、`tests/web/routes/projects.test.tsx` + +## 2. 基础层：依赖安装与类型定义 + +- [x] 2.1 使用 `bun add ai @ai-sdk/openai @ai-sdk/anthropic @ai-sdk/openai-compatible` 安装 Vercel AI SDK 依赖 +- [x] 2.2 在 `src/shared/api.ts` 新增供应商和模型相关类型定义（ProviderType、ModelCapability、Provider 相关请求/响应类型、Model 相关请求/响应类型） +- [x] 2.3 新建 `src/server/ai/types.ts`，定义 AI 层专用类型（ProviderType、ModelCapability、AIRegistryConfig 等） + +## 3. 数据库层：Schema 与 Migration + +- [x] 3.1 在 `src/server/db/schema.ts` 新增 providers 表定义（id、name、type、baseUrl、apiKey、enabled、createdAt、updatedAt） +- [x] 3.2 在 `src/server/db/schema.ts` 新增 models 表定义（id、name、providerId、modelId、capabilities、contextLength、maxOutputTokens、enabled、createdAt、updatedAt） +- [x] 3.3 使用 `bunx drizzle-kit generate` 生成 migration SQL 文件 +- [x] 3.4 验证 migration SQL 文件正确性（表结构、索引、外键约束） + +## 4. 数据访问层 + +- [x] 4.1 新建 `src/server/db/providers.ts`，实现供应商 CRUD 数据访问函数（create、list、get、update、delete、enable、disable），遵循 `projects.ts` 模式 +- [x] 4.2 新建 `src/server/db/models.ts`，实现模型 CRUD 数据访问函数（create、list、get、update、delete、enable、disable），包含按 providerId 查询和关联检查 + +## 5. 后端路由层 + +- [x] 5.1 新建 `src/server/routes/providers/create.ts`（POST /api/providers） +- [x] 5.2 新建 `src/server/routes/providers/list.ts`（GET /api/providers） +- [x] 5.3 新建 `src/server/routes/providers/get.ts`（GET /api/providers/:id） +- [x] 5.4 新建 `src/server/routes/providers/update.ts`（PATCH /api/providers/:id） +- [x] 5.5 新建 `src/server/routes/providers/delete.ts`（DELETE /api/providers/:id，有关联模型时阻止删除） +- [x] 5.6 新建 `src/server/routes/providers/enable.ts`（POST /api/providers/:id/enable） +- [x] 5.7 新建 `src/server/routes/providers/disable.ts`（POST /api/providers/:id/disable） +- [x] 5.8 新建 `src/server/routes/providers/test.ts`（POST /api/providers/:id/test，使用 AI SDK generateText 测试连通性） +- [x] 5.9 新建 `src/server/routes/models/create.ts`（POST /api/models） +- [x] 5.10 新建 `src/server/routes/models/list.ts`（GET /api/models，支持按 providerId 筛选） +- [x] 5.11 新建 `src/server/routes/models/get.ts`（GET /api/models/:id） +- [x] 5.12 新建 `src/server/routes/models/update.ts`（PATCH /api/models/:id） +- [x] 5.13 新建 `src/server/routes/models/delete.ts`（DELETE /api/models/:id） +- [x] 5.14 新建 `src/server/routes/models/enable.ts`（POST /api/models/:id/enable） +- [x] 5.15 新建 `src/server/routes/models/disable.ts`（POST /api/models/:id/disable） +- [x] 5.16 在 `src/server/server.ts` 中注册所有新路由（懒加载导入） + +## 6. AI 服务层 + +- [x] 6.1 新建 `src/server/ai/registry.ts`，实现 `buildProviderRegistry(db)`（从 DB 查询启用的供应商构建 AI SDK Provider Registry，模型通过 `registry.languageModel('providerId:modelId')` 获取）和 `testProviderConnection(config)`（使用 generateText 测试连通性） + +## 7. 前端：Hooks 与路由 + +- [x] 7.1 新建 `src/web/hooks/use-providers.ts`，实现供应商 CRUD 的 TanStack React Query hooks +- [x] 7.2 新建 `src/web/hooks/use-models.ts`，实现模型 CRUD 的 TanStack React Query hooks +- [x] 7.3 在 `src/web/consoles/admin/menu.tsx` 新增"模型管理"菜单项，图标使用 antd 的 RobotOutlined 或类似图标 +- [x] 7.4 在 `src/web/routes.tsx` 新增 `/models` 路由，指向 AdminConsoleLayout 下的模型管理页面 + +## 8. 前端：页面与组件 + +- [x] 8.1 新建 `src/web/pages/models/index.tsx`，使用 antd Tabs 实现供应商/模型双标签页布局 +- [x] 8.2 新建 `src/web/pages/models/components/ProviderTable.tsx`，实现供应商列表表格（名称、类型、baseURL、状态、操作） +- [x] 8.3 新建 `src/web/pages/models/components/ProviderFormModal.tsx`，实现供应商创建/编辑表单弹窗（name、type Select 默认 openai-compatible、apiKey Password 输入、baseURL 不设默认值） +- [x] 8.4 新建 `src/web/pages/models/components/ModelTable.tsx`，实现模型列表表格（名称、供应商、modelId、能力标签、状态、操作） +- [x] 8.5 新建 `src/web/pages/models/components/ModelFormModal.tsx`，实现模型创建/编辑表单弹窗（name、provider Select、modelId、capabilities Checkbox.Group、contextLength、maxOutputTokens 可选输入、连通性测试按钮） + +## 9. 测试：后端 + +- [x] 9.1 编写 `tests/server/db/providers.test.ts`，覆盖供应商 CRUD 和启用/禁用数据访问函数 +- [x] 9.2 编写 `tests/server/db/models.test.ts`，覆盖模型 CRUD、启用/禁用和关联检查数据访问函数 +- [x] 9.3 编写 `tests/server/routes/providers.test.ts`，覆盖供应商路由的请求验证、CRUD 操作和连通性测试 +- [x] 9.4 编写 `tests/server/routes/models.test.ts`，覆盖模型路由的请求验证和 CRUD 操作 +- [x] 9.5 编写 `tests/server/ai/registry.test.ts`，覆盖 AI 注册表构建逻辑 + +## 10. 测试：前端 + +- [x] 10.1 编写 `tests/web/hooks/use-providers.test.ts`，覆盖供应商 hooks 的 query 和 mutation +- [x] 10.2 编写 `tests/web/hooks/use-models.test.ts`，覆盖模型 hooks 的 query 和 mutation +- [x] 10.3 编写 `tests/web/routes/models.test.tsx`，覆盖模型管理页面路由和渲染 +- [x] 10.4 编写 `tests/web/components/ProviderTable.test.tsx`，覆盖供应商表格渲染和交互 +- [x] 10.5 编写 `tests/web/components/ModelTable.test.tsx`，覆盖模型表格渲染和交互 + +## 11. 质量保障 + +- [x] 11.1 运行全部测试（`bun test`），确保无失败 +- [x] 11.2 运行 lint 检查（`bun run lint`），确保无错误 +- [x] 11.3 运行格式检查（`bun run format:check`），确保代码格式正确 + +## 12. 文档 + +- [x] 12.1 执行文档影响分析：评估本次变更对 docs/ 下各文档的影响 +- [x] 12.2 更新 `docs/development/backend.md`，补充 AI 服务层架构说明（`src/server/ai/` 目录结构和职责） +- [x] 12.3 更新 `docs/development/frontend.md`，补充模型管理页面组件说明 diff --git a/package.json b/package.json index c49f722..28dae41 100644 --- a/package.json +++ b/package.json @@ -52,9 +52,13 @@ "vite": "^8.0.14" }, "dependencies": { + "@ai-sdk/anthropic": "^3.0.81", + "@ai-sdk/openai": "^3.0.66", + "@ai-sdk/openai-compatible": "^2.0.48", "@ant-design/icons": "^6.2.3", "@sinclair/typebox": "^0.34.49", "@tanstack/react-query": "^5.100.14", + "ai": "^6.0.193", "ajv": "^8.20.0", "antd": "^6.4.3", "drizzle-orm": "^0.45.2", diff --git a/src/server/ai/registry.ts b/src/server/ai/registry.ts new file mode 100644 index 0000000..ff134be --- /dev/null +++ b/src/server/ai/registry.ts @@ -0,0 +1,74 @@ +import type Database from "bun:sqlite"; + +import { createAnthropic } from "@ai-sdk/anthropic"; +import { createOpenAI } from "@ai-sdk/openai"; +import { createOpenAICompatible } from "@ai-sdk/openai-compatible"; +import { createProviderRegistry, generateText } from "ai"; + +import type { AIProviderConfig } from "./types"; + +export function buildProviderRegistry(db: Database) { + const enabledProviders = getEnabledProviders(db); + + const providerEntries: Record> = {}; + for (const p of enabledProviders) { + providerEntries[p.id] = createProvider({ + apiKey: p.api_key, + baseUrl: p.base_url, + name: p.name, + type: p.type, + }); + } + + return createProviderRegistry(providerEntries); +} + +export async function testProviderConnection(config: AIProviderConfig): Promise<{ message: string; ok: boolean }> { + try { + const provider = createProvider(config); + const model = provider.languageModel("test"); + + await generateText({ + maxOutputTokens: 1, + model, + prompt: "Hi", + }); + + return { message: "连接成功", ok: true }; + } catch (e: unknown) { + const msg = e instanceof Error ? e.message : String(e); + return { message: `连接失败: ${msg}`, ok: false }; + } +} + +function createProvider(config: AIProviderConfig) { + switch (config.type) { + case "anthropic": + return createAnthropic({ apiKey: config.apiKey, baseURL: config.baseUrl }); + case "openai": + return createOpenAI({ apiKey: config.apiKey, baseURL: config.baseUrl }); + case "openai-compatible": + return createOpenAICompatible({ + apiKey: config.apiKey, + baseURL: config.baseUrl, + name: config.name, + }); + } +} + +function getEnabledProviders(db: Database): Array<{ + api_key: string; + base_url: string; + id: string; + name: string; + type: "anthropic" | "openai" | "openai-compatible"; +}> { + const stmt = db.prepare("SELECT id, name, type, base_url, api_key FROM providers WHERE enabled = 1"); + return stmt.all() as Array<{ + api_key: string; + base_url: string; + id: string; + name: string; + type: "anthropic" | "openai" | "openai-compatible"; + }>; +} diff --git a/src/server/ai/types.ts b/src/server/ai/types.ts new file mode 100644 index 0000000..60d4cc5 --- /dev/null +++ b/src/server/ai/types.ts @@ -0,0 +1,21 @@ +import type { ModelCapability, ProviderType } from "../../shared/api"; + +export type { ModelCapability, ProviderType }; + +export interface AIModelConfig { + capabilities: ModelCapability[]; + modelId: string; + providerId: string; +} + +export interface AIProviderConfig { + apiKey: string; + baseUrl: string; + name: string; + type: ProviderType; +} + +export interface AIRegistryConfig { + models: AIModelConfig[]; + providers: AIProviderConfig[]; +} diff --git a/src/server/db/models.ts b/src/server/db/models.ts new file mode 100644 index 0000000..a325a93 --- /dev/null +++ b/src/server/db/models.ts @@ -0,0 +1,237 @@ +import type Database from "bun:sqlite"; + +import { and, desc, eq, like, or, sql } from "drizzle-orm"; +import { drizzle } from "drizzle-orm/bun-sqlite"; + +import type { CreateModelRequest, Model, ModelCapability, UpdateModelRequest } from "../../shared/api"; + +import { models, providers } from "./schema"; + +export function createModel( + raw: Database, + request: CreateModelRequest, +): { error: string; status: number } | { model: Model } { + const db = wrap(raw); + + const provider = db.select().from(providers).where(eq(providers.id, request.providerId)).get(); + if (!provider) return { error: "供应商不存在", status: 400 }; + + const name = request.name.trim(); + if (!name) return { error: "模型名称不能为空", status: 400 }; + + const modelId = request.modelId.trim(); + if (!modelId) return { error: "模型 ID 不能为空", status: 400 }; + + const capabilities = request.capabilities; + if (!capabilities || capabilities.length === 0) { + return { error: "至少选择一个能力标签", status: 400 }; + } + + const id = crypto.randomUUID(); + const now = new Date().toISOString(); + + try { + db.insert(models) + .values({ + capabilities: JSON.stringify(capabilities), + contextLength: request.contextLength ?? null, + createdAt: now, + enabled: true, + id, + maxOutputTokens: request.maxOutputTokens ?? null, + modelId, + name, + providerId: request.providerId, + updatedAt: now, + }) + .run(); + } catch (e: unknown) { + const msg = e instanceof Error ? e.message : String(e); + if (msg.includes("UNIQUE constraint")) { + return { error: "该供应商下模型 ID 已存在", status: 409 }; + } + throw e; + } + + const row = db.select().from(models).where(eq(models.id, id)).get(); + return { model: toModel(row!) }; +} + +export function deleteModel(raw: Database, id: string): { error: string; status: number } | { success: true } { + const db = wrap(raw); + const existing = db.select().from(models).where(eq(models.id, id)).get(); + if (!existing) return { error: "模型不存在", status: 404 }; + + db.delete(models).where(eq(models.id, id)).run(); + return { success: true }; +} + +export function disableModel(raw: Database, id: string): { error: string; status: number } | { model: Model } { + const db = wrap(raw); + const existing = db.select().from(models).where(eq(models.id, id)).get(); + if (!existing) return { error: "模型不存在", status: 404 }; + if (!existing.enabled) return { error: "模型已禁用", status: 409 }; + + const now = new Date().toISOString(); + db.update(models).set({ enabled: false, updatedAt: now }).where(eq(models.id, id)).run(); + + const updated = db.select().from(models).where(eq(models.id, id)).get(); + return { model: toModel(updated!) }; +} + +export function enableModel(raw: Database, id: string): { error: string; status: number } | { model: Model } { + const db = wrap(raw); + const existing = db.select().from(models).where(eq(models.id, id)).get(); + if (!existing) return { error: "模型不存在", status: 404 }; + if (existing.enabled) return { error: "模型已启用", status: 409 }; + + const now = new Date().toISOString(); + db.update(models).set({ enabled: true, updatedAt: now }).where(eq(models.id, id)).run(); + + const updated = db.select().from(models).where(eq(models.id, id)).get(); + return { model: toModel(updated!) }; +} + +export function getModel(raw: Database, id: string): { error: string; status: number } | { model: Model } { + const db = wrap(raw); + const row = db.select().from(models).where(eq(models.id, id)).get(); + + if (!row) return { error: "模型不存在", status: 404 }; + return { model: toModel(row) }; +} + +export function getModelsByProviderId(raw: Database, providerId: string): number { + const db = wrap(raw); + const result = db + .select({ count: sql`count(*)` }) + .from(models) + .where(eq(models.providerId, providerId)) + .get(); + return Number(result?.count ?? 0); +} + +export function listModels( + raw: Database, + options: { keyword?: string; page: number; pageSize: number; providerId?: string }, +): { items: Model[]; page: number; pageSize: number; total: number } { + const db = wrap(raw); + const conditions = []; + + if (options.providerId) { + conditions.push(eq(models.providerId, options.providerId)); + } + + if (options.keyword) { + const pattern = `%${options.keyword}%`; + conditions.push(or(like(models.name, pattern), like(models.modelId, pattern))!); + } + + const where = conditions.length > 0 ? and(...conditions) : undefined; + + const countResult = db + .select({ count: sql`count(*)` }) + .from(models) + .where(where) + .get(); + + const total = Number(countResult?.count ?? 0); + + const rows = db + .select() + .from(models) + .where(where) + .orderBy(desc(models.createdAt)) + .limit(options.pageSize) + .offset((options.page - 1) * options.pageSize) + .all(); + + return { + items: rows.map(toModel), + page: options.page, + pageSize: options.pageSize, + total, + }; +} + +export function updateModel( + raw: Database, + id: string, + request: UpdateModelRequest, +): { error: string; status: number } | { model: Model } { + const db = wrap(raw); + const existing = db.select().from(models).where(eq(models.id, id)).get(); + if (!existing) return { error: "模型不存在", status: 404 }; + + const updates: Partial = { + updatedAt: new Date().toISOString(), + }; + + const name = request.name?.trim(); + if (name === "") return { error: "模型名称不能为空", status: 400 }; + if (name !== undefined && name !== existing.name) { + updates.name = name; + } + + const modelId = request.modelId?.trim(); + if (modelId === "") return { error: "模型 ID 不能为空", status: 400 }; + if (modelId !== undefined) { + updates.modelId = modelId; + } + + if (request.providerId !== undefined) { + const provider = db.select().from(providers).where(eq(providers.id, request.providerId)).get(); + if (!provider) return { error: "供应商不存在", status: 400 }; + updates.providerId = request.providerId; + } + + if (request.capabilities !== undefined) { + if (request.capabilities.length === 0) { + return { error: "至少选择一个能力标签", status: 400 }; + } + updates.capabilities = JSON.stringify(request.capabilities); + } + + if (request.contextLength !== undefined) { + updates.contextLength = request.contextLength; + } + + if (request.maxOutputTokens !== undefined) { + updates.maxOutputTokens = request.maxOutputTokens; + } + + if (Object.keys(updates).length === 1 && updates.updatedAt) { + return { model: toModel(existing) }; + } + + try { + db.update(models).set(updates).where(eq(models.id, id)).run(); + } catch (e: unknown) { + const msg = e instanceof Error ? e.message : String(e); + if (msg.includes("UNIQUE constraint")) { + return { error: "该供应商下模型 ID 已存在", status: 409 }; + } + throw e; + } + + const updated = db.select().from(models).where(eq(models.id, id)).get(); + return { model: toModel(updated!) }; +} + +function toModel(row: typeof models.$inferSelect): Model { + return { + capabilities: JSON.parse(row.capabilities) as ModelCapability[], + contextLength: row.contextLength, + createdAt: row.createdAt, + enabled: row.enabled, + id: row.id, + maxOutputTokens: row.maxOutputTokens, + modelId: row.modelId, + name: row.name, + providerId: row.providerId, + updatedAt: row.updatedAt, + }; +} + +function wrap(raw: Database) { + return drizzle(raw); +} diff --git a/src/server/db/providers.ts b/src/server/db/providers.ts new file mode 100644 index 0000000..84f389e --- /dev/null +++ b/src/server/db/providers.ts @@ -0,0 +1,202 @@ +import type Database from "bun:sqlite"; + +import { and, desc, eq, like, sql } from "drizzle-orm"; +import { drizzle } from "drizzle-orm/bun-sqlite"; + +import type { CreateProviderRequest, Provider, UpdateProviderRequest } from "../../shared/api"; + +import { providers } from "./schema"; + +export function createProvider( + raw: Database, + request: CreateProviderRequest, +): { error: string; status: number } | { provider: Provider } { + const db = wrap(raw); + const name = request.name.trim(); + if (!name) return { error: "供应商名称不能为空", status: 400 }; + + const baseUrl = request.baseUrl.trim(); + if (!baseUrl) return { error: "Base URL 不能为空", status: 400 }; + + const apiKey = request.apiKey.trim(); + if (!apiKey) return { error: "API Key 不能为空", status: 400 }; + + const id = crypto.randomUUID(); + const now = new Date().toISOString(); + + try { + db.insert(providers) + .values({ + apiKey, + baseUrl, + createdAt: now, + enabled: true, + id, + name, + type: request.type, + updatedAt: now, + }) + .run(); + } catch (e: unknown) { + const msg = e instanceof Error ? e.message : String(e); + if (msg.includes("UNIQUE constraint")) { + return { error: "供应商名称已存在", status: 409 }; + } + throw e; + } + + const row = db.select().from(providers).where(eq(providers.id, id)).get(); + return { provider: toProvider(row!) }; +} + +export function deleteProvider(raw: Database, id: string): { error: string; status: number } | { success: true } { + const db = wrap(raw); + const existing = db.select().from(providers).where(eq(providers.id, id)).get(); + if (!existing) return { error: "供应商不存在", status: 404 }; + + db.delete(providers).where(eq(providers.id, id)).run(); + return { success: true }; +} + +export function disableProvider(raw: Database, id: string): { error: string; status: number } | { provider: Provider } { + const db = wrap(raw); + const existing = db.select().from(providers).where(eq(providers.id, id)).get(); + if (!existing) return { error: "供应商不存在", status: 404 }; + if (!existing.enabled) return { error: "供应商已禁用", status: 409 }; + + const now = new Date().toISOString(); + db.update(providers).set({ enabled: false, updatedAt: now }).where(eq(providers.id, id)).run(); + + const updated = db.select().from(providers).where(eq(providers.id, id)).get(); + return { provider: toProvider(updated!) }; +} + +export function enableProvider(raw: Database, id: string): { error: string; status: number } | { provider: Provider } { + const db = wrap(raw); + const existing = db.select().from(providers).where(eq(providers.id, id)).get(); + if (!existing) return { error: "供应商不存在", status: 404 }; + if (existing.enabled) return { error: "供应商已启用", status: 409 }; + + const now = new Date().toISOString(); + db.update(providers).set({ enabled: true, updatedAt: now }).where(eq(providers.id, id)).run(); + + const updated = db.select().from(providers).where(eq(providers.id, id)).get(); + return { provider: toProvider(updated!) }; +} + +export function getProvider(raw: Database, id: string): { error: string; status: number } | { provider: Provider } { + const db = wrap(raw); + const row = db.select().from(providers).where(eq(providers.id, id)).get(); + + if (!row) return { error: "供应商不存在", status: 404 }; + return { provider: toProvider(row) }; +} + +export function listProviders( + raw: Database, + options: { keyword?: string; page: number; pageSize: number }, +): { items: Provider[]; page: number; pageSize: number; total: number } { + const db = wrap(raw); + const conditions = []; + + if (options.keyword) { + const pattern = `%${options.keyword}%`; + conditions.push(like(providers.name, pattern)); + } + + const where = conditions.length > 0 ? and(...conditions) : undefined; + + const countResult = db + .select({ count: sql`count(*)` }) + .from(providers) + .where(where) + .get(); + + const total = Number(countResult?.count ?? 0); + + const rows = db + .select() + .from(providers) + .where(where) + .orderBy(desc(providers.createdAt)) + .limit(options.pageSize) + .offset((options.page - 1) * options.pageSize) + .all(); + + return { + items: rows.map(toProvider), + page: options.page, + pageSize: options.pageSize, + total, + }; +} + +export function updateProvider( + raw: Database, + id: string, + request: UpdateProviderRequest, +): { error: string; status: number } | { provider: Provider } { + const db = wrap(raw); + const existing = db.select().from(providers).where(eq(providers.id, id)).get(); + if (!existing) return { error: "供应商不存在", status: 404 }; + + const updates: Partial = { + updatedAt: new Date().toISOString(), + }; + + const name = request.name?.trim(); + if (name === "") return { error: "供应商名称不能为空", status: 400 }; + if (name !== undefined && name !== existing.name) { + updates.name = name; + } + + const baseUrl = request.baseUrl?.trim(); + if (baseUrl === "") return { error: "Base URL 不能为空", status: 400 }; + if (baseUrl !== undefined) { + updates.baseUrl = baseUrl; + } + + const apiKey = request.apiKey?.trim(); + if (apiKey === "") return { error: "API Key 不能为空", status: 400 }; + if (apiKey !== undefined) { + updates.apiKey = apiKey; + } + + if (request.type !== undefined) { + updates.type = request.type; + } + + if (Object.keys(updates).length === 1 && updates.updatedAt) { + return { provider: toProvider(existing) }; + } + + try { + db.update(providers).set(updates).where(eq(providers.id, id)).run(); + } catch (e: unknown) { + const msg = e instanceof Error ? e.message : String(e); + if (msg.includes("UNIQUE constraint")) { + return { error: "供应商名称已存在", status: 409 }; + } + throw e; + } + + const updated = db.select().from(providers).where(eq(providers.id, id)).get(); + return { provider: toProvider(updated!) }; +} + +function toProvider(row: typeof providers.$inferSelect): Provider { + return { + apiKey: row.apiKey, + baseUrl: row.baseUrl, + createdAt: row.createdAt, + enabled: row.enabled, + id: row.id, + name: row.name, + type: row.type, + updatedAt: row.updatedAt, + }; +} + +function wrap(raw: Database) { + return drizzle(raw); +} diff --git a/src/server/db/schema.ts b/src/server/db/schema.ts index efc5329..81d6b5b 100644 --- a/src/server/db/schema.ts +++ b/src/server/db/schema.ts @@ -1,4 +1,4 @@ -import { sqliteTable, text } from "drizzle-orm/sqlite-core"; +import { index, integer, sqliteTable, text, uniqueIndex } from "drizzle-orm/sqlite-core"; export const projects = sqliteTable("projects", { archivedAt: text("archived_at"), @@ -12,6 +12,41 @@ export const projects = sqliteTable("projects", { updatedAt: text("updated_at").notNull(), }); +export const providers = sqliteTable("providers", { + apiKey: text("api_key").notNull(), + baseUrl: text("base_url").notNull(), + createdAt: text("created_at").notNull(), + enabled: integer("enabled", { mode: "boolean" }).notNull().default(true), + id: text("id").primaryKey(), + name: text("name").notNull().unique(), + type: text("type", { enum: ["anthropic", "openai", "openai-compatible"] }) + .notNull() + .default("openai-compatible"), + updatedAt: text("updated_at").notNull(), +}); + +export const models = sqliteTable( + "models", + { + capabilities: text("capabilities").notNull(), + contextLength: integer("context_length"), + createdAt: text("created_at").notNull(), + enabled: integer("enabled", { mode: "boolean" }).notNull().default(true), + id: text("id").primaryKey(), + maxOutputTokens: integer("max_output_tokens"), + modelId: text("model_id").notNull(), + name: text("name").notNull(), + providerId: text("provider_id") + .notNull() + .references(() => providers.id), + updatedAt: text("updated_at").notNull(), + }, + (table) => [ + uniqueIndex("models_provider_id_model_id_unique").on(table.providerId, table.modelId), + index("models_provider_id_idx").on(table.providerId), + ], +); + export const schemaMigrations = sqliteTable("schema_migrations", { appliedAt: text("applied_at").notNull(), checksum: text("checksum").notNull(), diff --git a/src/server/routes/models/create.ts b/src/server/routes/models/create.ts new file mode 100644 index 0000000..55b5d13 --- /dev/null +++ b/src/server/routes/models/create.ts @@ -0,0 +1,47 @@ +import type Database from "bun:sqlite"; + +import type { CreateModelRequest, RuntimeMode } from "../../../shared/api"; + +import { MODEL_CAPABILITIES } from "../../../shared/api"; +import { createModel } from "../../db/models"; +import { createApiError, jsonResponse } from "../../helpers"; + +export async function handleCreateModel(req: Request, db: Database, mode: RuntimeMode): Promise { + let body: CreateModelRequest; + try { + body = (await req.json()) as CreateModelRequest; + } catch { + return jsonResponse(createApiError("Invalid JSON body", 400), { mode, status: 400 }); + } + + if (!body.name || typeof body.name !== "string") { + return jsonResponse(createApiError("name is required", 400), { mode, status: 400 }); + } + + if (!body.modelId || typeof body.modelId !== "string") { + return jsonResponse(createApiError("modelId is required", 400), { mode, status: 400 }); + } + + if (!body.providerId || typeof body.providerId !== "string") { + return jsonResponse(createApiError("providerId is required", 400), { mode, status: 400 }); + } + + if (!Array.isArray(body.capabilities) || body.capabilities.length === 0) { + return jsonResponse(createApiError("capabilities is required and must be a non-empty array", 400), { + mode, + status: 400, + }); + } + + const invalidCaps = body.capabilities.filter((c) => !MODEL_CAPABILITIES.includes(c)); + if (invalidCaps.length > 0) { + return jsonResponse(createApiError(`Invalid capabilities: ${invalidCaps.join(", ")}`, 400), { mode, status: 400 }); + } + + const result = createModel(db, body); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode, status: 201 }); +} diff --git a/src/server/routes/models/delete.ts b/src/server/routes/models/delete.ts new file mode 100644 index 0000000..e090850 --- /dev/null +++ b/src/server/routes/models/delete.ts @@ -0,0 +1,22 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { deleteModel } from "../../db/models"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleDeleteModel(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const result = deleteModel(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return new Response(null, { status: 204 }); +} diff --git a/src/server/routes/models/disable.ts b/src/server/routes/models/disable.ts new file mode 100644 index 0000000..ba076d9 --- /dev/null +++ b/src/server/routes/models/disable.ts @@ -0,0 +1,22 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { disableModel } from "../../db/models"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleDisableModel(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const result = disableModel(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/models/enable.ts b/src/server/routes/models/enable.ts new file mode 100644 index 0000000..264295b --- /dev/null +++ b/src/server/routes/models/enable.ts @@ -0,0 +1,22 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { enableModel } from "../../db/models"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleEnableModel(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const result = enableModel(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/models/get.ts b/src/server/routes/models/get.ts new file mode 100644 index 0000000..8d11e0b --- /dev/null +++ b/src/server/routes/models/get.ts @@ -0,0 +1,22 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { getModel } from "../../db/models"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleGetModel(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const result = getModel(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/models/list.ts b/src/server/routes/models/list.ts new file mode 100644 index 0000000..8ff6737 --- /dev/null +++ b/src/server/routes/models/list.ts @@ -0,0 +1,27 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { listModels } from "../../db/models"; +import { jsonResponse } from "../../helpers"; +import { validatePagination } from "../../middleware"; + +export function handleListModels(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const pageParam = url.searchParams.get("page"); + const pageSizeParam = url.searchParams.get("pageSize"); + const keyword = url.searchParams.get("keyword"); + const providerId = url.searchParams.get("providerId"); + + const pagination = validatePagination(pageParam, pageSizeParam, mode); + if (pagination instanceof Response) return pagination; + + const result = listModels(db, { + keyword: keyword ?? undefined, + page: pagination.page, + pageSize: pagination.pageSize, + providerId: providerId ?? undefined, + }); + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/models/update.ts b/src/server/routes/models/update.ts new file mode 100644 index 0000000..5267a94 --- /dev/null +++ b/src/server/routes/models/update.ts @@ -0,0 +1,43 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode, UpdateModelRequest } from "../../../shared/api"; + +import { MODEL_CAPABILITIES } from "../../../shared/api"; +import { updateModel } from "../../db/models"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export async function handleUpdateModel(req: Request, db: Database, mode: RuntimeMode): Promise { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + let body: UpdateModelRequest; + try { + body = (await req.json()) as UpdateModelRequest; + } catch { + return jsonResponse(createApiError("Invalid JSON body", 400), { mode, status: 400 }); + } + + if (body.capabilities !== undefined) { + if (!Array.isArray(body.capabilities) || body.capabilities.length === 0) { + return jsonResponse(createApiError("capabilities must be a non-empty array", 400), { mode, status: 400 }); + } + const invalidCaps = body.capabilities.filter((c) => !MODEL_CAPABILITIES.includes(c)); + if (invalidCaps.length > 0) { + return jsonResponse(createApiError(`Invalid capabilities: ${invalidCaps.join(", ")}`, 400), { + mode, + status: 400, + }); + } + } + + const result = updateModel(db, validated.id, body); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/providers/create.ts b/src/server/routes/providers/create.ts new file mode 100644 index 0000000..5b4a62b --- /dev/null +++ b/src/server/routes/providers/create.ts @@ -0,0 +1,41 @@ +import type Database from "bun:sqlite"; + +import type { CreateProviderRequest, RuntimeMode } from "../../../shared/api"; + +import { createProvider } from "../../db/providers"; +import { createApiError, jsonResponse } from "../../helpers"; + +export async function handleCreateProvider(req: Request, db: Database, mode: RuntimeMode): Promise { + let body: CreateProviderRequest; + try { + body = (await req.json()) as CreateProviderRequest; + } catch { + return jsonResponse(createApiError("Invalid JSON body", 400), { mode, status: 400 }); + } + + if (!body.name || typeof body.name !== "string") { + return jsonResponse(createApiError("name is required", 400), { mode, status: 400 }); + } + + if (!body.baseUrl || typeof body.baseUrl !== "string") { + return jsonResponse(createApiError("baseUrl is required", 400), { mode, status: 400 }); + } + + if (!body.apiKey || typeof body.apiKey !== "string") { + return jsonResponse(createApiError("apiKey is required", 400), { mode, status: 400 }); + } + + if (!body.type || !["anthropic", "openai", "openai-compatible"].includes(body.type)) { + return jsonResponse(createApiError("type must be one of: openai, anthropic, openai-compatible", 400), { + mode, + status: 400, + }); + } + + const result = createProvider(db, body); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode, status: 201 }); +} diff --git a/src/server/routes/providers/delete.ts b/src/server/routes/providers/delete.ts new file mode 100644 index 0000000..30eb6b9 --- /dev/null +++ b/src/server/routes/providers/delete.ts @@ -0,0 +1,28 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { getModelsByProviderId } from "../../db/models"; +import { deleteProvider } from "../../db/providers"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleDeleteProvider(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const modelCount = getModelsByProviderId(db, validated.id); + if (modelCount > 0) { + return jsonResponse(createApiError("该供应商下存在模型，无法删除", 409), { mode, status: 409 }); + } + + const result = deleteProvider(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return new Response(null, { status: 204 }); +} diff --git a/src/server/routes/providers/disable.ts b/src/server/routes/providers/disable.ts new file mode 100644 index 0000000..917a9bb --- /dev/null +++ b/src/server/routes/providers/disable.ts @@ -0,0 +1,22 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { disableProvider } from "../../db/providers"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleDisableProvider(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const result = disableProvider(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/providers/enable.ts b/src/server/routes/providers/enable.ts new file mode 100644 index 0000000..b9ad432 --- /dev/null +++ b/src/server/routes/providers/enable.ts @@ -0,0 +1,22 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { enableProvider } from "../../db/providers"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleEnableProvider(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const result = enableProvider(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/providers/get.ts b/src/server/routes/providers/get.ts new file mode 100644 index 0000000..019a258 --- /dev/null +++ b/src/server/routes/providers/get.ts @@ -0,0 +1,22 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { getProvider } from "../../db/providers"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export function handleGetProvider(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const result = getProvider(db, validated.id); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/providers/list.ts b/src/server/routes/providers/list.ts new file mode 100644 index 0000000..a3e685e --- /dev/null +++ b/src/server/routes/providers/list.ts @@ -0,0 +1,25 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { listProviders } from "../../db/providers"; +import { jsonResponse } from "../../helpers"; +import { validatePagination } from "../../middleware"; + +export function handleListProviders(req: Request, db: Database, mode: RuntimeMode): Response { + const url = new URL(req.url); + const pageParam = url.searchParams.get("page"); + const pageSizeParam = url.searchParams.get("pageSize"); + const keyword = url.searchParams.get("keyword"); + + const pagination = validatePagination(pageParam, pageSizeParam, mode); + if (pagination instanceof Response) return pagination; + + const result = listProviders(db, { + keyword: keyword ?? undefined, + page: pagination.page, + pageSize: pagination.pageSize, + }); + + return jsonResponse(result, { mode }); +} diff --git a/src/server/routes/providers/test.ts b/src/server/routes/providers/test.ts new file mode 100644 index 0000000..90896a9 --- /dev/null +++ b/src/server/routes/providers/test.ts @@ -0,0 +1,34 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode } from "../../../shared/api"; + +import { testProviderConnection } from "../../ai/registry"; +import { getProvider } from "../../db/providers"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export async function handleTestProvider(req: Request, db: Database, mode: RuntimeMode): Promise { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + const providerResult = getProvider(db, validated.id); + if ("error" in providerResult) { + return jsonResponse(createApiError(providerResult.error, providerResult.status), { + mode, + status: providerResult.status, + }); + } + + const provider = providerResult.provider; + const testResult = await testProviderConnection({ + apiKey: provider.apiKey, + baseUrl: provider.baseUrl, + name: provider.name, + type: provider.type, + }); + + return jsonResponse({ providerTestResponse: testResult }, { mode }); +} diff --git a/src/server/routes/providers/update.ts b/src/server/routes/providers/update.ts new file mode 100644 index 0000000..24fe441 --- /dev/null +++ b/src/server/routes/providers/update.ts @@ -0,0 +1,36 @@ +import type Database from "bun:sqlite"; + +import type { RuntimeMode, UpdateProviderRequest } from "../../../shared/api"; + +import { updateProvider } from "../../db/providers"; +import { createApiError, jsonResponse } from "../../helpers"; +import { validateIdParam } from "../../middleware"; + +export async function handleUpdateProvider(req: Request, db: Database, mode: RuntimeMode): Promise { + const url = new URL(req.url); + const idStr = url.pathname.split("/")[3]; + + const validated = validateIdParam(idStr ?? "", mode); + if (validated instanceof Response) return validated; + + let body: UpdateProviderRequest; + try { + body = (await req.json()) as UpdateProviderRequest; + } catch { + return jsonResponse(createApiError("Invalid JSON body", 400), { mode, status: 400 }); + } + + if (body.type !== undefined && !["anthropic", "openai", "openai-compatible"].includes(body.type)) { + return jsonResponse(createApiError("type must be one of: openai, anthropic, openai-compatible", 400), { + mode, + status: 400, + }); + } + + const result = updateProvider(db, validated.id, body); + if ("error" in result) { + return jsonResponse(createApiError(result.error, result.status), { mode, status: result.status }); + } + + return jsonResponse(result, { mode }); +} diff --git a/src/server/server.ts b/src/server/server.ts index 86c1400..4235ddf 100644 --- a/src/server/server.ts +++ b/src/server/server.ts @@ -43,6 +43,42 @@ export function startServer(options: StartServerOptions) { return handleMeta(mode, resolvedVersion); }, }, + "/api/models": { + GET: async (req) => { + const { handleListModels } = await import("./routes/models/list"); + return handleListModels(req, db, mode); + }, + POST: async (req) => { + const { handleCreateModel } = await import("./routes/models/create"); + return handleCreateModel(req, db, mode); + }, + }, + "/api/models/:id": { + DELETE: async (req) => { + const { handleDeleteModel } = await import("./routes/models/delete"); + return handleDeleteModel(req, db, mode); + }, + GET: async (req) => { + const { handleGetModel } = await import("./routes/models/get"); + return handleGetModel(req, db, mode); + }, + PATCH: async (req) => { + const { handleUpdateModel } = await import("./routes/models/update"); + return handleUpdateModel(req, db, mode); + }, + }, + "/api/models/:id/disable": { + POST: async (req) => { + const { handleDisableModel } = await import("./routes/models/disable"); + return handleDisableModel(req, db, mode); + }, + }, + "/api/models/:id/enable": { + POST: async (req) => { + const { handleEnableModel } = await import("./routes/models/enable"); + return handleEnableModel(req, db, mode); + }, + }, "/api/projects": { GET: async (req) => { const { handleListProjects } = await import("./routes/projects/list"); @@ -79,6 +115,48 @@ export function startServer(options: StartServerOptions) { return handleRestoreProject(req, db, mode); }, }, + "/api/providers": { + GET: async (req) => { + const { handleListProviders } = await import("./routes/providers/list"); + return handleListProviders(req, db, mode); + }, + POST: async (req) => { + const { handleCreateProvider } = await import("./routes/providers/create"); + return handleCreateProvider(req, db, mode); + }, + }, + "/api/providers/:id": { + DELETE: async (req) => { + const { handleDeleteProvider } = await import("./routes/providers/delete"); + return handleDeleteProvider(req, db, mode); + }, + GET: async (req) => { + const { handleGetProvider } = await import("./routes/providers/get"); + return handleGetProvider(req, db, mode); + }, + PATCH: async (req) => { + const { handleUpdateProvider } = await import("./routes/providers/update"); + return handleUpdateProvider(req, db, mode); + }, + }, + "/api/providers/:id/disable": { + POST: async (req) => { + const { handleDisableProvider } = await import("./routes/providers/disable"); + return handleDisableProvider(req, db, mode); + }, + }, + "/api/providers/:id/enable": { + POST: async (req) => { + const { handleEnableProvider } = await import("./routes/providers/enable"); + return handleEnableProvider(req, db, mode); + }, + }, + "/api/providers/:id/test": { + POST: async (req) => { + const { handleTestProvider } = await import("./routes/providers/test"); + return handleTestProvider(req, db, mode); + }, + }, }, }); diff --git a/src/shared/api.ts b/src/shared/api.ts index 3e75287..5cc16da 100644 --- a/src/shared/api.ts +++ b/src/shared/api.ts @@ -3,11 +3,32 @@ export interface ApiErrorResponse { status: number; } +export interface CreateModelRequest { + capabilities: ModelCapability[]; + contextLength?: null | number; + maxOutputTokens?: null | number; + modelId: string; + name: string; + providerId: string; +} + export interface CreateProjectRequest { description?: string; name: string; } +// ========================================== +// 在此定义你的业务类型 +// 前后端共享的类型都放在这个文件中 +// ========================================== + +export interface CreateProviderRequest { + apiKey: string; + baseUrl: string; + name: string; + type: ProviderType; +} + export interface MetaResponse { ok: true; service: string; @@ -15,10 +36,50 @@ export interface MetaResponse { version: string; } -// ========================================== -// 在此定义你的业务类型 -// 前后端共享的类型都放在这个文件中 -// ========================================== +export interface Model { + capabilities: ModelCapability[]; + contextLength: null | number; + createdAt: string; + enabled: boolean; + id: string; + maxOutputTokens: null | number; + modelId: string; + name: string; + providerId: string; + updatedAt: string; +} + +export type ModelCapability = + | "audio-generation" + | "audio-recognition" + | "image-generation" + | "image-recognition" + | "reasoning" + | "text" + | "video-generation" + | "video-recognition"; + +export const MODEL_CAPABILITIES: readonly ModelCapability[] = [ + "audio-generation", + "audio-recognition", + "image-generation", + "image-recognition", + "reasoning", + "text", + "video-generation", + "video-recognition", +]; + +export interface ModelListResponse { + items: Model[]; + page: number; + pageSize: number; + total: number; +} + +export interface ModelResponse { + model: Model; +} export interface Project { archivedAt: null | string; @@ -43,9 +104,54 @@ export interface ProjectResponse { export type ProjectStatus = "active" | "archived"; +export interface Provider { + apiKey: string; + baseUrl: string; + createdAt: string; + enabled: boolean; + id: string; + name: string; + type: ProviderType; + updatedAt: string; +} + +export interface ProviderListResponse { + items: Provider[]; + page: number; + pageSize: number; + total: number; +} + +export interface ProviderResponse { + provider: Provider; +} + +export interface ProviderTestResponse { + message: string; + ok: boolean; +} + +export type ProviderType = "anthropic" | "openai" | "openai-compatible"; + export type RuntimeMode = "development" | "production" | "test"; +export interface UpdateModelRequest { + capabilities?: ModelCapability[]; + contextLength?: null | number; + maxOutputTokens?: null | number; + modelId?: string; + name?: string; + providerId?: string; +} + export interface UpdateProjectRequest { description?: string; name?: string; } + +export interface UpdateProviderRequest { + apiKey?: string; + baseUrl?: string; + name?: string; + type?: ProviderType; +} diff --git a/src/web/consoles/admin/menu.tsx b/src/web/consoles/admin/menu.tsx index bdd409b..fb8cfe1 100644 --- a/src/web/consoles/admin/menu.tsx +++ b/src/web/consoles/admin/menu.tsx @@ -1,4 +1,4 @@ -import { DashboardOutlined, FolderOutlined } from "@ant-design/icons"; +import { DashboardOutlined, FolderOutlined, RobotOutlined } from "@ant-design/icons"; import { createElement } from "react"; import type { MenuItemConfig } from "../../menu"; @@ -6,4 +6,5 @@ import type { MenuItemConfig } from "../../menu"; export const ADMIN_MENU_ITEMS: readonly MenuItemConfig[] = [ { icon: createElement(DashboardOutlined), label: "总览", path: "/", value: "dashboard" }, { icon: createElement(FolderOutlined), label: "项目管理", path: "/projects", value: "projects" }, + { icon: createElement(RobotOutlined), label: "模型管理", path: "/models", value: "models" }, ] as const; diff --git a/src/web/hooks/use-models.ts b/src/web/hooks/use-models.ts new file mode 100644 index 0000000..07b3498 --- /dev/null +++ b/src/web/hooks/use-models.ts @@ -0,0 +1,141 @@ +import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; + +import type { CreateModelRequest, Model, ModelListResponse, ModelResponse, UpdateModelRequest } from "../../shared/api"; + +const MODELS_KEY = ["models"] as const; + +export async function createModel(data: CreateModelRequest): Promise { + const response = await fetch("/api/models", { + body: JSON.stringify(data), + headers: { "Content-Type": "application/json" }, + method: "POST", + }); + return handleResponse(response); +} + +export async function deleteModel(id: string): Promise { + const response = await fetch(`/api/models/${id}`, { method: "DELETE" }); + if (!response.ok) { + const body = (await response.json().catch(() => null)) as null | { error?: string }; + throw new Error(body?.error ?? `HTTP ${response.status}`); + } +} + +export async function disableModel(id: string): Promise { + const response = await fetch(`/api/models/${id}/disable`, { method: "POST" }); + return handleResponse(response); +} + +export async function enableModel(id: string): Promise { + const response = await fetch(`/api/models/${id}/enable`, { method: "POST" }); + return handleResponse(response); +} + +export async function fetchModel(id: string): Promise { + const response = await fetch(`/api/models/${id}`); + return handleResponse(response); +} + +export async function fetchModelList(params: { + keyword?: string; + page?: number; + pageSize?: number; + providerId?: string; +}): Promise { + const searchParams = new URLSearchParams(); + if (params.page) searchParams.set("page", String(params.page)); + if (params.pageSize) searchParams.set("pageSize", String(params.pageSize)); + if (params.keyword) searchParams.set("keyword", params.keyword); + if (params.providerId) searchParams.set("providerId", params.providerId); + const qs = searchParams.toString(); + const url = `/api/models${qs ? `?${qs}` : ""}`; + const response = await fetch(url); + if (!response.ok) { + const body = (await response.json().catch(() => null)) as null | { error?: string }; + throw new Error(body?.error ?? `HTTP ${response.status}`); + } + return response.json() as Promise; +} + +export async function updateModel(id: string, data: UpdateModelRequest): Promise { + const response = await fetch(`/api/models/${id}`, { + body: JSON.stringify(data), + headers: { "Content-Type": "application/json" }, + method: "PATCH", + }); + return handleResponse(response); +} + +export function useCreateModel() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: createModel, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: MODELS_KEY }); + }, + }); +} + +export function useDeleteModel() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: deleteModel, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: MODELS_KEY }); + }, + }); +} + +export function useDisableModel() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: disableModel, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: MODELS_KEY }); + }, + }); +} + +export function useEnableModel() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: enableModel, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: MODELS_KEY }); + }, + }); +} + +export function useModel(id: string) { + return useQuery({ + enabled: !!id, + queryFn: () => fetchModel(id), + queryKey: [...MODELS_KEY, "detail", id], + }); +} + +export function useModelList(params: { keyword?: string; page?: number; pageSize?: number; providerId?: string }) { + return useQuery({ + queryFn: () => fetchModelList(params), + queryKey: [...MODELS_KEY, "list", params], + }); +} + +export function useUpdateModel() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: (args: { data: UpdateModelRequest; id: string }) => updateModel(args.id, args.data), + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: MODELS_KEY }); + }, + }); +} + +async function handleResponse(response: Response): Promise { + if (!response.ok) { + const body = (await response.json().catch(() => null)) as null | { error?: string }; + throw new Error(body?.error ?? `HTTP ${response.status}`); + } + const data = (await response.json()) as ModelResponse; + return data.model; +} diff --git a/src/web/hooks/use-providers.ts b/src/web/hooks/use-providers.ts new file mode 100644 index 0000000..39423c4 --- /dev/null +++ b/src/web/hooks/use-providers.ts @@ -0,0 +1,164 @@ +import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; + +import type { + CreateProviderRequest, + Provider, + ProviderListResponse, + ProviderResponse, + ProviderTestResponse, + UpdateProviderRequest, +} from "../../shared/api"; + +const PROVIDERS_KEY = ["providers"] as const; +const MODELS_KEY = ["models"] as const; + +export async function createProvider(data: CreateProviderRequest): Promise { + const response = await fetch("/api/providers", { + body: JSON.stringify(data), + headers: { "Content-Type": "application/json" }, + method: "POST", + }); + return handleResponse(response); +} + +export async function deleteProvider(id: string): Promise { + const response = await fetch(`/api/providers/${id}`, { method: "DELETE" }); + if (!response.ok) { + const body = (await response.json().catch(() => null)) as null | { error?: string }; + throw new Error(body?.error ?? `HTTP ${response.status}`); + } +} + +export async function disableProvider(id: string): Promise { + const response = await fetch(`/api/providers/${id}/disable`, { method: "POST" }); + return handleResponse(response); +} + +export async function enableProvider(id: string): Promise { + const response = await fetch(`/api/providers/${id}/enable`, { method: "POST" }); + return handleResponse(response); +} + +export async function fetchProvider(id: string): Promise { + const response = await fetch(`/api/providers/${id}`); + return handleResponse(response); +} + +export async function fetchProviderList(params: { + keyword?: string; + page?: number; + pageSize?: number; +}): Promise { + const searchParams = new URLSearchParams(); + if (params.page) searchParams.set("page", String(params.page)); + if (params.pageSize) searchParams.set("pageSize", String(params.pageSize)); + if (params.keyword) searchParams.set("keyword", params.keyword); + const qs = searchParams.toString(); + const url = `/api/providers${qs ? `?${qs}` : ""}`; + const response = await fetch(url); + if (!response.ok) { + const body = (await response.json().catch(() => null)) as null | { error?: string }; + throw new Error(body?.error ?? `HTTP ${response.status}`); + } + return response.json() as Promise; +} + +export async function testProviderConnection(id: string): Promise { + const response = await fetch(`/api/providers/${id}/test`, { method: "POST" }); + if (!response.ok) { + const body = (await response.json().catch(() => null)) as null | { error?: string }; + throw new Error(body?.error ?? `HTTP ${response.status}`); + } + const data = (await response.json()) as { providerTestResponse: ProviderTestResponse }; + return data.providerTestResponse; +} + +export async function updateProvider(id: string, data: UpdateProviderRequest): Promise { + const response = await fetch(`/api/providers/${id}`, { + body: JSON.stringify(data), + headers: { "Content-Type": "application/json" }, + method: "PATCH", + }); + return handleResponse(response); +} + +export function useCreateProvider() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: createProvider, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: PROVIDERS_KEY }); + }, + }); +} + +export function useDeleteProvider() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: deleteProvider, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: PROVIDERS_KEY }); + void queryClient.invalidateQueries({ queryKey: MODELS_KEY }); + }, + }); +} + +export function useDisableProvider() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: disableProvider, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: PROVIDERS_KEY }); + }, + }); +} + +export function useEnableProvider() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: enableProvider, + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: PROVIDERS_KEY }); + }, + }); +} + +export function useProvider(id: string) { + return useQuery({ + enabled: !!id, + queryFn: () => fetchProvider(id), + queryKey: [...PROVIDERS_KEY, "detail", id], + }); +} + +export function useProviderList(params: { keyword?: string; page?: number; pageSize?: number }) { + return useQuery({ + queryFn: () => fetchProviderList(params), + queryKey: [...PROVIDERS_KEY, "list", params], + }); +} + +export function useTestProviderConnection() { + return useMutation({ + mutationFn: testProviderConnection, + }); +} + +export function useUpdateProvider() { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: (args: { data: UpdateProviderRequest; id: string }) => updateProvider(args.id, args.data), + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: PROVIDERS_KEY }); + }, + }); +} + +async function handleResponse(response: Response): Promise { + if (!response.ok) { + const body = (await response.json().catch(() => null)) as null | { error?: string }; + throw new Error(body?.error ?? `HTTP ${response.status}`); + } + const data = (await response.json()) as ProviderResponse; + return data.provider; +} diff --git a/src/web/pages/models/components/ModelFormModal.tsx b/src/web/pages/models/components/ModelFormModal.tsx new file mode 100644 index 0000000..5db79fd --- /dev/null +++ b/src/web/pages/models/components/ModelFormModal.tsx @@ -0,0 +1,182 @@ +import { App as AntApp, Button, Checkbox, Col, Form, Input, InputNumber, Modal, Row, Select, Space } from "antd"; +import { useEffect, useState } from "react"; + +import type { CreateModelRequest, Model, ModelCapability, Provider, UpdateModelRequest } from "../../../../shared/api"; + +interface FormValues { + capabilities: ModelCapability[]; + contextLength: null | number; + maxOutputTokens: null | number; + modelId: string; + name: string; + providerId: string; +} + +interface ModelFormModalProps { + editingModel: Model | null; + onCancel: () => void; + onCreate: (data: CreateModelRequest) => Promise; + onOpenChange: (open: boolean) => void; + onUpdate: (args: { data: UpdateModelRequest; id: string }) => Promise; + open: boolean; + providers: Provider[]; + submitting: boolean; + testConnection?: (providerId: string) => Promise; +} + +const CAPABILITY_OPTIONS: Array<{ label: string; value: ModelCapability }> = [ + { label: "文本", value: "text" }, + { label: "推理", value: "reasoning" }, + { label: "图片生成", value: "image-generation" }, + { label: "视频生成", value: "video-generation" }, + { label: "音频生成", value: "audio-generation" }, + { label: "图片识别", value: "image-recognition" }, + { label: "视频识别", value: "video-recognition" }, + { label: "音频识别", value: "audio-recognition" }, +]; + +export function ModelFormModal({ + editingModel, + onCancel, + onCreate, + onOpenChange, + onUpdate, + open, + providers, + submitting, + testConnection, +}: ModelFormModalProps) { + const { message } = AntApp.useApp(); + const [form] = Form.useForm(); + const [testing, setTesting] = useState(false); + + useEffect(() => { + if (!open) return; + if (editingModel) { + form.setFieldsValue({ + capabilities: editingModel.capabilities, + contextLength: editingModel.contextLength, + maxOutputTokens: editingModel.maxOutputTokens, + modelId: editingModel.modelId, + name: editingModel.name, + providerId: editingModel.providerId, + }); + } else { + form.resetFields(); + } + }, [editingModel, form, open]); + + const handleFinish = async (values: FormValues) => { + try { + if (editingModel) { + const reqData: UpdateModelRequest = {}; + if (values.name !== editingModel.name) reqData.name = values.name; + if (values.modelId !== editingModel.modelId) reqData.modelId = values.modelId; + if (values.providerId !== editingModel.providerId) reqData.providerId = values.providerId; + const capsChanged = + values.capabilities.length !== editingModel.capabilities.length || + values.capabilities.some((c, i) => c !== editingModel.capabilities[i]); + if (capsChanged) reqData.capabilities = values.capabilities; + if (values.contextLength !== editingModel.contextLength) reqData.contextLength = values.contextLength; + if (values.maxOutputTokens !== editingModel.maxOutputTokens) reqData.maxOutputTokens = values.maxOutputTokens; + await onUpdate({ data: reqData, id: editingModel.id }); + message.success("模型已更新"); + } else { + const reqData: CreateModelRequest = { + capabilities: values.capabilities, + contextLength: values.contextLength ?? undefined, + maxOutputTokens: values.maxOutputTokens ?? undefined, + modelId: values.modelId, + name: values.name, + providerId: values.providerId, + }; + await onCreate(reqData); + message.success("模型已创建"); + } + onOpenChange(false); + } catch (err) { + if (err instanceof Error) { + message.error(err.message); + } + } + }; + + const handleTest = async () => { + if (!testConnection) return; + const providerId: unknown = form.getFieldValue("providerId"); + if (typeof providerId !== "string" || !providerId) { + message.warning("请先选择供应商"); + return; + } + setTesting(true); + try { + const result = await testConnection(providerId); + message.success((result as { message: string }).message); + } catch (err) { + message.error((err as Error).message); + } finally { + setTesting(false); + } + }; + + const providerOptions = providers.filter((p) => p.enabled).map((p) => ({ label: p.name, value: p.id })); + + return ( + void form.submit()} + open={open} + title={editingModel ? "编辑模型" : "新建模型"} + width={600} + > +
void handleFinish(values)}> + + + + + + + + + + {CAPABILITY_OPTIONS.map((opt) => ( + + {opt.label} + + ))} + + + + + + + + + + {editingModel && testConnection && ( + + + + + + )} +
+ + ); +} diff --git a/src/web/pages/models/components/ModelTable.tsx b/src/web/pages/models/components/ModelTable.tsx new file mode 100644 index 0000000..56bc3bd --- /dev/null +++ b/src/web/pages/models/components/ModelTable.tsx @@ -0,0 +1,179 @@ +import type { ColumnsType } from "antd/es/table"; + +import { CheckCircleOutlined, DeleteOutlined, EditOutlined, StopOutlined } from "@ant-design/icons"; +import { App as AntApp, Button, Popconfirm, Space, Table, Tag } from "antd"; + +import type { Model, ModelListResponse, Provider } from "../../../../shared/api"; + +interface ModelTableProps { + data: ModelListResponse | undefined; + loading: boolean; + onDelete: (id: string) => Promise; + onDisable: (id: string) => Promise; + onEdit: (model: Model) => void; + onEnable: (id: string) => Promise; + onPageChange: (page: number, pageSize: number) => void; + page: number; + pageSize: number; + providers: Provider[]; +} + +const CAPABILITY_LABELS: Record = { + "audio-generation": "音频生成", + "audio-recognition": "音频识别", + "image-generation": "图片生成", + "image-recognition": "图片识别", + reasoning: "推理", + text: "文本", + "video-generation": "视频生成", + "video-recognition": "视频识别", +}; + +function getProviderName(providerId: string, providers: Provider[]): string { + return providers.find((p) => p.id === providerId)?.name ?? providerId; +} + +const COLUMNS: ColumnsType = [ + { dataIndex: "name", ellipsis: true, title: "模型名称", width: 160 }, + { dataIndex: "modelId", ellipsis: true, title: "模型 ID", width: 180 }, + { + dataIndex: "providerId", + ellipsis: true, + title: "供应商", + width: 120, + }, + { + dataIndex: "capabilities", + render: (value: string[]) => + value.map((c) => ( + + {CAPABILITY_LABELS[c] ?? c} + + )), + title: "能力", + width: 200, + }, + { + align: "center", + dataIndex: "enabled", + render: (value: boolean) => (value ? 已启用 : 已禁用), + title: "状态", + width: 100, + }, + { + align: "center", + dataIndex: "createdAt", + render: (_value: unknown, record: Model) => formatDatetime(record.createdAt), + title: "创建时间", + width: 185, + }, +]; + +export function ModelTable({ + data, + loading, + onDelete, + onDisable, + onEdit, + onEnable, + onPageChange, + page, + pageSize, + providers, +}: ModelTableProps) { + const { message } = AntApp.useApp(); + + const handleEnable = async (id: string) => { + try { + await onEnable(id); + message.success("模型已启用"); + } catch (err) { + message.error((err as Error).message); + } + }; + + const handleDisable = async (id: string) => { + try { + await onDisable(id); + message.success("模型已禁用"); + } catch (err) { + message.error((err as Error).message); + } + }; + + const handleDelete = async (id: string) => { + try { + await onDelete(id); + message.success("模型已删除"); + } catch (err) { + message.error((err as Error).message); + } + }; + + const columnsWithProvider: ColumnsType = COLUMNS.map((col) => + "dataIndex" in col && col.dataIndex === "providerId" + ? { + ...col, + render: (_value: unknown, record: Model) => getProviderName(record.providerId, providers), + } + : col, + ); + + const operationColumn: ColumnsType[number] = { + dataIndex: "op", + fixed: "right", + render: (_value: unknown, record: Model) => ( + + + {record.enabled ? ( + void handleDisable(record.id)} title="确认禁用此模型？"> + + + ) : ( + + )} + void handleDelete(record.id)} + title="确认删除此模型？" + > + + + + ), + title: "操作", + width: 220, + }; + + return ( + + ); +} + +function formatDatetime(dateStr: string): string { + const d = new Date(dateStr); + const pad = (n: number) => String(n).padStart(2, "0"); + return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`; +} diff --git a/src/web/pages/models/components/ModelToolbar.tsx b/src/web/pages/models/components/ModelToolbar.tsx new file mode 100644 index 0000000..9b007c7 --- /dev/null +++ b/src/web/pages/models/components/ModelToolbar.tsx @@ -0,0 +1,34 @@ +import { PlusOutlined } from "@ant-design/icons"; +import { Button, Flex, Input } from "antd"; +import { useState } from "react"; + +interface ModelToolbarProps { + keyword: string; + onSearch: (value: string) => void; + onSearchClear: () => void; + openCreateDialog: () => void; +} + +export function ModelToolbar({ keyword, onSearch, onSearchClear, openCreateDialog }: ModelToolbarProps) { + const [draftKeyword, setDraftKeyword] = useState(keyword); + + return ( + + setDraftKeyword(event.target.value)} + onClear={() => { + setDraftKeyword(""); + onSearchClear(); + }} + onSearch={(value) => onSearch(value)} + placeholder="搜索模型名称或 ID" + value={draftKeyword} + /> + + + ); +} diff --git a/src/web/pages/models/components/ProviderFormModal.tsx b/src/web/pages/models/components/ProviderFormModal.tsx new file mode 100644 index 0000000..c78e117 --- /dev/null +++ b/src/web/pages/models/components/ProviderFormModal.tsx @@ -0,0 +1,113 @@ +import { App as AntApp, Form, Input, Modal, Select } from "antd"; +import { useEffect } from "react"; + +import type { CreateProviderRequest, Provider, ProviderType, UpdateProviderRequest } from "../../../../shared/api"; + +interface FormValues { + apiKey: string; + baseUrl: string; + name: string; + type: ProviderType; +} + +interface ProviderFormModalProps { + editingProvider: null | Provider; + onCancel: () => void; + onCreate: (data: CreateProviderRequest) => Promise; + onOpenChange: (open: boolean) => void; + onUpdate: (args: { data: UpdateProviderRequest; id: string }) => Promise; + open: boolean; + submitting: boolean; +} + +const TYPE_OPTIONS = [ + { label: "OpenAI 兼容", value: "openai-compatible" }, + { label: "OpenAI", value: "openai" }, + { label: "Anthropic", value: "anthropic" }, +]; + +export function ProviderFormModal({ + editingProvider, + onCancel, + onCreate, + onOpenChange, + onUpdate, + open, + submitting, +}: ProviderFormModalProps) { + const { message } = AntApp.useApp(); + const [form] = Form.useForm(); + + useEffect(() => { + if (!open) return; + if (editingProvider) { + form.setFieldsValue({ + apiKey: editingProvider.apiKey, + baseUrl: editingProvider.baseUrl, + name: editingProvider.name, + type: editingProvider.type, + }); + } else { + form.resetFields(); + } + }, [editingProvider, form, open]); + + const handleFinish = async (values: FormValues) => { + try { + if (editingProvider) { + const reqData: UpdateProviderRequest = {}; + if (values.name !== editingProvider.name) reqData.name = values.name; + if (values.baseUrl !== editingProvider.baseUrl) reqData.baseUrl = values.baseUrl; + if (values.apiKey !== editingProvider.apiKey) reqData.apiKey = values.apiKey; + if (values.type !== editingProvider.type) reqData.type = values.type; + await onUpdate({ data: reqData, id: editingProvider.id }); + message.success("供应商已更新"); + } else { + const reqData: CreateProviderRequest = { + apiKey: values.apiKey, + baseUrl: values.baseUrl, + name: values.name, + type: values.type, + }; + await onCreate(reqData); + message.success("供应商已创建"); + } + onOpenChange(false); + } catch (err) { + if (err instanceof Error) { + message.error(err.message); + } + } + }; + + return ( + void form.submit()} + open={open} + title={editingProvider ? "编辑供应商" : "新建供应商"} + > +
void handleFinish(values)}> + + + + + + + + + + + + ); +} diff --git a/src/web/pages/models/components/ProviderTable.tsx b/src/web/pages/models/components/ProviderTable.tsx new file mode 100644 index 0000000..d69ea8a --- /dev/null +++ b/src/web/pages/models/components/ProviderTable.tsx @@ -0,0 +1,169 @@ +import type { ColumnsType } from "antd/es/table"; + +import { + CheckCircleOutlined, + DeleteOutlined, + EditOutlined, + StopOutlined, + ThunderboltOutlined, +} from "@ant-design/icons"; +import { App as AntApp, Button, Popconfirm, Space, Table, Tag, Tooltip } from "antd"; + +import type { Provider, ProviderListResponse } from "../../../../shared/api"; + +interface ProviderTableProps { + data: ProviderListResponse | undefined; + loading: boolean; + onDelete: (id: string) => Promise; + onDisable: (id: string) => Promise; + onEdit: (provider: Provider) => void; + onEnable: (id: string) => Promise; + onPageChange: (page: number, pageSize: number) => void; + onTest: (id: string) => Promise; + page: number; + pageSize: number; +} + +const TYPE_LABELS: Record = { + anthropic: "Anthropic", + openai: "OpenAI", + "openai-compatible": "OpenAI 兼容", +}; + +const COLUMNS: ColumnsType = [ + { dataIndex: "name", ellipsis: true, title: "供应商名称", width: 160 }, + { + align: "center", + dataIndex: "type", + render: (value: Provider["type"]) => TYPE_LABELS[value] ?? value, + title: "类型", + width: 130, + }, + { dataIndex: "baseUrl", ellipsis: true, title: "Base URL" }, + { + align: "center", + dataIndex: "enabled", + render: (value: boolean) => (value ? 已启用 : 已禁用), + title: "状态", + width: 100, + }, + { + align: "center", + dataIndex: "createdAt", + render: (_value: unknown, record: Provider) => formatDatetime(record.createdAt), + title: "创建时间", + width: 185, + }, +]; + +export function ProviderTable({ + data, + loading, + onDelete, + onDisable, + onEdit, + onEnable, + onPageChange, + onTest, + page, + pageSize, +}: ProviderTableProps) { + const { message } = AntApp.useApp(); + + const handleEnable = async (id: string) => { + try { + await onEnable(id); + message.success("供应商已启用"); + } catch (err) { + message.error((err as Error).message); + } + }; + + const handleDisable = async (id: string) => { + try { + await onDisable(id); + message.success("供应商已禁用"); + } catch (err) { + message.error((err as Error).message); + } + }; + + const handleDelete = async (id: string) => { + try { + await onDelete(id); + message.success("供应商已删除"); + } catch (err) { + message.error((err as Error).message); + } + }; + + const handleTest = async (id: string) => { + try { + const result = await onTest(id); + message.success((result as { message: string }).message); + } catch (err) { + message.error((err as Error).message); + } + }; + + const operationColumn: ColumnsType[number] = { + dataIndex: "op", + fixed: "right", + render: (_value: unknown, record: Provider) => ( + + + + {record.enabled ? ( + void handleDisable(record.id)} title="确认禁用此供应商？"> + + + ) : ( + + )} + void handleDelete(record.id)} + title="确认删除此供应商？" + > + + + + ), + title: "操作", + width: 280, + }; + + return ( +
+ ); +} + +function formatDatetime(dateStr: string): string { + const d = new Date(dateStr); + const pad = (n: number) => String(n).padStart(2, "0"); + return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`; +} diff --git a/src/web/pages/models/components/ProviderToolbar.tsx b/src/web/pages/models/components/ProviderToolbar.tsx new file mode 100644 index 0000000..c69a24d --- /dev/null +++ b/src/web/pages/models/components/ProviderToolbar.tsx @@ -0,0 +1,34 @@ +import { PlusOutlined } from "@ant-design/icons"; +import { Button, Flex, Input } from "antd"; +import { useState } from "react"; + +interface ProviderToolbarProps { + keyword: string; + onSearch: (value: string) => void; + onSearchClear: () => void; + openCreateDialog: () => void; +} + +export function ProviderToolbar({ keyword, onSearch, onSearchClear, openCreateDialog }: ProviderToolbarProps) { + const [draftKeyword, setDraftKeyword] = useState(keyword); + + return ( + + setDraftKeyword(event.target.value)} + onClear={() => { + setDraftKeyword(""); + onSearchClear(); + }} + onSearch={(value) => onSearch(value)} + placeholder="搜索供应商名称" + value={draftKeyword} + /> + + + ); +} diff --git a/src/web/pages/models/index.tsx b/src/web/pages/models/index.tsx new file mode 100644 index 0000000..4785c29 --- /dev/null +++ b/src/web/pages/models/index.tsx @@ -0,0 +1,186 @@ +import { Flex, Tabs } from "antd"; +import { useState } from "react"; + +import type { Model, Provider } from "../../../shared/api"; + +import { + useCreateModel, + useDeleteModel, + useDisableModel, + useEnableModel, + useModelList, + useUpdateModel, +} from "../../hooks/use-models"; +import { + useCreateProvider, + useDeleteProvider, + useDisableProvider, + useEnableProvider, + useProviderList, + useTestProviderConnection, + useUpdateProvider, +} from "../../hooks/use-providers"; +import { ModelFormModal } from "./components/ModelFormModal"; +import { ModelTable } from "./components/ModelTable"; +import { ModelToolbar } from "./components/ModelToolbar"; +import { ProviderFormModal } from "./components/ProviderFormModal"; +import { ProviderTable } from "./components/ProviderTable"; +import { ProviderToolbar } from "./components/ProviderToolbar"; + +export function ModelsPage() { + const [activeTab, setActiveTab] = useState("providers"); + + const [providerPage, setProviderPage] = useState(1); + const [providerPageSize, setProviderPageSize] = useState(20); + const [providerKeyword, setProviderKeyword] = useState(""); + const [providerDialogOpen, setProviderDialogOpen] = useState(false); + const [editingProvider, setEditingProvider] = useState(null); + + const [modelPage, setModelPage] = useState(1); + const [modelPageSize, setModelPageSize] = useState(20); + const [modelKeyword, setModelKeyword] = useState(""); + const [modelDialogOpen, setModelDialogOpen] = useState(false); + const [editingModel, setEditingModel] = useState(null); + + const { data: providerData, isLoading: providerLoading } = useProviderList({ + keyword: providerKeyword || undefined, + page: providerPage, + pageSize: providerPageSize, + }); + + const { data: modelData, isLoading: modelLoading } = useModelList({ + keyword: modelKeyword || undefined, + page: modelPage, + pageSize: modelPageSize, + }); + + const createProviderMutation = useCreateProvider(); + const updateProviderMutation = useUpdateProvider(); + const deleteProviderMutation = useDeleteProvider(); + const enableProviderMutation = useEnableProvider(); + const disableProviderMutation = useDisableProvider(); + const testProviderMutation = useTestProviderConnection(); + + const createModelMutation = useCreateModel(); + const updateModelMutation = useUpdateModel(); + const deleteModelMutation = useDeleteModel(); + const enableModelMutation = useEnableModel(); + const disableModelMutation = useDisableModel(); + + const isProviderSubmitting = createProviderMutation.isPending || updateProviderMutation.isPending; + const isProviderActionPending = + deleteProviderMutation.isPending || enableProviderMutation.isPending || disableProviderMutation.isPending; + + const isModelSubmitting = createModelMutation.isPending || updateModelMutation.isPending; + const isModelActionPending = + deleteModelMutation.isPending || enableModelMutation.isPending || disableModelMutation.isPending; + + return ( + + setActiveTab(key)} + /> + + {activeTab === "providers" && ( + <> + { + setProviderKeyword(value); + setProviderPage(1); + }} + onSearchClear={() => { + setProviderKeyword(""); + setProviderPage(1); + }} + openCreateDialog={() => { + setEditingProvider(null); + setProviderDialogOpen(true); + }} + /> + deleteProviderMutation.mutateAsync(id)} + onDisable={(id) => disableProviderMutation.mutateAsync(id)} + onEdit={(provider) => { + setEditingProvider(provider); + setProviderDialogOpen(true); + }} + onEnable={(id) => enableProviderMutation.mutateAsync(id)} + onPageChange={(p, ps) => { + setProviderPage(p); + setProviderPageSize(ps); + }} + onTest={(id) => testProviderMutation.mutateAsync(id)} + page={providerPage} + pageSize={providerPageSize} + /> + setProviderDialogOpen(false)} + onCreate={(data) => createProviderMutation.mutateAsync(data)} + onOpenChange={setProviderDialogOpen} + onUpdate={(args) => updateProviderMutation.mutateAsync(args)} + open={providerDialogOpen} + submitting={isProviderSubmitting} + /> + + )} + + {activeTab === "models" && ( + <> + { + setModelKeyword(value); + setModelPage(1); + }} + onSearchClear={() => { + setModelKeyword(""); + setModelPage(1); + }} + openCreateDialog={() => { + setEditingModel(null); + setModelDialogOpen(true); + }} + /> + deleteModelMutation.mutateAsync(id)} + onDisable={(id) => disableModelMutation.mutateAsync(id)} + onEdit={(model) => { + setEditingModel(model); + setModelDialogOpen(true); + }} + onEnable={(id) => enableModelMutation.mutateAsync(id)} + onPageChange={(p, ps) => { + setModelPage(p); + setModelPageSize(ps); + }} + page={modelPage} + pageSize={modelPageSize} + providers={providerData?.items ?? []} + /> + setModelDialogOpen(false)} + onCreate={(data) => createModelMutation.mutateAsync(data)} + onOpenChange={setModelDialogOpen} + onUpdate={(args) => updateModelMutation.mutateAsync(args)} + open={modelDialogOpen} + providers={providerData?.items ?? []} + submitting={isModelSubmitting} + testConnection={editingModel ? (id: string) => testProviderMutation.mutateAsync(id) : undefined} + /> + + )} + + ); +} diff --git a/src/web/routes.tsx b/src/web/routes.tsx index 3e7ec10..8007d56 100644 --- a/src/web/routes.tsx +++ b/src/web/routes.tsx @@ -4,6 +4,7 @@ import { AdminConsoleLayout } from "./consoles/admin/AdminConsoleLayout"; import { WorkbenchProjectGate } from "./consoles/workbench/WorkbenchProjectGate"; import { NotFoundPage } from "./pages/404"; import { DashboardPage } from "./pages/dashboard"; +import { ModelsPage } from "./pages/models"; import { ProjectsPage } from "./pages/projects"; import { WorkbenchOverviewPage } from "./pages/workbench"; @@ -13,6 +14,7 @@ export function AppRoutes() { }> } path="/" /> } path="/projects" /> + } path="/models" /> } path="/workbench/:projectId"> } path="" /> diff --git a/tests/server/ai/registry.test.ts b/tests/server/ai/registry.test.ts new file mode 100644 index 0000000..b2e7e33 --- /dev/null +++ b/tests/server/ai/registry.test.ts @@ -0,0 +1,78 @@ +import { describe, expect, mock, test } from "bun:test"; + +import { createMigratedTestDatabase } from "../../helpers"; + +describe("AI registry", () => { + test("testProviderConnection rejects invalid config", async () => { + void mock.module("ai", () => ({ + generateText: mock(() => { + throw new Error("Connection failed"); + }), + })); + + const { testProviderConnection } = await import("../../../src/server/ai/registry"); + + const result = await testProviderConnection({ + apiKey: "bad-key", + baseUrl: "https://0.0.0.0:1", + name: "Bad", + type: "openai-compatible", + }); + + expect(result.ok).toBe(false); + expect(result.message).toContain("连接失败"); + expect(typeof result.message).toBe("string"); + }); + + test("testProviderConnection return shape is correct", async () => { + void mock.module("ai", () => ({ + generateText: mock((_opts: unknown) => ({})), + })); + + const { testProviderConnection } = await import("../../../src/server/ai/registry"); + + const result = await testProviderConnection({ + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + name: "Test", + type: "openai", + }); + + expect(result.ok).toBe(true); + expect(result.message).toBe("连接成功"); + }); + + test("buildProviderRegistry 从 DB 构建包含启用供应商的注册表", async () => { + const handle = createMigratedTestDatabase("registry-build-test"); + const now = new Date().toISOString(); + + handle.db + .prepare( + "INSERT INTO providers (id, name, type, base_url, api_key, enabled, created_at, updated_at) VALUES (?, ?, ?, ?, ?, ?, ?, ?)", + ) + .run("pv1", "OpenAI", "openai", "https://api.openai.com/v1", "sk-test", 1, now, now); + handle.db + .prepare( + "INSERT INTO providers (id, name, type, base_url, api_key, enabled, created_at, updated_at) VALUES (?, ?, ?, ?, ?, ?, ?, ?)", + ) + .run("pv2", "Disabled", "anthropic", "https://api.anthropic.com", "sk-off", 0, now, now); + + const { buildProviderRegistry } = await import("../../../src/server/ai/registry"); + const registry = buildProviderRegistry(handle.db); + + expect(() => registry.languageModel("pv1:gpt-4o")).not.toThrow(); + + handle.cleanup(); + }); + + test("buildProviderRegistry 无启用供应商时返回空注册表", async () => { + const handle = createMigratedTestDatabase("registry-empty-test"); + + const { buildProviderRegistry } = await import("../../../src/server/ai/registry"); + const registry = buildProviderRegistry(handle.db); + + expect(typeof registry.languageModel).toBe("function"); + + handle.cleanup(); + }); +}); diff --git a/tests/server/db/models.test.ts b/tests/server/db/models.test.ts new file mode 100644 index 0000000..b8bca13 --- /dev/null +++ b/tests/server/db/models.test.ts @@ -0,0 +1,226 @@ +import type Database from "bun:sqlite"; + +import { describe, expect, test } from "bun:test"; + +import { + createModel, + deleteModel, + disableModel, + enableModel, + getModel, + getModelsByProviderId, + listModels, + updateModel, +} from "../../../src/server/db/models"; +import { createProvider } from "../../../src/server/db/providers"; +import { createMigratedTestDatabase } from "../../helpers"; + +function seedProvider(db: Database, name = "TestProvider"): string { + const result = createProvider(db, { apiKey: "sk-test", baseUrl: "https://api.test.com/v1", name, type: "openai" }); + return (result as { provider: { id: string } }).provider.id; +} + +function withDb(callback: (db: Database) => void): void { + const handle = createMigratedTestDatabase("models-test"); + try { + callback(handle.db); + handle.close(); + } finally { + handle.cleanup(); + } +} + +describe("模型数据访问层", () => { + test("创建模型", () => { + withDb((db) => { + const providerId = seedProvider(db); + const result = createModel(db, { + capabilities: ["text", "reasoning"], + modelId: "gpt-4o", + name: "GPT-4o", + providerId, + }); + expect("error" in result).toBe(false); + const model = ( + result as { + model: { capabilities: string[]; enabled: boolean; modelId: string; name: string; providerId: string }; + } + ).model; + expect(model.name).toBe("GPT-4o"); + expect(model.modelId).toBe("gpt-4o"); + expect(model.providerId).toBe(providerId); + expect(model.capabilities).toEqual(["text", "reasoning"]); + expect(model.enabled).toBe(true); + }); + }); + + test("供应商不存在时创建失败", () => { + withDb((db) => { + const result = createModel(db, { + capabilities: ["text"], + modelId: "test", + name: "Test", + providerId: "nonexistent", + }); + expect("error" in result).toBe(true); + expect((result as unknown as { status: number }).status).toBe(400); + }); + }); + + test("同一供应商下模型 ID 唯一", () => { + withDb((db) => { + const providerId = seedProvider(db); + createModel(db, { capabilities: ["text"], modelId: "gpt-4o", name: "Model1", providerId }); + const result = createModel(db, { capabilities: ["text"], modelId: "gpt-4o", name: "Model2", providerId }); + expect("error" in result).toBe(true); + expect((result as unknown as { error: string }).error).toContain("已存在"); + }); + }); + + test("不同供应商下模型 ID 可重复", () => { + withDb((db) => { + const p1 = seedProvider(db, "P1"); + const p2 = seedProvider(db, "P2"); + const r1 = createModel(db, { capabilities: ["text"], modelId: "same-id", name: "M1", providerId: p1 }); + const r2 = createModel(db, { capabilities: ["text"], modelId: "same-id", name: "M2", providerId: p2 }); + expect("error" in r1).toBe(false); + expect("error" in r2).toBe(false); + }); + }); + + test("能力标签为空时创建失败", () => { + withDb((db) => { + const providerId = seedProvider(db); + const result = createModel(db, { capabilities: [], modelId: "test", name: "Test", providerId }); + expect("error" in result).toBe(true); + expect((result as unknown as { error: string }).error).toContain("能力标签"); + }); + }); + + test("列表查询（分页、关键字、供应商过滤）", () => { + withDb((db) => { + const p1 = seedProvider(db, "P1"); + const p2 = seedProvider(db, "P2"); + createModel(db, { capabilities: ["text"], modelId: "m1", name: "Alpha", providerId: p1 }); + createModel(db, { capabilities: ["text"], modelId: "m2", name: "Beta", providerId: p1 }); + createModel(db, { capabilities: ["text"], modelId: "m3", name: "Gamma", providerId: p2 }); + + const all = listModels(db, { page: 1, pageSize: 20 }); + expect(all.total).toBe(3); + + const filtered = listModels(db, { page: 1, pageSize: 20, providerId: p1 }); + expect(filtered.total).toBe(2); + + const searched = listModels(db, { keyword: "Alpha", page: 1, pageSize: 20 }); + expect(searched.total).toBe(1); + }); + }); + + test("获取模型详情", () => { + withDb((db) => { + const providerId = seedProvider(db); + const created = createModel(db, { capabilities: ["text"], modelId: "gpt-4o", name: "GPT-4o", providerId }); + const id = (created as { model: { id: string } }).model.id; + + const result = getModel(db, id); + expect("error" in result).toBe(false); + expect((result as { model: { name: string } }).model.name).toBe("GPT-4o"); + }); + }); + + test("获取不存在的模型返回 404", () => { + withDb((db) => { + const result = getModel(db, "nonexistent"); + expect("error" in result).toBe(true); + expect((result as unknown as { status: number }).status).toBe(404); + }); + }); + + test("更新模型", () => { + withDb((db) => { + const providerId = seedProvider(db); + const created = createModel(db, { capabilities: ["text"], modelId: "gpt-4o", name: "原名", providerId }); + const id = (created as { model: { id: string } }).model.id; + + const result = updateModel(db, id, { capabilities: ["text", "reasoning"], name: "新名" }); + expect("error" in result).toBe(false); + const updated = (result as { model: { capabilities: string[]; name: string } }).model; + expect(updated.name).toBe("新名"); + expect(updated.capabilities).toEqual(["text", "reasoning"]); + }); + }); + + test("启用/禁用模型", () => { + withDb((db) => { + const providerId = seedProvider(db); + const created = createModel(db, { capabilities: ["text"], modelId: "gpt-4o", name: "测试", providerId }); + const id = (created as { model: { id: string } }).model.id; + + const disabled = disableModel(db, id); + expect("error" in disabled).toBe(false); + expect((disabled as { model: { enabled: boolean } }).model.enabled).toBe(false); + + const enabled = enableModel(db, id); + expect("error" in enabled).toBe(false); + expect((enabled as { model: { enabled: boolean } }).model.enabled).toBe(true); + }); + }); + + test("重复禁用失败", () => { + withDb((db) => { + const providerId = seedProvider(db); + const created = createModel(db, { capabilities: ["text"], modelId: "gpt-4o", name: "测试", providerId }); + const id = (created as { model: { id: string } }).model.id; + disableModel(db, id); + + const result = disableModel(db, id); + expect("error" in result).toBe(true); + expect((result as unknown as { status: number }).status).toBe(409); + }); + }); + + test("删除模型", () => { + withDb((db) => { + const providerId = seedProvider(db); + const created = createModel(db, { capabilities: ["text"], modelId: "gpt-4o", name: "删除测试", providerId }); + const id = (created as { model: { id: string } }).model.id; + + const result = deleteModel(db, id); + expect("error" in result).toBe(false); + + const after = getModel(db, id); + expect("error" in after).toBe(true); + }); + }); + + test("getModelsByProviderId 返回正确数量", () => { + withDb((db) => { + const p1 = seedProvider(db, "P1"); + const p2 = seedProvider(db, "P2"); + createModel(db, { capabilities: ["text"], modelId: "m1", name: "M1", providerId: p1 }); + createModel(db, { capabilities: ["text"], modelId: "m2", name: "M2", providerId: p1 }); + createModel(db, { capabilities: ["text"], modelId: "m3", name: "M3", providerId: p2 }); + + expect(getModelsByProviderId(db, p1)).toBe(2); + expect(getModelsByProviderId(db, p2)).toBe(1); + }); + }); + + test("可选字段 contextLength 和 maxOutputTokens", () => { + withDb((db) => { + const providerId = seedProvider(db); + const result = createModel(db, { + capabilities: ["text"], + contextLength: 128000, + maxOutputTokens: 4096, + modelId: "gpt-4o", + name: "GPT-4o", + providerId, + }); + expect("error" in result).toBe(false); + const model = (result as { model: { contextLength: null | number; maxOutputTokens: null | number } }).model; + expect(model.contextLength).toBe(128000); + expect(model.maxOutputTokens).toBe(4096); + }); + }); +}); diff --git a/tests/server/db/providers.test.ts b/tests/server/db/providers.test.ts new file mode 100644 index 0000000..a30d441 --- /dev/null +++ b/tests/server/db/providers.test.ts @@ -0,0 +1,195 @@ +import type Database from "bun:sqlite"; + +import { describe, expect, test } from "bun:test"; + +import { + createProvider, + deleteProvider, + disableProvider, + enableProvider, + getProvider, + listProviders, + updateProvider, +} from "../../../src/server/db/providers"; +import { createMigratedTestDatabase } from "../../helpers"; + +function withDb(callback: (db: Database) => void): void { + const handle = createMigratedTestDatabase("providers-test"); + try { + callback(handle.db); + handle.close(); + } finally { + handle.cleanup(); + } +} + +describe("供应商数据访问层", () => { + test("创建供应商", () => { + withDb((db) => { + const result = createProvider(db, { + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + name: "OpenAI", + type: "openai", + }); + expect("error" in result).toBe(false); + const provider = ( + result as { provider: { apiKey: string; baseUrl: string; enabled: boolean; name: string; type: string } } + ).provider; + expect(provider.name).toBe("OpenAI"); + expect(provider.type).toBe("openai"); + expect(provider.baseUrl).toBe("https://api.openai.com/v1"); + expect(provider.apiKey).toBe("sk-test"); + expect(provider.enabled).toBe(true); + }); + }); + + test("供应商名称唯一", () => { + withDb((db) => { + createProvider(db, { apiKey: "sk-1", baseUrl: "https://a.com", name: "唯一", type: "openai" }); + const result = createProvider(db, { apiKey: "sk-2", baseUrl: "https://b.com", name: "唯一", type: "openai" }); + expect("error" in result).toBe(true); + expect((result as unknown as { error: string }).error).toContain("已存在"); + }); + }); + + test("名称为空时创建失败", () => { + withDb((db) => { + const result = createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: " ", type: "openai" }); + expect("error" in result).toBe(true); + expect((result as unknown as { error: string }).error).toContain("不能为空"); + }); + }); + + test("列表查询（分页和关键字）", () => { + withDb((db) => { + createProvider(db, { apiKey: "sk-1", baseUrl: "https://a.com", name: "Alpha", type: "openai" }); + createProvider(db, { apiKey: "sk-2", baseUrl: "https://b.com", name: "Beta", type: "anthropic" }); + createProvider(db, { apiKey: "sk-3", baseUrl: "https://c.com", name: "Gamma", type: "openai-compatible" }); + + const result1 = listProviders(db, { page: 1, pageSize: 20 }); + expect(result1.total).toBe(3); + + const result2 = listProviders(db, { keyword: "Alpha", page: 1, pageSize: 20 }); + expect(result2.total).toBe(1); + expect(result2.items[0]!.name).toBe("Alpha"); + + const result3 = listProviders(db, { page: 1, pageSize: 2 }); + expect(result3.items.length).toBe(2); + }); + }); + + test("获取供应商详情", () => { + withDb((db) => { + const created = createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: "详情", type: "openai" }); + const id = (created as { provider: { id: string } }).provider.id; + + const result = getProvider(db, id); + expect("error" in result).toBe(false); + expect((result as { provider: { name: string } }).provider.name).toBe("详情"); + }); + }); + + test("获取不存在的供应商返回 404", () => { + withDb((db) => { + const result = getProvider(db, "nonexistent"); + expect("error" in result).toBe(true); + expect((result as unknown as { status: number }).status).toBe(404); + }); + }); + + test("更新供应商", () => { + withDb((db) => { + const created = createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: "原名", type: "openai" }); + const id = (created as { provider: { id: string } }).provider.id; + + const result = updateProvider(db, id, { name: "新名" }); + expect("error" in result).toBe(false); + expect((result as { provider: { name: string } }).provider.name).toBe("新名"); + }); + }); + + test("更新供应商名称重复失败", () => { + withDb((db) => { + createProvider(db, { apiKey: "sk-1", baseUrl: "https://a.com", name: "已存在", type: "openai" }); + const created = createProvider(db, { apiKey: "sk-2", baseUrl: "https://b.com", name: "原名", type: "openai" }); + const id = (created as { provider: { id: string } }).provider.id; + + const result = updateProvider(db, id, { name: "已存在" }); + expect("error" in result).toBe(true); + expect((result as unknown as { error: string }).error).toContain("已存在"); + }); + }); + + test("启用/禁用供应商", () => { + withDb((db) => { + const created = createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: "测试", type: "openai" }); + const id = (created as { provider: { id: string } }).provider.id; + + const disabled = disableProvider(db, id); + expect("error" in disabled).toBe(false); + expect((disabled as { provider: { enabled: boolean } }).provider.enabled).toBe(false); + + const enabled = enableProvider(db, id); + expect("error" in enabled).toBe(false); + expect((enabled as { provider: { enabled: boolean } }).provider.enabled).toBe(true); + }); + }); + + test("重复禁用失败", () => { + withDb((db) => { + const created = createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: "测试", type: "openai" }); + const id = (created as { provider: { id: string } }).provider.id; + disableProvider(db, id); + + const result = disableProvider(db, id); + expect("error" in result).toBe(true); + expect((result as unknown as { status: number }).status).toBe(409); + }); + }); + + test("重复启用失败", () => { + withDb((db) => { + const created = createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: "测试", type: "openai" }); + const id = (created as { provider: { id: string } }).provider.id; + + const result = enableProvider(db, id); + expect("error" in result).toBe(true); + expect((result as unknown as { status: number }).status).toBe(409); + }); + }); + + test("删除供应商", () => { + withDb((db) => { + const created = createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: "删除测试", type: "openai" }); + const id = (created as { provider: { id: string } }).provider.id; + + const result = deleteProvider(db, id); + expect("error" in result).toBe(false); + + const after = getProvider(db, id); + expect("error" in after).toBe(true); + }); + }); + + test("删除不存在的供应商返回 404", () => { + withDb((db) => { + const result = deleteProvider(db, "nonexistent"); + expect("error" in result).toBe(true); + expect((result as unknown as { status: number }).status).toBe(404); + }); + }); + + test("默认类型为 openai-compatible", () => { + withDb((db) => { + createProvider(db, { apiKey: "sk", baseUrl: "https://a.com", name: "默认类型", type: "openai-compatible" }); + const result = createProvider(db, { + apiKey: "sk2", + baseUrl: "https://b.com", + name: "显式默认", + type: "openai-compatible", + }); + expect((result as { provider: { type: string } }).provider.type).toBe("openai-compatible"); + }); + }); +}); diff --git a/tests/server/routes/models.test.ts b/tests/server/routes/models.test.ts new file mode 100644 index 0000000..a302ec9 --- /dev/null +++ b/tests/server/routes/models.test.ts @@ -0,0 +1,222 @@ +import type Database from "bun:sqlite"; + +import { describe, expect, test } from "bun:test"; + +import type { Model, RuntimeMode } from "../../../src/shared/api"; + +import { createMigratedMemoryTestDatabase } from "../../helpers"; + +const MODE: RuntimeMode = "test"; + +async function createModelViaHandler(req: Request, db: Database): Promise { + const { handleCreateModel: h } = await import("../../../src/server/routes/models/create"); + return h(req, db, MODE); +} + +function createTestModel(db: Database, pName: string, providerId?: string): Model { + const pid = providerId ?? seedProvider(db); + const result = createModel(db, { + capabilities: ["text"], + modelId: pName.toLowerCase().replace(/[^a-z0-9-]/g, "-"), + name: pName, + providerId: pid, + }); + if ("error" in result) throw new Error(result.error); + return result.model; +} + +async function deleteModelViaHandler(req: Request, db: Database): Promise { + const { handleDeleteModel: h } = await import("../../../src/server/routes/models/delete"); + return h(req, db, MODE); +} + +async function disableModelViaHandler(req: Request, db: Database): Promise { + const { handleDisableModel: h } = await import("../../../src/server/routes/models/disable"); + return h(req, db, MODE); +} + +async function enableModelViaHandler(req: Request, db: Database): Promise { + const { handleEnableModel: h } = await import("../../../src/server/routes/models/enable"); + return h(req, db, MODE); +} + +async function getModelViaHandler(req: Request, db: Database): Promise { + const { handleGetModel: h } = await import("../../../src/server/routes/models/get"); + return h(req, db, MODE); +} + +async function listModelsViaHandler(req: Request, db: Database): Promise { + const { handleListModels: h } = await import("../../../src/server/routes/models/list"); + return h(req, db, MODE); +} + +import { createModel } from "../../../src/server/db/models"; +import { createProvider } from "../../../src/server/db/providers"; + +function seedProvider(db: Database, name?: string): string { + const result = createProvider(db, { + apiKey: "sk-test", + baseUrl: "https://api.test.com/v1", + name: name ?? "TestProvider", + type: "openai", + }); + if ("error" in result) throw new Error(result.error); + return result.provider.id; +} + +async function updateModelViaHandler(req: Request, db: Database): Promise { + const { handleUpdateModel: h } = await import("../../../src/server/routes/models/update"); + return h(req, db, MODE); +} + +async function withRouteDb(callback: (db: Database) => Promise): Promise { + const handle = createMigratedMemoryTestDatabase("route-model-test"); + try { + await callback(handle.db); + handle.close(); + } finally { + handle.cleanup(); + } +} + +describe("models API routes", () => { + test("POST /api/models create", async () => { + await withRouteDb(async (db) => { + const providerId = seedProvider(db); + + const req = new Request("http://localhost/api/models", { + body: JSON.stringify({ + capabilities: ["text", "reasoning"], + modelId: "gpt-4o", + name: "GPT-4o", + providerId, + }), + headers: { "Content-Type": "application/json" }, + method: "POST", + }); + const res = await createModelViaHandler(req, db); + expect(res.status).toBe(201); + const body = (await res.json()) as { model: Model }; + expect(body.model.name).toBe("GPT-4o"); + expect(body.model.modelId).toBe("gpt-4o"); + }); + }); + + test("GET /api/models list", async () => { + await withRouteDb(async (db) => { + const p1 = seedProvider(db, "ListP1"); + const p2 = seedProvider(db, "ListP2"); + createTestModel(db, "A-Model", p1); + createTestModel(db, "B-Model", p2); + + const req = new Request("http://localhost/api/models?page=1&pageSize=20"); + const res = await listModelsViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { items: Model[]; total: number }; + expect(body.total).toBe(2); + expect(body.items.length).toBe(2); + }); + }); + + test("GET /api/models filter by providerId", async () => { + await withRouteDb(async (db) => { + const p1 = seedProvider(db, "P1"); + const p2 = seedProvider(db, "P2"); + createTestModel(db, "M1", p1); + createTestModel(db, "M2", p2); + + const res = await listModelsViaHandler( + new Request("http://localhost/api/models?page=1&pageSize=20&providerId=" + p1), + db, + ); + expect(res.status).toBe(200); + const body = (await res.json()) as { items: Model[]; total: number }; + expect(body.total).toBe(1); + }); + }); + + test("GET /api/models/:id get detail", async () => { + await withRouteDb(async (db) => { + const model = createTestModel(db, "Detail"); + + const req = new Request("http://localhost/api/models/" + model.id); + const res = await getModelViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { model: Model }; + expect(body.model.name).toBe("Detail"); + }); + }); + + test("PATCH /api/models/:id update", async () => { + await withRouteDb(async (db) => { + const model = createTestModel(db, "OldName"); + + const req = new Request("http://localhost/api/models/" + model.id, { + body: JSON.stringify({ name: "Updated" }), + headers: { "Content-Type": "application/json" }, + method: "PATCH", + }); + const res = await updateModelViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { model: Model }; + expect(body.model.name).toBe("Updated"); + }); + }); + + test("POST /api/models/:id/enable", async () => { + await withRouteDb(async (db) => { + const model = createTestModel(db, "EnableTest"); + await disableModelViaHandler( + new Request("http://localhost/api/models/" + model.id + "/disable", { method: "POST" }), + db, + ); + + const req = new Request("http://localhost/api/models/" + model.id + "/enable", { method: "POST" }); + const res = await enableModelViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { model: Model }; + expect(body.model.enabled).toBe(true); + }); + }); + + test("POST /api/models/:id/disable", async () => { + await withRouteDb(async (db) => { + const model = createTestModel(db, "DisableTest"); + + const req = new Request("http://localhost/api/models/" + model.id + "/disable", { method: "POST" }); + const res = await disableModelViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { model: Model }; + expect(body.model.enabled).toBe(false); + }); + }); + + test("DELETE /api/models/:id", async () => { + await withRouteDb(async (db) => { + const model = createTestModel(db, "DeleteTest"); + + const req = new Request("http://localhost/api/models/" + model.id, { method: "DELETE" }); + const res = await deleteModelViaHandler(req, db); + expect(res.status).toBe(204); + }); + }); + + test("invalid capabilities returns 400", async () => { + await withRouteDb(async (db) => { + const providerId = seedProvider(db); + + const req = new Request("http://localhost/api/models", { + body: JSON.stringify({ + capabilities: ["invalid-cap"], + modelId: "test", + name: "Test", + providerId, + }), + headers: { "Content-Type": "application/json" }, + method: "POST", + }); + const res = await createModelViaHandler(req, db); + expect(res.status).toBe(400); + }); + }); +}); diff --git a/tests/server/routes/providers.test.ts b/tests/server/routes/providers.test.ts new file mode 100644 index 0000000..9760212 --- /dev/null +++ b/tests/server/routes/providers.test.ts @@ -0,0 +1,198 @@ +import type Database from "bun:sqlite"; + +import { describe, expect, test } from "bun:test"; + +import type { Provider, RuntimeMode } from "../../../src/shared/api"; + +import { createMigratedMemoryTestDatabase } from "../../helpers"; + +const MODE: RuntimeMode = "test"; + +async function createProviderViaHandler(req: Request, db: Database): Promise { + const { handleCreateProvider: h } = await import("../../../src/server/routes/providers/create"); + return h(req, db, MODE); +} + +function createTestProvider(db: Database, name = "测试供应商"): Provider { + const result = createProvider(db, { + apiKey: "sk-test", + baseUrl: "https://api.test.com/v1", + name, + type: "openai", + }); + if ("error" in result) throw new Error(result.error); + return result.provider; +} + +async function deleteProviderViaHandler(req: Request, db: Database): Promise { + const { handleDeleteProvider: h } = await import("../../../src/server/routes/providers/delete"); + return h(req, db, MODE); +} + +async function disableProviderViaHandler(req: Request, db: Database): Promise { + const { handleDisableProvider: h } = await import("../../../src/server/routes/providers/disable"); + return h(req, db, MODE); +} + +async function enableProviderViaHandler(req: Request, db: Database): Promise { + const { handleEnableProvider: h } = await import("../../../src/server/routes/providers/enable"); + return h(req, db, MODE); +} + +async function getProviderViaHandler(req: Request, db: Database): Promise { + const { handleGetProvider: h } = await import("../../../src/server/routes/providers/get"); + return h(req, db, MODE); +} + +async function listProvidersViaHandler(req: Request, db: Database): Promise { + const { handleListProviders: h } = await import("../../../src/server/routes/providers/list"); + return h(req, db, MODE); +} + +import { createProvider } from "../../../src/server/db/providers"; + +async function updateProviderViaHandler(req: Request, db: Database): Promise { + const { handleUpdateProvider: h } = await import("../../../src/server/routes/providers/update"); + return h(req, db, MODE); +} + +async function withRouteDb(callback: (db: Database) => Promise): Promise { + const handle = createMigratedMemoryTestDatabase("route-provider-test"); + try { + await callback(handle.db); + handle.close(); + } finally { + handle.cleanup(); + } +} + +describe("供应商 API 路由", () => { + test("POST /api/providers 创建供应商", async () => { + await withRouteDb(async (db) => { + const req = new Request("http://localhost/api/providers", { + body: JSON.stringify({ + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + name: "OpenAI", + type: "openai", + }), + headers: { "Content-Type": "application/json" }, + method: "POST", + }); + const res = await createProviderViaHandler(req, db); + expect(res.status).toBe(201); + const body = (await res.json()) as { provider: Provider }; + expect(body.provider.name).toBe("OpenAI"); + expect(body.provider.type).toBe("openai"); + }); + }); + + test("GET /api/providers 列表查询", async () => { + await withRouteDb(async (db) => { + createTestProvider(db, "A供应商"); + createTestProvider(db, "B供应商"); + + const req = new Request("http://localhost/api/providers?page=1&pageSize=20"); + const res = await listProvidersViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { items: Provider[]; total: number }; + expect(body.total).toBe(2); + expect(body.items.length).toBe(2); + }); + }); + + test("GET /api/providers/:id 获取详情", async () => { + await withRouteDb(async (db) => { + const provider = createTestProvider(db, "详情路由"); + + const req = new Request(`http://localhost/api/providers/${provider.id}`); + const res = await getProviderViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { provider: Provider }; + expect(body.provider.name).toBe("详情路由"); + }); + }); + + test("PATCH /api/providers/:id 更新供应商", async () => { + await withRouteDb(async (db) => { + const provider = createTestProvider(db, "更新路由"); + + const req = new Request(`http://localhost/api/providers/${provider.id}`, { + body: JSON.stringify({ name: "已更新" }), + headers: { "Content-Type": "application/json" }, + method: "PATCH", + }); + const res = await updateProviderViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { provider: Provider }; + expect(body.provider.name).toBe("已更新"); + }); + }); + + test("POST /api/providers/:id/enable 启用", async () => { + await withRouteDb(async (db) => { + const provider = createTestProvider(db, "启用测试"); + await disableProviderViaHandler( + new Request(`http://localhost/api/providers/${provider.id}/disable`, { method: "POST" }), + db, + ); + + const req = new Request(`http://localhost/api/providers/${provider.id}/enable`, { method: "POST" }); + const res = await enableProviderViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { provider: Provider }; + expect(body.provider.enabled).toBe(true); + }); + }); + + test("POST /api/providers/:id/disable 禁用", async () => { + await withRouteDb(async (db) => { + const provider = createTestProvider(db, "禁用测试"); + + const req = new Request(`http://localhost/api/providers/${provider.id}/disable`, { method: "POST" }); + const res = await disableProviderViaHandler(req, db); + expect(res.status).toBe(200); + const body = (await res.json()) as { provider: Provider }; + expect(body.provider.enabled).toBe(false); + }); + }); + + test("DELETE /api/providers/:id 删除供应商", async () => { + await withRouteDb(async (db) => { + const provider = createTestProvider(db, "删除路由"); + + const req = new Request(`http://localhost/api/providers/${provider.id}`, { method: "DELETE" }); + const res = await deleteProviderViaHandler(req, db); + expect(res.status).toBe(204); + }); + }); + + test("创建同名供应商返回 409", async () => { + await withRouteDb(async (db) => { + const req1 = new Request("http://localhost/api/providers", { + body: JSON.stringify({ + apiKey: "sk-a", + baseUrl: "https://a.com", + name: "重复名", + type: "openai", + }), + headers: { "Content-Type": "application/json" }, + method: "POST", + }); + await createProviderViaHandler(req1, db); + + const req2 = new Request("http://localhost/api/providers", { + body: JSON.stringify({ + apiKey: "sk-b", + baseUrl: "https://b.com", + name: "重复名", + type: "openai", + }), + headers: { "Content-Type": "application/json" }, + method: "POST", + }); + const res = await createProviderViaHandler(req2, db); + expect(res.status).toBe(409); + }); + }); +}); diff --git a/tests/web/components/ModelTable.test.tsx b/tests/web/components/ModelTable.test.tsx new file mode 100644 index 0000000..24fa0d1 --- /dev/null +++ b/tests/web/components/ModelTable.test.tsx @@ -0,0 +1,115 @@ +import { fireEvent, screen, waitFor } from "@testing-library/react"; +import { describe, expect, mock, test } from "bun:test"; +import { createElement } from "react"; + +import type { Model, Provider } from "../../../src/shared/api"; + +import { ModelTable } from "../../../src/web/pages/models/components/ModelTable"; +import { renderWithProviders } from "../test-utils"; + +const ENABLED_PROVIDER: Provider = { + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + createdAt: "2024-01-01T00:00:00.000Z", + enabled: true, + id: "pv1", + name: "OpenAI", + type: "openai", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +const DISABLED_PROVIDER: Provider = { + apiKey: "sk-off", + baseUrl: "https://api.deepseek.com/v1", + createdAt: "2024-01-01T00:00:00.000Z", + enabled: false, + id: "pv2", + name: "DeepSeek", + type: "openai-compatible", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +const ENABLED_MODEL: Model = { + capabilities: ["text", "reasoning"], + contextLength: 128000, + createdAt: "2024-01-01T00:00:00.000Z", + enabled: true, + id: "m1", + maxOutputTokens: 4096, + modelId: "gpt-4o", + name: "GPT-4o", + providerId: "pv1", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +const DISABLED_MODEL: Model = { + capabilities: ["text"], + contextLength: null, + createdAt: "2024-01-01T00:00:00.000Z", + enabled: false, + id: "m2", + maxOutputTokens: null, + modelId: "deepseek-chat", + name: "DeepSeek Chat", + providerId: "pv2", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +function clickLatestConfirmButton() { + const buttons = screen.getAllByRole("button", { name: /OK|确定/ }); + fireEvent.click(buttons[buttons.length - 1]!); +} + +describe("ModelTable", () => { + test("渲染模型表格数据", () => { + renderWithProviders( + createElement(ModelTable, { + data: { items: [ENABLED_MODEL, DISABLED_MODEL], page: 1, pageSize: 20, total: 2 }, + loading: false, + onDelete: () => Promise.resolve(), + onDisable: () => Promise.resolve(), + onEdit: () => undefined, + onEnable: () => Promise.resolve(), + onPageChange: () => undefined, + page: 1, + pageSize: 20, + providers: [ENABLED_PROVIDER, DISABLED_PROVIDER], + }), + ); + + expect(screen.getByText("GPT-4o")).not.toBeNull(); + expect(screen.getByText("gpt-4o")).not.toBeNull(); + expect(screen.getByText("DeepSeek Chat")).not.toBeNull(); + }); + + test("模型表格操作触发 enable/disable/delete", async () => { + const onDisable = mock(() => Promise.resolve()); + const onEnable = mock(() => Promise.resolve()); + const onDelete = mock(() => Promise.resolve()); + + renderWithProviders( + createElement(ModelTable, { + data: { items: [ENABLED_MODEL, DISABLED_MODEL], page: 1, pageSize: 20, total: 2 }, + loading: false, + onDelete, + onDisable, + onEdit: () => undefined, + onEnable, + onPageChange: () => undefined, + page: 1, + pageSize: 20, + providers: [ENABLED_PROVIDER, DISABLED_PROVIDER], + }), + ); + + const disableButtons = screen.getAllByRole("button", { name: /禁用/ }); + fireEvent.click(disableButtons[0]!); + await waitFor(() => expect(screen.getByText("确认禁用此模型？")).not.toBeNull()); + clickLatestConfirmButton(); + await waitFor(() => expect(onDisable).toHaveBeenCalledWith("m1")); + + const enableButtons = screen.getAllByRole("button", { name: /启用/ }); + fireEvent.click(enableButtons[0]!); + await waitFor(() => expect(onEnable).toHaveBeenCalledWith("m2")); + }); +}); diff --git a/tests/web/components/ProviderTable.test.tsx b/tests/web/components/ProviderTable.test.tsx new file mode 100644 index 0000000..68155cb --- /dev/null +++ b/tests/web/components/ProviderTable.test.tsx @@ -0,0 +1,89 @@ +import { fireEvent, screen, waitFor } from "@testing-library/react"; +import { describe, expect, mock, test } from "bun:test"; +import { createElement } from "react"; + +import type { Provider } from "../../../src/shared/api"; + +import { ProviderTable } from "../../../src/web/pages/models/components/ProviderTable"; +import { renderWithProviders } from "../test-utils"; + +const ENABLED_PROVIDER: Provider = { + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + createdAt: "2024-01-01T00:00:00.000Z", + enabled: true, + id: "pv1", + name: "OpenAI", + type: "openai", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +const DISABLED_PROVIDER: Provider = { + apiKey: "sk-off", + baseUrl: "https://api.deepseek.com/v1", + createdAt: "2024-01-01T00:00:00.000Z", + enabled: false, + id: "pv2", + name: "DeepSeek", + type: "openai-compatible", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +function clickLatestConfirmButton() { + const buttons = screen.getAllByRole("button", { name: /OK|确定/ }); + fireEvent.click(buttons[buttons.length - 1]!); +} + +describe("ProviderTable", () => { + test("渲染供应商表格数据", () => { + renderWithProviders( + createElement(ProviderTable, { + data: { items: [ENABLED_PROVIDER, DISABLED_PROVIDER], page: 1, pageSize: 20, total: 2 }, + loading: false, + onDelete: () => Promise.resolve(), + onDisable: () => Promise.resolve(), + onEdit: () => undefined, + onEnable: () => Promise.resolve(), + onPageChange: () => undefined, + onTest: () => Promise.resolve({ message: "ok", ok: true }), + page: 1, + pageSize: 20, + }), + ); + + expect(screen.getAllByText("OpenAI").length).toBeGreaterThan(0); + expect(screen.getByText("DeepSeek")).not.toBeNull(); + expect(screen.getByText("https://api.openai.com/v1")).not.toBeNull(); + }); + + test("供应商表格操作触发 enable/disable/delete", async () => { + const onDisable = mock(() => Promise.resolve()); + const onEnable = mock(() => Promise.resolve()); + const onDelete = mock(() => Promise.resolve()); + + renderWithProviders( + createElement(ProviderTable, { + data: { items: [ENABLED_PROVIDER, DISABLED_PROVIDER], page: 1, pageSize: 20, total: 2 }, + loading: false, + onDelete, + onDisable, + onEdit: () => undefined, + onEnable, + onPageChange: () => undefined, + onTest: () => Promise.resolve({ message: "ok", ok: true }), + page: 1, + pageSize: 20, + }), + ); + + const disableButtons = screen.getAllByRole("button", { name: /禁用/ }); + fireEvent.click(disableButtons[0]!); + await waitFor(() => expect(screen.getByText("确认禁用此供应商？")).not.toBeNull()); + clickLatestConfirmButton(); + await waitFor(() => expect(onDisable).toHaveBeenCalledWith("pv1")); + + const enableButtons = screen.getAllByRole("button", { name: /启用/ }); + fireEvent.click(enableButtons[0]!); + await waitFor(() => expect(onEnable).toHaveBeenCalledWith("pv2")); + }); +}); diff --git a/tests/web/hooks/use-models.test.ts b/tests/web/hooks/use-models.test.ts new file mode 100644 index 0000000..fd885ec --- /dev/null +++ b/tests/web/hooks/use-models.test.ts @@ -0,0 +1,105 @@ +import { describe, expect, test } from "bun:test"; + +import { + createModel, + deleteModel, + disableModel, + enableModel, + fetchModel, + fetchModelList, + updateModel, +} from "../../../src/web/hooks/use-models"; +import { installFetchMock, jsonResponse } from "../test-utils"; + +const MODEL = { + capabilities: ["text"] as Array<"text">, + contextLength: null, + createdAt: "2024-01-01T00:00:00.000Z", + enabled: true, + id: "m1", + maxOutputTokens: null, + modelId: "gpt-4o", + name: "GPT-4o", + providerId: "pv1", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +async function expectRejectsWithMessage(action: () => Promise, message: string) { + try { + await action(); + throw new Error("expected rejection"); + } catch (error) { + expect(error).toBeInstanceOf(Error); + expect((error as Error).message).toBe(message); + } +} + +function jsonBody(body: BodyInit | null | undefined): unknown { + return JSON.parse(typeof body === "string" ? body : "{}"); +} + +describe("use-models request helpers", () => { + test("fetchModelList 按协议拼接 query 参数（含 providerId）", async () => { + const calls = installFetchMock(() => jsonResponse({ items: [MODEL], page: 1, pageSize: 20, total: 1 })); + + const result = await fetchModelList({ keyword: "GPT", page: 1, pageSize: 20, providerId: "pv1" }); + + expect(result.items).toHaveLength(1); + expect(calls[0]?.method).toBe("GET"); + expect(calls[0]?.url).toContain("providerId=pv1"); + expect(calls[0]?.url).toContain("keyword=GPT"); + }); + + test("模型 CRUD 与 enable/disable 使用正确 method、URL 与 body", async () => { + const calls = installFetchMock((call) => { + if (call.method === "DELETE") return new Response(null, { status: 204 }); + return jsonResponse( + { model: MODEL }, + { status: call.method === "POST" && call.url === "/api/models" ? 201 : 200 }, + ); + }); + + await createModel({ + capabilities: ["text"], + modelId: "gpt-4o", + name: "GPT-4o", + providerId: "pv1", + }); + await updateModel("m1", { name: "GPT-4o Mini" }); + await enableModel("m1"); + await disableModel("m1"); + await deleteModel("m1"); + await fetchModel("m1"); + + expect(calls.map((call) => `${call.method} ${call.url}`)).toEqual([ + "POST /api/models", + "PATCH /api/models/m1", + "POST /api/models/m1/enable", + "POST /api/models/m1/disable", + "DELETE /api/models/m1", + "GET /api/models/m1", + ]); + expect(jsonBody(calls[0]?.body)).toEqual({ + capabilities: ["text"], + modelId: "gpt-4o", + name: "GPT-4o", + providerId: "pv1", + }); + expect(jsonBody(calls[1]?.body)).toEqual({ name: "GPT-4o Mini" }); + }); + + test("错误响应优先使用后端 error 字段", async () => { + installFetchMock(() => jsonResponse({ error: "模型名称已存在" }, { status: 409 })); + + await expectRejectsWithMessage( + () => createModel({ capabilities: ["text"], modelId: "gpt-4o", name: "重复", providerId: "pv1" }), + "模型名称已存在", + ); + }); + + test("非 JSON 错误响应回退到 HTTP 状态", async () => { + installFetchMock(() => new Response("broken", { status: 500 })); + + await expectRejectsWithMessage(() => fetchModel("m-missing"), "HTTP 500"); + }); +}); diff --git a/tests/web/hooks/use-providers.test.ts b/tests/web/hooks/use-providers.test.ts new file mode 100644 index 0000000..454ad1e --- /dev/null +++ b/tests/web/hooks/use-providers.test.ts @@ -0,0 +1,106 @@ +import { describe, expect, test } from "bun:test"; + +import { + createProvider, + deleteProvider, + disableProvider, + enableProvider, + fetchProvider, + fetchProviderList, + testProviderConnection, + updateProvider, +} from "../../../src/web/hooks/use-providers"; +import { installFetchMock, jsonResponse } from "../test-utils"; + +const PROVIDER = { + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + createdAt: "2024-01-01T00:00:00.000Z", + enabled: true, + id: "pv1", + name: "OpenAI", + type: "openai" as const, + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +async function expectRejectsWithMessage(action: () => Promise, message: string) { + try { + await action(); + throw new Error("expected rejection"); + } catch (error) { + expect(error).toBeInstanceOf(Error); + expect((error as Error).message).toBe(message); + } +} + +function jsonBody(body: BodyInit | null | undefined): unknown { + return JSON.parse(typeof body === "string" ? body : "{}"); +} + +describe("use-providers request helpers", () => { + test("fetchProviderList builds correct query params", async () => { + const calls = installFetchMock(() => jsonResponse({ items: [PROVIDER], page: 1, pageSize: 20, total: 1 })); + + const result = await fetchProviderList({ keyword: "OpenAI", page: 1, pageSize: 20 }); + + expect(result.items).toHaveLength(1); + expect(calls[0]?.method).toBe("GET"); + expect(calls[0]?.url).toBe("/api/providers?page=1&pageSize=20&keyword=OpenAI"); + }); + + test("CRUD and enable/disable use correct method, URL and body", async () => { + const calls = installFetchMock((call) => { + if (call.method === "DELETE") return new Response(null, { status: 204 }); + return jsonResponse( + { provider: PROVIDER }, + { status: call.method === "POST" && call.url === "/api/providers" ? 201 : 200 }, + ); + }); + + await createProvider({ apiKey: "sk-test", baseUrl: "https://api.openai.com/v1", name: "OpenAI", type: "openai" }); + await updateProvider("pv1", { name: "New OpenAI" }); + await enableProvider("pv1"); + await disableProvider("pv1"); + await deleteProvider("pv1"); + await fetchProvider("pv1"); + + expect(calls.map((c) => c.method + " " + c.url)).toEqual([ + "POST /api/providers", + "PATCH /api/providers/pv1", + "POST /api/providers/pv1/enable", + "POST /api/providers/pv1/disable", + "DELETE /api/providers/pv1", + "GET /api/providers/pv1", + ]); + expect(jsonBody(calls[0]?.body)).toEqual({ + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + name: "OpenAI", + type: "openai", + }); + expect(jsonBody(calls[1]?.body)).toEqual({ name: "New OpenAI" }); + }); + + test("testProviderConnection uses correct URL and parses response", async () => { + installFetchMock(() => jsonResponse({ providerTestResponse: { message: "ok", ok: true } })); + + const result = await testProviderConnection("pv1"); + + expect(result).toEqual({ message: "ok", ok: true }); + }); + + test("error response uses backend error field", async () => { + installFetchMock(() => jsonResponse({ error: "dup" }, { status: 409 })); + + await expectRejectsWithMessage( + () => createProvider({ apiKey: "sk", baseUrl: "https://x.com", name: "dup", type: "openai-compatible" }), + "dup", + ); + }); + + test("non-JSON error falls back to HTTP status", async () => { + installFetchMock(() => new Response("broken", { status: 500 })); + + await expectRejectsWithMessage(() => fetchProvider("missing"), "HTTP 500"); + }); +}); diff --git a/tests/web/routes/models.test.tsx b/tests/web/routes/models.test.tsx new file mode 100644 index 0000000..790a536 --- /dev/null +++ b/tests/web/routes/models.test.tsx @@ -0,0 +1,127 @@ +import { fireEvent, screen, waitFor } from "@testing-library/react"; +import { describe, expect, mock, test } from "bun:test"; +import { createElement } from "react"; + +import type { Model, Provider } from "../../../src/shared/api"; + +import { ModelFormModal } from "../../../src/web/pages/models/components/ModelFormModal"; +import { ProviderFormModal } from "../../../src/web/pages/models/components/ProviderFormModal"; +import { renderWithProviders } from "../test-utils"; + +const ENABLED_PROVIDER: Provider = { + apiKey: "sk-test", + baseUrl: "https://api.openai.com/v1", + createdAt: "2024-01-01T00:00:00.000Z", + enabled: true, + id: "pv1", + name: "OpenAI", + type: "openai", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +const DISABLED_PROVIDER: Provider = { + apiKey: "sk-off", + baseUrl: "https://api.deepseek.com/v1", + createdAt: "2024-01-01T00:00:00.000Z", + enabled: false, + id: "pv2", + name: "DeepSeek", + type: "openai-compatible", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +const ENABLED_MODEL: Model = { + capabilities: ["text", "reasoning"], + contextLength: 128000, + createdAt: "2024-01-01T00:00:00.000Z", + enabled: true, + id: "m1", + maxOutputTokens: 4096, + modelId: "gpt-4o", + name: "GPT-4o", + providerId: "pv1", + updatedAt: "2024-01-01T00:00:00.000Z", +}; + +function clickLatestConfirmButton() { + const buttons = screen.getAllByRole("button", { name: /OK|确\s*定/ }); + fireEvent.click(buttons[buttons.length - 1]!); +} + +describe("ProviderFormModal", () => { + test("编辑供应商表单只提交变更字段", async () => { + const updateCalls: unknown[] = []; + + renderWithProviders( + createElement(ProviderFormModal, { + editingProvider: ENABLED_PROVIDER, + onCancel: () => undefined, + onCreate: () => Promise.resolve(), + onOpenChange: () => undefined, + onUpdate: (args: unknown) => { + updateCalls.push(args); + return Promise.resolve(); + }, + open: true, + submitting: false, + }), + ); + + await waitFor(() => expect(screen.getByPlaceholderText("请输入供应商名称")).not.toBeNull()); + fireEvent.change(screen.getByPlaceholderText("请输入供应商名称"), { target: { value: "New OpenAI" } }); + clickLatestConfirmButton(); + + await waitFor(() => expect(updateCalls.length).toBe(1)); + expect(updateCalls[0]).toEqual({ data: { name: "New OpenAI" }, id: "pv1" }); + }); +}); + +describe("ModelFormModal", () => { + test("编辑模型表单只提交变更字段", async () => { + const updateCalls: unknown[] = []; + + renderWithProviders( + createElement(ModelFormModal, { + editingModel: ENABLED_MODEL, + onCancel: () => undefined, + onCreate: () => Promise.resolve(), + onOpenChange: () => undefined, + onUpdate: (args: unknown) => { + updateCalls.push(args); + return Promise.resolve(); + }, + open: true, + providers: [ENABLED_PROVIDER, DISABLED_PROVIDER], + submitting: false, + }), + ); + + await waitFor(() => expect(screen.getByPlaceholderText("请输入模型名称")).not.toBeNull()); + fireEvent.change(screen.getByPlaceholderText("请输入模型名称"), { target: { value: "GPT-4o Mini" } }); + clickLatestConfirmButton(); + + await waitFor(() => expect(updateCalls.length).toBe(1)); + expect(updateCalls[0]).toEqual({ data: { name: "GPT-4o Mini" }, id: "m1" }); + }); + + test("模型表单校验失败不会提交", async () => { + const onCreate = mock(() => Promise.resolve()); + + renderWithProviders( + createElement(ModelFormModal, { + editingModel: null, + onCancel: () => undefined, + onCreate, + onOpenChange: () => undefined, + onUpdate: () => Promise.resolve(), + open: true, + providers: [ENABLED_PROVIDER], + submitting: false, + }), + ); + + await waitFor(() => expect(screen.getByPlaceholderText("请输入模型名称")).not.toBeNull()); + clickLatestConfirmButton(); + expect(onCreate).not.toHaveBeenCalled(); + }); +});