@vibe-forge/client 0.8.4 → 0.10.0

package/src/hooks/chat/use-terminal-dock-visibility.ts

@@ -0,0 +1,39 @@
+import { useEffect, useState } from 'react'
+
+const TERMINAL_EXIT_ANIMATION_MS = 240
+
+export function useTerminalDockVisibility(isOpen: boolean) {
+  const [isRendered, setIsRendered] = useState(isOpen)
+  const [isVisible, setIsVisible] = useState(isOpen)
+
+  useEffect(() => {
+    if (isOpen) {
+      setIsRendered(true)
+      const timeoutId = window.setTimeout(() => {
+        setIsVisible(true)
+      }, 0)
+      return () => {
+        window.clearTimeout(timeoutId)
+      }
+    }
+
+    setIsVisible(false)
+
+    if (!isRendered) {
+      return
+    }
+
+    const timeoutId = window.setTimeout(() => {
+      setIsRendered(false)
+    }, TERMINAL_EXIT_ANIMATION_MS)
+
+    return () => {
+      window.clearTimeout(timeoutId)
+    }
+  }, [isOpen, isRendered])
+
+  return {
+    isRendered,
+    isVisible
+  }
+}

package/src/hooks/use-roving-focus-list.ts

@@ -0,0 +1,104 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+
+export const getLoopedIndex = (
+  currentIndex: number,
+  delta: number,
+  itemCount: number
+) => {
+  if (itemCount <= 0) {
+    return -1
+  }
+
+  const nextIndex = (currentIndex + delta) % itemCount
+  return nextIndex < 0 ? nextIndex + itemCount : nextIndex
+}
+
+export const useRovingFocusList = <T extends string>(
+  keys: T[],
+  initialKey?: T | null
+) => {
+  const itemRefs = useRef(new Map<T, HTMLElement>())
+  const [activeKey, setActiveKey] = useState<T | null>(() => {
+    if (initialKey != null && keys.includes(initialKey)) {
+      return initialKey
+    }
+    return keys[0] ?? null
+  })
+
+  useEffect(() => {
+    if (keys.length === 0) {
+      setActiveKey(null)
+      return
+    }
+
+    if (activeKey != null && keys.includes(activeKey)) {
+      return
+    }
+
+    if (initialKey != null && keys.includes(initialKey)) {
+      setActiveKey(initialKey)
+      return
+    }
+
+    setActiveKey(keys[0] ?? null)
+  }, [activeKey, initialKey, keys])
+
+  const registerItem = useCallback((key: T) => {
+    return (node: HTMLElement | null) => {
+      if (node == null) {
+        itemRefs.current.delete(key)
+        return
+      }
+      itemRefs.current.set(key, node)
+    }
+  }, [])
+
+  const focusKey = useCallback((key: T | null) => {
+    if (key == null) {
+      return
+    }
+    setActiveKey(key)
+    itemRefs.current.get(key)?.focus()
+  }, [])
+
+  const keyIndexMap = useMemo(() => {
+    return new Map(keys.map((key, index) => [key, index]))
+  }, [keys])
+
+  const moveFocus = useCallback((delta: number, fromKey?: T | null) => {
+    if (keys.length === 0) {
+      return null
+    }
+
+    const sourceKey = fromKey ?? activeKey ?? keys[0] ?? null
+    const sourceIndex = sourceKey == null ? 0 : (keyIndexMap.get(sourceKey) ?? 0)
+    const nextIndex = getLoopedIndex(sourceIndex, delta, keys.length)
+    const nextKey = keys[nextIndex] ?? null
+    if (nextKey != null) {
+      focusKey(nextKey)
+    }
+    return nextKey
+  }, [activeKey, focusKey, keyIndexMap, keys])
+
+  const focusFirst = useCallback(() => {
+    const firstKey = keys[0] ?? null
+    focusKey(firstKey)
+    return firstKey
+  }, [focusKey, keys])
+
+  const focusLast = useCallback(() => {
+    const lastKey = keys.at(-1) ?? null
+    focusKey(lastKey)
+    return lastKey
+  }, [focusKey, keys])
+
+  return {
+    activeKey,
+    setActiveKey,
+    registerItem,
+    focusKey,
+    moveFocus,
+    focusFirst,
+    focusLast
+  }
+}

package/src/hooks/use-sidebar-navigation.ts

@@ -16,14 +16,19 @@ export function useSidebarNavigation() {
   const activeSessionId = sessionMatch?.params.sessionId
   const showSidebar = location.pathname === '/' || activeSessionId != null
 
+  const getNavigationTarget = useCallback((pathname: string) => ({
+    pathname,
+    search: location.search
+  }), [location.search])
+
   const handleSelectSession = useCallback((session: Session, _isNew?: boolean) => {
-    void navigate(session.id === '' ? '/' : `/session/${session.id}`)
-  }, [navigate])
+    void navigate(getNavigationTarget(session.id === '' ? '/' : `/session/${session.id}`))
+  }, [getNavigationTarget, navigate])
 
   const handleDeletedSession = useCallback((deletedId: string, nextId?: string) => {
     if (activeSessionId !== deletedId) return
-    void navigate(nextId ? `/session/${nextId}` : '/')
-  }, [activeSessionId, navigate])
+    void navigate(getNavigationTarget(nextId ? `/session/${nextId}` : '/'))
+  }, [activeSessionId, getNavigationTarget, navigate])
 
   return {
     activeSessionId,

package/src/hooks/use-sidebar-query-state.ts

@@ -0,0 +1,79 @@
+import { useMemo } from 'react'
+
+import { useQueryParams } from '#~/hooks/useQueryParams.js'
+
+export type SidebarSessionSortOrder = 'asc' | 'desc'
+
+const splitFilterValues = (raw: string) => {
+  return Array.from(
+    new Set(
+      raw
+        .split(',')
+        .map((value) => value.trim())
+        .filter(Boolean)
+    )
+  )
+}
+
+const joinFilterValues = (values: string[]) => {
+  return Array.from(
+    new Set(
+      values
+        .map((value) => value.trim())
+        .filter(Boolean)
+    )
+  ).join(',')
+}
+
+export function useSidebarQueryState() {
+  const { values, update } = useQueryParams<{
+    adapter: string
+    search: string
+    sort: string
+    sidebar: string
+    tag: string
+  }>({
+    keys: ['sidebar', 'search', 'tag', 'adapter', 'sort'],
+    defaults: {
+      sidebar: '',
+      search: '',
+      tag: '',
+      adapter: '',
+      sort: ''
+    },
+    omit: {
+      sidebar: (value) => value === '',
+      search: (value) => value === '',
+      tag: (value) => value === '',
+      adapter: (value) => value === '',
+      sort: (value) => value === ''
+    }
+  })
+
+  const tagFilters = useMemo(() => splitFilterValues(values.tag), [values.tag])
+  const adapterFilters = useMemo(() => splitFilterValues(values.adapter), [values.adapter])
+  const searchQuery = values.search
+  const sortSelection: SidebarSessionSortOrder | undefined = values.sort === 'asc' || values.sort === 'desc'
+    ? values.sort
+    : undefined
+  const sortOrder: SidebarSessionSortOrder = sortSelection ?? 'desc'
+  const isSidebarCollapsed = values.sidebar === 'collapsed'
+  const hasActiveFilterConditions = searchQuery.trim() !== '' || tagFilters.length > 0 || adapterFilters.length > 0
+  const hasActiveSearchControls = hasActiveFilterConditions || sortSelection != null
+
+  return {
+    adapterFilters,
+    hasActiveFilterConditions,
+    hasActiveSearchControls,
+    isSidebarCollapsed,
+    searchQuery,
+    setSortOrder: (sort?: SidebarSessionSortOrder) => update({ sort: sort ?? '' }),
+    setAdapterFilters: (filters: string[]) => update({ adapter: joinFilterValues(filters) }),
+    setSearchQuery: (search: string) => update({ search }),
+    setSidebarCollapsed: (collapsed: boolean) => update({ sidebar: collapsed ? 'collapsed' : '' }),
+    setTagFilters: (filters: string[]) => update({ tag: joinFilterValues(filters) }),
+    sortOrder,
+    sortSelection,
+    tagFilters
+  }
+}

package/src/main.tsx

@@ -12,7 +12,7 @@ import { BrowserRouter } from 'react-router-dom'
 import { SWRConfig } from 'swr'
 
 import { fetchApiJson } from '#~/api/base.js'
-import { getClientBase } from '#~/runtime-config.js'
+import { getClientBase, resolveDevDocumentTitle } from '#~/runtime-config.js'
 
 import App from './App'
 
@@ -20,6 +20,11 @@ const root = createRoot(document.getElementById('root')!)
 
 const clientBase = getClientBase()
 
+document.title = resolveDevDocumentTitle(document.title, {
+  isDev: import.meta.env.DEV,
+  gitRef: import.meta.env.__VF_PROJECT_AI_DEV_GIT_REF__
+})
+
 root.render(
   <React.StrictMode>
     <ConfigProvider locale={zhCN} theme={{ token: { colorPrimary: '#000000' } }}>

package/src/resources/locales/en.json

@@ -25,6 +25,7 @@
     "batchRestoreFailed": "Failed to restore some sessions",
     "cancel": "Cancel",
     "confirm": "Confirm",
+    "confirmAction": "Confirm {{action}}",
     "startNewChat": "No active sessions found. Start a new chat!",
     "backToHome": "Back to Home",
     "noData": "No data",
@@ -44,7 +45,14 @@
     "batchDeleteSuccess": "Batch deleted successfully",
     "batchDeleteFailed": "Failed to delete some sessions",
     "selectedCount": "{{count}} sessions selected",
+    "selectAll": "Select all",
+    "deselectAll": "Deselect all",
     "collapse": "Collapse sidebar",
+    "close": "Close",
+    "sort": "Sort order",
+    "allTags": "All tags",
+    "allAdapters": "All adapters",
+    "searchActions": "Search and filters",
     "expandChildren": "Expand children",
     "collapseChildren": "Collapse children",
     "childSummary": "{{count}} child sessions",
@@ -52,9 +60,19 @@
     "deleteConfirm": "Are you sure you want to delete the selected {{count}} chats?",
     "deleteSuccess": "Deleted successfully",
     "deleteFailed": "Failed to delete",
+    "operationFailed": "Operation failed",
+    "copyFailed": "Copy failed",
     "star": "Star",
     "unstar": "Unstar",
+    "rename": "Rename",
+    "renameSession": "Rename session",
     "addTag": "Tag",
+    "copySessionLink": "Copy session link",
+    "copySessionId": "Copy session ID",
+    "copyResumeCommand": "Copy resume command",
+    "moreActions": "More actions",
+    "sessionLinkCopied": "Session link copied to clipboard",
+    "resumeCommandCopied": "Resume command copied to clipboard",
     "sessionIdCopied": "Session ID copied to clipboard",
     "doubleClickToCopy": "Double click to copy Session ID",
     "status": {
@@ -307,9 +325,53 @@
     "modelUnavailable": "No models available",
     "modelConfigRequired": "Add a model service in config before starting a session",
     "connectionErrorTitle": "Connection error",
+    "sessionErrorTitle": "Task failed",
     "connectionError": "WebSocket connection failed. Check the server and try again.",
     "connectionClosed": "WebSocket connection closed. Try reconnecting.",
     "retryConnection": "Retry",
+    "permissionRequestBadge": "Permission request",
+    "permissionRequestTitleWithTool": "Requesting permission to use 【{{tool}}】. Choose how to proceed.",
+    "permissionSubject": "Scope",
+    "permissionProjectConfig": "Project config",
+    "permissionCurrentMode": "Current mode",
+    "permissionSuggestedMode": "Suggested mode",
+    "permissionDeniedTools": "Restricted tools",
+    "permissionReasons": "Reasons",
+    "permissionExpandOptions": "Show more options",
+    "permissionCollapseOptions": "Show fewer options",
+    "tooltipSlashCommands": "Slash commands",
+    "tooltipMentionAgents": "Mention agents",
+    "tooltipInjectContext": "Inject context",
+    "tooltipUploadImages": "Upload images",
+    "tooltipReferenceActions": "More",
+    "referenceActionsShortcutTooltip": "More / Permission mode",
+    "modelShortcutTooltip": "Switch model",
+    "modelAddRecommendation": "Add to recommended models",
+    "modelAlreadyRecommended": "Already recommended",
+    "modelRemoveRecommendation": "Remove from recommended models",
+    "effortShortcutTooltip": "Switch reasoning effort",
+    "sendShortcutTooltip": "Send message",
+    "adapterLockedTooltip": "Adapters are locked after a session is created",
+    "referenceActionsShort": "More",
+    "referenceActionsTitle": "More",
+    "referenceActionsDescription": "Add photos, files, and permission-related settings.",
+    "referenceAttachments": "Add photos and files",
+    "referenceAttachmentsDescription": "Choose images or project files as references.",
+    "referencePermission": "Permission mode",
+    "referencePermissionDescription": "Control how tool actions are authorized.",
+    "referenceImage": "Image",
+    "referenceImageDescription": "Choose a local image and attach it to the message.",
+    "referenceFile": "File",
+    "referenceFileDescription": "Choose files from the current project tree.",
+    "effortSelectPlaceholder": "Effort",
+    "effortLabels": {
+      "default": "Standard",
+      "low": "Low",
+      "medium": "Medium",
+      "high": "High",
+      "max": "Max"
+    },
+    "permissionModeSelectPlaceholder": "Permission mode",
     "assetWarningsTitle": "Compatibility notes",
     "assetWarningsCount": "{{count}} asset warnings",
     "assetWarningsMore": "+{{count}} more",
@@ -318,18 +380,52 @@
     "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}}.",
+    "modelGroupBuiltin": "{{adapter}} built-in models",
+    "modelGroupServices": "Model Services",
     "imageTooLarge": "Image must be smaller than 5MB",
     "imageReadFailed": "Failed to read image",
     "imageNotSupportedInInteraction": "Images are not supported for this interaction",
+    "fileNotSupportedInInteraction": "Files are not supported for this interaction",
+    "contextPickerTitle": "Reference files",
+    "contextPickerDescription": "Choose one or more files from the current project tree.",
+    "contextPickerConfirm": "Reference files",
+    "contextPickerLoading": "Loading workspace tree...",
+    "contextPickerEmpty": "No files available in this directory",
+    "contextPickerLoadFailed": "Failed to load workspace tree",
     "modelGroupRecommended": "Recommended Models",
+    "modelMoreModels": "More models",
     "availableTools": "Available Tools",
+    "availableToolsEmpty": "No tools are available for this session yet.",
     "toolGroupChromeDevtools": "ChromeDevtools",
     "toolGroupSystem": "System",
     "toolsCount": "{{count}} tools",
     "usedTools": "Used {{count}} tools",
-    "viewInitInfo": "Double click to view initialization info",
+    "debugSessionId": "Session",
+    "debugType": "Type",
+    "debugUuid": "UUID",
+    "debugLeafUuid": "Leaf",
+    "debugAdapter": "Adapter",
+    "debugModel": "Model",
+    "debugEffort": "Effort",
+    "debugVersion": "Version",
+    "debugTools": "Tools",
+    "debugAgents": "Agents",
+    "debugCwd": "CWD",
+    "debugTags": "Tags",
+    "debugView": "View",
+    "debugStarred": "Starred",
+    "debugArchived": "Archived",
+    "debugEnable": "Enable debug mode",
+    "debugDisable": "Disable debug mode",
+    "debugEnabledValue": "Enabled",
+    "debugDisabledValue": "Disabled",
+    "debugSectionTitle": "Debug Session Info",
+    "debugModeTitle": "Debug mode is on",
+    "debugModeDescription": "This section is visible because the current URL contains a debug query.",
+    "viewInitInfo": "Click the title 5 times to toggle debug mode",
     "viewHistory": "History",
     "viewTimeline": "Timeline",
+    "viewTerminal": "Terminal",
     "viewSettings": "Settings",
     "deleteSessionTitle": "Delete session",
     "deleteSessionDesc": "This will permanently remove the session and all messages. Proceed carefully.",
@@ -369,6 +465,42 @@
       "destroyLabel": "Destroy {{name}} @ {{end}}",
       "rangeLabel": "{{name}} ({{start}} → {{end}})"
     },
+    "messageActions": {
+      "copy": "Copy raw text",
+      "copySuccess": "Raw message copied",
+      "copyFailed": "Failed to copy raw message",
+      "copyLink": "Copy message link",
+      "copyLinkSuccess": "Message link copied",
+      "copyId": "Copy message ID",
+      "copyIdSuccess": "Message ID copied",
+      "copyJson": "Copy message JSON",
+      "copyJsonSuccess": "Message JSON copied",
+      "copyTimestamp": "Copy timestamp",
+      "copyTimestampSuccess": "Timestamp copied",
+      "edit": "Edit message",
+      "editInProgress": "A message is already being edited. Send or cancel it first.",
+      "saveEdit": "Save as branch",
+      "confirmInline": "Confirm",
+      "recall": "Recall to here",
+      "fork": "Fork from here",
+      "recallConfirmTitle": "Recall to this message?",
+      "recallConfirmContent": "Messages after this point will be rolled back. Continue?",
+      "forkConfirmTitle": "Fork from this message?",
+      "forkConfirmContent": "This will create a new session branch from this message. Continue?"
+    },
+    "messageFooter": {
+      "tokens": "Tokens",
+      "copyTimestampSuccess": "Copied ISO timestamp",
+      "copyTimestampTitle": "Double-click to copy the ISO timestamp and log the message payload"
+    },
+    "turnProcessedDuration": "Processed {{duration}}",
+    "turnDurationUnderSecond": "<1s",
+    "turnDurationHours": "{{count}}h",
+    "turnDurationMinutes": "{{count}}m",
+    "turnDurationSeconds": "{{count}}s",
+    "turnSummaryCount": "{{count}} hidden messages",
+    "turnExpandAction": "Expand",
+    "turnCollapseAction": "Collapse",
     "hint": "Press Enter to send, Shift + Enter for new line, type / @ # for completion",
     "newSessionGuide": {
       "loading": "Loading...",
@@ -429,6 +561,11 @@
       "viewCommand": "View command",
       "unknown": "Unknown tool"
     },
+    "terminal": {
+      "connectionError": "Terminal connection failed. Check the server and try again.",
+      "exitSummary": "Terminal exited with exitCode={{code}}, signal={{signal}}",
+      "resizePanel": "Drag to resize terminal height"
+    },
     "sessionSettings": "Session Settings",
     "enterTitle": "Enter session title...",
     "tags": "Tags",
@@ -680,7 +817,7 @@
       "models": {
         "items": {
           "label": "Model Selector Entries",
-          "desc": "Selector metadata keyed by `service` or `service,model`"
+          "desc": "Model metadata keyed by `service` or `service,model`. Display metadata like alias/title/description only applies to exact `model` or `service,model` matches"
         }
       },
       "modelServices": {
@@ -709,10 +846,6 @@
             "label": "Models",
             "desc": "Models supported by this service"
           },
-          "modelsAlias": {
-            "label": "Model Aliases",
-            "desc": "Alias mapping for models"
-          },
           "timeoutMs": {
             "label": "Timeout (ms)",
             "desc": "Provider timeout in milliseconds. Codex uses it as stream idle timeout; Claude Code Router uses global API timeout."
@@ -815,6 +948,18 @@
         "clearInput": {
           "label": "Clear Input",
           "desc": "Shortcut for clearing the input"
+        },
+        "switchModel": {
+          "label": "Switch Model",
+          "desc": "Open the model selector and navigate it with the keyboard"
+        },
+        "switchEffort": {
+          "label": "Switch Reasoning Effort",
+          "desc": "Open the effort selector and navigate it with the keyboard"
+        },
+        "switchPermissionMode": {
+          "label": "Switch Permission Mode",
+          "desc": "Open the permission menu and navigate it with the keyboard"
         }
       }
     },