Merge pull request #82 from 0xjuanma/refactor/ui

refactor[ui]: consolidate rendering design in views

Author: 0xjuanma

CHANGELOG.md

@@ -11,8 +11,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 - **Smart Update Detection** - The `--update` command now automatically detects whether golazo was installed via Homebrew or install script and uses the appropriate update method
+- **Unified Match Details Rendering** - Consolidated live and finished match views into a single rendering system with consistent styling
 
 ### Fixed
+- **Finished Matches Hints** - Fixed missing keyboard hints in finished matches view and added tab focus indicator
 
 ## [0.16.0] - 2026-01-22
 

internal/app/model.go

@@ -14,6 +14,7 @@ import (
 	"github.com/0xjuanma/golazo/internal/notify"
 	"github.com/0xjuanma/golazo/internal/reddit"
 	"github.com/0xjuanma/golazo/internal/ui"
+	"github.com/charmbracelet/bubbles/key"
 	"github.com/charmbracelet/bubbles/list"
 	"github.com/charmbracelet/bubbles/spinner"
 	"github.com/charmbracelet/bubbles/viewport"
@@ -153,6 +154,11 @@ func New(useMockData bool, debugMode bool, isDevBuild bool, newVersionAvailable
 	statsList.Styles.FilterCursor = filterCursorStyle
 	statsList.FilterInput.PromptStyle = filterPromptStyle
 	statsList.FilterInput.Cursor.Style = filterCursorStyle
+	statsList.AdditionalShortHelpKeys = func() []key.Binding {
+		return []key.Binding{
+			key.NewBinding(key.WithKeys("tab"), key.WithHelp("tab", "focus")),
+		}
+	}
 
 	// Initialize viewport for scrollable match details in stats view
 	statsDetailsViewport := viewport.New(80, 20) // Will be resized dynamically

internal/app/view.go

@@ -95,18 +95,19 @@ func (m *model) ensureStatsListSize() {
 	}
 
 	const (
-		frameH        = 2
-		frameV        = 2
-		titleHeight   = 3
-		spinnerHeight = 3
+		frameH         = 2
+		frameV         = 2
+		titleHeight    = 3
+		spinnerHeight  = 3
+		headerHeight   = 2 // "Match List" header + spacing
+		selectorHeight = 2 // Date selector + spacing
 	)
 
 	leftWidth := max(m.width*40/100, 30)
 	availableWidth := leftWidth - frameH*2
-	availableHeight := m.height - frameV*2 - titleHeight - spinnerHeight
+	availableHeight := m.height - frameV*2 - titleHeight - spinnerHeight - headerHeight - selectorHeight
 
 	if availableWidth > 0 && availableHeight > 0 {
-		// Upcoming matches are now shown in Live view, so give full height to finished list
 		m.statsMatchesList.SetSize(availableWidth, availableHeight)
 	}
 }