@vibe-forge/client 0.7.4 → 0.8.0

package/src/hooks/use-app-preferences.ts

@@ -4,18 +4,28 @@ import { useEffect, useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import useSWR from 'swr'
 
-import type { ConfigResponse } from '@vibe-forge/core'
+import type { ConfigResponse } from '@vibe-forge/types'
 
 import { getConfig } from '#~/api'
 import { themeAtom } from '#~/store'
 
-export function useAppPreferences() {
+interface AppPreferences {
+  isDarkMode: boolean
+  themeConfig: {
+    algorithm: typeof theme.darkAlgorithm | typeof theme.defaultAlgorithm
+    token: {
+      colorPrimary: string
+    }
+  }
+}
+
+export function useAppPreferences(): AppPreferences {
   const { i18n } = useTranslation()
   const themeMode = useAtomValue(themeAtom)
   const { data: configRes } = useSWR<ConfigResponse>('/api/config', getConfig)
   const interfaceLanguage = configRes?.sources?.merged?.general?.interfaceLanguage
-  const isDarkMode = themeMode === 'dark'
-    || (themeMode === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches)
+  const isDarkMode = themeMode === 'dark' ||
+    (themeMode === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches)
 
   useEffect(() => {
     document.documentElement.classList.toggle('dark', isDarkMode)

package/src/hooks/use-session-subscription.ts

@@ -8,7 +8,15 @@ import { createSocket } from '#~/ws.js'
 interface SessionListResponse {
   sessions: Session[]
 }
-type SessionUpdate = Session | { id: string; isDeleted: boolean }
+interface DeletedSessionUpdate {
+  id: string
+  isDeleted: boolean
+}
+type SessionUpdate = Session | DeletedSessionUpdate
+
+const isDeletedSessionUpdate = (update: SessionUpdate): update is DeletedSessionUpdate => {
+  return 'isDeleted' in update && update.isDeleted
+}
 
 const sortSessions = (sessions: Session[]) => {
   return [...sessions].sort((a, b) => {
@@ -25,16 +33,17 @@ const mergeSessionList = (
 ) => {
   if (prev?.sessions == null) return prev
 
-  if ('isDeleted' in updatedSession && updatedSession.isDeleted) {
+  if (isDeletedSessionUpdate(updatedSession)) {
     return {
       ...prev,
       sessions: prev.sessions.filter((session) => session.id !== updatedSession.id)
     }
   }
 
+  const session = updatedSession
   const shouldInclude = filter === 'archived'
-    ? updatedSession.isArchived === true
-    : updatedSession.isArchived !== true
+    ? session.isArchived === true
+    : session.isArchived !== true
   const existing = prev.sessions.find((session) => session.id === updatedSession.id)
 
   if (!shouldInclude) {
@@ -45,8 +54,10 @@ const mergeSessionList = (
   }
 
   const nextSessions = existing
-    ? prev.sessions.map((session) => session.id === updatedSession.id ? { ...session, ...updatedSession } : session)
-    : [updatedSession, ...prev.sessions]
+    ? prev.sessions.map((currentSession) =>
+      currentSession.id === updatedSession.id ? { ...currentSession, ...session } : currentSession
+    )
+    : [session, ...prev.sessions]
 
   return {
     ...prev,

package/src/hooks/useQueryParams.ts

@@ -1,10 +1,12 @@
 import { useCallback, useMemo } from 'react'
 import { useSearchParams } from 'react-router-dom'
 
-type QueryParamConfig<T extends Record<string, string>> = {
-  keys: Array<keyof T & string>
+type QueryParamKey<T> = Extract<keyof T, string>
+
+interface QueryParamConfig<T extends Record<string, string>> {
+  keys: QueryParamKey<T>[]
   defaults?: Partial<T>
-  omit?: Partial<Record<keyof T & string, (value: string) => boolean>>
+  omit?: Partial<Record<QueryParamKey<T>, (value: string) => boolean>>
 }
 
 export const useQueryParams = <T extends Record<string, string>>({
@@ -13,13 +15,13 @@ export const useQueryParams = <T extends Record<string, string>>({
   omit
 }: QueryParamConfig<T>) => {
   const [searchParams, setSearchParams] = useSearchParams()
-  const keySet = useMemo(() => new Set(keys), [keys])
+  const keySet = useMemo(() => new Set<string>(keys), [keys])
 
   const values = useMemo(() => {
     return keys.reduce((acc, key) => {
       const raw = searchParams.get(key)
       const fallback = defaults?.[key] ?? ''
-      acc[key] = (raw ?? fallback) as T[keyof T]
+      acc[key] = (raw ?? fallback) as T[QueryParamKey<T>]
       return acc
     }, {} as T)
   }, [defaults, keys, searchParams])
@@ -29,7 +31,7 @@ export const useQueryParams = <T extends Record<string, string>>({
     const merged = keys.reduce((acc, key) => {
       const raw = searchParams.get(key)
       const fallback = defaults?.[key] ?? ''
-      acc[key] = (raw ?? fallback) as T[keyof T]
+      acc[key] = (raw ?? fallback) as T[QueryParamKey<T>]
       return acc
     }, {} as T)
 

package/src/resources/adapters.ts

@@ -1,6 +1,12 @@
-import { adapterDisplayName as claudeCodeDisplayName, adapterIcon as claudeCodeIcon } from '@vibe-forge/adapter-claude-code/icon'
+import {
+  adapterDisplayName as claudeCodeDisplayName,
+  adapterIcon as claudeCodeIcon
+} from '@vibe-forge/adapter-claude-code/icon'
 import { adapterDisplayName as codexDisplayName, adapterIcon as codexIcon } from '@vibe-forge/adapter-codex/icon'
-import { adapterDisplayName as opencodeDisplayName, adapterIcon as opencodeIcon } from '@vibe-forge/adapter-opencode/icon'
+import {
+  adapterDisplayName as opencodeDisplayName,
+  adapterIcon as opencodeIcon
+} from '@vibe-forge/adapter-opencode/icon'
 
 export const adapterDisplayMap = {
   'claude-code': {

package/src/resources/locales/en.json

@@ -313,6 +313,11 @@
     "assetWarningsTitle": "Compatibility notes",
     "assetWarningsCount": "{{count}} asset warnings",
     "assetWarningsMore": "+{{count}} more",
+    "selectionWarningsTitle": "Model routing warnings",
+    "selectionWarningsCount": "{{count}} model warnings",
+    "selectionWarningReasonExcluded": "the model is excluded by adapter rules",
+    "selectionWarningReasonNotIncluded": "the model is not included by adapter rules",
+    "selectionWarningFallback": "Adapter {{adapter}} switched from {{requestedModel}} to {{resolvedModel}} because {{reason}}.",
     "imageTooLarge": "Image must be smaller than 5MB",
     "imageReadFailed": "Failed to read image",
     "imageNotSupportedInInteraction": "Images are not supported for this interaction",
@@ -470,6 +475,7 @@
       "addEnvVar": "Add Environment Variable",
       "addHeader": "Add Header",
       "addEntry": "Add Entry",
+      "newModelSelectorName": "New model selector",
       "shortcutPlaceholder": "Press shortcut",
       "clearShortcut": "Clear shortcut",
       "newModelServiceName": "New model service name",
@@ -661,6 +667,12 @@
           "desc": "Additional guidance for the assistant"
         }
       },
+      "models": {
+        "items": {
+          "label": "Model Selector Entries",
+          "desc": "Selector metadata keyed by `service` or `service,model`"
+        }
+      },
       "modelServices": {
         "items": {
           "label": "Service Entries",
@@ -708,7 +720,7 @@
       "adapters": {
         "items": {
           "label": "Adapter Entries",
-          "desc": "Flattened configuration by adapter name"
+          "desc": "Flattened configuration by adapter name. Common fields include `defaultModel`, `includeModels`, and `excludeModels`."
         }
       },
       "plugins": {
@@ -835,6 +847,7 @@
     "sections": {
       "general": "General",
       "conversation": "Conversation",
+      "models": "Models",
       "modelServices": "Model Services",
       "channels": "Channels",
       "adapters": "Adapters",

package/src/resources/locales/zh.json

@@ -314,6 +314,11 @@
     "assetWarningsTitle": "兼容性提示",
     "assetWarningsCount": "{{count}} 个资产告警",
     "assetWarningsMore": "还有 {{count}} 条",
+    "selectionWarningsTitle": "模型路由提示",
+    "selectionWarningsCount": "{{count}} 个模型告警",
+    "selectionWarningReasonExcluded": "该模型被适配器规则排除了",
+    "selectionWarningReasonNotIncluded": "该模型不在适配器允许列表中",
+    "selectionWarningFallback": "适配器 {{adapter}} 已将模型从 {{requestedModel}} 切换到 {{resolvedModel}}，原因：{{reason}}。",
     "imageTooLarge": "图片大小不能超过 5MB",
     "imageReadFailed": "图片读取失败",
     "imageNotSupportedInInteraction": "当前交互不支持图片",
@@ -471,6 +476,7 @@
       "addEnvVar": "添加环境变量",
       "addHeader": "添加请求头",
       "addEntry": "添加条目",
+      "newModelSelectorName": "新增模型选择器",
       "shortcutPlaceholder": "按下快捷键",
       "clearShortcut": "清除快捷键",
       "newModelServiceName": "新增模型服务名称",
@@ -662,6 +668,12 @@
           "desc": "为对话提供额外的提示与约束"
         }
       },
+      "models": {
+        "items": {
+          "label": "模型选择器明细",
+          "desc": "按 `service` 或 `service,model` 选择器配置元信息"
+        }
+      },
       "modelServices": {
         "items": {
           "label": "服务明细",
@@ -709,7 +721,7 @@
       "adapters": {
         "items": {
           "label": "适配器明细",
-          "desc": "按适配器名称平铺配置"
+          "desc": "按适配器名称平铺配置，公共字段包括 `defaultModel`、`includeModels` 和 `excludeModels`"
         }
       },
       "plugins": {
@@ -836,6 +848,7 @@
     "sections": {
       "general": "通用",
       "conversation": "会话",
+      "models": "模型选择器",
       "modelServices": "模型服务",
       "channels": "频道",
       "adapters": "适配器",

package/src/routes/ChatRoute.scss

@@ -59,7 +59,11 @@
   padding: 8px 14px;
   border: 1px solid rgba(59, 130, 246, .18);
   border-radius: 999px;
-  background: linear-gradient(135deg, rgba(239, 246, 255, .92), rgba(255, 255, 255, .96));
+  background: linear-gradient(
+    135deg,
+    rgba(239, 246, 255, .92),
+    rgba(255, 255, 255, .96)
+  );
   color: #2563eb;
   font-size: 13px;
   font-weight: 500;

package/src/runtime-config.ts

@@ -37,16 +37,20 @@ const normalizePath = (value?: string) => {
 
 export const getRuntimeEnv = (): RuntimeEnv => getGlobalRuntimeEnv() ?? {}
 
-export const getClientBase = () => normalizeBase(
-  getRuntimeEnv().__VF_PROJECT_AI_CLIENT_BASE__ ?? import.meta.env.__VF_PROJECT_AI_CLIENT_BASE__
-)
-
-export const getServerHostEnv = () => getRuntimeEnv().__VF_PROJECT_AI_SERVER_HOST__
-  ?? import.meta.env.__VF_PROJECT_AI_SERVER_HOST__
-
-export const getServerPortEnv = () => getRuntimeEnv().__VF_PROJECT_AI_SERVER_PORT__
-  ?? import.meta.env.__VF_PROJECT_AI_SERVER_PORT__
-
-export const getServerWsPath = () => normalizePath(
-  getRuntimeEnv().__VF_PROJECT_AI_SERVER_WS_PATH__ ?? import.meta.env.__VF_PROJECT_AI_SERVER_WS_PATH__
-)
+export const getClientBase = () =>
+  normalizeBase(
+    getRuntimeEnv().__VF_PROJECT_AI_CLIENT_BASE__ ?? import.meta.env.__VF_PROJECT_AI_CLIENT_BASE__
+  )
+
+export const getServerHostEnv = () =>
+  getRuntimeEnv().__VF_PROJECT_AI_SERVER_HOST__ ??
+    import.meta.env.__VF_PROJECT_AI_SERVER_HOST__
+
+export const getServerPortEnv = () =>
+  getRuntimeEnv().__VF_PROJECT_AI_SERVER_PORT__ ??
+    import.meta.env.__VF_PROJECT_AI_SERVER_PORT__
+
+export const getServerWsPath = () =>
+  normalizePath(
+    getRuntimeEnv().__VF_PROJECT_AI_SERVER_WS_PATH__ ?? import.meta.env.__VF_PROJECT_AI_SERVER_WS_PATH__
+  )

package/src/utils/shortcutUtils.ts

@@ -1,6 +1,6 @@
 import type { KeyboardEvent as ReactKeyboardEvent } from 'react'
 
-export type ShortcutSpec = {
+export interface ShortcutSpec {
   key: string
   metaKey: boolean
   ctrlKey: boolean

package/vite.config.ts

@@ -1,3 +1,4 @@
+import { fileURLToPath } from 'node:url'
 import process from 'node:process'
 
 import react from '@vitejs/plugin-react'
@@ -15,6 +16,10 @@ export default defineConfig({
   root: '.',
   base: clientBase,
   resolve: {
+    alias: {
+      '@vibe-forge/utils/model-selection': fileURLToPath(new URL('../../packages/utils/src/model-selection.ts', import.meta.url)),
+      '@vibe-forge/utils': fileURLToPath(new URL('../../packages/utils/src/index.ts', import.meta.url))
+    },
     conditions: ['browser', '__vibe-forge__', 'module', 'import', 'development']
   },
   server: {

package/dist/assets/channel-Hxo8SEEx.js

@@ -1 +0,0 @@
-import{al as o,am as n}from"./mermaid.core-H3QJi-7A.js";const l=(a,r)=>o.lang.round(n.parse(a)[r]);export{l as c};

package/dist/assets/clone-Dd_kUYh5.js

@@ -1 +0,0 @@
-import{a as r}from"./graph-BnzAin3i.js";var a=4;function n(o){return r(o,a)}export{n as c};

package/dist/assets/flowDiagram-v2-4f6560a1-CmztIxNZ.js

@@ -1 +0,0 @@
-import{f as o,p as e}from"./flowDb-c6c81e3f-CvND0Kz-.js";import{f as a,g as t}from"./styles-d45a18b0-BeG4Dd2L.js";import{ar as i}from"./mermaid.core-H3QJi-7A.js";import"./graph-BnzAin3i.js";import"./layout-PHWoi3a3.js";import"./index-Cw-fkktx.js";import"./index-5325376f-gU7GGRnq.js";import"./clone-Dd_kUYh5.js";import"./edges-96097737-63FzeZDk.js";import"./createText-1719965b-DGO5tdKk.js";import"./line-BJPgSD92.js";import"./array-BKyUJesY.js";import"./path-CbwjOpE9.js";import"./channel-Hxo8SEEx.js";const n={parser:e,db:o,renderer:t,styles:a,init:r=>{r.flowchart||(r.flowchart={}),r.flowchart.arrowMarkerAbsolute=r.arrowMarkerAbsolute,i({flowchart:{arrowMarkerAbsolute:r.arrowMarkerAbsolute}}),t.setConf(r.flowchart),o.clear(),o.setGen("gen-2")}};export{n as diagram};