release 0.3.0

Updated dashboard view
Updated domains tab with details
Fixed tab cycle issue
Added route health on dashboard
Adaptive layout
Tab overflow issue

Author: venkatkrishna07

internal/tui/components/banner.go

@@ -10,13 +10,27 @@ import (
 // Banner renders a compact single-line app banner: accent bar + name +
 // version on the left, status pill flush right. No box, no border.
 func Banner(th styles.Theme, version, pill string, width int) string {
-	if width < 40 {
-		width = 40
+	pillW := lipgloss.Width(pill)
+	if width <= pillW+2 {
+		return pill
+	}
+	left := th.Title.Render("▎ ") + th.Title.Render("mkdev")
+	tag := versionTag(version)
+	if width >= lipgloss.Width(left)+len(" · "+tag)+pillW+2 {
+		left += th.Dim.Render(" · " + tag)
 	}
-	left := th.Title.Render("▎ ") + th.Title.Render("mkdev") +
-		th.Dim.Render(" · v"+version)
 	leftW := lipgloss.Width(left)
-	pillW := lipgloss.Width(pill)
 	gap := max(width-leftW-pillW, 1)
 	return left + strings.Repeat(" ", gap) + pill
 }
+
+// versionTag returns the version with exactly one leading "v".
+func versionTag(version string) string {
+	if version == "" {
+		return "v?"
+	}
+	if version[0] == 'v' || version[0] == 'V' {
+		return version
+	}
+	return "v" + version
+}

internal/tui/components/components_test.go

@@ -11,7 +11,7 @@ import (
 
 func TestTabBarHighlightsActive(t *testing.T) {
 	th := styles.NewTheme()
-	out := components.TabBar(th, []string{"Domains", "Projects", "Logs"}, 1)
+	out := components.TabBar(th, []string{"Domains", "Projects", "Logs"}, 1, 120)
 	require.Contains(t, out, "Domains")
 	require.Contains(t, out, "Projects")
 	require.Contains(t, out, "Logs")

internal/tui/components/tabbar.go

@@ -5,6 +5,7 @@ import (
 	"strings"
 
 	"github.com/charmbracelet/lipgloss"
+
 	"github.com/venkatkrishna07/mkdev/internal/tui/styles"
 )
 
@@ -19,31 +20,73 @@ func useGlyphs() bool {
 	return os.Getenv("NO_NERD_FONT") == "" && os.Getenv("NO_COLOR") == ""
 }
 
-// TabBar renders a single-line tab strip. Active uses TabActive (filled
-// background); inactives use TabInactive.
-func TabBar(th styles.Theme, labels []string, active int) string {
+// TabBar renders a single-line tab strip. width caps the output; the bar
+// degrades to icon-only labels and finally to the active tab alone with
+// arrow hints when the full bar would overflow.
+func TabBar(th styles.Theme, labels []string, active, width int) string {
 	tabs := make([]Tab, len(labels))
 	for i, l := range labels {
 		tabs[i] = Tab{Label: l}
 	}
-	return TabBarRich(th, tabs, active)
+	return TabBarRich(th, tabs, active, width)
 }
 
-// TabBarRich draws tabs with optional per-tab icons.
-func TabBarRich(th styles.Theme, tabs []Tab, active int) string {
-	parts := make([]string, len(tabs))
+// TabBarRich draws tabs with optional per-tab icons, falling back to a
+// compact form when the rendered width exceeds the available terminal width.
+func TabBarRich(th styles.Theme, tabs []Tab, active, width int) string {
 	glyphs := useGlyphs()
+	sep := lipgloss.NewStyle().Foreground(th.Muted).Render("│")
+
+	build := func(labels []string) string {
+		parts := make([]string, len(labels))
+		for i, label := range labels {
+			if i == active {
+				parts[i] = th.TabActive.Render(label)
+			} else {
+				parts[i] = th.TabInactive.Render(label)
+			}
+		}
+		return strings.Join(parts, sep)
+	}
+
+	full := make([]string, len(tabs))
 	for i, t := range tabs {
 		label := t.Label
 		if glyphs && t.Icon != "" {
 			label = t.Icon + " " + t.Label
 		}
-		if i == active {
-			parts[i] = th.TabActive.Render(label)
-		} else {
-			parts[i] = th.TabInactive.Render(label)
+		full[i] = label
+	}
+	rendered := build(full)
+	if width <= 0 || lipgloss.Width(rendered) <= width {
+		return rendered
+	}
+
+	if glyphs {
+		iconsOnly := make([]string, len(tabs))
+		anyIcon := false
+		for i, t := range tabs {
+			if t.Icon != "" {
+				iconsOnly[i] = t.Icon
+				anyIcon = true
+			} else {
+				iconsOnly[i] = t.Label
+			}
+		}
+		if anyIcon {
+			rendered = build(iconsOnly)
+			if lipgloss.Width(rendered) <= width {
+				return rendered
+			}
 		}
 	}
-	sep := lipgloss.NewStyle().Foreground(th.Muted).Render("│")
-	return strings.Join(parts, sep)
+
+	activeLabel := full[active]
+	prev := th.Dim.Render("‹")
+	next := th.Dim.Render("›")
+	compact := prev + " " + th.TabActive.Render(activeLabel) + " " + next
+	if lipgloss.Width(compact) <= width {
+		return compact
+	}
+	return th.TabActive.Render(activeLabel)
 }

internal/tui/modal_dispatch.go

@@ -34,6 +34,9 @@ func (m rootModel) updateTopModal(msg tea.Msg) (tea.Model, tea.Cmd) {
 	case modals.Confirm:
 		t, cmd = t.Update(msg)
 		m.modals[idx] = t
+	case modals.Help:
+		t, cmd = t.Update(msg)
+		m.modals[idx] = t
 	}
 	return m, cmd
 }
@@ -72,6 +75,8 @@ func (m rootModel) activeKeyMap() help.KeyMap {
 		return t.Keys()
 	case modals.Confirm:
 		return t.Keys()
+	case modals.Help:
+		return t.Keys()
 	}
 	return m.keys
 }

internal/tui/modals/help.go

@@ -0,0 +1,91 @@
+package modals
+
+import (
+	"strings"
+
+	"github.com/charmbracelet/bubbles/help"
+	"github.com/charmbracelet/bubbles/key"
+	tea "github.com/charmbracelet/bubbletea"
+	"github.com/venkatkrishna07/mkdev/internal/tui/styles"
+)
+
+// HelpKeys are the keybindings advertised by the Help modal.
+type HelpKeys struct {
+	Close key.Binding
+}
+
+// ShortHelp implements help.KeyMap.
+func (k HelpKeys) ShortHelp() []key.Binding { return []key.Binding{k.Close} }
+
+// FullHelp implements help.KeyMap.
+func (k HelpKeys) FullHelp() [][]key.Binding { return [][]key.Binding{{k.Close}} }
+
+// DefaultHelpKeys is the default Help-modal binding set.
+var DefaultHelpKeys = HelpKeys{
+	Close: key.NewBinding(key.WithKeys("esc", "enter", "?"), key.WithHelp("esc/↵/?", "close")),
+}
+
+// Help is a read-only modal that lists key bindings.
+type Help struct {
+	th       styles.Theme
+	bindings []key.Binding
+}
+
+// NewHelp constructs a Help modal listing bindings.
+func NewHelp(th styles.Theme, bindings []key.Binding) Help {
+	return Help{th: th, bindings: bindings}
+}
+
+// Title implements Modal.
+func (h Help) Title() string { return "Help" }
+
+// Keys returns the modal's help.KeyMap.
+func (h Help) Keys() help.KeyMap { return DefaultHelpKeys }
+
+// Init implements tea.Model.
+func (h Help) Init() tea.Cmd { return nil }
+
+// Update advances the modal in response to a tea.Msg.
+func (h Help) Update(msg tea.Msg) (Help, tea.Cmd) {
+	if k, ok := msg.(tea.KeyMsg); ok {
+		switch k.Type {
+		case tea.KeyEsc, tea.KeyEnter:
+			return h, func() tea.Msg { return Closed{Result: Result{Cancelled: true}} }
+		}
+		if k.String() == "?" {
+			return h, func() tea.Msg { return Closed{Result: Result{Cancelled: true}} }
+		}
+	}
+	return h, nil
+}
+
+// View renders the Help modal.
+func (h Help) View() string {
+	keyCol := 0
+	for _, b := range h.bindings {
+		if w := len(b.Help().Key); w > keyCol {
+			keyCol = w
+		}
+	}
+	if keyCol < 6 {
+		keyCol = 6
+	}
+
+	var b strings.Builder
+	b.WriteString(h.th.ModalTitle.Render("Key bindings"))
+	b.WriteString("\n\n")
+	for _, kb := range h.bindings {
+		hk := kb.Help()
+		if hk.Key == "" && hk.Desc == "" {
+			continue
+		}
+		pad := max(keyCol-len(hk.Key), 0)
+		b.WriteString(h.th.FooterKey.Render(hk.Key))
+		b.WriteString(strings.Repeat(" ", pad+3))
+		b.WriteString(h.th.Footer.Render(hk.Desc))
+		b.WriteString("\n")
+	}
+	b.WriteString("\n")
+	b.WriteString(h.th.Dim.Render("esc/↵/?  close"))
+	return h.th.Modal.Width(50).Render(b.String())
+}

internal/tui/program.go

@@ -71,13 +71,12 @@ type rootModel struct {
 	logs        tabs.Logs
 	doctor      tabs.Doctor
 	settings    tabs.Settings
-	modals      []any // LIFO stack of modals.Add / modals.Edit / modals.Confirm
+	modals      []any // LIFO stack of modals.Add / modals.Edit / modals.Confirm / modals.Help
 	proxy       ProxyState
 	proxyCh     <-chan ProxyState
 	binPath     string
 	keys        KeyMap
 	help        help.Model
-	showHelp    bool
 	spinner     spinner.Model
 	busy        bool
 	active      tabIndex
@@ -287,7 +286,11 @@ func (m rootModel) handleGlobalKey(k tea.KeyMsg) (tea.Model, tea.Cmd) {
 		m.pendingQuit = true
 		return m, nil
 	case key.Matches(k, m.keys.Help):
-		m.showHelp = !m.showHelp
+		var flat []key.Binding
+		for _, row := range m.keys.FullHelp() {
+			flat = append(flat, row...)
+		}
+		m.modals = append(m.modals, modals.NewHelp(m.th, flat))
 		return m, nil
 	case key.Matches(k, m.keys.NextTab):
 		m.active = (m.active + 1) % tabIndex(len(tabLabels))
@@ -388,7 +391,7 @@ func (m rootModel) View() string {
 	}
 
 	header := components.Banner(m.th, version.Version, pill, width)
-	tabBar := components.TabBarRich(m.th, tabSpecs, int(m.active))
+	tabBar := components.TabBarRich(m.th, tabSpecs, int(m.active), width)
 	rule := m.th.Rule.Render(strings.Repeat("─", width))
 	var body string
 	switch m.active {
@@ -409,7 +412,6 @@ func (m rootModel) View() string {
 		body = m.spinner.View() + " " + m.th.Dim.Render("working…") + "\n" + body
 	}
 
-	m.help.ShowAll = m.showHelp
 	footer := m.help.View(m.activeKeyMap())
 
 	var toast string
@@ -423,6 +425,9 @@ func (m rootModel) View() string {
 	}
 	sections = append(sections, footer)
 	view := lipgloss.JoinVertical(lipgloss.Left, sections...)
+	if m.height > 0 {
+		view = lipgloss.Place(m.width, m.height, lipgloss.Left, lipgloss.Top, view)
+	}
 
 	if len(m.modals) == 0 {
 		return view
@@ -436,6 +441,8 @@ func (m rootModel) View() string {
 		modalView = t.View()
 	case modals.Confirm:
 		modalView = t.View()
+	case modals.Help:
+		modalView = t.View()
 	}
 	return lipgloss.Place(
 		m.width, m.height,