Refine mouse resize and scrolling

Author: hjanuschka

docs/src/content/docs/getting-started/keybindings/preview.mdx

@@ -29,3 +29,7 @@ Press <kbd>[</kbd> to move to the next tab in the preview sidebar, if one exists
 ## `]` - Previous Preview Tab
 
 Press <kbd>]</kbd> to move to the previous tab in the preview sidebar, if one exists.
+
+## `P` - Reset Preview Width
+
+Press <kbd>Shift</kbd>+<kbd>p</kbd> to reset the preview pane width back to the configured default.

internal/tui/components/carousel/carousel.go

@@ -445,22 +445,24 @@ func (m *Model) renderItem(itemID int, maxWidth int) string {
 	item := m.renderItemContent(itemID, maxWidth)
 
 	// Wrap the item in a zone for click detection
-	zoneID := fmt.Sprintf("%s%s%d", TabZonePrefix, m.zonePrefix, itemID)
-	return zone.Mark(zoneID, item)
+	return zone.Mark(m.tabZoneID(itemID), item)
 }
 
 // HandleClick checks if a mouse click event is on a tab and returns the tab index if so
 // Returns -1 if no tab was clicked
 func (m *Model) HandleClick(msg tea.MouseMsg) int {
 	for i := range m.items {
-		zoneID := fmt.Sprintf("%s%s%d", TabZonePrefix, m.zonePrefix, i)
-		if zone.Get(zoneID).InBounds(msg) {
+		if zone.Get(m.tabZoneID(i)).InBounds(msg) {
 			return i
 		}
 	}
 	return -1
 }
 
+func (m *Model) tabZoneID(itemID int) string {
+	return fmt.Sprintf("%s%s%d", TabZonePrefix, m.zonePrefix, itemID)
+}
+
 func max(a, b int) int {
 	if a > b {
 		return a

internal/tui/components/carousel/carousel_test.go

@@ -2,6 +2,7 @@ package carousel
 
 import (
 	"fmt"
+	"strings"
 	"testing"
 
 	tea "github.com/charmbracelet/bubbletea"
@@ -90,13 +91,13 @@ func TestCarousel(t *testing.T) {
 		// The view should contain the items (after zone.Scan)
 		scanned := zone.Scan(view)
 		for _, item := range items {
-			if !contains(scanned, item) {
+			if !strings.Contains(scanned, item) {
 				t.Errorf("Expected view to contain %q", item)
 			}
 		}
 	})
 
-	t.Run("HandleClick should check zones for each tab", func(t *testing.T) {
+	t.Run("HandleClick should return index for clicked tab", func(t *testing.T) {
 		items := []string{"Tab 1", "Tab 2", "Tab 3"}
 		c := New(WithItems(items), WithWidth(200))
 		c.UpdateSize()
@@ -105,14 +106,39 @@ func TestCarousel(t *testing.T) {
 		view := c.View()
 		_ = zone.Scan(view)
 
-		// Verify that zone IDs are being used in the rendered output
-		for i := range items {
-			zoneID := fmt.Sprintf("%s%d", TabZonePrefix, i)
-			// The zone should be marked in the view
-			if !contains(view, zoneID) {
-				// This is expected - zones are encoded differently
-				// The important thing is that HandleClick uses the correct zone IDs
-			}
+		// Click inside the first tab's zone
+		zoneID := fmt.Sprintf("%s%d", TabZonePrefix, 0)
+		z := zone.Get(zoneID)
+		if z.IsZero() {
+			t.Fatal("Expected zone to be registered")
+		}
+		msg := tea.MouseMsg{
+			X:      z.StartX,
+			Y:      z.StartY,
+			Button: tea.MouseButtonLeft,
+			Action: tea.MouseActionRelease,
+		}
+
+		result := c.HandleClick(msg)
+		if result != 0 {
+			t.Errorf("Expected tab index 0, got %d", result)
+		}
+	})
+
+	t.Run("HandleClick should return -1 for empty items", func(t *testing.T) {
+		c := New(WithItems([]string{}), WithWidth(100))
+		c.UpdateSize()
+
+		msg := tea.MouseMsg{
+			X:      1,
+			Y:      1,
+			Button: tea.MouseButtonLeft,
+			Action: tea.MouseActionRelease,
+		}
+
+		result := c.HandleClick(msg)
+		if result != -1 {
+			t.Errorf("Expected -1 for empty items, got %d", result)
 		}
 	})
 
@@ -135,16 +161,3 @@ func TestCarousel(t *testing.T) {
 		}
 	})
 }
-
-func contains(s, substr string) bool {
-	return len(s) >= len(substr) && (s == substr || len(s) > 0 && containsHelper(s, substr))
-}
-
-func containsHelper(s, substr string) bool {
-	for i := 0; i <= len(s)-len(substr); i++ {
-		if s[i:i+len(substr)] == substr {
-			return true
-		}
-	}
-	return false
-}

internal/tui/components/listviewport/listviewport.go

@@ -74,7 +74,13 @@ func (m *Model) getNumPrsPerPage() int {
 }
 
 func (m *Model) ResetCurrItem() {
+	m.resetCurrItem()
+}
+
+func (m *Model) resetCurrItem() {
 	m.currId = 0
+	m.topBoundId = 0
+	m.bottomBoundId = 0
 	m.viewport.GotoTop()
 }
 
@@ -122,21 +128,16 @@ func (m *Model) LastItem() int {
 
 func (m *Model) SetCurrItem(index int) {
 	if m.NumCurrentItems == 0 {
-		m.currId = 0
-		m.topBoundId = 0
-		m.bottomBoundId = 0
-		m.viewport.GotoTop()
+		m.resetCurrItem()
 		return
 	}
 
 	index = utils.Max(0, utils.Min(index, m.NumCurrentItems-1))
 	itemsPerPage := m.getNumPrsPerPage()
 
 	if itemsPerPage <= 0 {
+		m.resetCurrItem()
 		m.currId = index
-		m.topBoundId = 0
-		m.bottomBoundId = 0
-		m.viewport.GotoTop()
 		return
 	}
 
@@ -153,6 +154,11 @@ func (m *Model) SetCurrItem(index int) {
 	}
 
 	m.currId = index
+	if m.currId == 0 && m.topBoundId > 0 {
+		m.topBoundId = 0
+		m.bottomBoundId = utils.Min(itemsPerPage-1, m.NumCurrentItems-1)
+		m.viewport.GotoTop()
+	}
 }
 
 func (m *Model) SetDimensions(dimensions constants.Dimensions) {

internal/tui/components/sidebar/sidebar.go

@@ -1,8 +1,6 @@
 package sidebar
 
 import (
-	"fmt"
-
 	"github.com/charmbracelet/bubbles/key"
 	"github.com/charmbracelet/bubbles/viewport"
 	tea "github.com/charmbracelet/bubbletea"
@@ -21,7 +19,7 @@ const (
 	ResizeHandleChar = "│"
 	ScrollbarWidth   = 1
 	ScrollThumbChar  = "┃"
-	ScrollTrackChar  = "│"
+	ScrollTrackChar  = "║"
 )
 
 // ResizeMsg is sent when the sidebar is resized via mouse drag
@@ -115,17 +113,11 @@ func (m Model) handleMouseMsg(msg tea.MouseMsg) (Model, tea.Cmd) {
 			// Mouse X is relative to the terminal, sidebar is on the right
 			// New width = ScreenWidth - MouseX
 			newWidth := m.ctx.ScreenWidth - msg.X
-			if newWidth < MinPreviewWidth {
-				newWidth = MinPreviewWidth
-			}
-			if newWidth > MaxPreviewWidth {
-				newWidth = MaxPreviewWidth
-			}
+			newWidth = max(newWidth, MinPreviewWidth)
+			newWidth = min(newWidth, MaxPreviewWidth)
 			// Don't let the sidebar take more than 70% of the screen
 			maxWidth := int(float64(m.ctx.ScreenWidth) * 0.7)
-			if newWidth > maxWidth {
-				newWidth = maxWidth
-			}
+			newWidth = min(newWidth, maxWidth)
 			return m, func() tea.Msg { return ResizeMsg{NewWidth: newWidth} }
 
 		case tea.MouseActionRelease:
@@ -157,38 +149,30 @@ func (m Model) View() string {
 	if width <= 0 {
 		width = m.ctx.Config.Defaults.Preview.Width
 	}
+	handleWidth := lipgloss.Width(ResizeHandleChar)
 
 	var content string
 	if m.data == "" {
 		// Content style without the left border and scrollbar
 		contentStyle := lipgloss.NewStyle().
 			Height(height).
-			Width(width - 1) // Subtract 1 for the resize handle
+			Width(width - handleWidth)
 		content = contentStyle.Align(lipgloss.Center).Render(
 			lipgloss.PlaceVertical(height, lipgloss.Center, m.emptyState),
 		)
 	} else {
 		// Render scrollbar
-		scrollbar := m.renderScrollbar(height - m.ctx.Styles.Sidebar.PagerHeight)
-
-		// Content style - subtract space for resize handle and scrollbar
-		contentWidth := width - 1 - ScrollbarWidth
+		scrollbar := m.renderScrollbar(height)
 
 		// Note: Avoid using MaxWidth() on content that may contain zone markers
 		// as it can truncate them and cause visual artifacts.
 		viewportContent := m.viewport.View()
 
-		pager := lipgloss.NewStyle().
-			Width(contentWidth).
-			Render(m.ctx.Styles.Sidebar.PagerStyle.
-				Render(fmt.Sprintf("%d%%", int(m.viewport.ScrollPercent()*100))))
-
-		mainContent := lipgloss.JoinVertical(lipgloss.Top, viewportContent, pager)
-
 		// Join content and scrollbar
-		content = lipgloss.JoinHorizontal(lipgloss.Top, mainContent, scrollbar)
+		content = lipgloss.JoinHorizontal(lipgloss.Top, viewportContent, scrollbar)
 	}
 
+	// Normalize heights so the resize handle and content align without truncation.
 	contentHeight := lipgloss.Height(content)
 	if height > contentHeight {
 		content = lipgloss.PlaceVertical(height, lipgloss.Top, content)
@@ -230,8 +214,8 @@ func (m Model) renderScrollbar(height int) string {
 
 	// Build scrollbar string
 	scrollbar := ""
-	trackStyle := lipgloss.NewStyle().Foreground(m.ctx.Theme.FaintBorder)
-	thumbStyle := lipgloss.NewStyle().Foreground(m.ctx.Theme.PrimaryBorder)
+	trackStyle := lipgloss.NewStyle().Foreground(m.ctx.Theme.SecondaryBorder).Bold(true)
+	thumbStyle := lipgloss.NewStyle().Foreground(m.ctx.Theme.PrimaryText).Bold(true)
 
 	for i := 0; i < height; i++ {
 		if i >= thumbPos && i < thumbPos+thumbSize {
@@ -298,6 +282,6 @@ func (m *Model) UpdateProgramContext(ctx *context.ProgramContext) {
 		return
 	}
 	m.ctx = ctx
-	m.viewport.Height = m.ctx.MainContentHeight - m.ctx.Styles.Sidebar.PagerHeight
+	m.viewport.Height = m.ctx.MainContentHeight
 	m.viewport.Width = m.GetSidebarContentWidth() - 1 // Account for resize handle
 }

internal/tui/components/table/table.go

@@ -329,8 +329,11 @@ func (m *Model) renderRow(rowId int, headerColumns []string) string {
 		MaxWidth(m.dimensions.Width).
 		Render(lipgloss.JoinHorizontal(lipgloss.Top, renderedColumns...))
 
-	zoneID := fmt.Sprintf("%s%d-%d", RowZonePrefix, m.sectionId, rowId)
-	return zone.Mark(zoneID, row)
+	return zone.Mark(m.rowZoneID(rowId), row)
+}
+
+func (m *Model) rowZoneID(rowID int) string {
+	return fmt.Sprintf("%s%d-%d", RowZonePrefix, m.sectionId, rowID)
 }
 
 func (m *Model) UpdateProgramContext(ctx *context.ProgramContext) {
@@ -365,8 +368,7 @@ func (m *Model) SetSectionId(id int) {
 // HandleClick checks if a row was clicked and returns the row index, or -1 if no row was clicked
 func (m *Model) HandleClick(msg tea.MouseMsg) int {
 	for i := range m.Rows {
-		zoneID := fmt.Sprintf("%s%d-%d", RowZonePrefix, m.sectionId, i)
-		if zone.Get(zoneID).InBounds(msg) {
+		if zone.Get(m.rowZoneID(i)).InBounds(msg) {
 			return i
 		}
 	}

internal/tui/ui.go

@@ -631,14 +631,12 @@ func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 		if m.sidebar.IsOpen {
 			var sidebarCmd tea.Cmd
 			m.sidebar, sidebarCmd = m.sidebar.Update(msg)
-			if sidebarCmd != nil {
-				cmds = append(cmds, sidebarCmd)
-			}
+			cmds = append(cmds, sidebarCmd)
 			// If resizing is in progress, don't process other mouse events
 			if m.sidebar.IsResizing() {
 				return m, tea.Batch(cmds...)
 			}
-			// If sidebar handled a scroll event, return early
+			// If sidebar handled a scroll event, return early to avoid also scrolling the list.
 			if msg.Button == tea.MouseButtonWheelUp || msg.Button == tea.MouseButtonWheelDown {
 				// Check if mouse is in sidebar area
 				sidebarStartX := m.ctx.ScreenWidth - m.ctx.PreviewWidth