Skip to content

Add customizable keyboard shortcuts#888

Open
Rhoahndur wants to merge 1 commit intohumanlayer:mainfrom
Rhoahndur:feature/customizable-hotkeys
Open

Add customizable keyboard shortcuts#888
Rhoahndur wants to merge 1 commit intohumanlayer:mainfrom
Rhoahndur:feature/customizable-hotkeys

Conversation

@Rhoahndur
Copy link
Copy Markdown

@Rhoahndur Rhoahndur commented Dec 4, 2025

What problem(s) was I solving?

Keyboard shortcuts are hardcoded - users can't customize them to their preferences.

What user-facing changes did I ship?

  • New 'Keyboard Shortcuts' section in Settings dialog
  • View all available hotkeys grouped by category
  • Edit any hotkey binding
  • Conflict detection prevents duplicate bindings
  • Reset individual or all hotkeys to defaults
  • Custom bindings persist across sessions (localStorage)

How I implemented it

  • config/hotkeys.ts: Central schema with hotkey IDs, labels, defaults, categories
  • stores/hotkeyStore.ts: Zustand store with persistence for custom bindings
  • hooks/useConfigurableHotkey.ts: Drop-in replacement for useHotkeys that reads from store
  • HotkeySettings.tsx: Settings UI component
  • Updated SettingsDialog to include new tab

How to verify it

  • I have ensured make check test passes
  1. Open Settings (Cmd+Shift+S)
  2. Go to Keyboard Shortcuts tab
  3. Click Edit on any hotkey
  4. Change the binding and Save
  5. Verify the new binding works
  6. Refresh page - verify binding persists

Description for the changelog

Added customizable keyboard shortcuts with settings UI and persistence.-----> NOT FULLY IMPLEMENTED STILL NEED TO DISPLACE ALL THE HARDCODED SHORTCUTS SEEKING FEEDBACK ON HOW THIS FEELS CAN FINISH IF GET THE NOD :)


Important

Adds customizable keyboard shortcuts with a settings UI, allowing users to edit, reset, and persist hotkey bindings.

  • Behavior:
    • Adds customizable keyboard shortcuts with a new 'Keyboard Shortcuts' section in SettingsDialog.
    • Users can view, edit, and reset hotkey bindings, with conflict detection to prevent duplicates.
    • Custom bindings persist across sessions using localStorage.
  • Components:
    • HotkeySettings.tsx: New component for managing hotkey settings UI.
    • Updates SettingsDialog.tsx to include the HotkeySettings component.
    • Modifies Layout.tsx to replace hardcoded hotkeys with configurable ones using useConfigurableHotkey.
  • Configuration:
    • config/hotkeys.ts: Defines hotkey schema with IDs, labels, defaults, and categories.
    • stores/hotkeyStore.ts: Zustand store for managing custom bindings and persistence.
    • hooks/useConfigurableHotkey.ts: Hook to use configurable hotkeys, replacing useHotkeys.
  • Misc:
    • Adds formatBindingForDisplay in useHotkeyUnicodeChars.ts for displaying hotkeys based on platform.

This description was created by Ellipsis for 46a4db5. You can customize this summary. It will automatically update as commits are pushed.

- Add hotkey configuration schema with defaults (config/hotkeys.ts)
- Add Zustand store for hotkey settings with localStorage persistence
- Add useConfigurableHotkey hook that reads from store
- Add HotkeySettings UI component in Settings dialog
- Support conflict detection when setting duplicate keys
- Add reset to defaults option (individual and all) -----> NOT FULLY IMPLEMENTED STILL NEED TO DISPLACE ALL THE HARDCODED SHORTCUTS SEEKING FEEDBACK ON THIS
Copy link
Copy Markdown
Contributor

@ellipsis-dev ellipsis-dev bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Important

Looks good to me! 👍

Reviewed everything up to 46a4db5 in 1 minute and 2 seconds. Click for details.
  • Reviewed 1116 lines of code in 7 files
  • Skipped 0 files when reviewing.
  • Skipped posting 5 draft comments. View those below.
  • Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.
1. humanlayer-wui/src/components/HotkeySettings.tsx:77
  • Draft comment:
    Consider memoizing the filtered hotkeys (based on category) to avoid re-computation on each render if the HOTKEY_DEFINITIONS list grows.
  • Reason this comment was not posted:
    Confidence changes required: 33% <= threshold 50% None
2. humanlayer-wui/src/components/Layout.tsx:697
  • Draft comment:
    Using useStore.getState() directly in navigation callbacks bypasses reactivity. Consider using a selector hook outside or within the callback for consistency.
  • Reason this comment was not posted:
    Confidence changes required: 33% <= threshold 50% None
3. humanlayer-wui/src/hooks/useConfigurableHotkey.ts:14
  • Draft comment:
    Ensure the caller supplies all required dependencies in the deps array so the hotkey binding updates as expected when state changes.
  • Reason this comment was not posted:
    Confidence changes required: 33% <= threshold 50% None
4. humanlayer-wui/src/stores/hotkeyStore.ts:120
  • Draft comment:
    As the number of hotkeys increases, consider caching the normalized binding keys to avoid repeated normalization on each conflict check.
  • Reason this comment was not posted:
    Confidence changes required: 33% <= threshold 50% None
5. humanlayer-wui/src/hooks/useHotkeyUnicodeChars.ts:117
  • Draft comment:
    Review the modifier mapping in formatBindingForDisplay to ensure it robustly handles edge cases (e.g. unusual key names or multiple alternatives).
  • Reason this comment was not posted:
    Confidence changes required: 33% <= threshold 50% None

Workflow ID: wflow_qAYJIF4gUWzpUekF

You can customize Ellipsis by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant