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

package/src/components/chat/messages/MessageStatusNotice.tsx

@@ -1,56 +0,0 @@
-import './MessageStatusNotice.scss'
-
-import { Button } from 'antd'
-import { useTranslation } from 'react-i18next'
-
-import type { ChatHistoryStatusNotice } from './build-chat-history-status-notices'
-
-export function MessageStatusNotice({
-  notice,
-  onRetryConnection,
-  onRetrySessionCreation
-}: {
-  notice: ChatHistoryStatusNotice
-  onRetryConnection: () => void
-  onRetrySessionCreation?: () => void
-}) {
-  const { t } = useTranslation()
-  const actionLabel = notice.action === 'retry-session-creation'
-    ? t('chat.retrySessionCreation')
-    : t('chat.retryConnection')
-  const handleAction = notice.action === 'retry-session-creation'
-    ? onRetrySessionCreation
-    : onRetryConnection
-
-  return (
-    <div className={`message-status-notice message-status-notice--${notice.tone} ${notice.isMock ? 'is-mock' : ''}`}>
-      <div className='message-status-notice__card' role='status' aria-live='polite'>
-        <div className='message-status-notice__content'>
-          <div className='message-status-notice__header'>
-            <div className='message-status-notice__title-row'>
-              <span className='material-symbols-rounded message-status-notice__icon'>{notice.icon}</span>
-              <div className='message-status-notice__title'>{notice.title}</div>
-              {notice.isMock && (
-                <span className='message-status-notice__badge'>{t('chat.debugMockLabel')}</span>
-              )}
-            </div>
-            {notice.meta != null && notice.meta !== '' && (
-              <span className='message-status-notice__meta'>{notice.meta}</span>
-            )}
-          </div>
-          <div className='message-status-notice__message'>{notice.message}</div>
-          {notice.detail != null && notice.detail !== '' && (
-            <div className='message-status-notice__detail'>{notice.detail}</div>
-          )}
-          {notice.action != null && handleAction != null && (
-            <div className='message-status-notice__actions'>
-              <Button size='small' onClick={handleAction}>
-                {actionLabel}
-              </Button>
-            </div>
-          )}
-        </div>
-      </div>
-    </div>
-  )
-}

package/src/components/chat/messages/build-chat-history-status-notices.ts

@@ -1,143 +0,0 @@
-import type { ChatErrorState } from '#~/hooks/chat/interaction-state'
-
-type Translate = (key: string, options?: Record<string, unknown>) => string
-
-export interface ChatHistoryStatusNotice {
-  action?: 'retry-connection' | 'retry-session-creation'
-  detail?: string
-  icon: string
-  id: string
-  isMock?: boolean
-  message: string
-  meta?: string
-  tone: 'error' | 'warning'
-  title: string
-}
-
-const createModelUnavailableNotice = (t: Translate, isMock = false): ChatHistoryStatusNotice => ({
-  icon: 'settings_suggest',
-  id: isMock ? 'mock-model-unavailable' : 'model-unavailable',
-  isMock,
-  message: t('chat.modelConfigRequired'),
-  detail: t('chat.modelConfigRequiredHelp'),
-  tone: 'warning',
-  title: t('chat.modelConfigRequiredTitle')
-})
-
-const createConnectionNotice = (
-  t: Translate,
-  state: ChatErrorState,
-  isMock = false
-): ChatHistoryStatusNotice => {
-  const isClosed = state.reason === 'closed'
-
-  return {
-    action: isMock ? undefined : 'retry-connection',
-    detail: isClosed ? t('chat.connectionClosedHelp') : t('chat.connectionErrorHelp'),
-    icon: isClosed ? 'wifi_off' : 'cloud_off',
-    id: isMock
-      ? isClosed ? 'mock-connection-closed' : 'mock-connection-error'
-      : isClosed
-      ? 'connection-closed'
-      : 'connection-error',
-    isMock,
-    message: state.message,
-    tone: 'error',
-    title: isClosed ? t('chat.connectionClosedTitle') : t('chat.connectionErrorTitle')
-  }
-}
-
-const createSessionNotice = (
-  t: Translate,
-  state: ChatErrorState,
-  isMock = false
-): ChatHistoryStatusNotice => {
-  const isCreateFailure = state.action === 'retry-session-creation'
-
-  return {
-    ...(isMock || state.action == null ? {} : { action: state.action }),
-    detail: isCreateFailure ? t('chat.sessionCreateFailedHelp') : t('chat.sessionErrorHelp'),
-    icon: 'error',
-    id: isMock ? 'mock-session-error' : isCreateFailure ? 'session-create-failed' : 'session-error',
-    isMock,
-    message: state.message,
-    ...(!isCreateFailure && state.code != null && state.code !== ''
-      ? { meta: t('chat.sessionErrorCode', { code: state.code }) }
-      : {}),
-    tone: 'error',
-    title: isCreateFailure ? t('chat.sessionCreateFailedTitle') : t('chat.sessionErrorTitle')
-  }
-}
-
-export const buildChatHistoryStatusNotices = ({
-  errorState,
-  isDebugMode,
-  modelUnavailable,
-  t
-}: {
-  errorState?: ChatErrorState | null
-  isDebugMode: boolean
-  modelUnavailable: boolean
-  t: Translate
-}) => {
-  const notices: ChatHistoryStatusNotice[] = []
-  const activeScenarios = new Set<string>()
-
-  if (modelUnavailable) {
-    notices.push(createModelUnavailableNotice(t))
-    activeScenarios.add('model-unavailable')
-  }
-
-  if (errorState != null && errorState.message.trim() !== '') {
-    if (errorState.kind === 'session') {
-      notices.push(createSessionNotice(t, errorState))
-      activeScenarios.add('session-error')
-    } else {
-      notices.push(createConnectionNotice(t, errorState))
-      activeScenarios.add(errorState.reason === 'closed' ? 'connection-closed' : 'connection-error')
-    }
-  }
-
-  if (!isDebugMode) {
-    return notices
-  }
-
-  const mockNotices: Array<{ notice: ChatHistoryStatusNotice; scenario: string }> = [
-    {
-      scenario: 'connection-error',
-      notice: createConnectionNotice(t, {
-        kind: 'connection',
-        message: t('chat.debugMockConnectionErrorMessage'),
-        reason: 'error'
-      }, true)
-    },
-    {
-      scenario: 'connection-closed',
-      notice: createConnectionNotice(t, {
-        kind: 'connection',
-        message: t('chat.debugMockConnectionClosedMessage'),
-        reason: 'closed'
-      }, true)
-    },
-    {
-      scenario: 'session-error',
-      notice: createSessionNotice(t, {
-        kind: 'session',
-        message: t('chat.debugMockSessionErrorMessage'),
-        code: 'session_timeout'
-      }, true)
-    },
-    {
-      scenario: 'model-unavailable',
-      notice: createModelUnavailableNotice(t, true)
-    }
-  ]
-
-  for (const mock of mockNotices) {
-    if (!activeScenarios.has(mock.scenario)) {
-      notices.push(mock.notice)
-    }
-  }
-
-  return notices
-}

package/src/components/chat/messages/build-message-context-menu-entries.ts

@@ -1,166 +0,0 @@
-import type { ChatMessage } from '@vibe-forge/core'
-
-import { buildSessionUrl } from '#~/utils/chat-links.js'
-import { copyTextWithFeedback } from '#~/utils/copy.js'
-import type { MessageContextMenuEntry } from './MessageContextMenuContent'
-
-type PendingMessageMenuAction = 'fork' | 'recall' | null
-
-export function buildMessageContextMenuEntries({
-  anchorId,
-  canEdit,
-  canFork,
-  canRecall,
-  copyableText,
-  isDebugMode,
-  isEditing,
-  messageApi,
-  onCloseMenu,
-  onConfirmableActionClick,
-  onStartEditing,
-  sessionId,
-  sourceMessage,
-  t
-}: {
-  anchorId: string
-  canEdit: boolean
-  canFork: boolean
-  canRecall: boolean
-  copyableText?: string
-  isDebugMode: boolean
-  isEditing: boolean
-  messageApi: {
-    error: (content: string) => void
-    success: (content: string) => void
-  }
-  onCloseMenu: () => void
-  onConfirmableActionClick: (action: Exclude<PendingMessageMenuAction, null>) => void
-  onStartEditing: () => void
-  sessionId?: string
-  sourceMessage: ChatMessage
-  t: (key: string, options?: Record<string, unknown>) => string
-}): MessageContextMenuEntry[] {
-  const entries: MessageContextMenuEntry[] = []
-
-  const closeWithCopy = (text: string, successMessage: string) => {
-    onCloseMenu()
-    void copyTextWithFeedback({
-      text,
-      messageApi,
-      successMessage,
-      failureMessage: t('chat.messageActions.copyFailed')
-    })
-  }
-
-  if (copyableText != null) {
-    entries.push({
-      key: 'copy',
-      label: t('chat.messageActions.copy'),
-      icon: 'content_copy',
-      onClick: () => {
-        closeWithCopy(copyableText, t('chat.messageActions.copySuccess'))
-      }
-    })
-  }
-
-  if (canEdit && !isEditing) {
-    entries.push({
-      key: 'edit',
-      label: t('chat.messageActions.edit'),
-      icon: 'edit',
-      onClick: () => {
-        onCloseMenu()
-        onStartEditing()
-      }
-    })
-  }
-
-  if (canRecall) {
-    entries.push({
-      key: 'recall',
-      label: t('chat.messageActions.recall'),
-      confirmLabel: t('common.confirmAction', {
-        action: t('chat.messageActions.recall')
-      }),
-      icon: 'undo',
-      danger: true,
-      onClick: () => {
-        onConfirmableActionClick('recall')
-      }
-    })
-  }
-
-  if (canFork) {
-    entries.push({
-      key: 'fork',
-      label: t('chat.messageActions.fork'),
-      confirmLabel: t('common.confirmAction', {
-        action: t('chat.messageActions.fork')
-      }),
-      icon: 'fork_right',
-      onClick: () => {
-        onConfirmableActionClick('fork')
-      }
-    })
-  }
-
-  if (entries.length > 0) {
-    entries.push({
-      key: 'divider-primary',
-      type: 'divider',
-      label: '',
-      icon: '',
-      onClick: () => undefined
-    })
-  }
-
-  if (sessionId != null && sessionId !== '') {
-    entries.push({
-      key: 'copy-link',
-      label: t('chat.messageActions.copyLink'),
-      icon: 'link',
-      onClick: () => {
-        closeWithCopy(buildSessionUrl(sessionId, { anchorId }), t('chat.messageActions.copyLinkSuccess'))
-      }
-    })
-  }
-
-  entries.push({
-    key: 'copy-id',
-    label: t('chat.messageActions.copyId'),
-    icon: 'fingerprint',
-    onClick: () => {
-      closeWithCopy(sourceMessage.id, t('chat.messageActions.copyIdSuccess'))
-    }
-  })
-
-  if (isDebugMode) {
-    entries.push(
-      {
-        key: 'divider-debug',
-        type: 'divider',
-        label: '',
-        icon: '',
-        onClick: () => undefined
-      },
-      {
-        key: 'copy-json',
-        label: t('chat.messageActions.copyJson'),
-        icon: 'data_object',
-        onClick: () => {
-          closeWithCopy(JSON.stringify(sourceMessage, null, 2), t('chat.messageActions.copyJsonSuccess'))
-        }
-      },
-      {
-        key: 'copy-timestamp',
-        label: t('chat.messageActions.copyTimestamp'),
-        icon: 'schedule',
-        onClick: () => {
-          closeWithCopy(String(sourceMessage.createdAt), t('chat.messageActions.copyTimestampSuccess'))
-        }
-      }
-    )
-  }
-
-  return entries
-}

package/src/components/chat/messages/message-action-utils.ts

@@ -1,29 +0,0 @@
-import type { ChatRenderItem } from './message-utils'
-
-export function getLastMessageAnchorId(renderItems: ChatRenderItem[]) {
-  for (let index = renderItems.length - 1; index >= 0; index -= 1) {
-    const item = renderItems[index]
-    if (item?.type === 'message') {
-      return item.anchorId
-    }
-  }
-
-  return null
-}
-
-export function getLastAssistantActionAnchorId(renderItems: ChatRenderItem[]) {
-  const lastItem = renderItems[renderItems.length - 1]
-  if (lastItem?.type === 'tool-group') {
-    return null
-  }
-
-  for (let index = renderItems.length - 1; index >= 0; index -= 1) {
-    const item = renderItems[index]
-    if (item == null) continue
-    if (item.type === 'tool-group') continue
-    if (item.message.role === 'user') continue
-    return item.anchorId
-  }
-
-  return null
-}

package/src/components/chat/messages/message-content-utils.ts

@@ -1,121 +0,0 @@
-import type { ChatMessage, ChatMessageContent } from '@vibe-forge/core'
-
-export type EditableMessageItem =
-  | Extract<ChatMessageContent, { type: 'text' }>
-  | Extract<ChatMessageContent, { type: 'image' }>
-
-export type EditableMessageContent = string | EditableMessageItem[]
-
-const isEditableMessageItem = (item: ChatMessageContent): item is EditableMessageItem => {
-  return item.type === 'text' || item.type === 'image'
-}
-
-const cloneEditableMessageContent = (content: EditableMessageContent) => {
-  if (typeof content === 'string') {
-    return content
-  }
-
-  return content.map((item) => {
-    if (item.type === 'text') {
-      return { type: 'text', text: item.text } satisfies ChatMessageContent
-    }
-
-    return {
-      type: 'image',
-      url: item.url,
-      name: item.name,
-      size: item.size,
-      mimeType: item.mimeType
-    } satisfies ChatMessageContent
-  })
-}
-
-export const normalizeEditableMessageContent = (content: string | ChatMessageContent[] | undefined) => {
-  if (content == null) {
-    return undefined
-  }
-
-  if (typeof content === 'string') {
-    const trimmed = content.trim()
-    return trimmed === '' ? undefined : trimmed
-  }
-
-  const normalized: EditableMessageItem[] = []
-  for (const item of content) {
-    if (!isEditableMessageItem(item)) {
-      return undefined
-    }
-
-    if (item.type === 'text') {
-      const text = item.text.trim()
-      if (text !== '') {
-        normalized.push({ type: 'text', text })
-      }
-      continue
-    }
-
-    normalized.push({
-      type: 'image',
-      url: item.url,
-      name: item.name,
-      size: item.size,
-      mimeType: item.mimeType
-    })
-  }
-
-  return normalized.length === 0 ? undefined : normalized
-}
-
-export const getEditableMessageContent = (message: ChatMessage) => {
-  if (typeof message.content === 'string') {
-    const trimmed = message.content.trim()
-    return trimmed === '' ? undefined : message.content
-  }
-
-  if (!Array.isArray(message.content) || message.toolCall != null) {
-    return undefined
-  }
-
-  const editableItems = message.content.filter(isEditableMessageItem)
-  if (editableItems.length !== message.content.length || editableItems.length === 0) {
-    return undefined
-  }
-
-  const hasVisibleContent = editableItems.some((item) => item.type === 'image' || item.text.trim() !== '')
-  if (!hasVisibleContent) {
-    return undefined
-  }
-
-  return cloneEditableMessageContent(editableItems)
-}
-
-export const isSameEditableMessageContent = (
-  left: EditableMessageContent | undefined,
-  right: EditableMessageContent | undefined
-) => {
-  const normalizedLeft = normalizeEditableMessageContent(left)
-  const normalizedRight = normalizeEditableMessageContent(right)
-
-  return JSON.stringify(normalizedLeft) === JSON.stringify(normalizedRight)
-}
-
-export const getCopyableMessageText = (message: ChatMessage) => {
-  if (typeof message.content === 'string') {
-    return message.content.trim() === '' ? undefined : message.content
-  }
-
-  if (!Array.isArray(message.content)) {
-    return undefined
-  }
-
-  const textItems = message.content
-    .filter((item): item is Extract<ChatMessageContent, { type: 'text' }> => item.type === 'text')
-    .map(item => item.text)
-    .filter(text => text.trim() !== '')
-
-  if (textItems.length === 0) {
-    return undefined
-  }
-
-  return textItems.join('\n\n')
-}

package/src/components/chat/messages/message-turns.ts

@@ -1,88 +0,0 @@
-import type { ChatRenderItem } from './message-utils'
-
-interface MessageTurnDraft {
-  id: string
-  items: ChatRenderItem[]
-  startedByUser: boolean
-}
-
-export interface MessageTurn {
-  durationMs: number | null
-  hiddenCount: number
-  id: string
-  isCollapsed: boolean
-  isExpandable: boolean
-  items: ChatRenderItem[]
-  visibleItems: ChatRenderItem[]
-}
-
-const isUserTurnStarter = (item: ChatRenderItem) => {
-  return item.type === 'message' && item.originalMessage.role === 'user'
-}
-
-export const buildMessageTurns = (params: {
-  expandedTurnIds: Set<string>
-  hashAnchorId?: string
-  keepLastTurnExpanded: boolean
-  renderItems: ChatRenderItem[]
-}): MessageTurn[] => {
-  const drafts: MessageTurnDraft[] = []
-  let currentDraft: MessageTurnDraft | null = null
-
-  for (const item of params.renderItems) {
-    if (isUserTurnStarter(item)) {
-      if (currentDraft != null) {
-        drafts.push(currentDraft)
-      }
-
-      currentDraft = {
-        id: item.originalMessage.id,
-        items: [item],
-        startedByUser: true
-      }
-      continue
-    }
-
-    if (currentDraft == null) {
-      currentDraft = {
-        id: `orphan:${item.anchorId}`,
-        items: [item],
-        startedByUser: false
-      }
-      continue
-    }
-
-    currentDraft.items.push(item)
-  }
-
-  if (currentDraft != null) {
-    drafts.push(currentDraft)
-  }
-
-  return drafts.map((draft, index) => {
-    const isLastTurn = index === drafts.length - 1
-    const startTimestamp = draft.items[0]?.originalMessage.createdAt ?? null
-    const endTimestamp = draft.items[draft.items.length - 1]?.originalMessage.createdAt ?? null
-    const hiddenCount = Math.max(draft.items.length - 2, 0)
-    const isExpandable = draft.startedByUser && hiddenCount > 0
-    const hasHashTarget = params.hashAnchorId != null && params.hashAnchorId !== ''
-      ? draft.items.some((item) => item.anchorId === params.hashAnchorId)
-      : false
-    const shouldCollapseByDefault = isExpandable && !(isLastTurn && params.keepLastTurnExpanded)
-    const isCollapsed = shouldCollapseByDefault && !params.expandedTurnIds.has(draft.id) && !hasHashTarget
-
-    return {
-      durationMs: startTimestamp != null && endTimestamp != null
-        ? Math.max(endTimestamp - startTimestamp, 0)
-        : null,
-      hiddenCount,
-      id: draft.id,
-      isCollapsed,
-      isExpandable,
-      items: draft.items,
-      visibleItems: isCollapsed
-        ? [draft.items[0]!, draft.items[draft.items.length - 1]!]
-        : draft.items
-    }
-  })
-}