Simplify dialog code with shared readOnlyScrollDialog base

Extract common scrollable read-only dialog boilerplate (Init, Update, Position,
View, scrolling) into readOnlyScrollDialog. Both permissionsDialog and toolsDialog
now embed it and only provide content rendering logic.

Also unhide /permissions command so it always appears in the command palette.

Assisted-By: docker-agent

Author: dgageot

pkg/tui/commands/commands.go

@@ -327,17 +327,6 @@ func BuildCommandCategories(ctx context.Context, application *app.App) []Categor
 	// Get session commands and filter based on model capabilities
 	sessionCommands := builtInSessionCommands()
 
-	// Hide /permissions if no permissions are configured
-	if !application.HasPermissions() {
-		filtered := make([]Item, 0, len(sessionCommands))
-		for _, cmd := range sessionCommands {
-			if cmd.ID != "session.permissions" {
-				filtered = append(filtered, cmd)
-			}
-		}
-		sessionCommands = filtered
-	}
-
 	categories := []Category{
 		{
 			Name:     "Session",

pkg/tui/dialog/permissions.go

@@ -1,82 +1,34 @@
 package dialog
 
 import (
-	"charm.land/bubbles/v2/key"
-	tea "charm.land/bubbletea/v2"
 	"charm.land/lipgloss/v2"
 
 	"github.com/docker/docker-agent/pkg/runtime"
-	"github.com/docker/docker-agent/pkg/tui/components/scrollview"
-	"github.com/docker/docker-agent/pkg/tui/core"
-	"github.com/docker/docker-agent/pkg/tui/core/layout"
 	"github.com/docker/docker-agent/pkg/tui/styles"
 )
 
 // permissionsDialog displays the configured tool permissions (allow/deny patterns).
 type permissionsDialog struct {
-	BaseDialog
+	readOnlyScrollDialog
 
 	permissions *runtime.PermissionsInfo
 	yoloEnabled bool
-	closeKey    key.Binding
-	scrollview  *scrollview.Model
 }
 
 // NewPermissionsDialog creates a new dialog showing tool permission rules.
 func NewPermissionsDialog(perms *runtime.PermissionsInfo, yoloEnabled bool) Dialog {
-	return &permissionsDialog{
+	d := &permissionsDialog{
 		permissions: perms,
 		yoloEnabled: yoloEnabled,
-		scrollview: scrollview.New(
-			scrollview.WithKeyMap(scrollview.ReadOnlyScrollKeyMap()),
-			scrollview.WithReserveScrollbarSpace(true),
-		),
-		closeKey: key.NewBinding(key.WithKeys("esc", "enter", "q"), key.WithHelp("Esc", "close")),
 	}
+	d.readOnlyScrollDialog = newReadOnlyScrollDialog(
+		readOnlyScrollDialogSize{widthPercent: 60, minWidth: 40, maxWidth: 70, heightPercent: 70, heightMax: 30},
+		d.renderLines,
+	)
+	return d
 }
 
-func (d *permissionsDialog) Init() tea.Cmd {
-	return nil
-}
-
-func (d *permissionsDialog) Update(msg tea.Msg) (layout.Model, tea.Cmd) {
-	if handled, cmd := d.scrollview.Update(msg); handled {
-		return d, cmd
-	}
-
-	switch msg := msg.(type) {
-	case tea.WindowSizeMsg:
-		cmd := d.SetSize(msg.Width, msg.Height)
-		return d, cmd
-
-	case tea.KeyPressMsg:
-		if key.Matches(msg, d.closeKey) {
-			return d, core.CmdHandler(CloseDialogMsg{})
-		}
-	}
-	return d, nil
-}
-
-func (d *permissionsDialog) dialogSize() (dialogWidth, maxHeight, contentWidth int) {
-	dialogWidth = d.ComputeDialogWidth(60, 40, 70)
-	maxHeight = min(d.Height()*70/100, 30)
-	contentWidth = d.ContentWidth(dialogWidth, 2) - d.scrollview.ReservedCols()
-	return dialogWidth, maxHeight, contentWidth
-}
-
-func (d *permissionsDialog) Position() (row, col int) {
-	dialogWidth, maxHeight, _ := d.dialogSize()
-	return CenterPosition(d.Width(), d.Height(), dialogWidth, maxHeight)
-}
-
-func (d *permissionsDialog) View() string {
-	dialogWidth, maxHeight, contentWidth := d.dialogSize()
-	content := d.renderContent(contentWidth, maxHeight)
-	return styles.DialogStyle.Padding(1, 2).Width(dialogWidth).Render(content)
-}
-
-func (d *permissionsDialog) renderContent(contentWidth, maxHeight int) string {
-	// Build all lines
+func (d *permissionsDialog) renderLines(contentWidth, _ int) []string {
 	lines := []string{
 		RenderTitle("Tool Permissions", contentWidth, styles.DialogTitleStyle),
 		RenderSeparator(contentWidth),
@@ -89,7 +41,6 @@ func (d *permissionsDialog) renderContent(contentWidth, maxHeight int) string {
 	if d.permissions == nil {
 		lines = append(lines, styles.MutedStyle.Render("No permission patterns configured."), "")
 	} else {
-		// Deny section (checked first during evaluation)
 		if len(d.permissions.Deny) > 0 {
 			lines = append(lines, d.renderSectionHeader("Deny", "Always blocked, even with yolo mode"), "")
 			for _, pattern := range d.permissions.Deny {
@@ -98,7 +49,6 @@ func (d *permissionsDialog) renderContent(contentWidth, maxHeight int) string {
 			lines = append(lines, "")
 		}
 
-		// Allow section
 		if len(d.permissions.Allow) > 0 {
 			lines = append(lines, d.renderSectionHeader("Allow", "Auto-approved without confirmation"), "")
 			for _, pattern := range d.permissions.Allow {
@@ -107,7 +57,6 @@ func (d *permissionsDialog) renderContent(contentWidth, maxHeight int) string {
 			lines = append(lines, "")
 		}
 
-		// Ask section
 		if len(d.permissions.Ask) > 0 {
 			lines = append(lines, d.renderSectionHeader("Ask", "Always requires confirmation, even for read-only tools"), "")
 			for _, pattern := range d.permissions.Ask {
@@ -116,14 +65,12 @@ func (d *permissionsDialog) renderContent(contentWidth, maxHeight int) string {
 			lines = append(lines, "")
 		}
 
-		// If all are empty
 		if len(d.permissions.Allow) == 0 && len(d.permissions.Ask) == 0 && len(d.permissions.Deny) == 0 {
 			lines = append(lines, styles.MutedStyle.Render("No permission patterns configured."), "")
 		}
 	}
 
-	// Apply scrolling
-	return d.applyScrolling(lines, contentWidth, maxHeight)
+	return lines
 }
 
 func (d *permissionsDialog) renderYoloStatus() string {
@@ -146,7 +93,6 @@ func (d *permissionsDialog) renderSectionHeader(title, description string) strin
 }
 
 func (d *permissionsDialog) renderPattern(pattern string, isDeny bool) string {
-	// Use different colors for deny (red-ish) vs allow (green-ish)
 	var icon string
 	var style lipgloss.Style
 	if isDeny {
@@ -165,26 +111,3 @@ func (d *permissionsDialog) renderAskPattern(pattern string) string {
 	style := lipgloss.NewStyle().Foreground(styles.TextSecondary)
 	return style.Render(icon) + "  " + lipgloss.NewStyle().Foreground(styles.Highlight).Render(pattern)
 }
-
-func (d *permissionsDialog) applyScrolling(allLines []string, contentWidth, maxHeight int) string {
-	const headerLines = 3 // title + separator + space
-	const footerLines = 2 // space + help
-
-	visibleLines := max(1, maxHeight-headerLines-footerLines-4)
-	contentLines := allLines[headerLines:]
-
-	regionWidth := contentWidth + d.scrollview.ReservedCols()
-	d.scrollview.SetSize(regionWidth, visibleLines)
-
-	// Set scrollview position for mouse hit-testing (auto-computed from dialog position)
-	// Y offset: border(1) + padding(1) + headerLines(3) = 5
-	dialogRow, dialogCol := d.Position()
-	d.scrollview.SetPosition(dialogCol+3, dialogRow+2+headerLines)
-
-	d.scrollview.SetContent(contentLines, len(contentLines))
-
-	scrollableContent := d.scrollview.View()
-	parts := append(allLines[:headerLines], scrollableContent)
-	parts = append(parts, "", RenderHelpKeys(regionWidth, "↑↓", "scroll", "Esc", "close"))
-	return lipgloss.JoinVertical(lipgloss.Left, parts...)
-}

pkg/tui/dialog/readonly_scroll_dialog.go

@@ -0,0 +1,111 @@
+package dialog
+
+import (
+	"charm.land/bubbles/v2/key"
+	tea "charm.land/bubbletea/v2"
+	"charm.land/lipgloss/v2"
+
+	"github.com/docker/docker-agent/pkg/tui/components/scrollview"
+	"github.com/docker/docker-agent/pkg/tui/core"
+	"github.com/docker/docker-agent/pkg/tui/core/layout"
+	"github.com/docker/docker-agent/pkg/tui/styles"
+)
+
+// readOnlyScrollDialogSize defines the sizing parameters for a read-only scroll dialog.
+type readOnlyScrollDialogSize struct {
+	widthPercent  int
+	minWidth      int
+	maxWidth      int
+	heightPercent int
+	heightMax     int
+}
+
+// contentRenderer renders dialog content lines given the available width and max height.
+type contentRenderer func(contentWidth, maxHeight int) []string
+
+// readOnlyScrollDialog is a base for simple read-only dialogs with scrollable content.
+// It handles Init, Update (scrollview + close key), Position, View, and scrolling.
+// Concrete dialogs embed it and provide a contentRenderer and help key bindings.
+type readOnlyScrollDialog struct {
+	BaseDialog
+
+	scrollview *scrollview.Model
+	closeKey   key.Binding
+	size       readOnlyScrollDialogSize
+	render     contentRenderer
+	helpKeys   []string // pairs of [key, description] for the footer
+}
+
+// newReadOnlyScrollDialog creates a new read-only scrollable dialog.
+func newReadOnlyScrollDialog(
+	size readOnlyScrollDialogSize,
+	render contentRenderer,
+) readOnlyScrollDialog {
+	return readOnlyScrollDialog{
+		scrollview: scrollview.New(
+			scrollview.WithKeyMap(scrollview.ReadOnlyScrollKeyMap()),
+			scrollview.WithReserveScrollbarSpace(true),
+		),
+		closeKey: key.NewBinding(key.WithKeys("esc", "enter", "q"), key.WithHelp("Esc", "close")),
+		size:     size,
+		render:   render,
+		helpKeys: []string{"↑↓", "scroll", "Esc", "close"},
+	}
+}
+
+func (d *readOnlyScrollDialog) Init() tea.Cmd {
+	return nil
+}
+
+func (d *readOnlyScrollDialog) Update(msg tea.Msg) (layout.Model, tea.Cmd) {
+	if handled, cmd := d.scrollview.Update(msg); handled {
+		return d, cmd
+	}
+
+	switch msg := msg.(type) {
+	case tea.WindowSizeMsg:
+		cmd := d.SetSize(msg.Width, msg.Height)
+		return d, cmd
+
+	case tea.KeyPressMsg:
+		if key.Matches(msg, d.closeKey) {
+			return d, core.CmdHandler(CloseDialogMsg{})
+		}
+	}
+	return d, nil
+}
+
+func (d *readOnlyScrollDialog) dialogSize() (dialogWidth, maxHeight, contentWidth int) {
+	s := d.size
+	dialogWidth = d.ComputeDialogWidth(s.widthPercent, s.minWidth, s.maxWidth)
+	maxHeight = min(d.Height()*s.heightPercent/100, s.heightMax)
+	contentWidth = d.ContentWidth(dialogWidth, 2) - d.scrollview.ReservedCols()
+	return dialogWidth, maxHeight, contentWidth
+}
+
+func (d *readOnlyScrollDialog) Position() (row, col int) {
+	dialogWidth, maxHeight, _ := d.dialogSize()
+	return CenterPosition(d.Width(), d.Height(), dialogWidth, maxHeight)
+}
+
+func (d *readOnlyScrollDialog) View() string {
+	dialogWidth, maxHeight, contentWidth := d.dialogSize()
+	allLines := d.render(contentWidth, maxHeight)
+
+	const headerLines = 3 // title + separator + space
+	contentLines := allLines[headerLines:]
+
+	regionWidth := contentWidth + d.scrollview.ReservedCols()
+	visibleLines := max(1, maxHeight-headerLines-2-4) // 2 = footer (space + help), 4 = dialog chrome
+	d.scrollview.SetSize(regionWidth, visibleLines)
+
+	dialogRow, dialogCol := d.Position()
+	d.scrollview.SetPosition(dialogCol+3, dialogRow+2+headerLines)
+	d.scrollview.SetContent(contentLines, len(contentLines))
+
+	parts := append(allLines[:headerLines], d.scrollview.View())
+	parts = append(parts, "", RenderHelpKeys(regionWidth, d.helpKeys...))
+
+	content := lipgloss.JoinVertical(lipgloss.Left, parts...)
+	return styles.DialogStyle.Padding(1, 2).Width(dialogWidth).Render(content)
+}