@vibe-forge/client 3.0.0-alpha.5 → 3.0.0-alpha.7

package/src/components/chat/sender/@hooks/use-sender-history.ts

@@ -1,79 +0,0 @@
-import type { RefObject } from 'react'
-import { useEffect, useState } from 'react'
-
-import type { SenderEditorHandle } from '#~/components/chat/sender/@types/sender-editor'
-import type { SenderInitialContent } from '#~/components/chat/sender/@types/sender-types'
-import { loadChatHistory } from '#~/components/chat/sender/@utils/sender-utils'
-
-export const useSenderHistory = ({
-  initialContent,
-  input,
-  setInput,
-  editorRef
-}: {
-  initialContent: SenderInitialContent
-  input: string
-  setInput: (value: string) => void
-  editorRef: RefObject<SenderEditorHandle | null>
-}) => {
-  const [historyIndex, setHistoryIndex] = useState(-1)
-  const [draft, setDraft] = useState('')
-
-  useEffect(() => {
-    resetHistory()
-  }, [initialContent])
-
-  const resetHistory = () => {
-    setHistoryIndex(-1)
-    setDraft('')
-  }
-
-  const clearInputValue = () => {
-    if (input === '') {
-      return
-    }
-    setInput('')
-    setHistoryIndex(-1)
-  }
-
-  const handleHistoryNavigation = (direction: 'up' | 'down') => {
-    const history = loadChatHistory()
-    if (history.length === 0) {
-      return
-    }
-
-    const nextIndex = direction === 'up'
-      ? Math.min(historyIndex + 1, history.length - 1)
-      : Math.max(historyIndex - 1, -1)
-    if (nextIndex === historyIndex) {
-      return
-    }
-
-    if (historyIndex === -1) {
-      setDraft(input)
-    }
-
-    const nextValue = nextIndex === -1 ? draft : history[nextIndex]
-    setHistoryIndex(nextIndex)
-    setInput(nextValue)
-
-    setTimeout(() => {
-      const editor = editorRef.current
-
-      if (editor == null) {
-        return
-      }
-
-      const length = nextValue.length
-      editor.setSelection({ start: length, end: length })
-      editor.focus()
-    }, 0)
-  }
-
-  return {
-    historyIndex,
-    resetHistory,
-    clearInputValue,
-    handleHistoryNavigation
-  }
-}

package/src/components/chat/sender/@hooks/use-sender-keydown.ts

@@ -1,177 +0,0 @@
-import type { RefObject } from 'react'
-import { useEffect, useRef } from 'react'
-
-import type { SenderEditorHandle } from '#~/components/chat/sender/@types/sender-editor'
-import { loadChatHistory } from '#~/components/chat/sender/@utils/sender-utils'
-import { isShortcutMatch } from '#~/utils/shortcutUtils'
-
-export const useSenderKeydown = ({
-  editorRef,
-  isMac,
-  clearInputShortcut,
-  isInlineEdit,
-  isThinking,
-  input,
-  pendingImageCount,
-  pendingFileCount,
-  interactionOptionCount,
-  onCancel,
-  onClear,
-  onInteractionOptionMove,
-  onInteractionOptionSubmit,
-  onInterrupt,
-  onInterruptHint,
-  onResetComposer,
-  showReferenceActions,
-  onCloseReferenceActions,
-  showModelSelect,
-  onCloseModelSelect,
-  showEffortSelect,
-  onCloseEffortSelect,
-  showCompletion,
-  historyIndex,
-  onHistoryNavigate,
-  onInputClear
-}: {
-  editorRef: RefObject<SenderEditorHandle | null>
-  isMac: boolean
-  clearInputShortcut?: string
-  isInlineEdit: boolean
-  isThinking: boolean
-  input: string
-  pendingImageCount: number
-  pendingFileCount: number
-  interactionOptionCount: number
-  onCancel?: () => void
-  onClear?: () => void
-  onInteractionOptionMove?: (delta: number) => void
-  onInteractionOptionSubmit?: () => void
-  onInterrupt: () => void
-  onInterruptHint: () => void
-  onResetComposer: () => void
-  showReferenceActions: boolean
-  onCloseReferenceActions: () => void
-  showModelSelect: boolean
-  onCloseModelSelect: () => void
-  showEffortSelect: boolean
-  onCloseEffortSelect: () => void
-  showCompletion: boolean
-  historyIndex: number
-  onHistoryNavigate: (direction: 'up' | 'down') => void
-  onInputClear: () => void
-}) => {
-  const interruptConfirmationExpiresAtRef = useRef<number | null>(null)
-
-  useEffect(() => {
-    if (input !== '' || pendingImageCount > 0 || pendingFileCount > 0 || !isThinking) {
-      interruptConfirmationExpiresAtRef.current = null
-    }
-  }, [input, isThinking, pendingFileCount, pendingImageCount])
-
-  return (event: KeyboardEvent) => {
-    if (showReferenceActions && event.key === 'Escape') {
-      event.preventDefault()
-      onCloseReferenceActions()
-      return
-    }
-    if (showModelSelect && event.key === 'Escape') {
-      event.preventDefault()
-      onCloseModelSelect()
-      return
-    }
-    if (showEffortSelect && event.key === 'Escape') {
-      event.preventDefault()
-      onCloseEffortSelect()
-      return
-    }
-    if (showCompletion && ['ArrowDown', 'ArrowUp', 'Enter', 'Escape', 'Tab'].includes(event.key)) {
-      return
-    }
-    if (clearInputShortcut?.trim() && isShortcutMatch(event, clearInputShortcut, isMac)) {
-      event.preventDefault()
-      onInputClear()
-      return
-    }
-    const canNavigateInteractionOptions = !isInlineEdit &&
-      interactionOptionCount > 0 &&
-      input.trim() === '' &&
-      pendingImageCount === 0 &&
-      pendingFileCount === 0
-    if (
-      canNavigateInteractionOptions &&
-      onInteractionOptionMove != null &&
-      (event.key === 'ArrowUp' || event.key === 'ArrowDown')
-    ) {
-      event.preventDefault()
-      onInteractionOptionMove(event.key === 'ArrowUp' ? -1 : 1)
-      return
-    }
-    if (
-      canNavigateInteractionOptions &&
-      onInteractionOptionSubmit != null &&
-      event.key === 'Enter' &&
-      !event.metaKey &&
-      !event.ctrlKey &&
-      !event.altKey &&
-      !event.shiftKey
-    ) {
-      event.preventDefault()
-      onInteractionOptionSubmit()
-      return
-    }
-    if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
-      const selection = editorRef.current?.getSelection()
-      const history = loadChatHistory()
-      const currentHistoryValue = historyIndex === -1 ? null : history[historyIndex]
-      const textSegment = event.key === 'ArrowUp'
-        ? input.substring(0, selection?.start ?? input.length)
-        : input.substring(selection?.end ?? input.length)
-      if (!textSegment.includes('\n')) {
-        const canMoveUp = event.key === 'ArrowUp' && (input.trim() === '' || input === currentHistoryValue)
-        const canMoveDown = event.key === 'ArrowDown' && (historyIndex !== -1 || input === currentHistoryValue)
-        if (canMoveUp || canMoveDown) {
-          event.preventDefault()
-          onHistoryNavigate(event.key === 'ArrowUp' ? 'up' : 'down')
-          return
-        }
-      }
-    }
-    if (event.key === 'Escape') {
-      if (isInlineEdit && input === '' && pendingImageCount === 0 && pendingFileCount === 0 && onCancel != null) {
-        event.preventDefault()
-        onCancel()
-        return
-      }
-      if (input !== '') {
-        event.preventDefault()
-        interruptConfirmationExpiresAtRef.current = null
-        onInputClear()
-        return
-      }
-      if (isThinking && pendingImageCount === 0 && pendingFileCount === 0) {
-        event.preventDefault()
-        const now = Date.now()
-        const expiresAt = interruptConfirmationExpiresAtRef.current
-
-        if (expiresAt != null && expiresAt > now) {
-          interruptConfirmationExpiresAtRef.current = null
-          onInterrupt()
-          return
-        }
-
-        interruptConfirmationExpiresAtRef.current = now + 1800
-        onInterruptHint()
-      }
-      return
-    }
-    if (event.key === 'l' && (event.metaKey || event.ctrlKey)) {
-      event.preventDefault()
-      if (isInlineEdit) {
-        onResetComposer()
-        return
-      }
-      onInputClear()
-      onClear?.()
-    }
-  }
-}

package/src/components/chat/sender/@hooks/use-sender-reference-actions.ts

@@ -1,134 +0,0 @@
-import { useEffect, useMemo, useState } from 'react'
-
-import type { ReferenceMenuKey, SenderInitialContent } from '#~/components/chat/sender/@types/sender-types'
-import { isActivationKey } from '#~/components/chat/sender/@utils/sender-utils'
-import type { PermissionMode } from '#~/hooks/chat/use-chat-permission-mode'
-import { useRovingFocusList } from '#~/hooks/use-roving-focus-list'
-
-export const useSenderReferenceActions = ({
-  initialContent,
-  isInlineEdit,
-  permissionMode,
-  permissionModeValues,
-  onPermissionSelect,
-  onReferenceImageSelect,
-  onOpenContextPicker
-}: {
-  initialContent: SenderInitialContent
-  isInlineEdit: boolean
-  permissionMode: PermissionMode
-  permissionModeValues: PermissionMode[]
-  onPermissionSelect: (mode: PermissionMode) => void
-  onReferenceImageSelect: () => void
-  onOpenContextPicker: () => void
-}) => {
-  const [showReferenceActions, setShowReferenceActions] = useState(false)
-  const [showPermissionActions, setShowPermissionActions] = useState(false)
-  const [shouldRestoreFocus, setShouldRestoreFocus] = useState(false)
-  const referenceMenuKeys = useMemo<ReferenceMenuKey[]>(() => {
-    const keys: ReferenceMenuKey[] = ['image']
-    if (!isInlineEdit) {
-      keys.push('file')
-    }
-    return keys
-  }, [isInlineEdit])
-  const referenceMenuNavigation = useRovingFocusList(referenceMenuKeys, 'image')
-  const permissionMenuNavigation = useRovingFocusList(permissionModeValues, permissionMode)
-
-  useEffect(() => {
-    resetReferenceActions()
-  }, [initialContent])
-
-  useEffect(() => {
-    if (permissionModeValues.includes(permissionMode)) {
-      permissionMenuNavigation.setActiveKey(permissionMode)
-    }
-  }, [permissionMenuNavigation, permissionMode, permissionModeValues])
-
-  const closeReferenceActions = ({ restoreFocus = false }: { restoreFocus?: boolean } = {}) => {
-    resetReferenceActions()
-    setShouldRestoreFocus(restoreFocus)
-  }
-
-  const resetReferenceActions = () => {
-    setShowReferenceActions(false)
-    setShowPermissionActions(false)
-    setShouldRestoreFocus(false)
-  }
-
-  return {
-    showReferenceActions,
-    setShowReferenceActions,
-    showPermissionActions,
-    setShowPermissionActions,
-    shouldRestoreFocus,
-    clearReferenceFocusRestore: () => setShouldRestoreFocus(false),
-    referenceMenuNavigation,
-    permissionMenuNavigation,
-    resetReferenceActions,
-    closeReferenceActions,
-    openPermissionShortcutMenu: () => {
-      setShowReferenceActions(false)
-      setShowPermissionActions(true)
-      permissionMenuNavigation.setActiveKey(permissionMode)
-      window.requestAnimationFrame(() => {
-        permissionMenuNavigation.focusKey(permissionMenuNavigation.activeKey ?? permissionMode)
-      })
-    },
-    handleReferenceMenuKeyDown: (event: React.KeyboardEvent<HTMLButtonElement>, key: ReferenceMenuKey) => {
-      if (event.key === 'ArrowDown') {
-        event.preventDefault()
-        setShowPermissionActions(false)
-        referenceMenuNavigation.moveFocus(1, key)
-        return
-      }
-      if (event.key === 'ArrowUp') {
-        event.preventDefault()
-        setShowPermissionActions(false)
-        referenceMenuNavigation.moveFocus(-1, key)
-        return
-      }
-      if (event.key === 'Escape') {
-        event.preventDefault()
-        closeReferenceActions({ restoreFocus: true })
-        return
-      }
-      if (!isActivationKey(event.key)) {
-        return
-      }
-      event.preventDefault()
-      if (key === 'image') {
-        closeReferenceActions()
-        onReferenceImageSelect()
-        return
-      }
-      if (key === 'file') {
-        closeReferenceActions()
-        onOpenContextPicker()
-      }
-    },
-    handlePermissionMenuKeyDown: (event: React.KeyboardEvent<HTMLButtonElement>, key: PermissionMode) => {
-      if (event.key === 'ArrowDown') {
-        event.preventDefault()
-        permissionMenuNavigation.moveFocus(1, key)
-        return
-      }
-      if (event.key === 'ArrowUp') {
-        event.preventDefault()
-        permissionMenuNavigation.moveFocus(-1, key)
-        return
-      }
-      if (event.key === 'ArrowLeft' || event.key === 'Escape') {
-        event.preventDefault()
-        closeReferenceActions({ restoreFocus: true })
-        return
-      }
-      if (!isActivationKey(event.key)) {
-        return
-      }
-      event.preventDefault()
-      onPermissionSelect(key)
-      closeReferenceActions({ restoreFocus: true })
-    }
-  }
-}

package/src/components/chat/sender/@hooks/use-sender-reference-focus-restore.ts

@@ -1,21 +0,0 @@
-import { useEffect } from 'react'
-
-export const useSenderReferenceFocusRestore = ({
-  focusRestore,
-  referenceActions
-}: {
-  focusRestore: { queueEditorFocusRestore: () => void }
-  referenceActions: {
-    shouldRestoreFocus: boolean
-    clearReferenceFocusRestore: () => void
-  }
-}) => {
-  useEffect(() => {
-    if (!referenceActions.shouldRestoreFocus) {
-      return
-    }
-
-    focusRestore.queueEditorFocusRestore()
-    referenceActions.clearReferenceFocusRestore()
-  }, [focusRestore, referenceActions])
-}

package/src/components/chat/sender/@hooks/use-sender-refs.ts

@@ -1,19 +0,0 @@
-import { useRef } from 'react'
-
-import type { RefSelectProps } from 'antd'
-
-import type { SenderEditorHandle } from '#~/components/chat/sender/@types/sender-editor'
-
-export const useSenderRefs = () => {
-  const editorRef = useRef<SenderEditorHandle | null>(null)
-  const fileInputRef = useRef<HTMLInputElement>(null)
-  const modelSelectRef = useRef<RefSelectProps>(null)
-  const effortSelectRef = useRef<RefSelectProps>(null)
-
-  return {
-    editorRef,
-    fileInputRef,
-    modelSelectRef,
-    effortSelectRef
-  }
-}

package/src/components/chat/sender/@hooks/use-sender-select-overlays.ts

@@ -1,83 +0,0 @@
-import type { RefObject } from 'react'
-import { useEffect, useState } from 'react'
-
-import type { RefSelectProps } from 'antd'
-
-import type { SenderInitialContent } from '#~/components/chat/sender/@types/sender-types'
-
-export const useSenderSelectOverlays = ({
-  initialContent,
-  isInlineEdit,
-  isThinking,
-  modelUnavailable,
-  supportsEffort,
-  modelSelectRef,
-  effortSelectRef
-}: {
-  initialContent: SenderInitialContent
-  isInlineEdit: boolean
-  isThinking: boolean
-  modelUnavailable?: boolean
-  supportsEffort: boolean
-  modelSelectRef: RefObject<RefSelectProps>
-  effortSelectRef: RefObject<RefSelectProps>
-}) => {
-  const [showModelSelect, setShowModelSelect] = useState(false)
-  const [showEffortSelect, setShowEffortSelect] = useState(false)
-  const [modelSearchValue, setModelSearchValue] = useState('')
-
-  useEffect(() => {
-    resetSelectOverlays()
-  }, [initialContent])
-
-  const resetSelectOverlays = () => {
-    setShowModelSelect(false)
-    setShowEffortSelect(false)
-    setModelSearchValue('')
-  }
-
-  useEffect(() => {
-    if (!showModelSelect && modelSearchValue !== '') {
-      setModelSearchValue('')
-    }
-  }, [modelSearchValue, showModelSelect])
-
-  const focusSelect = (selectRef: RefObject<RefSelectProps>) => {
-    window.requestAnimationFrame(() => {
-      selectRef.current?.focus?.()
-    })
-  }
-
-  const openModelSelector = () => {
-    if (isInlineEdit || modelUnavailable || isThinking) {
-      return false
-    }
-    setShowEffortSelect(false)
-    setModelSearchValue('')
-    setShowModelSelect(true)
-    focusSelect(modelSelectRef)
-    return true
-  }
-
-  const openEffortSelector = () => {
-    if (isInlineEdit || modelUnavailable || isThinking || !supportsEffort) {
-      return false
-    }
-    setShowModelSelect(false)
-    setShowEffortSelect(true)
-    focusSelect(effortSelectRef)
-    return true
-  }
-
-  return {
-    showModelSelect,
-    setShowModelSelect,
-    showEffortSelect,
-    setShowEffortSelect,
-    modelSearchValue,
-    setModelSearchValue,
-    resetSelectOverlays,
-    openModelSelector,
-    openEffortSelector
-  }
-}

package/src/components/chat/sender/@hooks/use-sender-shortcuts.ts

@@ -1,93 +0,0 @@
-import type { ReactNode } from 'react'
-
-import useSWR from 'swr'
-
-import type { ConfigResponse } from '@vibe-forge/types'
-
-import type { PermissionMode } from '#~/hooks/chat/use-chat-permission-mode'
-import { useComposerControlShortcuts } from '#~/hooks/chat/use-composer-control-shortcuts'
-import { resolveSendShortcut } from '#~/utils/shortcutUtils'
-
-const resolveQueuedMessageShortcuts = (sendShortcut: string, isMac: boolean) => {
-  const primary = sendShortcut
-  const candidates = isMac
-    ? ['cmd+shift+enter', 'cmd+alt+enter', 'cmd+ctrl+enter']
-    : ['mod+enter', 'alt+enter', 'ctrl+shift+enter']
-  const next = candidates.find(shortcut => shortcut !== primary) ?? candidates[0]
-
-  return {
-    queueSteer: primary,
-    queueNext: next
-  }
-}
-
-export const useSenderShortcuts = ({
-  enabled,
-  isInlineEdit,
-  isMac,
-  isThinking,
-  modelUnavailable,
-  permissionModeOptions,
-  referenceActions,
-  selectOverlays
-}: {
-  enabled: boolean
-  isInlineEdit: boolean
-  isMac: boolean
-  isThinking: boolean
-  modelUnavailable?: boolean
-  permissionModeOptions: Array<{ value: PermissionMode; label: ReactNode }>
-  referenceActions: {
-    closeReferenceActions: (options?: { restoreFocus?: boolean }) => void
-    openPermissionShortcutMenu: () => void
-  }
-  selectOverlays: {
-    openModelSelector: () => boolean
-    openEffortSelector: () => boolean
-    setShowModelSelect: (nextOpen: boolean) => void
-    setShowEffortSelect: (nextOpen: boolean) => void
-  }
-}) => {
-  const { data: configRes } = useSWR<ConfigResponse>('/api/config')
-  const mergedShortcuts = configRes?.sources?.merged?.shortcuts
-  const resolvedSendShortcut = resolveSendShortcut(mergedShortcuts?.sendMessage, isMac)
-  const queuedMessageShortcuts = resolveQueuedMessageShortcuts(resolvedSendShortcut, isMac)
-
-  const composerControlShortcuts = useComposerControlShortcuts({
-    enabled,
-    isMac,
-    shortcuts: mergedShortcuts,
-    onSwitchModel: (event) => {
-      event.preventDefault()
-      event.stopPropagation()
-      if (selectOverlays.openModelSelector()) {
-        referenceActions.closeReferenceActions()
-      }
-    },
-    onSwitchEffort: (event) => {
-      event.preventDefault()
-      event.stopPropagation()
-      if (selectOverlays.openEffortSelector()) {
-        referenceActions.closeReferenceActions()
-      }
-    },
-    onSwitchPermissionMode: (event) => {
-      if (isInlineEdit || modelUnavailable || isThinking || permissionModeOptions.length === 0) {
-        return
-      }
-
-      event.preventDefault()
-      event.stopPropagation()
-      selectOverlays.setShowModelSelect(false)
-      selectOverlays.setShowEffortSelect(false)
-      referenceActions.openPermissionShortcutMenu()
-    }
-  })
-
-  return {
-    clearInputShortcut: mergedShortcuts?.clearInput,
-    composerControlShortcuts,
-    resolvedSendShortcut,
-    queuedMessageShortcuts
-  }
-}

package/src/components/chat/sender/@hooks/use-sender-submit.ts

@@ -1,89 +0,0 @@
-import type { SessionQueuedMessageMode } from '@vibe-forge/core'
-import type { TFunction } from 'i18next'
-
-import type { MessageInstance } from 'antd/es/message/interface'
-
-import { buildMessageContent } from '#~/components/chat/sender/@core/content-attachments'
-import type { SenderSubmitResult } from '#~/components/chat/sender/@types/sender-types'
-import { saveChatHistoryEntry } from '#~/components/chat/sender/@utils/sender-utils'
-
-export const useSenderSubmit = ({
-  getInput,
-  pendingImages,
-  pendingFiles,
-  isBusy,
-  allowWhileBusy,
-  isInlineEdit,
-  modelUnavailable,
-  interactionRequest,
-  onInteractionResponse,
-  onSend,
-  onSendContent,
-  message,
-  t,
-  resetComposer
-}: {
-  getInput: () => string
-  pendingImages: Parameters<typeof buildMessageContent>[1]
-  pendingFiles: Parameters<typeof buildMessageContent>[2]
-  isBusy: boolean
-  allowWhileBusy: boolean
-  isInlineEdit: boolean
-  modelUnavailable?: boolean
-  interactionRequest?: { id: string } | null
-  onInteractionResponse?: (id: string, data: string | string[]) => void
-  onSend: (text: string, mode?: SessionQueuedMessageMode) => SenderSubmitResult | Promise<SenderSubmitResult>
-  onSendContent: (
-    content: ReturnType<typeof buildMessageContent>,
-    mode?: SessionQueuedMessageMode
-  ) => SenderSubmitResult | Promise<SenderSubmitResult>
-  message: MessageInstance
-  t: TFunction
-  resetComposer: () => void
-}) => {
-  return async (mode?: SessionQueuedMessageMode) => {
-    const input = getInput()
-
-    if (
-      ((isBusy && !allowWhileBusy) || (input.trim() === '' && pendingImages.length === 0 && pendingFiles.length === 0))
-    ) {
-      return
-    }
-    if (!isInlineEdit && modelUnavailable) {
-      void message.warning(t('chat.modelConfigRequired'))
-      return
-    }
-    if (!isInlineEdit && interactionRequest != null && onInteractionResponse != null) {
-      if (pendingImages.length > 0 || pendingFiles.length > 0) {
-        void message.warning(
-          pendingImages.length > 0 ? t('chat.imageNotSupportedInInteraction') : t('chat.fileNotSupportedInInteraction')
-        )
-        return
-      }
-      onInteractionResponse(interactionRequest.id, input.trim())
-      resetComposer()
-      return
-    }
-
-    let didSubmit = true
-    if (pendingImages.length > 0 || pendingFiles.length > 0) {
-      const content = buildMessageContent(input, pendingImages, pendingFiles)
-      if (isInlineEdit) {
-        didSubmit = (await onSendContent(content, mode)) !== false
-      } else {
-        void onSendContent(content, mode)
-      }
-    } else if (isInlineEdit) {
-      didSubmit = (await onSend(input, mode)) !== false
-    } else {
-      void onSend(input, mode)
-    }
-
-    if (!didSubmit) {
-      return
-    }
-
-    saveChatHistoryEntry(input)
-    resetComposer()
-  }
-}