on main help sign in
fix(filepicker): general fixes to size and position

* The image and dialog are now rendered at a fixed height. Before, the height could change as you navigate, which did not look well in practice. * We'll now hide the preview if the terminal height is not enought for it. * Better position. Before, in some scenarios the dialog was been rendered too close to the bottom, instead of centered.

commit40599a04e42bd410295933e10e7547df48eb9632 authorAndrey Nering <andreynering@users.noreply.github.com> dateFri 22 Aug 2025, 17:32 (1 year ago) parent68adc06
1 file changed+29−7
internal/tui/components/dialogs/filepicker/filepicker.go+29−7
internal/tui/components/dialogs/filepicker/filepicker.go+29−7
@@ -24,6 +24,7 @@ const (
2424 MaxAttachmentSize = int64(5 * 1024 * 1024) // 5MB
2525 FilePickerID = "filepicker"
2626 fileSelectionHeight = 10
27+ previewHeight = 20
2728)
2829
2930type FilePickedMsg struct {
@@ -160,13 +161,25 @@ func (m *model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
160161func (m *model) View() string {
161162 t := styles.CurrentTheme()
162163
163− content := lipgloss.JoinVertical(
164− lipgloss.Left,
164+ strs := []string{
165165 t.S().Base.Padding(0, 1, 1, 1).Render(core.Title("Add Image", m.width-4)),
166− m.imagePreview(),
166+ }
167+
168+ // hide image preview if the terminal is too small
169+ if x, y := m.imagePreviewSize(); x > 0 && y > 0 {
170+ strs = append(strs, m.imagePreview())
171+ }
172+
173+ strs = append(
174+ strs,
167175 m.filePicker.View(),
168176 t.S().Base.Width(m.width-2).PaddingLeft(1).AlignHorizontal(lipgloss.Left).Render(m.help.View(m.keyMap)),
169177 )
178+
179+ content := lipgloss.JoinVertical(
180+ lipgloss.Left,
181+ strs...,
182+ )
170183 return m.style().Render(content)
171184}
172185
@@ -180,12 +193,15 @@ func (m *model) currentImage() string {
180193}
181194
182195func (m *model) imagePreview() string {
196+ const padding = 2
197+
183198 t := styles.CurrentTheme()
184199 w, h := m.imagePreviewSize()
200+
185201 if m.currentImage() == "" {
186202 imgPreview := t.S().Base.
187− Width(w).
188− Height(h).
203+ Width(w - padding).
204+ Height(h - padding).
189205 Background(t.BgOverlay)
190206
191207 return m.imagePreviewStyle().Render(imgPreview.Render())
@@ -200,7 +216,10 @@ func (m *model) imagePreviewStyle() lipgloss.Style {
200216}
201217
202218func (m *model) imagePreviewSize() (int, int) {
203− return m.width - 4, min(20, m.wHeight/2)
219+ if m.wHeight-fileSelectionHeight-8 > previewHeight {
220+ return m.width - 4, previewHeight
221+ }
222+ return 0, 0
204223}
205224
206225func (m *model) style() lipgloss.Style {
@@ -218,7 +237,10 @@ func (m *model) ID() dialogs.DialogID {
218237
219238// Position implements FilePicker.
220239func (m *model) Position() (int, int) {
221− row := m.wHeight/4 - 2 // just a bit above the center
240+ _, imageHeight := m.imagePreviewSize()
241+ dialogHeight := fileSelectionHeight + imageHeight + 4
242+ row := (m.wHeight - dialogHeight) / 2
243+
222244 col := m.wWidth / 2
223245 col -= m.width / 2
224246 return row, col