Setting table height makes footer unsticky on zoom out or resize

[Roman-Weisman]

Describe the bug
With model.table.SetHeight() to occupy all space but the header's and footer's, pressing on alt+ to make tab bigger or ctrl- to make text smaller results in: header+table+footer being all moved up, accompanied with space from footer to bottom and disappearance of header and partial table.
Pressing on those keys again moves everything even higher, as if the header is no longer anchored.

Setup
Please complete the following information along with version numbers, if applicable.

• OS: Ubuntu: Omakub v1.1.3
• Shell: Not relevant
• Terminal Emulator: Alacritty
• Terminal Multiplexer: Zellij
• Locale: America/New_York, EST

To Reproduce
Steps to reproduce the behavior:

1. Run the code in split tab ( go run ./main.go)
2. Resize or zoom with alt+ or ctrl-.

Source Code
( please rename to .go )
main.txt

Expected behavior
Sticky footer + header + body to remain relative on resize/zoom.

Screenshots
1: Left pane: code, top right: lazy docker ( for comparison ), bottom right: the app.
Everything is positioned properly until I resize (alt+) or zoom out(ctrl-).

2: Pressed alt+: footer not sticky anymore, positioned itself higher, and looks like the entire app broke border upwards. You can see in the debug line the height increased from 51 to 56.

3: Commenting the table.SetHeight() anchors everything in place, solves the misalignment on resize or zoom, but the footer is no longer sticky - I need it at the bottom.
I noticed that method table.SetHeight() is doing other calculations which might cause this issue.

Additional context
All I need is the footer to be fixed to the bottom, maybe there's another way of doing it.
Lazy docker is displayed just for comparison, showing that it does not change on resize or zoom - which is probably an indication that it's not the terminal nor the multiplexer.

[Roman-Weisman]

Update : Not having this issue on Omarchy in which the same Alacritty is used, but no multiplexer.

[meowgorithm]

Thanks for flagging this. It sounds like an implementation issue, so I'm going to convert it to a discussion to help attract the right kind of help you need. If it ends up being a proper bug issue we'll convert it back to an issue.

---

Note for participants: here's the example code for this above.

package main

import (
	"fmt"
	"os"

	"github.com/charmbracelet/bubbles/table"
	tea "github.com/charmbracelet/bubbletea"
	"github.com/charmbracelet/lipgloss"
)

var (
	versionStyle = lipgloss.NewStyle().Foreground(lipgloss.Color("241")).PaddingLeft(1)
	menuStyle    = lipgloss.NewStyle().Foreground(lipgloss.Color("3"))
	helpStyle    = lipgloss.NewStyle().Foreground(lipgloss.Color("241")).Faint(true)
	debugStyle   = lipgloss.NewStyle().Foreground(lipgloss.Color("9"))
)

type Model struct {
	quitting      bool
	width, height int
	table         table.Model
}

func main() {
	columns := []table.Column{
		{Title: "", Width: 13},
		{Title: "", Width: 13},
		{Title: "", Width: 13},
	}

	rows := []table.Row{
		{"ALICE", "ADMIN", "ACTIVE"},
		{"BOB", "USER", "SUSPENDED"},
		{"CAROL", "DEVELOPER", "ACTIVE"},
	}

	t := table.New(
		table.WithColumns(columns),
		table.WithRows(rows),
		table.WithFocused(true),
		// table.WithHeight(5),
	)

	s := table.DefaultStyles()
	s.Selected = s.Selected.
		Foreground(lipgloss.Color("2")).
		Bold(false).
		Underline(true)
	t.SetStyles(s)

	if _, err := tea.NewProgram(Model{table: t}, tea.WithAltScreen()).Run(); err != nil {
		fmt.Println("Error running program:", err)
		os.Exit(1)
	}
}

func (m Model) Init() tea.Cmd {
	return nil
}

func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
	var cmd tea.Cmd
	switch msg := msg.(type) {
	case tea.WindowSizeMsg:
		m.width = msg.Width
		m.height = msg.Height
		// m.table.SetHeight(m.height - 3)
	case tea.KeyMsg:
		switch msg.String() {
		case "q", "ctrl+c", "esc":
			m.quitting = true
			return m, tea.Quit
		}
	}

	m.table, cmd = m.table.Update(msg)
	return m, cmd
}

func (m Model) View() string {
	if m.quitting {
		return "Bye!\n"
	}

	title := versionStyle.Render("COFFEEBEAN v0.1.0")
	menu := menuStyle.Render("USERS LOGS PULSE DLQ")
	menu = lipgloss.Place(m.width, 1, lipgloss.Center, lipgloss.Top, menu)
	header := lipgloss.JoinVertical(lipgloss.Left, title, menu)

	footer := helpStyle.Render("space+e: explorer • q: quit")
	footer = lipgloss.Place(m.width, 1, lipgloss.Center, lipgloss.Bottom, footer)

	h := m.height - lipgloss.Height(footer) - lipgloss.Height(header) - 2 // Minus 2 for the debug below.
	m.table.SetHeight(h)
	body := lipgloss.NewStyle().Render(m.table.View())

	debugHeight := fmt.Sprintf("modelHeight: %d • headerHeight: %d • tableHeight: %d • footherHeight: %d", m.height, lipgloss.Height(header), m.table.Height(), lipgloss.Height(footer))
	debugHeight = debugStyle.Render(debugHeight)
	debugHeight = lipgloss.Place(m.width, 1, lipgloss.Center, lipgloss.Bottom, debugHeight)

	debugWidth := fmt.Sprintf("modelWidth: %d • headerWidth: %d • tableWidth: %d • footherWidth: %d", m.width, lipgloss.Width(header), m.table.Width(), lipgloss.Width(footer))
	debugWidth = debugStyle.Render(debugWidth)
	debugWidth = lipgloss.Place(m.width, 1, lipgloss.Center, lipgloss.Bottom, debugWidth)

	return lipgloss.JoinVertical(lipgloss.Left,
		header,
		body,
		footer,
		debugHeight,
		debugWidth)
}

[meowgorithm]

One quick thought here (not completely understanding the core of the issue yet): if you upgrade to Bubble Tea, Bubbles, and Lip Gloss v2, you'll be able to take advantage of the new Layer API that typically makes positioning things like this very easy.

[Roman-Weisman]

Not sure what you mean by upgrade as I already use those. Maybe not v2, but the screenshots show that on reposition: header body and footer move up involuntarily.