-
Hey! I have 2 models, the first being an event list model (which uses a custom delegate), and the 2nd where the model shows more information/details on the currently focused "event" item from the event list. When the list model is focused, every time the cursor moves it sends an update to the "details" model saying "Hey! we're hovering a new item, show more information for this item." The problem is on program start, it seems the "details" model doesn't get updated right away. Maybe I'm missing something but I'd sure appreciate some help. Here's a small video showcasing the problem. Notice how when the first program starts, the view on the right (the details model's view) doesn't get updated immediately, even though (according to the code) the item at index 0 should be sent instantly as a msg. 2025-03-04.22-00-28.mp4my parent/global model currently looks as follows package main
import (
"fmt"
"math"
"github.com/charmbracelet/bubbles/list"
tea "github.com/charmbracelet/bubbletea"
"github.com/charmbracelet/lipgloss"
)
type focusedState uint // tracks which part of the view is focused
const (
eventListView focusedState = iota
eventListDetailsView
)
var (
// -3 is an offset to account for borders + help line
width = int(math.Round(float64(TermWidth())/2) - 3)
height = TermHeight() - 3
)
type GlobalModel struct {
list list.Model
details tea.Model
focused focusedState
styles GlobalStyles
events *[]Event
}
func NewGlobalModel(events *[]Event) GlobalModel {
eventListModel := NewEventListModel(events)
eventListDetailsModel := NewDetailsModel()
styles := DefaultGlobalStyles()
model := GlobalModel{
list: eventListModel,
details: eventListDetailsModel,
styles: styles,
focused: eventListView, // this view is focused by default when the TUI runs
}
return model
}
func (m GlobalModel) Init() tea.Cmd {
return nil
}
func (m GlobalModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
var updateList, updateDetails tea.Cmd
switch msg := msg.(type) {
case tea.KeyMsg:
switch msg.String() {
case "ctrl+c", "q":
return m, tea.Quit
case "tab":
if m.focused == eventListView {
m.focused = eventListDetailsView
} else {
m.focused = eventListView
}
}
switch m.focused {
case eventListView:
// at this point, the msg passed from the global model is
// of type tea.KeyMsg
m.list, updateList = m.list.Update(msg)
// send a "msg" down to the details model of whatever item
// is currently being hovered/focused
item := m.list.Items()[m.list.Index()]
m.details, updateDetails = m.details.Update(item)
}
}
return m, tea.Batch(updateList, updateDetails)
}
func (m GlobalModel) View() string {
var s string
if m.focused == eventListView {
s += lipgloss.
JoinHorizontal(
lipgloss.Top,
m.styles.Focused.Render(fmt.Sprintf("%4s", m.list.View())),
m.styles.Unfocused.Render(m.details.View()))
} else {
s += lipgloss.
JoinHorizontal(lipgloss.Top,
m.styles.Unfocused.Render(fmt.Sprintf("%4s", m.list.View())),
m.styles.Focused.Render(m.details.View()))
}
s += m.styles.Help.Render("\ntab: focus next • q: exit")
return s
}
// GlobalStyles contains style definitions for the global model. these
// values are generated by DefaultGlobalStyles.
type GlobalStyles struct {
Focused,
Unfocused,
Help lipgloss.Style
}
func DefaultGlobalStyles() (s GlobalStyles) {
s.Focused = lipgloss.NewStyle().
Width(width).
Height(height).
BorderStyle(lipgloss.RoundedBorder()).
BorderForeground(lipgloss.Color(termANSIBrightYellow.String()))
s.Unfocused = lipgloss.NewStyle().
Width(width).
Height(height).
BorderStyle(lipgloss.RoundedBorder()).
BorderForeground(lipgloss.Color(termANSIBrightBlack.String()))
s.Help = lipgloss.NewStyle().Foreground(lipgloss.Color(termANSIBrightBlack.String()))
return s
} Am I missing someting? is this a skill issue moment. Any help is appreciated |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment
-
This was absolutely a skill issue. |
Beta Was this translation helpful? Give feedback.
This was absolutely a skill issue.
m.details.Update(...)
was only being called, when the cases fortea.KeyMsg
andeventListView
were true. Thus to update on start, I had to putm.details.Update(...)
at the end of the global model'sUpdate()
.