mirror of
https://github.com/github/gh-stack.git
synced 2026-09-14 20:26:28 +08:00
797c62e9b4
* Make the TUIs adapt to light and dark terminal backgrounds
The submit, view, and modify TUIs were tuned for dark terminals. On light
or solarized-light backgrounds the result was hard to read and inverted:
primary text used ANSI white (invisible on white), dim chrome used light
grays (too faint), and accents used bright cyan (low contrast) — so
"active" things looked lighter than "disabled" ones.
Introduce a centralized, background-aware color palette and migrate all
three TUIs to it:
- internal/tui/shared/theme.go: a semantic palette of lipgloss.AdaptiveColor
values (primary/muted/faint text, chrome/border, accent, PR-state colors,
badge backgrounds, row shade, button, switch). lipgloss resolves the
light/dark variant per render from the terminal background, which Bubble
Tea detects at startup; terminals that don't report it fall back to dark,
preserving the original look.
- Replace every hardcoded ANSI color in shared/, submitview/, and
modifyview/ with palette roles. The four pre-rendered status icons now
render at use-time so their adaptive colors resolve correctly. The submit
markdown preview picks glamour's light or dark style from the detected
background.
- GH_STACK_THEME=auto|light|dark forces the palette for terminals that
mis-detect (some SSH/tmux setups); wired via the root command's
PersistentPreRun before any render. Documented in the README and CLI docs.
Neutral text/chrome use truecolor hex (GitHub Primer-inspired) for
predictability across themes, including solarized which repurposes ANSI
8-15; lipgloss downsamples on terminals without truecolor.
Tests verify the palette resolves differently for light vs dark and that
GH_STACK_THEME is honored.
* Apply background-aware colors to all command output
Background detection and the GH_STACK_THEME override (added for the TUIs)
only affected the interactive screens. Plain command output -- status
messages and interactive prompts -- went through the mgutz/ansi library
with fixed ANSI palette names (green/red/yellow/cyan/...), so it never
adapted to the terminal background and could read poorly on light or
solarized themes.
Unify everything on the same adaptive palette so all colors react to the
detected background and to GH_STACK_THEME.
- Extract internal/theme, a foundational package with no internal
dependencies, that owns:
- the background-aware lipgloss.AdaptiveColor palette (moved out of
internal/tui/shared),
- ApplyOverride(), the GH_STACK_THEME=auto|light|dark logic, and
- non-TUI colorizers (Success/Error/Warning/Blue/Magenta/Cyan/Gray/
Bold) plus FgSeqs(), which returns the raw start/reset escapes used
to color the user's echoed prompt input.
- internal/tui/shared/theme.go now re-exports the palette, so the TUI code
keeps referring to shared.ColorX unchanged.
- internal/config/config.go wires the Config.Color* funcs to the theme
colorizers and drops mgutz/ansi (now an indirect dependency only).
- cmd/utils.go colors the prompt icon and echoed input via theme.
- cmd/root.go calls theme.ApplyOverride() in PersistentPreRun.
Detection adds no cost: because the command package imports Bubble Tea,
its init() already triggers (and caches) the terminal background query for
every command, so the non-TUI colorizers just read the cached value.
Terminals that don't answer the query fall back to the dark palette;
GH_STACK_THEME=light|dark forces it. Colors are truecolor on capable
terminals and downsample to the nearest ANSI color elsewhere.
Tests: internal/theme covers palette adaptiveness, ApplyOverride, the
colorizers, and FgSeqs; a new internal/config test verifies the wired-up
Config.Color* funcs adapt to the background when color is enabled.
Docs: README and the CLI reference note that GH_STACK_THEME now controls
all colored output, not just the interactive screens.
No behavior change beyond colors.
175 lines
4.7 KiB
Go
175 lines
4.7 KiB
Go
package submitview
|
|
|
|
import (
|
|
"fmt"
|
|
"strings"
|
|
|
|
"github.com/charmbracelet/lipgloss"
|
|
"github.com/github/gh-stack/internal/tui/shared"
|
|
)
|
|
|
|
// Chrome styles shared across the submit views.
|
|
var (
|
|
stackInfoStyle = lipgloss.NewStyle().Foreground(shared.ColorTextMuted)
|
|
)
|
|
|
|
// headerHeight returns the number of screen rows the shared header occupies, or
|
|
// 0 when the terminal is too small to show it.
|
|
func (m Model) headerHeight() int {
|
|
if shared.ShouldShowHeader(m.width, m.height) {
|
|
return shared.HeaderHeightFor(m.buildHeaderConfig())
|
|
}
|
|
return 0
|
|
}
|
|
|
|
// renderHeader renders the shared gh-stack header (GitHub art, title, stack
|
|
// info, and keyboard shortcuts), matching `gh stack view` and `gh stack
|
|
// modify`. It returns "" when the terminal is too small for the header.
|
|
func (m Model) renderHeader() string {
|
|
if !shared.ShouldShowHeader(m.width, m.height) {
|
|
return ""
|
|
}
|
|
var b strings.Builder
|
|
shared.RenderHeader(&b, m.buildHeaderConfig(), m.width, m.height)
|
|
return strings.TrimSuffix(b.String(), "\n")
|
|
}
|
|
|
|
// buildHeaderConfig assembles the shared header configuration: title, stack
|
|
// info lines (including the consequence summary), and keyboard shortcuts.
|
|
func (m Model) buildHeaderConfig() shared.HeaderConfig {
|
|
repo := m.repoLabel
|
|
if repo == "" {
|
|
repo = "unknown"
|
|
}
|
|
|
|
infoLines := []shared.HeaderInfoLine{
|
|
{Icon: "○", Label: "Repo: " + repo},
|
|
{Icon: "◆", Label: "Base: " + m.trunk.Branch},
|
|
}
|
|
|
|
// Third line mirrors the modify header's pending line: a solid yellow square
|
|
// with the count when PRs will be created, or an empty square otherwise.
|
|
newCount := 0
|
|
for _, n := range m.nodes {
|
|
if n.State == StateNew && n.Included {
|
|
newCount++
|
|
}
|
|
}
|
|
if newCount > 0 {
|
|
yellowStyle := lipgloss.NewStyle().Foreground(shared.ColorYellow)
|
|
prWord := "PRs"
|
|
if newCount == 1 {
|
|
prWord = "PR"
|
|
}
|
|
infoLines = append(infoLines, shared.HeaderInfoLine{
|
|
Icon: "■",
|
|
Label: fmt.Sprintf("Creating %d %s", newCount, prWord),
|
|
IconStyle: &yellowStyle,
|
|
})
|
|
} else {
|
|
infoLines = append(infoLines, shared.HeaderInfoLine{Icon: "□", Label: "No pending PRs"})
|
|
}
|
|
|
|
return shared.HeaderConfig{
|
|
ShowArt: true,
|
|
Title: "Submit Stack",
|
|
Subtitle: "v" + m.version,
|
|
InfoLines: infoLines,
|
|
ShortcutColumns: 1,
|
|
Shortcuts: m.headerShortcuts(),
|
|
}
|
|
}
|
|
|
|
// headerShortcuts returns the six primary single-screen keyboard shortcuts shown
|
|
// in the header (the help overlay lists the full set).
|
|
func (m Model) headerShortcuts() []shared.ShortcutEntry {
|
|
return []shared.ShortcutEntry{
|
|
{Key: "↑↓", Desc: "select branch"},
|
|
{Key: "tab", Desc: "cycle field"},
|
|
{Key: "^x", Desc: "skip/include"},
|
|
{Key: "^s", Desc: "submit PRs"},
|
|
{Key: "^h", Desc: "help"},
|
|
{Key: "esc", Desc: "quit"},
|
|
}
|
|
}
|
|
|
|
// renderClosedBanner renders a slim full-width red banner directly under the
|
|
// header when the stack contains a closed PR, or "" otherwise.
|
|
func (m Model) renderClosedBanner() string {
|
|
closed := ClosedBranches(m.nodes)
|
|
if len(closed) == 0 {
|
|
return ""
|
|
}
|
|
verb := "branch has"
|
|
if len(closed) > 1 {
|
|
verb = "branches have"
|
|
}
|
|
msg := fmt.Sprintf(" %s %d %s a closed PR (%s) — reopen it, or unstack and recreate.",
|
|
RenderDot(StateClosed), len(closed), verb, strings.Join(closed, ", "))
|
|
if lipgloss.Width(msg) > m.width {
|
|
msg = truncateVisible(msg, m.width)
|
|
}
|
|
return calloutErrorStyle.Render(msg)
|
|
}
|
|
|
|
// composeLR places left and right content on one line of the given width with
|
|
// the right content flush to the right edge.
|
|
func composeLR(left, right string, width int) string {
|
|
lw := lipgloss.Width(left)
|
|
rw := lipgloss.Width(right)
|
|
gap := width - lw - rw
|
|
if gap < 1 {
|
|
gap = 1
|
|
// Truncate the left side so the right stays visible.
|
|
if lw > width-rw-1 {
|
|
left = truncateVisible(left, width-rw-1)
|
|
}
|
|
}
|
|
return left + strings.Repeat(" ", gap) + right
|
|
}
|
|
|
|
// truncateVisible truncates a possibly-styled string to at most maxWidth
|
|
// visible columns, appending an ellipsis when it had to cut. It resets styling
|
|
// at the cut so trailing ANSI does not leak.
|
|
func truncateVisible(s string, maxWidth int) string {
|
|
if maxWidth <= 0 {
|
|
return ""
|
|
}
|
|
if lipgloss.Width(s) <= maxWidth {
|
|
return s
|
|
}
|
|
var b strings.Builder
|
|
width := 0
|
|
inEscape := false
|
|
for _, r := range s {
|
|
if r == '\x1b' {
|
|
inEscape = true
|
|
}
|
|
if inEscape {
|
|
b.WriteRune(r)
|
|
if r == 'm' {
|
|
inEscape = false
|
|
}
|
|
continue
|
|
}
|
|
if width >= maxWidth-1 {
|
|
b.WriteString("…")
|
|
b.WriteString("\x1b[0m")
|
|
break
|
|
}
|
|
b.WriteRune(r)
|
|
width++
|
|
}
|
|
return b.String()
|
|
}
|
|
|
|
// contentHeight returns the number of lines available for the two panels,
|
|
// between the header and the reserved status line.
|
|
func (m Model) contentHeight() int {
|
|
h := m.height - m.headerHeight() - 1 // status line
|
|
if h < 1 {
|
|
h = 1
|
|
}
|
|
return h
|
|
}
|