Coding

Bubbletea Code Review

Try it

Reviews BubbleTea TUI code for proper Elm architecture, model/update/view patterns, and Lipgloss styling. Use when reviewing terminal UI code using charmbrac...

What it does

Advance only when each **pass condition** is objectively true (reduces false positives on and unsubstantiated blocking claims):

The skill document

BubbleTea Code Review

Hard gates (sequence)

Advance only when each pass condition is objectively true (reduces false positives on tea.Cmd and unsubstantiated blocking claims):

GatePass condition
G1 — Anti–false-positiveYou skimmed NOT Issues below or read references/elm-architecture.md before recording a finding about tea.Cmd returns, value receivers on Update, or nested child Update.
G2 — Evidence for blocking / suspicious I/OEach Critical/Major finding names file path + line (or a short quoted snippet) showing the blocking call, huh.Form.Run in the wrong place, or other asserted anti-pattern—not a hypothetical.
G3 — VerificationBefore publishing review output, you applied the review-verification-protocol to each proposed finding.

Quick Reference

Issue TypeReference
Elm architecture, tea.Cmd as datareferences/elm-architecture.md
Model state, message handlingreferences/model-update.md
View rendering, Lipgloss stylingreferences/view-styling.md
Component composition, Huh formsreferences/composition.md
Bubbles components (list, table, etc.)references/bubbles-components.md

CRITICAL: Avoid False Positives

Read elm-architecture.md first! The most common review mistake is flagging correct patterns as bugs.

NOT Issues (Do NOT Flag These)

PatternWhy It's Correct
return m, m.loadData()tea.Cmd is returned immediately; runtime executes async
Value receiver on Update()Standard BubbleTea pattern; model returned by value
Nested m.child, cmd = m.child.Update(msg)Normal component composition
Helper functions returning tea.CmdCreates command descriptor, no I/O in Update
tea.Batch(cmd1, cmd2)Commands execute concurrently by runtime

ACTUAL Issues (DO Flag These)

PatternWhy It's Wrong
os.ReadFile() in UpdateBlocks UI thread
http.Get() in UpdateNetwork I/O blocks
time.Sleep() in UpdateFreezes UI
<-channel in Update (blocking)May block indefinitely
huh.Form.Run() in UpdateBlocking call

Review Checklist

Architecture

  • No blocking I/O in Update() (file, network, sleep)
  • Helper functions returning tea.Cmd are NOT flagged as blocking
  • Commands used for all async operations

Model & Update

  • Model is immutable (Update returns new model, not mutates)
  • Init returns proper initial command (or nil)
  • Update handles all expected message types
  • WindowSizeMsg handled for responsive layout
  • tea.Batch used for multiple commands
  • tea.Quit used correctly for exit

View & Styling

  • View is a pure function (no side effects)
  • Lipgloss styles defined once, not in View
  • Key bindings use key.Matches with help.KeyMap

Components

  • Sub-component updates propagated correctly
  • Bubbles components initialized with dimensions
  • Huh forms embedded via Update loop (not Run())

Critical Patterns

Model Must Be Immutable

// BAD - mutates model
func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
    m.items = append(m.items, newItem)  // mutation!
    return m, nil
}

// GOOD - returns new model
func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
    newItems := make([]Item, len(m.items)+1)
    copy(newItems, m.items)
    newItems[len(m.items)] = newItem
    m.items = newItems
    return m, nil
}

Commands for Async/IO

// BAD - blocking in Update
func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
    data, _ := os.ReadFile("config.json")  // blocks UI!
    m.config = parse(data)
    return m, nil
}

// GOOD - use commands
func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
    return m, loadConfigCmd()
}

func loadConfigCmd() tea.Cmd {
    return func() tea.Msg {
        data, err := os.ReadFile("config.json")
        if err != nil {
            return errMsg{err}
        }
        return configLoadedMsg{parse(data)}
    }
}

Styles Defined Once

// BAD - creates new style each render
func (m Model) View() string {
    style := lipgloss.NewStyle().Bold(true).Foreground(lipgloss.Color("205"))
    return style.Render("Hello")
}

// GOOD - define styles at package level or in model
var titleStyle = lipgloss.NewStyle().Bold(true).Foreground(lipgloss.Color("205"))

func (m Model) View() string {
    return titleStyle.Render("Hello")
}

When to Load References

  • First time reviewing BubbleTea → elm-architecture.md (prevents false positives)
  • Reviewing Update function logic → model-update.md
  • Reviewing View function, styling → view-styling.md
  • Reviewing component hierarchy → composition.md
  • Using Bubbles components → bubbles-components.md

Review Questions

  1. Is Update() free of blocking I/O? (NOT: "is the cmd helper blocking?")
  2. Is the model immutable in Update?
  3. Are Lipgloss styles defined once, not in View?
  4. Is WindowSizeMsg handled for resizing?
  5. Are key bindings documented with help.KeyMap?
  6. Are Bubbles components sized correctly?

Related skills

Generate and edit Draw.io, Mermaid, and Excalidraw diagrams from natural language using a structured JSON spec.

by nssa.io1.0k installs47 stars

Find why your productivity system keeps failing, then apply the smallest fix — capacity math, bottleneck routing, durable local notes.

by Iván855 installs69 stars

Join a video meeting as an AI bot with voice, avatar, and screenshare across four operating modes.

by johnpatternai22 installs8 stars

Stores durable facts in a categorized, plain-markdown vault on disk, alongside your agent's built-in memory.

by Iván559 installs18 stars

Fetch raw ad creative, app, ranking, and revenue data from AdMapix as structured JSON.

by fly0pants4.3k installs296 stars

More from anderskev

Browse all skills

Get a structured template and writing principles for explanation docs that build reader understanding of why systems work the way they do.

by anderskev26 installs

Step-by-step tutorial patterns for learning-by-doing docs that get beginners to a visible result.

by anderskev26 installs

Turn a brainstorm spec with open questions into an implementation-ready spec with no gaps.

by anderskev19 installs

Turn a fuzzy idea into a structured, implementation-free project spec through collaborative dialogue.

by anderskev25 installs

Configure Tailwind CSS v4 with CSS-first theme variables and OKLCH design tokens.

by anderskev29 installs

Generate Architecture Decision Records from decisions made in the current session.

by anderskev19 installs