Multiple spinners

[milosjost]

Hi. Is it possible to have multiple spinners in one model and update those two spinners independently?

[naglis]

Yes, the TickMsg has an ID of the associated spinner and the spinner's Update function will ignore TickMsgs that do not belong to that spinner.

In your model's Update function where TickMsg is handled you could pass the msg to each spinner's Update and gather the returned tea.Cmd in tea.Batch.

Modified spinners example

package main

import (
	"fmt"
	"os"

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

var (
	// Available spinners
	spinners = []spinner.Spinner{
		spinner.Line,
		spinner.Dot,
		spinner.MiniDot,
		spinner.Jump,
		spinner.Pulse,
		spinner.Points,
		spinner.Globe,
		spinner.Moon,
		spinner.Monkey,
	}

	textStyle    = lipgloss.NewStyle().Foreground(lipgloss.Color("252")).Render
	spinnerStyle = lipgloss.NewStyle().Foreground(lipgloss.Color("69"))
	helpStyle    = lipgloss.NewStyle().Foreground(lipgloss.Color("241")).Render
)

func main() {
	m := model{}
	m.resetSpinner1()
	m.resetSpinner2()

	if _, err := tea.NewProgram(m).Run(); err != nil {
		fmt.Println("could not run program:", err)
		os.Exit(1)
	}
}

type model struct {
	index1   int
	index2   int
	spinner1 spinner.Model
	spinner2 spinner.Model
}

func (m model) Init() tea.Cmd {
	return tea.Batch(m.spinner1.Tick, m.spinner2.Tick)
}

func (m model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
	switch msg := msg.(type) {
	case tea.KeyMsg:
		switch msg.String() {
		case "ctrl+c", "q", "esc":
			return m, tea.Quit
		case "h", "left":
			m.index1--
			if m.index1 < 0 {
				m.index1 = len(spinners) - 1
			}
			m.resetSpinner1()
			return m, m.spinner1.Tick
		case "l", "right":
			m.index1++
			if m.index1 >= len(spinners) {
				m.index1 = 0
			}
			m.resetSpinner1()
			return m, m.spinner1.Tick
		case "j", "down":
			m.index2--
			if m.index2 < 0 {
				m.index2 = len(spinners) - 1
			}
			m.resetSpinner2()
			return m, m.spinner2.Tick
		case "k", "up":
			m.index2++
			if m.index2 >= len(spinners) {
				m.index2 = 0
			}
			m.resetSpinner2()
			return m, m.spinner2.Tick
		default:
			return m, nil
		}
	case spinner.TickMsg:
		var (
			cmd  tea.Cmd
			cmds []tea.Cmd
		)

		m.spinner1, cmd = m.spinner1.Update(msg)
		if cmd != nil {
			cmds = append(cmds, cmd)
		}
		m.spinner2, cmd = m.spinner2.Update(msg)
		if cmd != nil {
			cmds = append(cmds, cmd)
		}
		return m, tea.Batch(cmds...)
	default:
		return m, nil
	}
}

func (m *model) resetSpinner1() {
	m.spinner1 = spinner.New()
	m.spinner1.Style = spinnerStyle
	m.spinner1.Spinner = spinners[m.index1]
}

func (m *model) resetSpinner2() {
	m.spinner2 = spinner.New()
	m.spinner2.Style = spinnerStyle
	m.spinner2.Spinner = spinners[m.index2]
}

func (m model) View() (s string) {
	var gap string
	switch m.index1 {
	case 1:
		gap = ""
	default:
		gap = " "
	}

	s += fmt.Sprintf("\n %s\n %s%s%s\n\n", m.spinner1.View(), m.spinner2.View(), gap, textStyle("Spinning..."))
	s += helpStyle("h/l, ←/→: change spinner • q: exit\n")
	return
}