vrubel/vcom
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix directory preview layout to exactly match browser pane columns

Browse source 
Root cause: renderPreviewPane() was stuffing directory entries into the
viewport model via SetContent(), then rendering through
renderPreviewContent() which wraps the viewport in an additional
border+padding box. This reduced the effective content width by 4
characters compared to the browser pane's innerWidth (width-2), causing
column misalignment where the date column would wrap to the next line.

Fix: For directory previews, directly render entries using the same
renderPaneRows() and renderColumnsHeader() functions as the browser
pane, at the same innerWidth. A temporary BrowserPane is created with
the directory entries, and renderPaneRows() is called with active=false,
producing pixel-identical output to the main file browser.

Removed renderDirectoryPreviewBody() which is no longer needed.
This commit is contained in:
vrubelroman 2026-04-27 16:52:44 +03:00
parent db5eaba409
commit bba8783f10
3 changed files with 22 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

14
internal/fs/preview.go
View file

@ -53,6 +53,7 @@ type Preview struct {
Body string
PlainBody string
Metadata Metadata
Entries []Entry
}
type PreviewOptions struct {
@ -91,7 +92,7 @@ func BuildPreview(entry Entry, options PreviewOptions) Preview {
preview.Kind = PreviewKindDirectory
preview.Metadata.Size = entry.Size
preview.Metadata.SizeKnown = entry.DirSizeKnown
preview.Body = buildDirectoryPreview(entry.Path, options)
preview.Body, preview.Entries = buildDirectoryPreview(entry.Path, options)
preview.PlainBody = preview.Body
return preview
}
@ -305,7 +306,7 @@ func chromaStyleName(themeName string) string {
}
}
func buildDirectoryPreview(path string, options PreviewOptions) string {
func buildDirectoryPreview(path string, options PreviewOptions) (string, []Entry) {
entries, err := ListDir(path, ListOptions{
ShowHidden: options.ShowHidden,
DirsFirst: options.DirsFirst,
@ -313,12 +314,15 @@ func buildDirectoryPreview(path string, options PreviewOptions) string {
SortReverse: options.SortReverse,
})
if err != nil {
return fmt.Sprintf("Could not list directory:\n\n%s", err)
return fmt.Sprintf("Could not list directory:\n\n%s", err), nil
}
if len(entries) == 0 {
return "Directory is empty."
return "Directory is empty.", nil
}
// Return all entries as-is for column-based rendering.
// The text body is still generated for terminals that don't support
// the rich rendering, and as a fallback.
var lines []string
for _, entry := range entries {
if entry.IsParent {
@ -342,7 +346,7 @@ func buildDirectoryPreview(path string, options PreviewOptions) string {
}
}
return strings.Join(lines, "\n")
return strings.Join(lines, "\n"), entries
}
func previewIcon(entry Entry, useNerdIcons bool) string {

13
internal/ui/model.go
View file

@ -2363,7 +2363,18 @@ func renderPreviewPane(preview vfs.Preview, viewportModel *viewport.Model, cfg c
contentHeight := max(innerHeight-usedHeight, 3)
viewportModel.Width = max(innerWidth-2, 10)
viewportModel.Height = max(contentHeight-3, 1)
parts = append(parts, renderPreviewContent(viewportModel, palette, innerWidth, contentHeight))
// Directory previews: borrow the column layout from the browser pane
// (renderPaneRows + renderColumnsHeader at the same innerWidth),
// but non-interactive (no cursor, no selection).
if preview.Kind == vfs.PreviewKindDirectory && len(preview.Entries) > 0 {
dirPane := BrowserPane{Entries: preview.Entries}
headerRow := renderColumnsHeader(cfg, innerWidth, palette, palette.Panel, useNerdfont)
rows := renderPaneRows(dirPane, cfg, palette, innerWidth, contentHeight, false, -1, palette.Panel, useNerdfont)
parts = append(parts, lipgloss.JoinVertical(lipgloss.Left, headerRow, rows))
} else {
parts = append(parts, renderPreviewContent(viewportModel, palette, innerWidth, contentHeight))
}
content := lipgloss.NewStyle().
Width(innerWidth).

2
vcom.toml
View file

@ -4,7 +4,7 @@ right_path = ''
[ui]
app_title = 'vcom'
theme = 'vesper'
theme = 'ayu-dark'
icon_mode = 'auto'
show_title_bar = true
show_footer = true