@vibe-forge/client 3.0.0-alpha.6 → 3.0.0

package/src/components/monaco/use-monaco-theme.ts

@@ -1,63 +0,0 @@
-import type { editor as MonacoEditorNamespace } from 'monaco-editor'
-import { useEffect, useState } from 'react'
-
-import { monacoApi } from './monaco-runtime'
-
-const LIGHT_THEME = 'vf-workspace-light'
-const DARK_THEME = 'vf-workspace-dark'
-const HEX_COLOR_PATTERN = /^#(?:[\da-f]{3}|[\da-f]{4}|[\da-f]{6}|[\da-f]{8})$/i
-
-const readCssColor = (styles: CSSStyleDeclaration, name: string, fallback: string) => {
-  const value = styles.getPropertyValue(name).trim()
-  return HEX_COLOR_PATTERN.test(value) ? value : fallback
-}
-
-const buildTheme = (isDark: boolean): MonacoEditorNamespace.IStandaloneThemeData => {
-  const styles = window.getComputedStyle(document.documentElement)
-  const background = readCssColor(styles, '--bg-color', isDark ? '#141414' : '#ffffff')
-  const foreground = readCssColor(styles, '--text-color', isDark ? '#ffffff' : '#111827')
-  const primaryColor = readCssColor(styles, '--primary-color', isDark ? '#3b82f6' : '#2563eb')
-  const selectionBackground = readCssColor(styles, '--primary-soft-bg', isDark ? '#111b26' : '#eff6ff')
-
-  return {
-    base: isDark ? 'vs-dark' : 'vs',
-    colors: {
-      'editor.background': background,
-      'editor.foreground': foreground,
-      'editor.inactiveSelectionBackground': selectionBackground,
-      'editor.selectionBackground': selectionBackground,
-      'editorCursor.foreground': primaryColor
-    },
-    inherit: true,
-    rules: []
-  }
-}
-
-const defineTheme = (isDark: boolean) => {
-  const themeName = isDark ? DARK_THEME : LIGHT_THEME
-  monacoApi.editor.defineTheme(themeName, buildTheme(isDark))
-  return themeName
-}
-
-const getThemeName = () => defineTheme(document.documentElement.classList.contains('dark'))
-
-export const useMonacoTheme = () => {
-  const [themeName, setThemeName] = useState(getThemeName)
-
-  useEffect(() => {
-    const syncThemeName = () => setThemeName(getThemeName())
-    const observer = new MutationObserver(syncThemeName)
-
-    observer.observe(document.documentElement, {
-      attributes: true,
-      attributeFilter: ['class']
-    })
-    syncThemeName()
-
-    return () => {
-      observer.disconnect()
-    }
-  }, [])
-
-  return themeName
-}

package/src/components/nav-rail-account-actions.tsx

@@ -1,104 +0,0 @@
-import { App as AntdApp } from 'antd'
-import type { MenuProps } from 'antd'
-import React from 'react'
-import { useTranslation } from 'react-i18next'
-import useSWR, { useSWRConfig } from 'swr'
-
-import { getAuthStatus, logout } from '#~/api/auth'
-import { clearAuthToken } from '#~/api/auth-token'
-import { getApiErrorMessage } from '#~/api/base'
-import { isServerConnectionManagedClientMode, requestServerConnectionPicker } from '#~/runtime-config'
-
-import type { NavRailCompactMoreAction } from './NavRailCompact'
-
-export function useNavRailAccountActions() {
-  const { t } = useTranslation()
-  const { message } = AntdApp.useApp()
-  const { mutate } = useSWRConfig()
-  const { data: authStatus } = useSWR('/api/auth/status', getAuthStatus)
-  const connectionManagedMode = isServerConnectionManagedClientMode()
-  const authEnabled = authStatus?.enabled === true
-
-  const refreshAuthStatus = React.useCallback(async () => {
-    try {
-      await mutate('/api/auth/status')
-    } catch {
-      // The user intent is still to leave the current local session.
-    }
-  }, [mutate])
-
-  const handleChangeServer = React.useCallback(() => {
-    requestServerConnectionPicker({ clearCurrentServer: true })
-    window.location.reload()
-  }, [])
-
-  const handleLogout = React.useCallback(async () => {
-    try {
-      await logout()
-      await refreshAuthStatus()
-    } catch (err) {
-      clearAuthToken()
-      await refreshAuthStatus()
-      void message.error(getApiErrorMessage(err, t('auth.logoutFailed')))
-    }
-  }, [message, refreshAuthStatus, t])
-
-  const accountItems = React.useMemo<NonNullable<MenuProps['items']>>(() => {
-    const items: NonNullable<MenuProps['items']> = []
-
-    if (connectionManagedMode) {
-      items.push({
-        key: 'change-server',
-        label: t('auth.changeServer'),
-        icon: <span className='material-symbols-rounded nav-menu-icon'>sync_alt</span>,
-        onClick: handleChangeServer
-      })
-    }
-
-    if (authEnabled) {
-      if (items.length > 0) {
-        items.push({ key: 'account-divider', type: 'divider' })
-      }
-
-      items.push({
-        key: 'logout',
-        label: t('auth.logout'),
-        danger: true,
-        icon: <span className='material-symbols-rounded nav-menu-icon'>logout</span>,
-        onClick: () => {
-          void handleLogout()
-        }
-      })
-    }
-
-    return items
-  }, [authEnabled, connectionManagedMode, handleChangeServer, handleLogout, t])
-
-  const compactAccountActions = React.useMemo<NavRailCompactMoreAction[]>(() => [
-    ...(connectionManagedMode
-      ? [{
-        icon: 'sync_alt',
-        key: 'change-server',
-        label: t('auth.changeServer'),
-        onSelect: handleChangeServer
-      }]
-      : []),
-    ...(authEnabled
-      ? [{
-        icon: 'logout',
-        key: 'logout',
-        label: t('auth.logout'),
-        onSelect: () => {
-          void handleLogout()
-        }
-      }]
-      : [])
-  ], [authEnabled, connectionManagedMode, handleChangeServer, handleLogout, t])
-
-  return {
-    accountItems,
-    accountMenuLabel: t('auth.accountMenu'),
-    compactAccountActions,
-    showAccountMenu: accountItems.length > 0
-  }
-}

package/src/components/nav-rail-compact-config.ts

@@ -1,114 +0,0 @@
-import type { TFunction } from 'i18next'
-import type { NavigateFunction } from 'react-router-dom'
-
-import type { ThemeMode } from '#~/store'
-
-import type { NavRailCompactChoiceAction, NavRailCompactMoreAction } from './NavRailCompact'
-
-export function buildCompactMoreActions({
-  currentPath,
-  navigate,
-  onOpenSidebar,
-  showSidebar,
-  t
-}: {
-  currentPath: string
-  navigate: NavigateFunction
-  onOpenSidebar?: () => void
-  showSidebar: boolean
-  t: TFunction
-}): NavRailCompactMoreAction[] {
-  const actions: NavRailCompactMoreAction[] = []
-
-  if (showSidebar && onOpenSidebar != null) {
-    actions.push({
-      active: currentPath === '/' || currentPath.startsWith('/session/'),
-      icon: 'menu',
-      key: 'sessions',
-      label: t('common.sessions'),
-      onSelect: onOpenSidebar
-    })
-  }
-
-  actions.push({
-    active: currentPath === '/config',
-    icon: 'settings',
-    key: 'settings',
-    label: t('common.settings'),
-    onSelect: () => {
-      void navigate('/config')
-    }
-  })
-
-  return actions
-}
-
-export function buildCompactThemeActions({
-  setThemeMode,
-  t,
-  themeMode
-}: {
-  setThemeMode: (value: ThemeMode) => void
-  t: TFunction
-  themeMode: ThemeMode
-}): NavRailCompactChoiceAction[] {
-  return [
-    {
-      active: themeMode === 'light',
-      icon: 'light_mode',
-      key: 'light',
-      label: t('common.themeLight'),
-      onSelect: () => {
-        setThemeMode('light')
-        localStorage.setItem('theme', 'light')
-      }
-    },
-    {
-      active: themeMode === 'dark',
-      icon: 'dark_mode',
-      key: 'dark',
-      label: t('common.themeDark'),
-      onSelect: () => {
-        setThemeMode('dark')
-        localStorage.setItem('theme', 'dark')
-      }
-    },
-    {
-      active: themeMode === 'system',
-      icon: 'desktop_windows',
-      key: 'system',
-      label: t('common.themeSystem'),
-      onSelect: () => {
-        setThemeMode('system')
-        localStorage.setItem('theme', 'system')
-      }
-    }
-  ]
-}
-
-export function buildCompactLanguageActions({
-  currentLanguage,
-  onChangeLanguage
-}: {
-  currentLanguage: string
-  onChangeLanguage: (language: string) => void
-}): NavRailCompactChoiceAction[] {
-  return [
-    {
-      active: currentLanguage.startsWith('zh'),
-      key: 'zh',
-      label: '简体中文',
-      onSelect: () => {
-        onChangeLanguage('zh')
-      }
-    },
-    {
-      active: currentLanguage.startsWith('en'),
-      key: 'en',
-      label: 'English',
-      onSelect: () => {
-        onChangeLanguage('en')
-      }
-    }
-  ]
-}

package/src/components/nav-rail-items.tsx

@@ -1,181 +0,0 @@
-import type { MenuProps } from 'antd'
-import type { TFunction } from 'i18next'
-import type { NavigateFunction } from 'react-router-dom'
-
-import type { ThemeMode } from '#~/store'
-
-export interface NavRailItem {
-  active: boolean
-  icon: string
-  key: string
-  label: string
-  path: string
-}
-
-export function buildLanguageItems({
-  currentLanguage,
-  onChangeLanguage
-}: {
-  currentLanguage: string
-  onChangeLanguage: (language: string) => unknown
-}): MenuProps['items'] {
-  return [
-    {
-      key: 'zh',
-      label: '简体中文',
-      icon: currentLanguage.startsWith('zh')
-        ? (
-          <span className='material-symbols-rounded nav-menu-icon active'>check</span>
-        )
-        : <div className='nav-menu-icon-placeholder' />,
-      onClick: () => {
-        void onChangeLanguage('zh')
-      }
-    },
-    {
-      key: 'en',
-      label: 'English',
-      icon: currentLanguage.startsWith('en')
-        ? (
-          <span className='material-symbols-rounded nav-menu-icon active'>check</span>
-        )
-        : <div className='nav-menu-icon-placeholder' />,
-      onClick: () => {
-        void onChangeLanguage('en')
-      }
-    }
-  ]
-}
-
-export function buildThemeItems({
-  setThemeMode,
-  t,
-  themeMode
-}: {
-  setThemeMode: (themeMode: ThemeMode) => void
-  t: TFunction
-  themeMode: ThemeMode
-}): MenuProps['items'] {
-  return [
-    {
-      key: 'light',
-      label: t('common.themeLight'),
-      icon: themeMode === 'light'
-        ? <span className='material-symbols-rounded nav-menu-icon active'>check</span>
-        : <span className='material-symbols-rounded nav-menu-icon'>light_mode</span>,
-      onClick: () => {
-        setThemeMode('light')
-        localStorage.setItem('theme', 'light')
-      }
-    },
-    {
-      key: 'dark',
-      label: t('common.themeDark'),
-      icon: themeMode === 'dark'
-        ? <span className='material-symbols-rounded nav-menu-icon active'>check</span>
-        : <span className='material-symbols-rounded nav-menu-icon'>dark_mode</span>,
-      onClick: () => {
-        setThemeMode('dark')
-        localStorage.setItem('theme', 'dark')
-      }
-    },
-    {
-      key: 'system',
-      label: t('common.themeSystem'),
-      icon: themeMode === 'system'
-        ? <span className='material-symbols-rounded nav-menu-icon active'>check</span>
-        : <span className='material-symbols-rounded nav-menu-icon'>desktop_windows</span>,
-      onClick: () => {
-        setThemeMode('system')
-        localStorage.setItem('theme', 'system')
-      }
-    }
-  ]
-}
-
-export function buildNavItems({
-  currentPath,
-  t
-}: {
-  currentPath: string
-  t: TFunction
-}): NavRailItem[] {
-  return [
-    {
-      key: 'sessions',
-      icon: 'chat_bubble',
-      label: t('common.sessions'),
-      path: '/',
-      active: currentPath === '/' || currentPath.startsWith('/session/')
-    },
-    {
-      key: 'knowledge',
-      icon: 'library_books',
-      label: t('common.knowledgeBase'),
-      path: '/knowledge',
-      active: currentPath === '/knowledge'
-    },
-    {
-      key: 'automation',
-      icon: 'schedule',
-      label: t('common.automation'),
-      path: '/automation',
-      active: currentPath === '/automation'
-    },
-    {
-      key: 'benchmark',
-      icon: 'speed',
-      label: t('common.benchmark'),
-      path: '/benchmark',
-      active: currentPath === '/benchmark'
-    },
-    {
-      key: 'archive',
-      icon: 'archive',
-      label: t('common.archivedSessions'),
-      path: '/archive',
-      active: currentPath === '/archive'
-    }
-  ]
-}
-
-export function buildCompactMoreItems({
-  langItems,
-  navigate,
-  t,
-  themeItems,
-  themeMode
-}: {
-  langItems: MenuProps['items']
-  navigate: NavigateFunction
-  t: TFunction
-  themeItems: MenuProps['items']
-  themeMode: ThemeMode
-}): MenuProps['items'] {
-  return [
-    {
-      key: 'settings',
-      label: t('common.settings'),
-      icon: <span className='material-symbols-rounded nav-menu-icon'>settings</span>,
-      onClick: () => {
-        void navigate('/config')
-      }
-    },
-    {
-      key: 'theme',
-      label: t('common.theme'),
-      icon: (
-        <span className='material-symbols-rounded nav-menu-icon'>
-          {themeMode === 'light' ? 'light_mode' : themeMode === 'dark' ? 'dark_mode' : 'desktop_windows'}
-        </span>
-      ),
-      children: themeItems
-    },
-    {
-      key: 'language',
-      label: t('common.language'),
-      icon: <span className='material-symbols-rounded nav-menu-icon'>language</span>,
-      children: langItems
-    }
-  ]
-}