From 03a12413d632a2a1613091e44c52ce46b4adc5b8 Mon Sep 17 00:00:00 2001 From: Vijay A Date: Fri, 19 Apr 2024 09:02:56 +0530 Subject: Minor refactoring to move repeated code into utility class --- src/components/downloadManager/DownloadManagerLayout.tsx | 4 ++-- src/components/services/tabs/TabItem.tsx | 6 +++--- src/components/settings/SettingsLayout.tsx | 4 ++-- src/components/settings/releaseNotes/ReleaseNotesLayout.tsx | 4 ++-- src/components/ui/input/index.tsx | 3 ++- src/components/ui/select/index.tsx | 13 +++++++++---- 6 files changed, 20 insertions(+), 14 deletions(-) (limited to 'src/components') diff --git a/src/components/downloadManager/DownloadManagerLayout.tsx b/src/components/downloadManager/DownloadManagerLayout.tsx index 43670355c..09a1b2096 100644 --- a/src/components/downloadManager/DownloadManagerLayout.tsx +++ b/src/components/downloadManager/DownloadManagerLayout.tsx @@ -10,7 +10,7 @@ import { import { mdiClose } from '@mdi/js'; import { Outlet } from 'react-router-dom'; import type { Actions } from '../../actions/lib/actions'; -import { isEscKeyPress } from '../../jsUtils'; +import { isEscapeKeyPress } from '../../jsUtils'; import Appear from '../ui/effects/Appear'; import Icon from '../ui/icon'; import ErrorBoundary from '../util/ErrorBoundary'; @@ -45,7 +45,7 @@ class DownloadManagerLayout extends Component { } handleKeyDown(e: KeyboardEvent) { - if (isEscKeyPress(e.key)) { + if (isEscapeKeyPress(e.key)) { this.props.actions!.ui.closeSettings(); } } diff --git a/src/components/services/tabs/TabItem.tsx b/src/components/services/tabs/TabItem.tsx index bf193e136..0e999506a 100644 --- a/src/components/services/tabs/TabItem.tsx +++ b/src/components/services/tabs/TabItem.tsx @@ -19,7 +19,7 @@ import globalMessages from '../../../i18n/globalMessages'; import type Service from '../../../models/Service'; import Icon from '../../ui/icon'; import MenuItemConstructorOptions = Electron.MenuItemConstructorOptions; -import { acceleratorString } from '../../../jsUtils'; +import { acceleratorString, isShiftKeyPress } from '../../../jsUtils'; const IS_SERVICE_DEBUGGING_ENABLED = ( localStorage.getItem('debug') || '' @@ -171,8 +171,8 @@ class TabItem extends Component { ); } - handleShortcutIndex = (event, showShortcutIndex = true) => { - if (event.key === 'Shift') { + handleShortcutIndex = (event: KeyboardEvent, showShortcutIndex = true) => { + if (isShiftKeyPress(event.key)) { this.setState({ showShortcutIndex }); } }; diff --git a/src/components/settings/SettingsLayout.tsx b/src/components/settings/SettingsLayout.tsx index a5fa13d71..3b5d81cdd 100644 --- a/src/components/settings/SettingsLayout.tsx +++ b/src/components/settings/SettingsLayout.tsx @@ -7,7 +7,7 @@ import { injectIntl, } from 'react-intl'; import { Outlet } from 'react-router-dom'; -import { isEscKeyPress } from '../../jsUtils'; +import { isEscapeKeyPress } from '../../jsUtils'; import Appear from '../ui/effects/Appear'; import Icon from '../ui/icon'; import ErrorBoundary from '../util/ErrorBoundary'; @@ -41,7 +41,7 @@ class SettingsLayout extends Component> { } handleKeyDown(e: KeyboardEvent): void { - if (isEscKeyPress(e.key)) { + if (isEscapeKeyPress(e.key)) { this.props.closeSettings(); } } diff --git a/src/components/settings/releaseNotes/ReleaseNotesLayout.tsx b/src/components/settings/releaseNotes/ReleaseNotesLayout.tsx index 4fb31d053..1743bb5a1 100644 --- a/src/components/settings/releaseNotes/ReleaseNotesLayout.tsx +++ b/src/components/settings/releaseNotes/ReleaseNotesLayout.tsx @@ -9,7 +9,7 @@ import { import { mdiClose } from '@mdi/js'; import { Outlet } from 'react-router-dom'; import type { Actions } from '../../../actions/lib/actions'; -import { isEscKeyPress } from '../../../jsUtils'; +import { isEscapeKeyPress } from '../../../jsUtils'; import Appear from '../../ui/effects/Appear'; import Icon from '../../ui/icon'; import ErrorBoundary from '../../util/ErrorBoundary'; @@ -44,7 +44,7 @@ class ReleaseNotesLayout extends Component { } handleKeyDown(e: KeyboardEvent) { - if (isEscKeyPress(e.key)) { + if (isEscapeKeyPress(e.key)) { this.props.actions!.ui.closeSettings(); } } diff --git a/src/components/ui/input/index.tsx b/src/components/ui/input/index.tsx index 225517ba8..7e3179baf 100644 --- a/src/components/ui/input/index.tsx +++ b/src/components/ui/input/index.tsx @@ -16,6 +16,7 @@ import { injectIntl, } from 'react-intl'; import withStyles, { type WithStylesProps } from 'react-jss'; +import { isEnterKeyPress } from '../../../jsUtils'; // biome-ignore lint/suspicious/noShadowRestrictedNames: import Error from '../error'; import Icon from '../icon'; @@ -96,7 +97,7 @@ class Input extends Component { } onInputKeyPress(e: KeyboardEvent): void { - if (e.key === 'Enter') { + if (isEnterKeyPress(e.key)) { const { onEnterKey = noop } = this.props; onEnterKey(); } diff --git a/src/components/ui/select/index.tsx b/src/components/ui/select/index.tsx index 397fd97ed..c19c12417 100644 --- a/src/components/ui/select/index.tsx +++ b/src/components/ui/select/index.tsx @@ -13,6 +13,11 @@ import { createRef, } from 'react'; import withStyles, { type WithStylesProps } from 'react-jss'; +import { + isArrowDownKeyPress, + isArrowUpKeyPress, + isEnterKeyPress, +} from '../../../jsUtils'; import type { Theme } from '../../../themes'; // biome-ignore lint/suspicious/noShadowRestrictedNames: import Error from '../error'; @@ -288,23 +293,23 @@ class SelectComponent extends Component { if (!open) return; - if (e.key === 'ArrowUp' || e.key === 'ArrowDown') { + if (isArrowUpKeyPress(e.key) || isArrowDownKeyPress(e.key)) { e.preventDefault(); } if (this.componentRef?.current) { - if (e.key === 'ArrowUp' && selected > 0) { + if (isArrowUpKeyPress(e.key) && selected > 0) { this.setState((state: IState) => ({ selected: state.selected - 1, })); } else if ( - e.key === 'ArrowDown' && + isArrowDownKeyPress(e.key) && selected < Object.keys(options!).length - 1 ) { this.setState((state: IState) => ({ selected: state.selected + 1, })); - } else if (e.key === 'Enter') { + } else if (isEnterKeyPress(e.key)) { this.select(Object.keys(options!)[selected]); } -- cgit v1.2.3-54-g00ecf