👉 Workflow runs 👉 Branch on GitHub

Definitely appreciate the initiative with this. I also often times feel like I’d like to navigate the app by keyboard. I played around a bit with this implementation in the app and it seems to do the job, but I keep wanting to use the keys for more than just the sidebar.

And this is where I wonder if we should go forward with this approach, my main concern is that this won’t be scalable to the rest of the app, places where I see it might not work:

• when you’re on a form page with text inputs this won’t work, we’d need at least a modifier key or disable the shortcuts altogether
• how would we make this type of shortcut solution work in the rest of the app, e.g. list views or generally anywhere else than the sidebar?

For this I’d urge us to do a bit of research and then pick something that’s most suitable for the whole app (i.e. works with any content - menus, lists, dropdowns, pages with lots of content, comments, input forms, modals, reactions, etc.). Because once we pick one method we should stick to it, to not confuse users down the line if we decide the initial thing we picked doesn’t cover all our bases.

Here’s a quick chatgpt chat of what’s out there for starters.

1. Tab-Based Navigation

• Moves focus sequentially through interactive elements (Tab to move forward, Shift + Tab to move backward).
• Common in web accessibility and form navigation.

2. Shortcut-Based Navigation

• Uses predefined key combinations (Ctrl + S, Alt + Tab, Cmd + Space).
• Often used for productivity software and operating systems.

3. Hint-Based Navigation (Letter Hints)

• Temporarily labels clickable elements with letters (as in Vimium or qutebrowser).
• User types the displayed letter(s) to select an element.

4. Caret Navigation (Cursor-Based)

• Moves a text cursor (caret) around the UI using arrow keys.
• Used in text editors, some browsers (F7 mode), and command-line interfaces.

5. Spatial Navigation (Arrow-Key Grid Movement)

• Moves focus based on a 2D layout (using arrow keys to navigate menus, grids, or game-like UIs).
• Common in TV interfaces, gaming UIs, and accessibility features.

6. Command-Based Navigation

• Users enter text commands to navigate (:q in Vim, cd .. in a terminal).
• Seen in command-line interfaces, Vim-like editors, and automation tools.

7. Mnemonic-Based Navigation

• Uses key sequences that resemble words (e.g., Alt + F + S for “File → Save”).
• Found in classic Windows applications with Alt menus.

8. Modal Navigation

• Different modes for movement, selection, and editing (like Vim’s normal/insert modes).
• Reduces key conflicts but requires learning mode switching.

9. Search & Filter Navigation

• Jump to elements using search (e.g., Spotlight Search, Command Palette).
• Often used in IDEs (Ctrl + P in VS Code) and web apps.

10. Predictive & Adaptive Navigation

• Uses AI/autocomplete to predict navigation actions (Ctrl + T in browsers with URL suggestions).
• Found in smart UI assistants and modern operating systems.

I’m leaning towards either 3., 5., 9. or a combination of them. But would really want to spend more time thinking about what requirements we actually have.