on main help sign in
fix(ui): accurately calculate help and main height in UI layout
6b8ca6aAyman Bagabas
internal/ui/model/editor.go+39−2
@@ -15,6 +15,11 @@ type EditorKeyMap struct {
15 SendMessage key.Binding
15 SendMessage key.Binding
16 OpenEditor key.Binding
16 OpenEditor key.Binding
17 Newline key.Binding
17 Newline key.Binding
18+
19+ // Attachments key maps
20+ AttachmentDeleteMode key.Binding
21+ Escape key.Binding
22+ DeleteAllAttachments key.Binding
18}
23}
19
24
20func DefaultEditorKeyMap() EditorKeyMap {
25func DefaultEditorKeyMap() EditorKeyMap {
@@ -38,6 +43,18 @@ func DefaultEditorKeyMap() EditorKeyMap {
38 // to reflect that.
43 // to reflect that.
39 key.WithHelp("ctrl+j", "newline"),
44 key.WithHelp("ctrl+j", "newline"),
40 ),
45 ),
46+ AttachmentDeleteMode: key.NewBinding(
47+ key.WithKeys("ctrl+r"),
48+ key.WithHelp("ctrl+r+{i}", "delete attachment at index i"),
49+ ),
50+ Escape: key.NewBinding(
51+ key.WithKeys("esc", "alt+esc"),
52+ key.WithHelp("esc", "cancel delete mode"),
53+ ),
54+ DeleteAllAttachments: key.NewBinding(
55+ key.WithKeys("r"),
56+ key.WithHelp("ctrl+r+r", "delete all attachments"),
57+ ),
41 }
58 }
42}
59}
43
60
@@ -49,6 +66,8 @@ type EditorModel struct {
49 keyMap EditorKeyMap
66 keyMap EditorKeyMap
50 textarea *textarea.Model
67 textarea *textarea.Model
51
68
69+ attachments []any // TODO: Implement attachments
70+
52 readyPlaceholder string
71 readyPlaceholder string
53 workingPlaceholder string
72 workingPlaceholder string
54}
73}
@@ -110,12 +129,30 @@ func (m *EditorModel) View() string {
110
129
111// ShortHelp returns the short help view for the editor model.
130// ShortHelp returns the short help view for the editor model.
112func (m *EditorModel) ShortHelp() []key.Binding {
131func (m *EditorModel) ShortHelp() []key.Binding {
132+ k := m.keyMap
133+ binds := []key.Binding{
134+ k.AddFile,
135+ k.SendMessage,
136+ k.OpenEditor,
137+ k.Newline,
138+ }
139+
140+ if len(m.attachments) > 0 {
141+ binds = append(binds,
142+ k.AttachmentDeleteMode,
143+ k.DeleteAllAttachments,
144+ k.Escape,
145+ )
146+ }
147+
113− return nil
148+ return binds
114}
149}
115
150
116// FullHelp returns the full help view for the editor model.
151// FullHelp returns the full help view for the editor model.
117func (m *EditorModel) FullHelp() [][]key.Binding {
152func (m *EditorModel) FullHelp() [][]key.Binding {
118− return nil
153+ return [][]key.Binding{
154+ m.ShortHelp(),
155+ }
119}
156}
120
157
121// Cursor returns the relative cursor position of the editor.
158// Cursor returns the relative cursor position of the editor.
internal/ui/model/ui.go+48−28
@@ -59,6 +59,7 @@ func (m *UI) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
59 case tea.WindowSizeMsg:
59 case tea.WindowSizeMsg:
60 m.updateLayout(msg.Width, msg.Height)
60 m.updateLayout(msg.Width, msg.Height)
61 m.editor.SetSize(m.layout.editor.Dx(), m.layout.editor.Dy())
61 m.editor.SetSize(m.layout.editor.Dx(), m.layout.editor.Dy())
62+ m.help.Width = m.layout.help.Dx()
62 case tea.KeyPressMsg:
63 case tea.KeyPressMsg:
63 if m.dialog.HasDialogs() {
64 if m.dialog.HasDialogs() {
64 m.updateDialogs(msg, &cmds)
65 m.updateDialogs(msg, &cmds)
@@ -75,6 +76,7 @@ func (m *UI) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
75 case key.Matches(msg, m.keyMap.Help):
76 case key.Matches(msg, m.keyMap.Help):
76 m.showFullHelp = !m.showFullHelp
77 m.showFullHelp = !m.showFullHelp
77 m.help.ShowAll = m.showFullHelp
78 m.help.ShowAll = m.showFullHelp
79+ m.updateLayout(m.layout.area.Dx(), m.layout.area.Dy())
78 case key.Matches(msg, m.keyMap.Quit):
80 case key.Matches(msg, m.keyMap.Quit):
79 if !m.dialog.ContainsDialog(dialog.QuitDialogID) {
81 if !m.dialog.ContainsDialog(dialog.QuitDialogID) {
80 m.dialog.AddDialog(dialog.NewQuit(m.com))
82 m.dialog.AddDialog(dialog.NewQuit(m.com))
@@ -130,27 +132,28 @@ func (m *UI) View() tea.View {
130 v.Cursor = cur
132 v.Cursor = cur
131 }
133 }
132
134
133− layers = append(layers, lipgloss.NewLayer(
135+ mainLayer := lipgloss.NewLayer("").X(area.Min.X).Y(area.Min.Y).
136+ Width(area.Dx()).Height(area.Dy()).
137+ AddLayers(
138+ lipgloss.NewLayer(
134− lipgloss.NewStyle().Width(chatRect.Dx()).
139+ lipgloss.NewStyle().Width(chatRect.Dx()).
135− Height(chatRect.Dy()).
140+ Height(chatRect.Dy()).
136− Background(lipgloss.ANSIColor(rand.Intn(256))).
141+ Background(lipgloss.ANSIColor(rand.Intn(256))).
137− Render(" Main View "),
142+ Render(" Main View "),
138− ).X(chatRect.Min.X).Y(chatRect.Min.Y),
143+ ).X(chatRect.Min.X).Y(chatRect.Min.Y),
139− lipgloss.NewLayer(
144+ lipgloss.NewLayer(
140− lipgloss.NewStyle().Width(sideRect.Dx()).
145+ lipgloss.NewStyle().Width(sideRect.Dx()).
141− Height(sideRect.Dy()).
146+ Height(sideRect.Dy()).
142− Background(lipgloss.ANSIColor(rand.Intn(256))).
147+ Background(lipgloss.ANSIColor(rand.Intn(256))).
143− Render(" Side View "),
148+ Render(" Side View "),
144− ).X(sideRect.Min.X).Y(sideRect.Min.Y),
149+ ).X(sideRect.Min.X).Y(sideRect.Min.Y),
145− lipgloss.NewLayer(m.editor.View()).
150+ lipgloss.NewLayer(m.editor.View()).
146− X(editRect.Min.X).Y(editRect.Min.Y),
151+ X(editRect.Min.X).Y(editRect.Min.Y),
147− lipgloss.NewLayer(
148− lipgloss.NewStyle().Width(helpRect.Dx()).
149− Height(helpRect.Dy()).
150− Background(lipgloss.ANSIColor(rand.Intn(256))).
151− Render(m.help.View(helpKeyMap)),
152+ lipgloss.NewLayer(m.help.View(helpKeyMap)).
152− ).X(helpRect.Min.X).Y(helpRect.Min.Y),
153+ X(helpRect.Min.X).Y(helpRect.Min.Y),
153− )
154+ )
155+
156+ layers = append(layers, mainLayer)
154
157
155 v.Layer = lipgloss.NewCanvas(layers...)
158 v.Layer = lipgloss.NewCanvas(layers...)
156
159
@@ -209,23 +212,37 @@ func (m *UI) updateEditor(msg tea.KeyPressMsg, cmds *[]tea.Cmd) {
209// height given in cells.
212// height given in cells.
210func (m *UI) updateLayout(w, h int) {
213func (m *UI) updateLayout(w, h int) {
211 // The screen area we're working with
214 // The screen area we're working with
212− area := image.Rect(1, 1, w-1, h-1) // -1 for margins
215+ area := image.Rect(0, 0, w, h)
213 helpKeyMap := m.focusedKeyMap()
216 helpKeyMap := m.focusedKeyMap()
214 helpHeight := 1
217 helpHeight := 1
218+ if m.dialog.HasDialogs() && len(m.dialog.FullHelp()) > 0 && len(m.dialog.ShortHelp()) > 0 {
219+ helpKeyMap = m.dialog
220+ }
215 if m.showFullHelp {
221 if m.showFullHelp {
216− helpHeight = max(1, len(helpKeyMap.FullHelp()))
222+ for _, row := range helpKeyMap.FullHelp() {
223+ helpHeight = max(helpHeight, len(row))
224+ }
217 }
225 }
218
226
227+ // Add app margins
228+ mainRect := area
229+ mainRect.Min.X += 1
230+ mainRect.Min.Y += 1
231+ mainRect.Max.X -= 1
232+ mainRect.Max.Y -= 1
233+
234+ mainRect, helpRect := uv.SplitVertical(mainRect, uv.Fixed(mainRect.Dy()-helpHeight))
219− chatRect, sideRect := uv.SplitHorizontal(area, uv.Fixed(area.Dx()-40))
235+ chatRect, sideRect := uv.SplitHorizontal(mainRect, uv.Fixed(mainRect.Dx()-40))
220− chatRect, editRect := uv.SplitVertical(chatRect, uv.Fixed(area.Dy()-5-helpHeight))
236+ chatRect, editRect := uv.SplitVertical(chatRect, uv.Fixed(mainRect.Dy()-5))
237+
221− // Add 1 line margin bottom of mainRect
238+ // Add 1 line margin bottom of chatRect
222 chatRect, _ = uv.SplitVertical(chatRect, uv.Fixed(chatRect.Dy()-1))
239 chatRect, _ = uv.SplitVertical(chatRect, uv.Fixed(chatRect.Dy()-1))
223− editRect, helpRect := uv.SplitVertical(editRect, uv.Fixed(5))
224− // Add 1 line margin bottom of footRect
240+ // Add 1 line margin bottom of editRect
225 editRect, _ = uv.SplitVertical(editRect, uv.Fixed(editRect.Dy()-1))
241 editRect, _ = uv.SplitVertical(editRect, uv.Fixed(editRect.Dy()-1))
226
242
227 m.layout = layout{
243 m.layout = layout{
228 area: area,
244 area: area,
245+ main: mainRect,
229 chat: chatRect,
246 chat: chatRect,
230 editor: editRect,
247 editor: editRect,
231 sidebar: sideRect,
248 sidebar: sideRect,
@@ -238,6 +255,9 @@ type layout struct {
238 // area is the overall available area.
255 // area is the overall available area.
239 area uv.Rectangle
256 area uv.Rectangle
240
257
258+ // main is the main area excluding help.
259+ main uv.Rectangle
260+
241 // chat is the area for the chat pane.
261 // chat is the area for the chat pane.
242 chat uv.Rectangle
262 chat uv.Rectangle
243
263