diff --git a/package-lock.json b/package-lock.json index a7301d40..4b4ca7c8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -36,7 +36,7 @@ "p-retry": "~7.1.0", "preact": "10.27.2", "punycode": "~2.3.1", - "react-hotkeys-hook": "~5.1.0", + "react-hotkeys-hook": "~5.2.0", "react-intersection-observer": "~9.16.0", "react-quick-pinch-zoom": "~5.1.0", "react-router-dom": "6.6.2", @@ -8790,9 +8790,9 @@ } }, "node_modules/react-hotkeys-hook": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/react-hotkeys-hook/-/react-hotkeys-hook-5.1.0.tgz", - "integrity": "sha512-GCNGXjBzV9buOS3REoQFmSmE4WTvBhYQ0YrAeeMZI83bhXg3dRWsLHXDutcVDdEjwJqJCxk5iewWYX5LtFUd7g==", + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/react-hotkeys-hook/-/react-hotkeys-hook-5.2.0.tgz", + "integrity": "sha512-6hhPHVuofG8De4yU3jr8Q4EjHsxEnob5I1Dag+OxgDRXX1oARHbmURreXyo2CDTYyz0POmFqdBlW6eAa0MwNLw==", "license": "MIT", "workspaces": [ "packages/*" diff --git a/package.json b/package.json index 1eea2d89..9d8dc14b 100644 --- a/package.json +++ b/package.json @@ -49,7 +49,7 @@ "p-retry": "~7.1.0", "preact": "10.27.2", "punycode": "~2.3.1", - "react-hotkeys-hook": "~5.1.0", + "react-hotkeys-hook": "~5.2.0", "react-intersection-observer": "~9.16.0", "react-quick-pinch-zoom": "~5.1.0", "react-router-dom": "6.6.2", diff --git a/src/app.jsx b/src/app.jsx index b7e775d7..17dc4393 100644 --- a/src/app.jsx +++ b/src/app.jsx @@ -22,6 +22,7 @@ import { ICONS } from './components/ICONS'; import KeyboardShortcutsHelp from './components/keyboard-shortcuts-help'; import Loader from './components/loader'; import Modals from './components/modals'; +import NavigationCommand from './components/navigation-command'; import NotificationService from './components/notification-service'; import SearchCommand from './components/search-command'; import Shortcuts from './components/shortcuts'; @@ -514,6 +515,7 @@ function App() { {isLoggedIn && } + {isLoggedIn && } diff --git a/src/components/keyboard-shortcuts-help.jsx b/src/components/keyboard-shortcuts-help.jsx index fee32685..c407c7ce 100644 --- a/src/components/keyboard-shortcuts-help.jsx +++ b/src/components/keyboard-shortcuts-help.jsx @@ -10,6 +10,15 @@ import states from '../utils/states'; import Icon from './icon'; import Modal from './modal'; +// Helper component for sequential key shortcuts +function SequentialKeys({ key1, key2 }) { + return ( + + {key1} then {key2} + + ); +} + export default memo(function KeyboardShortcutsHelp() { const { t } = useLingui(); const snapStates = useSnapshot(states); @@ -196,6 +205,14 @@ export default memo(function KeyboardShortcutsHelp() { ), }, + { + action: t`Go to Home`, + keys: , + }, + { + action: t`Go to Notifications`, + keys: , + }, ].map(({ action, className, keys }) => ( {action} diff --git a/src/components/navigation-command.jsx b/src/components/navigation-command.jsx new file mode 100644 index 00000000..2453f6b3 --- /dev/null +++ b/src/components/navigation-command.jsx @@ -0,0 +1,20 @@ +import { memo } from 'preact/compat'; +import { useHotkeys } from 'react-hotkeys-hook'; +import { useNavigate } from 'react-router-dom'; + +export default memo(function NavigationCommand() { + const navigate = useNavigate(); + + const hotkeyOptions = { + useKey: true, + ignoreEventWhen: (e) => { + const hasModal = !!document.querySelector('#modal-container > *'); + return hasModal || e.metaKey || e.ctrlKey || e.altKey; + }, + }; + + useHotkeys('g>h', () => navigate('/'), hotkeyOptions); + useHotkeys('g>n', () => navigate('/notifications'), hotkeyOptions); + + return null; +}); diff --git a/src/locales/en.po b/src/locales/en.po index 4d2ea7cc..77a62fcf 100644 --- a/src/locales/en.po +++ b/src/locales/en.po @@ -273,7 +273,7 @@ msgstr "View post stats" #: src/components/embed-modal.jsx:13 #: src/components/generic-accounts.jsx:151 #: src/components/gif-picker-modal.jsx:71 -#: src/components/keyboard-shortcuts-help.jsx:43 +#: src/components/keyboard-shortcuts-help.jsx:52 #: src/components/list-add-edit.jsx:37 #: src/components/media-alt-modal.jsx:43 #: src/components/media-attachment.jsx:353 @@ -598,7 +598,7 @@ msgid "Schedule" msgstr "Schedule" #: src/components/compose.jsx:1975 -#: src/components/keyboard-shortcuts-help.jsx:155 +#: src/components/keyboard-shortcuts-help.jsx:164 #: src/components/status.jsx:1073 #: src/components/status.jsx:1107 #: src/components/status.jsx:2091 @@ -720,7 +720,7 @@ msgid "Media" msgstr "" #: src/components/drafts.jsx:270 -#: src/components/keyboard-shortcuts-help.jsx:184 +#: src/components/keyboard-shortcuts-help.jsx:193 #: src/components/status.jsx:736 msgid "Quote" msgstr "" @@ -870,104 +870,108 @@ msgstr "" msgid "Error loading GIFs" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:47 +#: src/components/keyboard-shortcuts-help.jsx:16 +msgid "<0>{key1} then <1>{key2}" +msgstr "<0>{key1} then <1>{key2}" + +#: src/components/keyboard-shortcuts-help.jsx:56 #: src/components/nav-menu.jsx:368 #: src/pages/catchup.jsx:1638 msgid "Keyboard shortcuts" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:55 +#: src/components/keyboard-shortcuts-help.jsx:64 msgid "Keyboard shortcuts help" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:59 +#: src/components/keyboard-shortcuts-help.jsx:68 #: src/pages/catchup.jsx:1663 msgid "Next post" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:63 +#: src/components/keyboard-shortcuts-help.jsx:72 #: src/pages/catchup.jsx:1671 msgid "Previous post" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:67 +#: src/components/keyboard-shortcuts-help.jsx:76 msgid "Skip carousel to next post" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:69 +#: src/components/keyboard-shortcuts-help.jsx:78 msgid "<0>Shift + <1>j" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:75 +#: src/components/keyboard-shortcuts-help.jsx:84 msgid "Skip carousel to previous post" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:77 +#: src/components/keyboard-shortcuts-help.jsx:86 msgid "<0>Shift + <1>k" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:83 +#: src/components/keyboard-shortcuts-help.jsx:92 msgid "Load new posts" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:87 +#: src/components/keyboard-shortcuts-help.jsx:96 #: src/pages/catchup.jsx:1695 msgid "Open post details" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:89 +#: src/components/keyboard-shortcuts-help.jsx:98 msgid "<0>Enter or <1>o" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:96 +#: src/components/keyboard-shortcuts-help.jsx:105 msgid "Expand content warning or<0/>toggle expanded/collapsed thread" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:105 +#: src/components/keyboard-shortcuts-help.jsx:114 msgid "Close post or dialogs" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:107 +#: src/components/keyboard-shortcuts-help.jsx:116 msgid "<0>Esc or <1>Backspace" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:113 +#: src/components/keyboard-shortcuts-help.jsx:122 msgid "Focus column in multi-column mode" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:115 +#: src/components/keyboard-shortcuts-help.jsx:124 msgid "<0>1 to <1>9" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:121 +#: src/components/keyboard-shortcuts-help.jsx:130 msgid "Focus next column in multi-column mode" msgstr "Focus next column in multi-column mode" -#: src/components/keyboard-shortcuts-help.jsx:125 +#: src/components/keyboard-shortcuts-help.jsx:134 msgid "Focus previous column in multi-column mode" msgstr "Focus previous column in multi-column mode" -#: src/components/keyboard-shortcuts-help.jsx:129 +#: src/components/keyboard-shortcuts-help.jsx:138 msgid "Compose new post" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:133 +#: src/components/keyboard-shortcuts-help.jsx:142 msgid "Compose new post (new window)" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:136 +#: src/components/keyboard-shortcuts-help.jsx:145 msgid "<0>Shift + <1>c" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:142 +#: src/components/keyboard-shortcuts-help.jsx:151 msgid "Send post" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:144 +#: src/components/keyboard-shortcuts-help.jsx:153 msgid "<0>Ctrl + <1>Enter or <2>⌘ + <3>Enter" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:151 +#: src/components/keyboard-shortcuts-help.jsx:160 #: src/components/nav-menu.jsx:337 #: src/components/search-form.jsx:204 #: src/components/shortcuts-settings.jsx:52 @@ -977,48 +981,56 @@ msgstr "" msgid "Search" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:159 +#: src/components/keyboard-shortcuts-help.jsx:168 msgid "Reply (new window)" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:162 +#: src/components/keyboard-shortcuts-help.jsx:171 msgid "<0>Shift + <1>r" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:168 +#: src/components/keyboard-shortcuts-help.jsx:177 msgid "Like (favourite)" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:170 +#: src/components/keyboard-shortcuts-help.jsx:179 msgid "<0>l or <1>f" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:176 +#: src/components/keyboard-shortcuts-help.jsx:185 #: src/components/status.jsx:1143 #: src/components/status.jsx:2865 #: src/components/status.jsx:2920 msgid "Boost" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:178 +#: src/components/keyboard-shortcuts-help.jsx:187 msgid "<0>Shift + <1>b" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:188 +#: src/components/keyboard-shortcuts-help.jsx:197 #: src/components/status.jsx:1245 #: src/components/status.jsx:2945 #: src/components/status.jsx:2946 msgid "Bookmark" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:192 +#: src/components/keyboard-shortcuts-help.jsx:201 msgid "Toggle Cloak mode" msgstr "" -#: src/components/keyboard-shortcuts-help.jsx:194 +#: src/components/keyboard-shortcuts-help.jsx:203 msgid "<0>Shift + <1>Alt + <2>k" msgstr "" +#: src/components/keyboard-shortcuts-help.jsx:209 +msgid "Go to Home" +msgstr "Go to Home" + +#: src/components/keyboard-shortcuts-help.jsx:213 +msgid "Go to Notifications" +msgstr "Go to Notifications" + #: src/components/list-add-edit.jsx:41 msgid "Edit list" msgstr ""