opencode icon indicating copy to clipboard operation
opencode copied to clipboard

feat(tui): add Project Files viewer/editor with vi mode support

Open ryanwyler opened this issue 1 month ago • 2 comments

Summary

Adds a file browser and viewer/editor panel to the TUI for viewing and editing project files directly within OpenCode.

Activate vi prompt in command menu: Use vi basic prompt editor / Use standard prompt editor Activate vi editor in command menu: Use vi basic project file editor / Use standard project file editor

Depends on: #7016 (vi basic mode extension)

Features

  • Project Files Browser - File tree in sidebar showing project files with expand/collapse
  • File Viewer Panel - View files with syntax highlighting, resizable panel with drag divider
  • File Editor - Edit files directly in the TUI with save (ctrl+s) and cancel (ctrl+c)
  • Vi Mode Integration - Optional vi basic mode for editing (toggle with ctrl+/)
    • Status bar showing INSERT/NORMAL state and command buffer
    • Search: / forward, ? backward, n/N next/prev match
    • Search bar UI displays when typing search pattern
  • Focus Management - Proper keyboard focus between editor and prompt
    • Click to refocus editor panel
    • Keys only captured when editor textarea is focused

Configuration

  • editor_mode KV setting: "standard" or "vi" (default: standard)
  • Toggle via ctrl+/ in edit mode or command menu

Files Changed

File Changes
routes/session/project-files.tsx File tree component
routes/session/content-panel.tsx Panel wrapper with resize divider
routes/session/file-viewer.tsx View/edit with vi mode integration
routes/session/sidebar.tsx ProjectFiles integration
routes/session/index.tsx ContentPanel + editor mode toggle

ryanwyler avatar Jan 06 '26 02:01 ryanwyler

The following comment was made by an LLM, it may be inaccurate:

Duplicate PR Check Results

✅ No duplicate PRs found.

The current PR (7017) is the only PR addressing the Project Files viewer/editor feature.

Related PR (not a duplicate):

  • PR #7016: "feat(tui): add vi basic mode extension for prompt and editor"
    • This is a dependency of the current PR (as noted in the description), not a duplicate. PR #7016 provides the vi mode extension that PR #7017 integrates into the file editor.

The searches across multiple relevant keywords (TUI project files, file browser, vi mode, syntax highlighting) confirm this is a new feature with no competing implementations.

github-actions[bot] avatar Jan 06 '26 02:01 github-actions[bot]

Enable VI in prompt and Editor image

Screenshot from 2026-01-05 19-24-31 Screenshot from 2026-01-05 19-24-44 Screenshot from 2026-01-05 19-24-58

ryanwyler avatar Jan 06 '26 02:01 ryanwyler

This was experimental, closing PR. This branch is available on my fork if you're interested in it.

ryanwyler avatar Jan 15 '26 05:01 ryanwyler