Wrap long clone commands

Christian Rocha created 4 years ago

Change summary

tui/bubbles/repo/bubble.go | 49 ++++++++++++++++++++++++++++++---------
tui/style/style.go         | 32 +++++++++++++++++--------
2 files changed, 58 insertions(+), 23 deletions(-)

Detailed changes

tui/bubbles/repo/bubble.go

@@ -100,21 +100,39 @@ func (b *Bubble) GotoTop() {
 }
 
 func (b Bubble) headerView() string {
-	ts := b.styles.RepoTitle
-	ns := b.styles.RepoNote
-	if b.Active {
-		ts = ts.Copy().BorderForeground(b.styles.ActiveBorderColor)
-		ns = ns.Copy().BorderForeground(b.styles.ActiveBorderColor)
+	// Render repo title
+	title := b.name
+	if title == "config" {
+		title = "Home"
 	}
-	var gc string
-	n := truncate.StringWithTail(b.name, repoNameMaxWidth, "…")
-	if n == "config" {
-		n = "Home"
+	title = truncate.StringWithTail(title, repoNameMaxWidth, "…")
+	title = b.styles.RepoTitle.Render(title)
+
+	// Render clone command
+	var note string
+	if b.name == "config" {
+		note = ""
 	} else {
-		gc = fmt.Sprintf("git clone %s", b.sshAddress())
+		note = fmt.Sprintf("git clone %s", b.sshAddress())
+	}
+	noteStyle := b.styles.RepoNote.Copy().Width(
+		b.width - b.widthMargin - lipgloss.Width(title) -
+			b.styles.RepoTitleBox.GetHorizontalFrameSize(),
+	)
+	note = noteStyle.Render(note)
+
+	// Render borders on name and command
+	height := max(lipgloss.Height(title), lipgloss.Height(note))
+	titleBoxStyle := b.styles.RepoTitleBox.Copy().Height(height)
+	noteBoxStyle := b.styles.RepoNoteBox.Copy().Height(height)
+	if b.Active {
+		titleBoxStyle = titleBoxStyle.BorderForeground(b.styles.ActiveBorderColor)
+		noteBoxStyle = noteBoxStyle.BorderForeground(b.styles.ActiveBorderColor)
 	}
-	title := ts.Render(n)
-	note := ns.Width(b.width - b.widthMargin - lipgloss.Width(title)).Render(gc)
+	title = titleBoxStyle.Render(title)
+	note = noteBoxStyle.Render(note)
+
+	// Render
 	return lipgloss.JoinHorizontal(lipgloss.Top, title, note)
 }
 
@@ -201,3 +219,10 @@ func (b *Bubble) glamourize(md string) (string, error) {
 	mdt = wrap.String(wordwrap.String((mdt), w), w)
 	return mdt, nil
 }
+
+func max(a, b int) int {
+	if a > b {
+		return a
+	}
+	return b
+}

tui/style/style.go

@@ -23,9 +23,11 @@ type Styles struct {
 	RepoNoteBorder  lipgloss.Border
 	RepoBodyBorder  lipgloss.Border
 
-	RepoTitle lipgloss.Style
-	RepoNote  lipgloss.Style
-	RepoBody  lipgloss.Style
+	RepoTitle    lipgloss.Style
+	RepoTitleBox lipgloss.Style
+	RepoNote     lipgloss.Style
+	RepoNoteBox  lipgloss.Style
+	RepoBody     lipgloss.Style
 
 	Footer      lipgloss.Style
 	HelpKey     lipgloss.Style
@@ -84,11 +86,11 @@ func DefaultStyles() *Styles {
 	s.RepoNoteBorder = lipgloss.Border{
 		Top:         "─",
 		Bottom:      "─",
-		Left:        "",
+		Left:        "│",
 		Right:       "│",
-		TopLeft:     "",
+		TopLeft:     "┬",
 		TopRight:    "╮",
-		BottomLeft:  "",
+		BottomLeft:  "┴",
 		BottomRight: "┤",
 	}
 
@@ -104,16 +106,24 @@ func DefaultStyles() *Styles {
 	}
 
 	s.RepoTitle = lipgloss.NewStyle().
-		Border(s.RepoTitleBorder).
-		BorderForeground(s.InactiveBorderColor).
 		Padding(0, 2).
 		Foreground(lipgloss.Color("252"))
 
+	s.RepoTitleBox = lipgloss.NewStyle().
+		BorderStyle(s.RepoTitleBorder).
+		BorderForeground(s.InactiveBorderColor)
+
 	s.RepoNote = lipgloss.NewStyle().
-		Border(s.RepoNoteBorder, true, true, true, false).
+		Padding(0, 2).
+		Foreground(lipgloss.Color("168"))
+
+	s.RepoNoteBox = lipgloss.NewStyle().
+		BorderStyle(s.RepoNoteBorder).
 		BorderForeground(s.InactiveBorderColor).
-		Foreground(lipgloss.Color("168")).
-		Padding(0, 2)
+		BorderTop(true).
+		BorderRight(true).
+		BorderBottom(true).
+		BorderLeft(false)
 
 	s.RepoBody = lipgloss.NewStyle().
 		BorderStyle(s.RepoBodyBorder).