Add keyboard navigation to quickly hop between various pages of a project #3097
Zak Siddiqui opened 9 hours ago

Improve on the following Git issue for OneDev. Use common Git issue patterns to make it a well-described issue.

Don't assume. Ask high-level clarifying questions if needed.

  • Numbered questions (1, 2, 3, etc)
  • Lettered answer options (A, B, C, etc)
  • Include a markdown table that contains the following for each option:
    • number (with an emoji that represents your recommended option)
    • Option short title
    • Explanation (don't assume my level of knowledge).
    • Pros (with relevant emojis)
    • Cons (with relevant emojis)

I want keyboard shortcuts to quickly hop between various pages of a project, including:

Main

  • Overview (o)
  • Pull Requests (p)
  • Builds (u)
  • Packages (g, since p is for pull requests)
  • Workspaces (w)

Code

  • Files (f)
  • Commits (c)
  • Branches (b)
  • Tags (t)
  • Code Comments (m - for comMent or for Markup)
  • Code Compare (d - for diff)

Issues

  • List (i)
  • Boards (k for kanban, since b is for branch)
  • Iterations (e, since "I" is taken for the issues list)

Statistics

  • Code Contributions (sc)
  • Pull Request (sp)
  • Issue (si)
  • Build (sb)

The universal trigger for entering shortcuts mode could be the letter o. So for issue statisticr, it would be osi. For issues, it would be oi.

There should be a universal method of creating a new item. The universal shortcut for creating a new thing should be n. For creating a new issue, ni, For creating a new pull request, np, For creating a new tag, nt, For running a build, nb, etc

Naturally, the only time when the shortcut key would not be accepted is if the focus is on a text box. In which case, the user can still use the keyboard because they can hit Escape and then hit the shortcut.

If you have any better ideas, please suggest.

Don't assume. Ask high-level clarifying questions if needed.

  • Numbered questions (1, 2, 3, etc)
  • Lettered answer options (A, B, C, etc)
  • Include a markdown table that contains the following for each option:
    • number (with an emoji that represents your recommended option)
    • Option short title
    • Explanation (don't assume my level of knowledge).
    • Pros (with relevant emojis)
    • Cons (with relevant emojis)
  • Service Desk commented 9 hours ago

    I could not start the requested work because this assignee account does not have permission to write code in the issue project (tod issue checkout --for-write 3097 returned HTTP 403). No checkout or code changes were made.

  • Zak Siddiqui commented 9 hours ago

    @servicedesk I just need your assistance to refine and create the issue.

  • Service Desk commented 8 hours ago

    @zaakiy, absolutely. The feature is clear at a high level: add project-wide, sequential keyboard shortcuts for navigation and common create actions, while ignoring keystrokes entered in editable controls. Before I turn it into a precise implementation issue, please choose the behavior below.\n\n| No. | Option | Explanation | Pros | Cons |\n|---|---|---|---|---|\n| 1A ⭐ | Prefix sequences | Use the proposed prefixes: for navigation and for creation. Examples: opens issues, opens issue statistics, and starts a new issue. | ✅ Matches your proposal; ✅ no modifier keys; ✅ fast after learning | ⚠️ Needs a short timeout and on-screen hint after the first key |\n| 1B | Command palette | One shortcut opens a searchable list of destinations and actions. | ✅ Easy to discover; ✅ avoids mnemonic conflicts | ⚠️ Slower for frequent use; ⚠️ differs from your proposed sequences |\n| 1C | Modifier shortcuts | Use combinations such as or . | ✅ Immediate single-step action | ⚠️ More browser/OS conflicts; ⚠️ harder to remember |\n| 2A ⭐ | Ignore all editable contexts | Disable sequences in text inputs, textareas, selectors, and content-editable components. Escape may first leave or close the active editor, after which shortcuts work normally. | ✅ Prevents accidental navigation or data loss; ✅ consistent safety rule | ⚠️ Requires users to leave the editor first |\n| 2B | Text fields only | Disable sequences only in basic text inputs and textareas. | ✅ Shortcuts remain available in more places | ⚠️ Rich editors and interactive widgets may still conflict |\n| 3A ⭐ | Full navigation, eligible creation | Include every navigation destination listed in the description. Include a create shortcut only where the user has permission and the action is available; do not intercept unsupported sequences. | ✅ Complete and predictable; ✅ respects permissions and project features | ⚠️ Larger initial implementation |\n| 3B | Navigation first | Deliver navigation sequences first and track creation sequences separately. | ✅ Smaller first change; ✅ easier to validate | ⚠️ The complete workflow arrives in stages |\n\nPlease reply with one choice per question, for example 1A, 2A, 3A. Unless you prefer otherwise, I recommend those three starred options.\n\nWith those choices, I will refine the issue around these acceptance criteria:\n\n- Sequential shortcuts work from project pages without modifier keys.\n- The first key opens a small discoverability hint showing valid next keys.\n- A sequence cancels on Escape, an invalid key, or a short timeout.\n- Navigation preserves the current project and routes to the selected project page.\n- Create actions use the normal permission checks and existing creation screens.\n- Shortcuts never fire while focus is in an editable control.\n- A keyboard-shortcut help entry documents all supported sequences.

  • Service Desk commented 8 hours ago

    @zaakiy, correction: the shortcut labels in my previous comment were stripped by formatting. Here is the complete question.

    The feature is clear at a high level: add project-wide, sequential keyboard shortcuts for navigation and common create actions, while ignoring keystrokes entered in editable controls. Before I turn it into a precise implementation issue, please choose the behavior below.

    No.OptionExplanationProsCons
    1A ⭐Prefix sequencesUse the proposed prefixes: o for navigation and n for creation. Examples: oi opens issues, osi opens issue statistics, and ni starts a new issue.✅ Matches your proposal; ✅ no modifier keys; ✅ fast after learning⚠️ Needs a short timeout and on-screen hint after the first key
    1BCommand paletteOne shortcut opens a searchable list of destinations and actions.✅ Easy to discover; ✅ avoids mnemonic conflicts⚠️ Slower for frequent use; ⚠️ differs from your proposed sequences
    1CModifier shortcutsUse combinations such as Alt+I or Alt+N.✅ Immediate single-step action⚠️ More browser/OS conflicts; ⚠️ harder to remember
    2A ⭐Ignore all editable contextsDisable sequences in text inputs, textareas, selectors, and content-editable components. Escape may first leave or close the active editor, after which shortcuts work normally.✅ Prevents accidental navigation or data loss; ✅ consistent safety rule⚠️ Requires users to leave the editor first
    2BText fields onlyDisable sequences only in basic text inputs and textareas.✅ Shortcuts remain available in more places⚠️ Rich editors and interactive widgets may still conflict
    3A ⭐Full navigation, eligible creationInclude every navigation destination listed in the description. Include a create shortcut only where the user has permission and the action is available; do not intercept unsupported sequences.✅ Complete and predictable; ✅ respects permissions and project features⚠️ Larger initial implementation
    3BNavigation firstDeliver navigation sequences first and track creation sequences separately.✅ Smaller first change; ✅ easier to validate⚠️ The complete workflow arrives in stages

    Please reply with one choice per question, for example 1A, 2A, 3A. Unless you prefer otherwise, I recommend those three starred options.

    With those choices, I will refine the issue around these acceptance criteria:

    • Sequential shortcuts work from project pages without modifier keys.
    • The first key opens a small discoverability hint showing valid next keys.
    • A sequence cancels on Escape, an invalid key, or a short timeout.
    • Navigation preserves the current project and routes to the selected project page.
    • Create actions use the normal permission checks and existing creation screens.
    • Shortcuts never fire while focus is in an editable control.
    • A keyboard-shortcut help entry documents all supported sequences.
  • Zak Siddiqui commented 5 hours ago

    1a - yes

    1b - The command palette could be improved by adding shortcut combinations, similar to <enter> to go, <tab> to search, we could have <o> <i> for ~issues, <n> <i> for ~issues/new, and so on. Note that the command palette should show the shortcuts, but not support using them if the command palette is invoked uing the .command-palette button or using Ctrl/Cmd-k, because I want to be able to use the shortcuts without opening the command palette. That said, when the o or n is invoked outside the command palette, then the command palette should open and only be showing the commands that follow the o or n prefix respectively.

    1c - No

    2a - yes

    3a - yes

    Don't assume. Ask high-level clarifying questions if needed.

    • Numbered questions (1, 2, 3, etc)
    • Lettered answer options (A, B, C, etc)
    • Include a markdown table that contains the following for each option:
      • number (with an emoji that represents your recommended option)
      • Option short title
      • Explanation (don't assume my level of knowledge).
      • Pros (with relevant emojis)
      • Cons (with relevant emojis)
  • Service Desk commented 5 hours ago

    @zaakiy, understood. I will refine the feature as a hybrid shortcut/command-palette interaction:

    • Pressing o or n outside an editable context opens the command palette in a dedicated shortcut mode.
    • o shows only project navigation commands; n shows only eligible creation commands.
    • The palette displays each command's next key, and pressing that key immediately runs the command without requiring Enter.
    • Opening the palette normally via Ctrl/Cmd-k or the .command-palette button keeps its current behavior. Shortcut sequences are shown there for discoverability but are not active.
    • Shortcuts are disabled in all editable contexts.
    • All requested navigation destinations and permission-eligible creation actions are included.

    Two interaction details remain before the issue is implementation-ready:

    No.Option short titleExplanationProsCons
    1A ⭐Search within the prefix groupAfter o or n opens shortcut mode, Tab activates text search while retaining that group's navigation-only or creation-only filter.✅ Predictable scope; ✅ matches the visible command set; ✅ avoids unrelated results⚠️ A user must reopen the full palette to search all commands
    1BSearch all commandsTab leaves shortcut mode and searches the complete command palette.✅ Broader search without reopening⚠️ The results can abruptly change from the selected prefix group
    2A ⭐Keep the palette openIf no second key is pressed, or an unsupported key is pressed, keep the filtered palette open so the user can use arrow keys, the mouse, Tab, or Escape. No timeout is needed once the visible palette opens.✅ Better discoverability; ✅ forgiving for new users; ✅ accessible fallback⚠️ Requires Escape or an outside click to dismiss
    2BCancel the sequenceClose the palette after a short timeout or an unsupported second key.✅ Returns quickly to the page⚠️ Can feel abrupt; ⚠️ makes learning available shortcuts harder

    Please reply with one choice per question, for example 1A, 2A. I recommend the starred options.

  • Zak Siddiqui commented 5 hours ago
    1. a
    2. b. It's only for advanced users. Helps enforce correct key combinations.

    Don't assume. Ask high-level clarifying questions if needed.

    • Numbered questions (1, 2, 3, etc)
    • Lettered answer options (A, B, C, etc)
    • Include a markdown table that contains the following for each option:
      • number (with an emoji that represents your recommended option)
      • Option short title
      • Explanation (don't assume my level of knowledge).
      • Pros (with relevant emojis)
      • Cons (with relevant emojis)
  • Service Desk commented 5 hours ago

    @zaakiy, thanks—your final choices are captured in new feature #3098:

    • Tab searches only within the active o navigation or n creation group.
    • An unsupported key or short timeout closes shortcut mode, keeping the interaction aimed at advanced users and reinforcing valid combinations.
    • The issue specifies all requested navigation sequences, permission-eligible creation actions, editable-context safety, normal command-palette behavior, and acceptance criteria.

    All watchers from this Question were added to #3098, and the two issues are linked. Since the design question is resolved and implementation is now tracked in #3098, I am closing this Question.

  • Service Desk changed state to 'Closed' 5 hours ago
    Previous Value Current Value
    Open
    Closed
1/1
Type
Question
Priority
Normal
Assignee
Labels
No labels
Issue Votes (0)
Watchers (3)
Reference
OD-3097
Please wait...
Connection lost or session expired, reload to recover
Page is in error, reload to recover