feat: Add search functionality to help menu (#1009)

Author: iZarrios

src/internal/default_config.go

@@ -32,12 +32,7 @@ func defaultModelConfig(toggleDotFile, toggleFooter, firstUse bool, firstFilePan
 			},
 			width: 10,
 		},
-		helpMenu: helpMenuModal{
-			renderIndex: 0,
-			cursor:      1,
-			data:        getHelpMenuData(),
-			open:        false,
-		},
+		helpMenu:       newHelpMenuModal(),
 		imagePreviewer: imagePreviewer,
 		promptModal:    prompt.DefaultModel(prompt.PromptMinHeight, prompt.PromptMinWidth),
 		modelQuitState: notQuitting,
@@ -48,6 +43,19 @@ func defaultModelConfig(toggleDotFile, toggleFooter, firstUse bool, firstFilePan
 	}
 }
 
+func newHelpMenuModal() helpMenuModal {
+	helpMenuData := getHelpMenuData()
+
+	return helpMenuModal{
+		renderIndex:  0,
+		cursor:       1,
+		data:         helpMenuData,
+		filteredData: helpMenuData,
+		open:         false,
+		searchBar:    common.GenerateSearchBar(),
+	}
+}
+
 // Return help menu for Hotkeys
 func getHelpMenuData() []helpMenuModalData { //nolint: funlen // This should be self contained
 	data := []helpMenuModalData{

src/internal/handle_modal.go

@@ -5,6 +5,8 @@ import (
 	"os"
 	"path/filepath"
 	"strings"
+
+	"github.com/yorukot/superfile/src/internal/utils"
 )
 
 // Cancel typing modal e.g. create file or directory
@@ -144,34 +146,42 @@ func (m *model) helpMenuListUp() {
 		m.helpMenu.cursor--
 		if m.helpMenu.cursor < m.helpMenu.renderIndex {
 			m.helpMenu.renderIndex--
-			if m.helpMenu.data[m.helpMenu.cursor].subTitle != "" {
+			if m.helpMenu.filteredData[m.helpMenu.cursor].subTitle != "" {
 				m.helpMenu.renderIndex--
 			}
 		}
-		if m.helpMenu.data[m.helpMenu.cursor].subTitle != "" {
+		if m.helpMenu.filteredData[m.helpMenu.cursor].subTitle != "" {
 			m.helpMenu.cursor--
 		}
 	} else {
-		m.helpMenu.cursor = len(m.helpMenu.data) - 1
-		m.helpMenu.renderIndex = len(m.helpMenu.data) - m.helpMenu.height
+		// Set the cursor to the last item in the list.
+		// We use max(..., 0) as a safeguard to prevent a negative cursor index
+		// in case the filtered list is empty.
+		m.helpMenu.cursor = max(len(m.helpMenu.filteredData)-1, 0)
+
+		// Adjust the render index to show the bottom of the list.
+		// Similarly, we use max(..., 0) to ensure the renderIndex doesn't become negative,
+		// which can happen if the number of items is less than the view height.
+		// This prevents a potential out-of-bounds panic during rendering.
+		m.helpMenu.renderIndex = max(len(m.helpMenu.filteredData)-m.helpMenu.height, 0)
 	}
 }
 
 // Help menu panel list down
 func (m *model) helpMenuListDown() {
-	if len(m.helpMenu.data) == 0 {
+	if len(m.helpMenu.filteredData) == 0 {
 		return
 	}
 
-	if m.helpMenu.cursor < len(m.helpMenu.data)-1 {
+	if m.helpMenu.cursor < len(m.helpMenu.filteredData)-1 {
 		m.helpMenu.cursor++
-		if m.helpMenu.cursor > m.helpMenu.renderIndex+m.helpMenu.height-1 {
+		if m.helpMenu.cursor > m.helpMenu.renderIndex+m.helpMenu.height-2 {
 			m.helpMenu.renderIndex++
-			if m.helpMenu.data[m.helpMenu.cursor].subTitle != "" {
+			if m.helpMenu.filteredData[m.helpMenu.cursor].subTitle != "" {
 				m.helpMenu.renderIndex++
 			}
 		}
-		if m.helpMenu.data[m.helpMenu.cursor].subTitle != "" {
+		if m.helpMenu.filteredData[m.helpMenu.cursor].subTitle != "" {
 			m.helpMenu.cursor++
 		}
 	} else {
@@ -180,17 +190,88 @@ func (m *model) helpMenuListDown() {
 	}
 }
 
+func removeOrphanSections(items []helpMenuModalData) []helpMenuModalData {
+	var result []helpMenuModalData
+	// Since we can't know beforehand which section are we actually filtering
+	// we may end up in a scenario where there are two sections (General, Panel navigation)
+	// with no hotkeys between them, so we need to remove the section which its hotkeys was
+	// completely filtered out (Orphan sections)
+	for i := range items {
+		if items[i].subTitle != "" {
+			// Look ahead: is the next item a real hotkey?
+			if i+1 < len(items) && items[i+1].subTitle == "" {
+				result = append(result, items[i])
+			}
+			// Else: skip this subtitle because no children
+		} else {
+			result = append(result, items[i])
+		}
+	}
+	return result
+}
+
+func (m *model) filterHelpMenu(query string) {
+	filtered := fuzzySearch(query, m.helpMenu.data)
+	filtered = removeOrphanSections(filtered)
+
+	m.helpMenu.filteredData = filtered
+	m.helpMenu.cursor = 1
+	m.helpMenu.renderIndex = 0
+}
+
+// Fuzzy search function for a list of helpMenuModalData.
+// inspired from: sidebar/directory_utils.go
+func fuzzySearch(query string, data []helpMenuModalData) []helpMenuModalData {
+	if len(data) == 0 {
+		return []helpMenuModalData{}
+	}
+
+	// Optimization - This haystack can be kept precomputed based on description
+	// instead of re computing it in each call
+	haystack := []string{}
+	idxMap := []int{}
+	for i, item := range data {
+		if item.subTitle == "" {
+			haystack = append(haystack, item.description)
+			idxMap = append(idxMap, i)
+		}
+	}
+
+	matchedIdx := map[int]struct{}{}
+	for _, match := range utils.FzfSearch(query, haystack) {
+		matchedIdx[idxMap[match.HayIndex]] = struct{}{}
+		// if d, ok := idx[match.Key]; ok {
+		// 	filteredDirs = append(filteredDirs, d)
+		// }
+	}
+	results := []helpMenuModalData{}
+	for i, d := range data {
+		if d.subTitle != "" {
+			results = append(results, d)
+			continue
+		}
+		if _, ok := matchedIdx[i]; ok {
+			results = append(results, d)
+		}
+	}
+
+	return results
+}
+
 // Toggle help menu
 func (m *model) openHelpMenu() {
 	if m.helpMenu.open {
 		m.helpMenu.open = false
 		return
 	}
 
+	// Reset filteredData to the full data whenever the helpMenu is opened
+	m.helpMenu.filteredData = m.helpMenu.data
 	m.helpMenu.open = true
 }
 
 // Quit help menu
 func (m *model) quitHelpMenu() {
+	m.helpMenu.searchBar.Reset()
 	m.helpMenu.open = false
 }

src/internal/key_function.go

@@ -300,12 +300,25 @@ func (m *model) focusOnSearchbarKey(msg string) {
 // Check hotkey input in help menu. Possible actions are moving up, down
 // and quiting the menu
 func (m *model) helpMenuKey(msg string) {
-	switch {
-	case slices.Contains(common.Hotkeys.ListUp, msg):
-		m.helpMenuListUp()
-	case slices.Contains(common.Hotkeys.ListDown, msg):
-		m.helpMenuListDown()
-	case slices.Contains(common.Hotkeys.Quit, msg):
-		m.quitHelpMenu()
+	if m.helpMenu.searchBar.Focused() {
+		switch {
+		case slices.Contains(common.Hotkeys.ConfirmTyping, msg):
+			m.helpMenu.searchBar.Blur()
+		case slices.Contains(common.Hotkeys.CancelTyping, msg):
+			m.helpMenu.searchBar.Blur()
+		default:
+			m.filterHelpMenu(m.helpMenu.searchBar.Value())
+		}
+	} else {
+		switch {
+		case slices.Contains(common.Hotkeys.ListUp, msg):
+			m.helpMenuListUp()
+		case slices.Contains(common.Hotkeys.ListDown, msg):
+			m.helpMenuListDown()
+		case slices.Contains(common.Hotkeys.Quit, msg):
+			m.quitHelpMenu()
+		case slices.Contains(common.Hotkeys.SearchBar, msg):
+			m.helpMenu.searchBar.Focus()
+		}
 	}
 }

src/internal/model.go

@@ -67,6 +67,14 @@ func (m *model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 	gotModelUpdateMsg := false
 
 	sidebarCmd = m.sidebarModel.UpdateState(msg)
+
+	// this is similar to m.sidebarModel.UpdateState(msg) but since helpMenu is not a Model
+	// we call .Update() manually here
+	var helpMenuCmd tea.Cmd
+	if m.helpMenu.searchBar.Focused() {
+		m.helpMenu.searchBar, helpMenuCmd = m.helpMenu.searchBar.Update(msg)
+	}
+
 	forcePreviewRender := false
 
 	switch msg := msg.(type) {
@@ -104,7 +112,7 @@ func (m *model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 		filePreviewCmd = m.getFilePreviewCmd(forcePreviewRender)
 	}
 
-	return m, tea.Batch(sidebarCmd, inputCmd, updateCmd, panelCmd, metadataCmd, filePreviewCmd)
+	return m, tea.Batch(sidebarCmd, helpMenuCmd, inputCmd, updateCmd, panelCmd, metadataCmd, filePreviewCmd)
 }
 
 func (m *model) handleMouseMsg(msg tea.MouseMsg) {
@@ -278,6 +286,7 @@ func (m *model) setHelpMenuSize() {
 	if m.fullWidth > 95 {
 		m.helpMenu.width = 90
 	}
+	m.helpMenu.searchBar.Width = m.helpMenu.width - 4
 }
 
 func (m *model) setPromptModelSize() {

src/internal/model_render.go

@@ -340,7 +340,7 @@ func (m *model) promptModalRender() string {
 func (m *model) helpMenuRender() string {
 	maxKeyLength := 0
 
-	for _, data := range m.helpMenu.data {
+	for _, data := range m.helpMenu.filteredData {
 		totalKeyLen := 0
 		for _, key := range data.hotkey {
 			totalKeyLen += len(key)
@@ -359,7 +359,7 @@ func (m *model) helpMenuRender() string {
 	totalTitleCount := 0
 	cursorBeenTitleCount := 0
 
-	for i, data := range m.helpMenu.data {
+	for i, data := range m.helpMenu.filteredData {
 		if data.subTitle != "" {
 			if i < m.helpMenu.cursor {
 				cursorBeenTitleCount++
@@ -370,24 +370,25 @@ func (m *model) helpMenuRender() string {
 
 	renderHotkeyLength := m.getRenderHotkeyLengthHelpmenuModal()
 	helpMenuContent := m.getHelpMenuContent(renderHotkeyLength, valueLength)
-
+	searchBar := m.helpMenu.searchBar.View()
+	helpMenuContent = lipgloss.JoinVertical(lipgloss.Left, searchBar, helpMenuContent)
 	bottomBorder := common.GenerateFooterBorder(fmt.Sprintf("%s/%s",
 		strconv.Itoa(m.helpMenu.cursor+1-cursorBeenTitleCount),
-		strconv.Itoa(len(m.helpMenu.data)-totalTitleCount)), m.helpMenu.width-2)
+		strconv.Itoa(len(m.helpMenu.filteredData)-totalTitleCount)), m.helpMenu.width-2)
 
 	return common.HelpMenuModalBorderStyle(m.helpMenu.height, m.helpMenu.width, bottomBorder).Render(helpMenuContent)
 }
 
 func (m *model) getRenderHotkeyLengthHelpmenuModal() int {
 	renderHotkeyLength := 0
-	for i := m.helpMenu.renderIndex; i < m.helpMenu.height+m.helpMenu.renderIndex && i < len(m.helpMenu.data); i++ {
+	for i := m.helpMenu.renderIndex; i < m.helpMenu.height+m.helpMenu.renderIndex && i < len(m.helpMenu.filteredData); i++ {
 		hotkey := ""
 
-		if m.helpMenu.data[i].subTitle != "" {
+		if m.helpMenu.filteredData[i].subTitle != "" {
 			continue
 		}
 
-		for i, key := range m.helpMenu.data[i].hotkey {
+		for i, key := range m.helpMenu.filteredData[i].hotkey {
 			if i != 0 {
 				hotkey += " | "
 			}
@@ -401,20 +402,20 @@ func (m *model) getRenderHotkeyLengthHelpmenuModal() int {
 
 func (m *model) getHelpMenuContent(renderHotkeyLength int, valueLength int) string {
 	helpMenuContent := ""
-	for i := m.helpMenu.renderIndex; i < m.helpMenu.height+m.helpMenu.renderIndex && i < len(m.helpMenu.data); i++ {
+	for i := m.helpMenu.renderIndex; i < m.helpMenu.height+m.helpMenu.renderIndex && i < len(m.helpMenu.filteredData); i++ {
 		if i != m.helpMenu.renderIndex {
 			helpMenuContent += "\n"
 		}
 
-		if m.helpMenu.data[i].subTitle != "" {
-			helpMenuContent += common.HelpMenuTitleStyle.Render(" " + m.helpMenu.data[i].subTitle)
+		if m.helpMenu.filteredData[i].subTitle != "" {
+			helpMenuContent += common.HelpMenuTitleStyle.Render(" " + m.helpMenu.filteredData[i].subTitle)
 			continue
 		}
 
 		hotkey := ""
-		description := common.TruncateText(m.helpMenu.data[i].description, valueLength, "...")
+		description := common.TruncateText(m.helpMenu.filteredData[i].description, valueLength, "...")
 
-		for i, key := range m.helpMenu.data[i].hotkey {
+		for i, key := range m.helpMenu.filteredData[i].hotkey {
 			if i != 0 {
 				hotkey += " | "
 			}

src/internal/type.go

@@ -115,12 +115,14 @@ type model struct {
 
 // Modal
 type helpMenuModal struct {
-	height      int
-	width       int
-	open        bool
-	renderIndex int
-	cursor      int
-	data        []helpMenuModalData
+	height       int
+	width        int
+	open         bool
+	renderIndex  int
+	cursor       int
+	data         []helpMenuModalData
+	filteredData []helpMenuModalData
+	searchBar    textinput.Model
 }
 
 type helpMenuModalData struct {