Desktop: Enable 'Alt+Left/Right' for history navigation.
## Why - Consistent behavior across Web and Desktop.
This commit is contained in:
parent
cbac21746f
commit
d0f42ce6b3
3 changed files with 33 additions and 0 deletions
|
@ -8,6 +8,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
||||||
|
|
||||||
### Added
|
### Added
|
||||||
|
|
||||||
|
- Desktop: Enable 'Alt+Left/Right' for history navigation _community pr!_ ([#5203](https://github.com/lbryio/lbry-desktop/pull/5203))
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
|
||||||
### Fixed
|
### Fixed
|
||||||
|
|
|
@ -22,6 +22,7 @@ import Spinner from 'component/spinner';
|
||||||
import SyncFatalError from 'component/syncFatalError';
|
import SyncFatalError from 'component/syncFatalError';
|
||||||
// @if TARGET='app'
|
// @if TARGET='app'
|
||||||
import useZoom from 'effects/use-zoom';
|
import useZoom from 'effects/use-zoom';
|
||||||
|
import useHistoryNav from 'effects/use-history-nav';
|
||||||
// @endif
|
// @endif
|
||||||
// @if TARGET='web'
|
// @if TARGET='web'
|
||||||
import OpenInAppLink from 'web/component/openInAppLink';
|
import OpenInAppLink from 'web/component/openInAppLink';
|
||||||
|
@ -192,6 +193,11 @@ function App(props: Props) {
|
||||||
useZoom();
|
useZoom();
|
||||||
// @endif
|
// @endif
|
||||||
|
|
||||||
|
// Enable 'Alt + Left/Right' for history navigation on Desktop.
|
||||||
|
// @if TARGET='app'
|
||||||
|
useHistoryNav(history);
|
||||||
|
// @endif
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (referredRewardAvailable && sanitizedReferrerParam && isRewardApproved) {
|
if (referredRewardAvailable && sanitizedReferrerParam && isRewardApproved) {
|
||||||
setReferrer(sanitizedReferrerParam, true);
|
setReferrer(sanitizedReferrerParam, true);
|
||||||
|
|
25
ui/effects/use-history-nav.js
Normal file
25
ui/effects/use-history-nav.js
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
import { useEffect } from 'react';
|
||||||
|
|
||||||
|
export default function useHistoryNav(history) {
|
||||||
|
useEffect(() => {
|
||||||
|
const handleKeyPress = e => {
|
||||||
|
if ((e.metaKey || e.altKey) && !e.ctrlKey && !e.shiftKey) {
|
||||||
|
switch (e.code) {
|
||||||
|
case 'ArrowLeft':
|
||||||
|
e.preventDefault();
|
||||||
|
history.goBack();
|
||||||
|
break;
|
||||||
|
case 'ArrowRight':
|
||||||
|
e.preventDefault();
|
||||||
|
history.goForward();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
// Do nothing
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
window.addEventListener('keydown', handleKeyPress);
|
||||||
|
return () => window.removeEventListener('keydown', handleKeyPress);
|
||||||
|
}, []);
|
||||||
|
}
|
Loading…
Reference in a new issue