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

package/src/components/chat/workspace-drawer/WorkspaceDrawerChangedFolderTree.tsx

@@ -1,191 +0,0 @@
-import type { CSSProperties } from 'react'
-import { useEffect, useMemo, useState } from 'react'
-
-import { WorkspaceDrawerChangedFileRow } from './WorkspaceDrawerChangedFileRow'
-import type {
-  ChangedFileScope,
-  ChangedFolderNode,
-  ChangedTreeCommand,
-  SelectedChangedFolder
-} from './changed-files-model'
-import { collectChangedFolderPaths, findChangedFolderNode } from './changed-files-model'
-
-const getFolderDepthStyle = (depth: number): CSSProperties => ({
-  '--changed-folder-depth': depth
-} as CSSProperties)
-
-const getCompactFolderNode = (node: ChangedFolderNode) => {
-  const names = [node.name]
-  let current = node
-
-  while (current.entries.length === 0 && current.children.length === 1) {
-    current = current.children[0]!
-    names.push(current.name)
-  }
-
-  return {
-    label: names.join('/'),
-    node: current
-  }
-}
-
-function WorkspaceDrawerChangedFolderNode({
-  depth,
-  expandedPaths,
-  node,
-  onOpenFile,
-  onSelectFolder,
-  onToggleFolder,
-  selectedFilePath,
-  selectedFolder,
-  scope
-}: {
-  depth: number
-  expandedPaths: Set<string>
-  node: ChangedFolderNode
-  onOpenFile?: (path: string) => void
-  onSelectFolder: (path: string) => void
-  onToggleFolder: (path: string) => void
-  selectedFilePath?: string | null
-  selectedFolder: SelectedChangedFolder | null
-  scope: ChangedFileScope
-}) {
-  const isRoot = node.path === ''
-  const compactFolder = isRoot ? { label: '', node } : getCompactFolderNode(node)
-  const displayNode = compactFolder.node
-  const isExpanded = isRoot || expandedPaths.has(displayNode.path)
-  const isSelected = selectedFolder?.scope === scope && selectedFolder.path === displayNode.path
-
-  return (
-    <div className='chat-workspace-drawer__changed-folder-node'>
-      {!isRoot && (
-        <button
-          type='button'
-          className={`chat-workspace-drawer__changed-folder ${isExpanded ? 'is-expanded' : ''} ${
-            isSelected ? 'is-selected' : ''
-          }`}
-          style={getFolderDepthStyle(depth)}
-          aria-expanded={isExpanded}
-          aria-pressed={isSelected}
-          title={displayNode.path}
-          onClick={() => {
-            onSelectFolder(displayNode.path)
-            onToggleFolder(displayNode.path)
-          }}
-        >
-          <span className='material-symbols-rounded chat-workspace-drawer__changed-folder-icon'>
-            {isExpanded ? 'folder_open' : 'folder'}
-          </span>
-          <span className='chat-workspace-drawer__changed-folder-name'>{compactFolder.label}</span>
-        </button>
-      )}
-      <div
-        className={`chat-workspace-drawer__changed-folder-children ${isExpanded ? 'is-expanded' : 'is-collapsed'}`}
-      >
-        <div className='chat-workspace-drawer__changed-folder-children-inner'>
-          {displayNode.children.map(child => (
-            <WorkspaceDrawerChangedFolderNode
-              key={child.path}
-              depth={depth + 1}
-              expandedPaths={expandedPaths}
-              node={child}
-              selectedFilePath={selectedFilePath}
-              onOpenFile={onOpenFile}
-              onSelectFolder={onSelectFolder}
-              onToggleFolder={onToggleFolder}
-              selectedFolder={selectedFolder}
-              scope={scope}
-            />
-          ))}
-          {displayNode.entries.map(entry => (
-            <div
-              key={entry.key}
-              className='chat-workspace-drawer__changed-folder-entry'
-              style={getFolderDepthStyle(displayNode.path === '' ? 0 : depth + 1)}
-            >
-              <WorkspaceDrawerChangedFileRow
-                entry={entry}
-                selectedFilePath={selectedFilePath}
-                showDirectory={false}
-                onOpenFile={onOpenFile}
-              />
-            </div>
-          ))}
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export function WorkspaceDrawerChangedFolderTree({
-  command,
-  onOpenFile,
-  onSelectFolder,
-  root,
-  scope,
-  selectedFilePath,
-  selectedFolder
-}: {
-  command: ChangedTreeCommand | null
-  onOpenFile?: (path: string) => void
-  onSelectFolder: (folder: SelectedChangedFolder) => void
-  root: ChangedFolderNode
-  scope: ChangedFileScope
-  selectedFilePath?: string | null
-  selectedFolder: SelectedChangedFolder | null
-}) {
-  const allFolderPaths = useMemo(() => collectChangedFolderPaths(root), [root])
-  const [expandedPaths, setExpandedPaths] = useState<Set<string>>(() => new Set(allFolderPaths))
-
-  useEffect(() => {
-    setExpandedPaths(new Set(allFolderPaths))
-  }, [allFolderPaths])
-
-  useEffect(() => {
-    if (command == null) {
-      return
-    }
-
-    const targetPath = selectedFolder?.scope === scope ? selectedFolder.path : null
-    const targetNode = targetPath == null ? root : findChangedFolderNode(root, targetPath)
-    const targetPaths = targetNode == null ? allFolderPaths : collectChangedFolderPaths(targetNode)
-    const paths = targetPath == null ? targetPaths : [targetPath, ...targetPaths]
-
-    setExpandedPaths((prev) => {
-      if (command.action === 'expand') {
-        return new Set([...prev, ...paths])
-      }
-      const next = new Set(prev)
-      for (const path of paths) {
-        next.delete(path)
-      }
-      return next
-    })
-  }, [allFolderPaths, command, root, scope, selectedFolder])
-
-  const handleToggleFolder = (path: string) => {
-    setExpandedPaths((prev) => {
-      const next = new Set(prev)
-      if (next.has(path)) {
-        next.delete(path)
-      } else {
-        next.add(path)
-      }
-      return next
-    })
-  }
-
-  return (
-    <WorkspaceDrawerChangedFolderNode
-      depth={0}
-      expandedPaths={expandedPaths}
-      node={root}
-      selectedFilePath={selectedFilePath}
-      onOpenFile={onOpenFile}
-      onSelectFolder={path => onSelectFolder({ scope, path })}
-      onToggleFolder={handleToggleFolder}
-      selectedFolder={selectedFolder}
-      scope={scope}
-    />
-  )
-}

package/src/components/chat/workspace-drawer/WorkspaceDrawerTree.tsx

@@ -1,35 +0,0 @@
-import type { ContextPickerFile } from '#~/components/workspace/context-file-types'
-import { toContextPickerFile } from '#~/components/workspace/context-file-types'
-import { ProjectFileTree } from '#~/components/workspace/project-file-tree/ProjectFileTree'
-import type { ProjectFileTreeCommand } from '#~/components/workspace/project-file-tree/project-file-tree-types'
-
-export function WorkspaceDrawerTree({
-  command,
-  onOpenFile,
-  onReferencePaths,
-  refreshKey,
-  selectedFilePath,
-  sessionId
-}: {
-  command: ProjectFileTreeCommand | null
-  onOpenFile?: (path: string) => void
-  onReferencePaths?: (files: ContextPickerFile[]) => void
-  refreshKey: number
-  selectedFilePath?: string | null
-  sessionId?: string
-}) {
-  return (
-    <ProjectFileTree
-      activePath={selectedFilePath}
-      className='chat-workspace-drawer__tree'
-      command={command}
-      refreshKey={refreshKey}
-      selectableTypes='all'
-      selectionMode='multiple'
-      sessionId={sessionId}
-      showContextMenu
-      onOpenFile={onOpenFile}
-      onReferenceNodes={nodes => onReferencePaths?.(nodes.map(toContextPickerFile))}
-    />
-  )
-}

package/src/components/chat/workspace-drawer/WorkspaceDrawerTreeState.tsx

@@ -1,17 +0,0 @@
-import { Empty } from 'antd'
-import { useTranslation } from 'react-i18next'
-
-export function WorkspaceDrawerTreeState({
-  kind
-}: {
-  kind: 'empty' | 'error'
-}) {
-  const { t } = useTranslation()
-
-  return (
-    <Empty
-      image={Empty.PRESENTED_IMAGE_SIMPLE}
-      description={t(kind === 'error' ? 'chat.contextPickerLoadFailed' : 'chat.contextPickerEmpty')}
-    />
-  )
-}

package/src/components/chat/workspace-drawer/changed-files-model.ts

@@ -1,152 +0,0 @@
-import type { GitChangedFile } from '@vibe-forge/types'
-
-export type ChangedFilesLayout = 'folders' | 'flat'
-export type ChangedFileScope = 'staged' | 'tracked' | 'untracked'
-export type ChangedTreeCommandAction = 'expand' | 'collapse'
-
-export interface ChangedTreeCommand {
-  action: ChangedTreeCommandAction
-  id: number
-}
-
-export interface ChangedFileEntry {
-  file: GitChangedFile
-  key: string
-  scope: ChangedFileScope
-}
-
-export interface ChangedFileSection {
-  count: number
-  entries: ChangedFileEntry[]
-  scope: ChangedFileScope
-}
-
-export interface ChangedFolderNode {
-  children: ChangedFolderNode[]
-  entries: ChangedFileEntry[]
-  name: string
-  path: string
-}
-
-export interface SelectedChangedFolder {
-  path: string
-  scope: ChangedFileScope
-}
-
-const sortEntries = (entries: ChangedFileEntry[]) =>
-  [...entries].sort((left, right) => left.file.path.localeCompare(right.file.path))
-
-export const getFileName = (path: string) => path.split('/').pop() ?? path
-
-export const getFileDirectory = (path: string) => {
-  const fileName = getFileName(path)
-  return path === fileName ? '' : path.slice(0, Math.max(0, path.length - fileName.length - 1))
-}
-
-export const getChangedFileEntries = (file: GitChangedFile): ChangedFileEntry[] => {
-  const entries: ChangedFileEntry[] = []
-
-  if (file.staged) {
-    entries.push({ file, key: `${file.path}:staged`, scope: 'staged' })
-  }
-  if (file.unstaged && !file.untracked) {
-    entries.push({ file, key: `${file.path}:tracked`, scope: 'tracked' })
-  }
-  if (file.untracked) {
-    entries.push({ file, key: `${file.path}:untracked`, scope: 'untracked' })
-  }
-
-  return entries
-}
-
-export const getChangedFileSections = (files: GitChangedFile[]): ChangedFileSection[] => {
-  const entries = files.flatMap(getChangedFileEntries)
-  const sections: ChangedFileSection[] = [
-    { scope: 'staged', entries: [], count: 0 },
-    { scope: 'tracked', entries: [], count: 0 },
-    { scope: 'untracked', entries: [], count: 0 }
-  ]
-
-  for (const section of sections) {
-    section.entries = sortEntries(entries.filter(entry => entry.scope === section.scope))
-    section.count = section.entries.length
-  }
-
-  return sections.filter(section => section.count > 0)
-}
-
-const findOrCreateFolderNode = (parent: ChangedFolderNode, name: string, path: string) => {
-  const existing = parent.children.find(child => child.path === path)
-  if (existing != null) {
-    return existing
-  }
-
-  const node: ChangedFolderNode = {
-    name,
-    path,
-    children: [],
-    entries: []
-  }
-  parent.children.push(node)
-  return node
-}
-
-const sortFolderNode = (node: ChangedFolderNode) => {
-  node.children.sort((left, right) => left.name.localeCompare(right.name))
-  node.entries = sortEntries(node.entries)
-  for (const child of node.children) {
-    sortFolderNode(child)
-  }
-}
-
-export const buildChangedFolderTree = (entries: ChangedFileEntry[]): ChangedFolderNode => {
-  const root: ChangedFolderNode = {
-    name: '',
-    path: '',
-    children: [],
-    entries: []
-  }
-
-  for (const entry of entries) {
-    const parts = entry.file.path.split('/').filter(Boolean)
-    const fileName = parts.pop()
-    if (fileName == null) {
-      continue
-    }
-
-    let current = root
-    let currentPath = ''
-    for (const part of parts) {
-      currentPath = currentPath === '' ? part : `${currentPath}/${part}`
-      current = findOrCreateFolderNode(current, part, currentPath)
-    }
-    current.entries.push(entry)
-  }
-
-  sortFolderNode(root)
-  return root
-}
-
-export const collectChangedFolderPaths = (node: ChangedFolderNode): string[] => {
-  const paths = node.path === '' ? [] : [node.path]
-  for (const child of node.children) {
-    paths.push(...collectChangedFolderPaths(child))
-  }
-  return paths
-}
-
-export const findChangedFolderNode = (
-  node: ChangedFolderNode,
-  path: string
-): ChangedFolderNode | null => {
-  if (node.path === path) {
-    return node
-  }
-  for (const child of node.children) {
-    const found = findChangedFolderNode(child, path)
-    if (found != null) {
-      return found
-    }
-  }
-  return null
-}

package/src/components/chat/workspace-drawer/workspace-drawer-icons.ts

@@ -1,110 +0,0 @@
-export interface WorkspaceDrawerIconMeta {
-  badgeIcon?: string
-  icon: string
-  tone: string
-}
-
-const normalizeName = (name: string) => name.trim().toLowerCase()
-
-const getExtension = (name: string) => {
-  const normalized = normalizeName(name)
-  const dotIndex = normalized.lastIndexOf('.')
-  return dotIndex <= 0 ? '' : normalized.slice(dotIndex + 1)
-}
-
-export const getWorkspaceFolderIconMeta = (name: string, expanded: boolean): WorkspaceDrawerIconMeta => {
-  const normalized = normalizeName(name)
-  const icon = expanded ? 'folder_open' : 'folder'
-  if (normalized === '.github') return { icon, tone: 'github', badgeIcon: 'commit' }
-  if (normalized === '.ai' || normalized === '.codex') return { icon, tone: 'ai', badgeIcon: 'auto_awesome' }
-  if (normalized === 'apps') return { icon, tone: 'app', badgeIcon: 'apps' }
-  if (normalized === 'packages') return { icon, tone: 'package', badgeIcon: 'inventory_2' }
-  if (normalized === 'scripts' || normalized === 'bin') return { icon, tone: 'script', badgeIcon: 'terminal' }
-  if (normalized === 'docs' || normalized === '.docs' || normalized === 'changelog') {
-    return { icon, tone: 'docs', badgeIcon: 'article' }
-  }
-  if (normalized === 'src') return { icon, tone: 'source', badgeIcon: 'code' }
-  if (normalized.includes('component')) return { icon, tone: 'component', badgeIcon: 'widgets' }
-  if (normalized.includes('route')) return { icon, tone: 'route', badgeIcon: 'alt_route' }
-  if (normalized.includes('hook')) return { icon, tone: 'hook', badgeIcon: 'link' }
-  if (normalized.includes('api') || normalized.includes('service')) return { icon, tone: 'api', badgeIcon: 'api' }
-  if (normalized.includes('style') || normalized.includes('scss') || normalized.includes('css')) {
-    return { icon, tone: 'style', badgeIcon: 'palette' }
-  }
-  if (normalized.includes('asset') || normalized === 'public') return { icon, tone: 'asset', badgeIcon: 'image' }
-  if (normalized.includes('test') || normalized === '__tests__') return { icon, tone: 'test', badgeIcon: 'checklist' }
-  return { icon, tone: 'folder' }
-}
-
-export const getWorkspaceFileIconMeta = (name: string): WorkspaceDrawerIconMeta => {
-  const normalized = normalizeName(name)
-  const extension = getExtension(name)
-  if (normalized === 'package.json') return { icon: 'inventory_2', tone: 'package' }
-  if (normalized.includes('lock')) return { icon: 'lock', tone: 'lock' }
-  if (normalized.startsWith('.env')) return { icon: 'key', tone: 'env' }
-  if (normalized.includes('config')) return { icon: 'tune', tone: 'config' }
-  if (normalized.includes('readme') || extension === 'md' || extension === 'mdx') {
-    return { icon: 'article', tone: 'docs' }
-  }
-  if (normalized.includes('gitignore') || normalized.includes('dockerignore')) {
-    return { icon: 'hide_source', tone: 'ignore' }
-  }
-  if (extension === 'ts' || extension === 'tsx') return { icon: 'data_object', tone: 'typescript' }
-  if (extension === 'js' || extension === 'jsx' || extension === 'mjs' || extension === 'cjs') {
-    return { icon: 'javascript', tone: 'javascript' }
-  }
-  if (extension === 'json') return { icon: 'data_object', tone: 'json' }
-  if (extension === 'scss' || extension === 'sass' || extension === 'css') return { icon: 'palette', tone: 'style' }
-  if (extension === 'html') return { icon: 'language', tone: 'html' }
-  if (['png', 'jpg', 'jpeg', 'gif', 'webp', 'svg', 'ico'].includes(extension)) {
-    return { icon: 'image', tone: 'image' }
-  }
-  if (['yml', 'yaml', 'toml'].includes(extension)) return { icon: 'settings', tone: 'config' }
-  if (['sh', 'bash', 'zsh'].includes(extension)) return { icon: 'terminal', tone: 'script' }
-  return { icon: 'draft', tone: 'file' }
-}
-
-export const getWorkspaceLinkedIconMeta = (
-  name: string,
-  linkType: 'directory' | 'file' | 'missing' | 'other' | undefined,
-  expanded: boolean,
-  linkKind: 'gitdir' | 'symlink' = 'symlink'
-): WorkspaceDrawerIconMeta => {
-  if (linkKind === 'gitdir') {
-    return {
-      icon: expanded ? 'folder_open' : 'folder',
-      tone: linkType === 'missing' ? 'symlink-broken' : 'git'
-    }
-  }
-
-  if (linkType === 'missing') {
-    return { icon: 'draft', tone: 'symlink-broken', badgeIcon: 'link_off' }
-  }
-
-  if (linkType === 'directory') {
-    return getWorkspaceFolderIconMeta(name, expanded)
-  }
-
-  if (linkType === 'file') {
-    return getWorkspaceFileIconMeta(name)
-  }
-
-  return { icon: 'draft', tone: 'symlink' }
-}
-
-export const getWorkspaceLinkIndicatorIconMeta = (
-  linkKind: 'gitdir' | 'symlink',
-  linkType: 'directory' | 'file' | 'missing' | 'other' | undefined,
-  isExternal?: boolean
-): WorkspaceDrawerIconMeta => {
-  if (linkType === 'missing') {
-    return { icon: 'link_off', tone: 'symlink-broken' }
-  }
-  if (linkKind === 'gitdir') {
-    return { icon: 'account_tree', tone: 'git' }
-  }
-  if (isExternal === true) {
-    return { icon: 'open_in_new', tone: 'symlink-external' }
-  }
-  return { icon: 'link', tone: 'symlink' }
-}

package/src/components/chat/workspace-file-editor/WorkspaceFileBreadcrumb.tsx

@@ -1,17 +0,0 @@
-export function WorkspaceFileBreadcrumb({ path }: { path: string }) {
-  const parts = path.split('/').filter(Boolean)
-
-  return (
-    <div className='workspace-file-editor__breadcrumb' title={path} data-dock-panel-no-resize='true'>
-      {parts.map((part, index) => {
-        const isLast = index === parts.length - 1
-        return (
-          <span key={`${part}:${index}`} className='workspace-file-editor__breadcrumb-part'>
-            <span className={isLast ? 'is-current' : undefined}>{part}</span>
-            {!isLast && <span className='workspace-file-editor__breadcrumb-separator'>/</span>}
-          </span>
-        )
-      })}
-    </div>
-  )
-}