Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add (ctrl-)alt-up/down keyboard navigation #1645

Closed
wants to merge 1 commit into from

Conversation

WebFreak001
Copy link
Contributor

Description

Using Alt-Up/Down moves up/down in the room list / DM list (the drawer)

Using Alt-Left moves up one breadcrumb in a breadcrumbed subspace.

Using Ctrl-Alt-Up/Down moves up/down the pinned spaces (the sidebar) or goes into home or DMs when at the top.

These shortcuts match some other popular messengers (e.g. partially telegram, fully discord, partially element)

Subspaces aren't working optimally yet, since they are immediately entered. In a follow-up PR I would like to improve on that so that they are only selected and not automatically visited when using keyboard navigation, however that requires some more changes I haven't looked into yet.

For navigation the lists or buttons implement imperative refs now. Lists implement a hasSelected for the parent to check on which element to start searching for the next item to focus, as well as a navigate method which takes in 0, 1 or -1, meaning select current again, select next or select previous respectively. If navigate returns 0, an item has been selected, if it returns non-zero it means we should continue searching in the adjacent list.

The drawer (home) and sidebar both have an instance of code that goes through a list of lists - could maybe deduplicate this, but without typescript it's a pain to maintain correctness as a public method so I'd rather not do that right now while these components still use plain JS.

Type of change

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

Checklist:

  • My code follows the style guidelines of this project
    • (ran prettier)
  • I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings

Copy link

Preview: https://1645--pr-cinny.netlify.app
⚠️ Exercise caution. Use test accounts. ⚠️

@ajbura
Copy link
Member

ajbura commented Jan 10, 2025

closing as outdated because of lack of timely review

@ajbura ajbura closed this Jan 10, 2025
@github-actions github-actions bot locked and limited conversation to collaborators Jan 10, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants