From d5abff3199d1c43bcd3533b204265a5ec167fa7e Mon Sep 17 00:00:00 2001 From: Dimitri Mitropoulos Date: Mon, 13 Dec 2021 09:23:56 -0500 Subject: [PATCH] renames keyboard events in line with project standard (#4303) --- .../ui/components/base/dropdown/dropdown.tsx | 18 ++++++++--------- .../app/ui/components/base/editable.tsx | 8 ++++---- .../app/ui/components/base/modal.tsx | 10 +++++----- .../components/codemirror/one-line-editor.tsx | 20 +++++++++---------- .../dropdowns/environments-dropdown.tsx | 4 ++-- .../dropdowns/response-history-dropdown.tsx | 4 ++-- .../dropdowns/workspace-dropdown.tsx | 4 ++-- .../graph-ql-explorer/graph-ql-explorer.tsx | 4 ++-- .../modals/request-switcher-modal.tsx | 8 ++++---- .../app/ui/components/request-url-bar.tsx | 8 ++++---- .../ui/components/sidebar/sidebar-filter.tsx | 4 ++-- .../ui/components/viewers/response-viewer.tsx | 4 ++-- .../app/ui/components/wrapper-home.tsx | 4 ++-- .../insomnia-app/app/ui/containers/app.tsx | 4 ++-- 14 files changed, 52 insertions(+), 52 deletions(-) diff --git a/packages/insomnia-app/app/ui/components/base/dropdown/dropdown.tsx b/packages/insomnia-app/app/ui/components/base/dropdown/dropdown.tsx index 390f2b2ec8..4b38b28287 100644 --- a/packages/insomnia-app/app/ui/components/base/dropdown/dropdown.tsx +++ b/packages/insomnia-app/app/ui/components/base/dropdown/dropdown.tsx @@ -105,13 +105,13 @@ export class Dropdown extends PureComponent { }); } - _handleDropdownNavigation(e) { - const { key, shiftKey } = e; + _handleDropdownNavigation(event: KeyboardEvent) { + const { key, shiftKey } = event; // Handle tab and arrows to move up and down dropdown entries const { filterItems, filterActiveIndex } = this.state; if (['Tab', 'ArrowDown', 'ArrowUp'].includes(key)) { - e.preventDefault(); + event.preventDefault(); const items = filterItems || []; if (!filterItems) { @@ -141,17 +141,17 @@ export class Dropdown extends PureComponent { this._filter?.focus(); } - _handleBodyKeyDown(e) { + _handleBodyKeyDown(event: KeyboardEvent) { if (!this.state.open) { return; } // Catch all key presses (like global app hotkeys) if we're open - e.stopPropagation(); + event.stopPropagation(); - this._handleDropdownNavigation(e); + this._handleDropdownNavigation(event); - executeHotKey(e, hotKeyRefs.CLOSE_DROPDOWN, () => { + executeHotKey(event, hotKeyRefs.CLOSE_DROPDOWN, () => { this.hide(); }); } @@ -238,9 +238,9 @@ export class Dropdown extends PureComponent { this.toggle(); } - static _handleMouseDown(e) { + static _handleMouseDown(event: React.MouseEvent) { // Intercept mouse down so that clicks don't trigger things like drag and drop. - e.preventDefault(); + event.preventDefault(); } _addDropdownListRef(n: HTMLDivElement) { diff --git a/packages/insomnia-app/app/ui/components/base/editable.tsx b/packages/insomnia-app/app/ui/components/base/editable.tsx index 3843d5013f..89750795a8 100644 --- a/packages/insomnia-app/app/ui/components/base/editable.tsx +++ b/packages/insomnia-app/app/ui/components/base/editable.tsx @@ -88,14 +88,14 @@ export class Editable extends PureComponent { ); } - _handleEditKeyDown(e) { - if (e.keyCode === 13) { + _handleEditKeyDown(event: KeyboardEvent) { + if (event.keyCode === 13) { // Pressed Enter this._handleEditEnd(); - } else if (e.keyCode === 27) { + } else if (event.keyCode === 27) { // Pressed Escape // Prevent bubbling to modals and other escape listeners. - e.stopPropagation(); + event.stopPropagation(); if (this._input) { // Set the input to the original value diff --git a/packages/insomnia-app/app/ui/components/base/modal.tsx b/packages/insomnia-app/app/ui/components/base/modal.tsx index 31bc86d462..114a46bb70 100644 --- a/packages/insomnia-app/app/ui/components/base/modal.tsx +++ b/packages/insomnia-app/app/ui/components/base/modal.tsx @@ -43,12 +43,12 @@ export class Modal extends PureComponent { zIndex: globalZIndex, }; - async _handleKeyDown(e) { + async _handleKeyDown(event: KeyboardEvent) { if (!this.state.open) { return; } - this.props.onKeyDown?.(e); + this.props.onKeyDown?.(event); // Don't check for close keys if we don't want them if (this.props.noEscape) { @@ -56,12 +56,12 @@ export class Modal extends PureComponent { } const closeOnKeyCodes = this.props.closeOnKeyCodes || []; - const pressedEscape = await pressedHotKey(e, hotKeyRefs.CLOSE_MODAL); - const pressedCloseButton = closeOnKeyCodes.find(c => c === e.keyCode); + const pressedEscape = await pressedHotKey(event, hotKeyRefs.CLOSE_MODAL); + const pressedCloseButton = closeOnKeyCodes.find(c => c === event.keyCode); // Pressed escape if (pressedEscape || pressedCloseButton) { - e.preventDefault(); + event.preventDefault(); this.hide(); this.props.onCancel?.(); } diff --git a/packages/insomnia-app/app/ui/components/codemirror/one-line-editor.tsx b/packages/insomnia-app/app/ui/components/codemirror/one-line-editor.tsx index 1e17772fcf..eeabbd54c1 100644 --- a/packages/insomnia-app/app/ui/components/codemirror/one-line-editor.tsx +++ b/packages/insomnia-app/app/ui/components/codemirror/one-line-editor.tsx @@ -120,7 +120,7 @@ export class OneLineEditor extends PureComponent { document.body.removeEventListener('mousedown', this._handleDocumentMousedown); } - _handleDocumentMousedown(e) { + _handleDocumentMousedown(event: KeyboardEvent) { if (!this._editor) { return; } @@ -130,7 +130,7 @@ export class OneLineEditor extends PureComponent { // NOTE: Must be "mousedown", not "click" because "click" triggers on selection drags const node = ReactDOM.findDOMNode(this._editor); // @ts-expect-error -- TSCONVERSION - const clickWasOutsideOfComponent = !node.contains(e.target); + const clickWasOutsideOfComponent = !node.contains(event.target); if (clickWasOutsideOfComponent) { this._editor?.clearSelection(); @@ -209,9 +209,9 @@ export class OneLineEditor extends PureComponent { this.props.onChange?.(value); } - _handleInputKeyDown(e) { + _handleInputKeyDown(event) { if (this.props.onKeyDown) { - this.props.onKeyDown(e, e.target.value); + this.props.onKeyDown(event, event.target.value); } } @@ -245,16 +245,16 @@ export class OneLineEditor extends PureComponent { } // @TODO Refactor this event handler. The way we search for a parent form node is not stable. - _handleKeyDown(e) { + _handleKeyDown(event) { // submit form if needed - if (e.keyCode === 13) { - let node = e.target; + if (event.keyCode === 13) { + let node = event.target; for (let i = 0; i < 20 && node; i++) { if (node.tagName === 'FORM') { node.dispatchEvent(new window.Event('submit')); - e.preventDefault(); - e.stopPropagation(); + event.preventDefault(); + event.stopPropagation(); break; } @@ -262,7 +262,7 @@ export class OneLineEditor extends PureComponent { } } - this.props.onKeyDown?.(e, this.getValue()); + this.props.onKeyDown?.(event, this.getValue()); } _convertToEditorPreserveFocus() { diff --git a/packages/insomnia-app/app/ui/components/dropdowns/environments-dropdown.tsx b/packages/insomnia-app/app/ui/components/dropdowns/environments-dropdown.tsx index 53bd48d4ed..cbc5b31984 100644 --- a/packages/insomnia-app/app/ui/components/dropdowns/environments-dropdown.tsx +++ b/packages/insomnia-app/app/ui/components/dropdowns/environments-dropdown.tsx @@ -62,8 +62,8 @@ export class EnvironmentsDropdown extends PureComponent { ); } - _handleKeydown(e: KeyboardEvent) { - executeHotKey(e, hotKeyRefs.ENVIRONMENT_SHOW_SWITCH_MENU, () => { + _handleKeydown(event: KeyboardEvent) { + executeHotKey(event, hotKeyRefs.ENVIRONMENT_SHOW_SWITCH_MENU, () => { this._dropdown?.toggle(true); }); } diff --git a/packages/insomnia-app/app/ui/components/dropdowns/response-history-dropdown.tsx b/packages/insomnia-app/app/ui/components/dropdowns/response-history-dropdown.tsx index f95382d77a..0a7cd6f6d8 100644 --- a/packages/insomnia-app/app/ui/components/dropdowns/response-history-dropdown.tsx +++ b/packages/insomnia-app/app/ui/components/dropdowns/response-history-dropdown.tsx @@ -51,8 +51,8 @@ export class ResponseHistoryDropdown extends PureComponent { this.props.handleSetActiveResponse(response); } - _handleKeydown(e: KeyboardEvent) { - executeHotKey(e, hotKeyRefs.REQUEST_TOGGLE_HISTORY, () => { + _handleKeydown(event: KeyboardEvent) { + executeHotKey(event, hotKeyRefs.REQUEST_TOGGLE_HISTORY, () => { this._dropdown?.toggle(true); }); } diff --git a/packages/insomnia-app/app/ui/components/dropdowns/workspace-dropdown.tsx b/packages/insomnia-app/app/ui/components/dropdowns/workspace-dropdown.tsx index 4b4c3c2ed7..bc8e1fc349 100644 --- a/packages/insomnia-app/app/ui/components/dropdowns/workspace-dropdown.tsx +++ b/packages/insomnia-app/app/ui/components/dropdowns/workspace-dropdown.tsx @@ -115,8 +115,8 @@ export class WorkspaceDropdown extends PureComponent { showModal(WorkspaceSettingsModal); } - _handleKeydown(e: KeyboardEvent) { - executeHotKey(e, hotKeyRefs.TOGGLE_MAIN_MENU, () => { + _handleKeydown(event: KeyboardEvent) { + executeHotKey(event, hotKeyRefs.TOGGLE_MAIN_MENU, () => { this._dropdown?.toggle(true); }); } diff --git a/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer.tsx b/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer.tsx index 8916cd1008..509d1ead3f 100644 --- a/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer.tsx +++ b/packages/insomnia-app/app/ui/components/graph-ql-explorer/graph-ql-explorer.tsx @@ -87,8 +87,8 @@ export class GraphQLExplorer extends PureComponent { _searchInput = createRef(); - _handleKeydown(e: KeyboardEvent) { - executeHotKey(e, hotKeyRefs.GRAPHQL_EXPLORER_FOCUS_FILTER, () => { + _handleKeydown(event: KeyboardEvent) { + executeHotKey(event, hotKeyRefs.GRAPHQL_EXPLORER_FOCUS_FILTER, () => { this._navigateToSchema(); this._focusAndSelectFilterInput(); }); diff --git a/packages/insomnia-app/app/ui/components/modals/request-switcher-modal.tsx b/packages/insomnia-app/app/ui/components/modals/request-switcher-modal.tsx index cc3d61a95d..2fa894a0a6 100644 --- a/packages/insomnia-app/app/ui/components/modals/request-switcher-modal.tsx +++ b/packages/insomnia-app/app/ui/components/modals/request-switcher-modal.tsx @@ -361,20 +361,20 @@ class RequestSwitcherModal extends PureComponent { } } - _handleKeydown(e: KeyboardEvent) { - if (e.keyCode === keyboardKeys.esc.keyCode) { + _handleKeydown(event: KeyboardEvent) { + if (event.keyCode === keyboardKeys.esc.keyCode) { this.hide(); return; } // Only control up/down with tab if modal is visible - executeHotKey(e, hotKeyRefs.SHOW_RECENT_REQUESTS, () => { + executeHotKey(event, hotKeyRefs.SHOW_RECENT_REQUESTS, () => { if (this.state.isModalVisible) { this._setActiveIndex(this.state.activeIndex + 1); } }); // Only control up/down with tab if modal is visible - executeHotKey(e, hotKeyRefs.SHOW_RECENT_REQUESTS_PREVIOUS, () => { + executeHotKey(event, hotKeyRefs.SHOW_RECENT_REQUESTS_PREVIOUS, () => { if (this.state.isModalVisible) { this._setActiveIndex(this.state.activeIndex - 1); } diff --git a/packages/insomnia-app/app/ui/components/request-url-bar.tsx b/packages/insomnia-app/app/ui/components/request-url-bar.tsx index 324139b445..24cbd9210a 100644 --- a/packages/insomnia-app/app/ui/components/request-url-bar.tsx +++ b/packages/insomnia-app/app/ui/components/request-url-bar.tsx @@ -137,19 +137,19 @@ export class RequestUrlBar extends PureComponent { this.props.handleUpdateDownloadPath(request._id, null); } - async _handleKeyDown(e: KeyboardEvent) { + async _handleKeyDown(event: KeyboardEvent) { if (!this._input) { return; } - executeHotKey(e, hotKeyRefs.REQUEST_FOCUS_URL, () => { + executeHotKey(event, hotKeyRefs.REQUEST_FOCUS_URL, () => { this._input?.focus(); this._input?.selectAll(); }); - executeHotKey(e, hotKeyRefs.REQUEST_TOGGLE_HTTP_METHOD_MENU, () => { + executeHotKey(event, hotKeyRefs.REQUEST_TOGGLE_HTTP_METHOD_MENU, () => { this._methodDropdown?.toggle(); }); - executeHotKey(e, hotKeyRefs.REQUEST_SHOW_OPTIONS, () => { + executeHotKey(event, hotKeyRefs.REQUEST_SHOW_OPTIONS, () => { this._dropdown?.toggle(true); }); } diff --git a/packages/insomnia-app/app/ui/components/sidebar/sidebar-filter.tsx b/packages/insomnia-app/app/ui/components/sidebar/sidebar-filter.tsx index d8dba27d72..8f6b059e8e 100644 --- a/packages/insomnia-app/app/ui/components/sidebar/sidebar-filter.tsx +++ b/packages/insomnia-app/app/ui/components/sidebar/sidebar-filter.tsx @@ -55,8 +55,8 @@ export class SidebarFilter extends PureComponent { this.props.requestCreate(); } - _handleKeydown(e: KeyboardEvent) { - executeHotKey(e, hotKeyRefs.SIDEBAR_FOCUS_FILTER, () => { + _handleKeydown(event: KeyboardEvent) { + executeHotKey(event, hotKeyRefs.SIDEBAR_FOCUS_FILTER, () => { this._input?.focus(); }); } diff --git a/packages/insomnia-app/app/ui/components/viewers/response-viewer.tsx b/packages/insomnia-app/app/ui/components/viewers/response-viewer.tsx index 26c4ea1daf..89a4cc6282 100644 --- a/packages/insomnia-app/app/ui/components/viewers/response-viewer.tsx +++ b/packages/insomnia-app/app/ui/components/viewers/response-viewer.tsx @@ -176,12 +176,12 @@ export class ResponseViewer extends Component { ); } - _handleKeyDown(e: KeyboardEvent) { + _handleKeyDown(event: KeyboardEvent) { if (!this._isViewSelectable()) { return; } - executeHotKey(e, hotKeyRefs.RESPONSE_FOCUS, () => { + executeHotKey(event, hotKeyRefs.RESPONSE_FOCUS, () => { if (!this._isViewSelectable()) { return; } diff --git a/packages/insomnia-app/app/ui/components/wrapper-home.tsx b/packages/insomnia-app/app/ui/components/wrapper-home.tsx index dc9d4cc51a..0f64d87b25 100644 --- a/packages/insomnia-app/app/ui/components/wrapper-home.tsx +++ b/packages/insomnia-app/app/ui/components/wrapper-home.tsx @@ -223,8 +223,8 @@ class WrapperHome extends PureComponent { }); } - _handleKeyDown(e) { - executeHotKey(e, hotKeyRefs.FILTER_DOCUMENTS, () => { + _handleKeyDown(event: KeyboardEvent) { + executeHotKey(event, hotKeyRefs.FILTER_DOCUMENTS, () => { if (this._filterInput) { this._filterInput.focus(); } diff --git a/packages/insomnia-app/app/ui/containers/app.tsx b/packages/insomnia-app/app/ui/containers/app.tsx index a50b59af9a..8a55b3ab57 100644 --- a/packages/insomnia-app/app/ui/containers/app.tsx +++ b/packages/insomnia-app/app/ui/containers/app.tsx @@ -999,9 +999,9 @@ class App extends PureComponent { } } - _handleKeyDown(e) { + _handleKeyDown(event: KeyboardEvent) { for (const [definition, callback] of this._globalKeyMap) { - executeHotKey(e, definition, callback); + executeHotKey(event, definition, callback); } }