renames keyboard events in line with project standard (#4303)

This commit is contained in:
Dimitri Mitropoulos
2021-12-13 09:23:56 -05:00
committed by GitHub
parent 9586ee749b
commit d5abff3199
14 changed files with 52 additions and 52 deletions

View File

@@ -105,13 +105,13 @@ export class Dropdown extends PureComponent<DropdownProps, State> {
});
}
_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<DropdownProps, State> {
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<DropdownProps, State> {
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) {

View File

@@ -88,14 +88,14 @@ export class Editable extends PureComponent<Props, State> {
);
}
_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

View File

@@ -43,12 +43,12 @@ export class Modal extends PureComponent<ModalProps, State> {
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<ModalProps, State> {
}
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?.();
}

View File

@@ -120,7 +120,7 @@ export class OneLineEditor extends PureComponent<Props, State> {
document.body.removeEventListener('mousedown', this._handleDocumentMousedown);
}
_handleDocumentMousedown(e) {
_handleDocumentMousedown(event: KeyboardEvent) {
if (!this._editor) {
return;
}
@@ -130,7 +130,7 @@ export class OneLineEditor extends PureComponent<Props, State> {
// 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<Props, State> {
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<Props, State> {
}
// @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<Props, State> {
}
}
this.props.onKeyDown?.(e, this.getValue());
this.props.onKeyDown?.(event, this.getValue());
}
_convertToEditorPreserveFocus() {

View File

@@ -62,8 +62,8 @@ export class EnvironmentsDropdown extends PureComponent<Props> {
);
}
_handleKeydown(e: KeyboardEvent) {
executeHotKey(e, hotKeyRefs.ENVIRONMENT_SHOW_SWITCH_MENU, () => {
_handleKeydown(event: KeyboardEvent) {
executeHotKey(event, hotKeyRefs.ENVIRONMENT_SHOW_SWITCH_MENU, () => {
this._dropdown?.toggle(true);
});
}

View File

@@ -51,8 +51,8 @@ export class ResponseHistoryDropdown extends PureComponent<Props> {
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);
});
}

View File

@@ -115,8 +115,8 @@ export class WorkspaceDropdown extends PureComponent<Props, State> {
showModal(WorkspaceSettingsModal);
}
_handleKeydown(e: KeyboardEvent) {
executeHotKey(e, hotKeyRefs.TOGGLE_MAIN_MENU, () => {
_handleKeydown(event: KeyboardEvent) {
executeHotKey(event, hotKeyRefs.TOGGLE_MAIN_MENU, () => {
this._dropdown?.toggle(true);
});
}

View File

@@ -87,8 +87,8 @@ export class GraphQLExplorer extends PureComponent<Props, State> {
_searchInput = createRef<DebouncedInput>();
_handleKeydown(e: KeyboardEvent) {
executeHotKey(e, hotKeyRefs.GRAPHQL_EXPLORER_FOCUS_FILTER, () => {
_handleKeydown(event: KeyboardEvent) {
executeHotKey(event, hotKeyRefs.GRAPHQL_EXPLORER_FOCUS_FILTER, () => {
this._navigateToSchema();
this._focusAndSelectFilterInput();
});

View File

@@ -361,20 +361,20 @@ class RequestSwitcherModal extends PureComponent<Props, State> {
}
}
_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);
}

View File

@@ -137,19 +137,19 @@ export class RequestUrlBar extends PureComponent<Props, State> {
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);
});
}

View File

@@ -55,8 +55,8 @@ export class SidebarFilter extends PureComponent<Props> {
this.props.requestCreate();
}
_handleKeydown(e: KeyboardEvent) {
executeHotKey(e, hotKeyRefs.SIDEBAR_FOCUS_FILTER, () => {
_handleKeydown(event: KeyboardEvent) {
executeHotKey(event, hotKeyRefs.SIDEBAR_FOCUS_FILTER, () => {
this._input?.focus();
});
}

View File

@@ -176,12 +176,12 @@ export class ResponseViewer extends Component<ResponseViewerProps, State> {
);
}
_handleKeyDown(e: KeyboardEvent) {
_handleKeyDown(event: KeyboardEvent) {
if (!this._isViewSelectable()) {
return;
}
executeHotKey(e, hotKeyRefs.RESPONSE_FOCUS, () => {
executeHotKey(event, hotKeyRefs.RESPONSE_FOCUS, () => {
if (!this._isViewSelectable()) {
return;
}

View File

@@ -223,8 +223,8 @@ class WrapperHome extends PureComponent<Props, State> {
});
}
_handleKeyDown(e) {
executeHotKey(e, hotKeyRefs.FILTER_DOCUMENTS, () => {
_handleKeyDown(event: KeyboardEvent) {
executeHotKey(event, hotKeyRefs.FILTER_DOCUMENTS, () => {
if (this._filterInput) {
this._filterInput.focus();
}

View File

@@ -999,9 +999,9 @@ class App extends PureComponent<AppProps, State> {
}
}
_handleKeyDown(e) {
_handleKeyDown(event: KeyboardEvent) {
for (const [definition, callback] of this._globalKeyMap) {
executeHotKey(e, definition, callback);
executeHotKey(event, definition, callback);
}
}