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

Assistants Web: Add hot key bindings button #841

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

scottmx81
Copy link
Collaborator

@scottmx81 scottmx81 commented Nov 13, 2024

There is a modal dialog that already exists in the Assistants Web interface, that shows the available keyboard shortcuts. This modal dialog can already be accessed by pressing Ctrl + K or Cmd + K.

This PR modifies the left navigation menu to include a "Hot Keys" button that can be used to access the hot keys dialog:

Screenshot 2024-11-13 at 1 47 15 PM

When hovering over the button, it shows the keystroke to the right:

Screenshot 2024-11-13 at 1 47 28 PM

AI Description

This PR introduces a new feature for managing hotkeys in the application. The changes include:

  • src/interfaces/assistants_web/src/components/HotKeys/HotKeysProvider.tsx:

    • The useSettingsStore hook is imported from @/stores.
    • The useState hook is removed, and the isHotKeysDialogOpen and setIsHotKeysDialogOpen states are now managed using the useSettingsStore hook.
    • The open and close functions now use setIsHotKeysDialogOpen to toggle the dialog.
    • The HotKeysDialog component is updated to use isHotKeysDialogOpen and setIsHotKeysDialogOpen from the useSettingsStore hook.
  • src/interfaces/assistants_web/src/components/SideNavPanel/SideNavPanel.tsx:

    • The isHotKeysDialogOpen and setIsHotKeysDialogOpen states are added to the useSettingsStore hook.
    • A new function openHotKeysDialog is introduced, which toggles the isHotKeysDialogOpen state.
    • A new AgentsSidePanelButton is added to the footer, allowing users to open the hotkeys dialog.
  • src/interfaces/assistants_web/src/components/UI/Icon.tsx:

    • A new icon named 'hot-keys' is added to the getIcon function.
  • src/interfaces/assistants_web/src/stores/persistedStore.ts:

    • The isHotKeysDialogOpen and setIsHotKeysDialogOpen states are added to the useSettingsStore hook.
  • src/interfaces/assistants_web/src/stores/slices/settingsSlice.ts:

    • The isHotKeysDialogOpen state is added to the INITIAL_STATE object.
    • A new action setIsHotKeysDialogOpen is introduced to update the isHotKeysDialogOpen state.

@scottmx81
Copy link
Collaborator Author

I have reused the existing menu icon. Please let me know if there is a more suitable icon to use, and where I can get the SVG, and I will update the icon used in this PR.

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