From 605c8330fbbd8b4c75184f4705bbb9b11b7fa114 Mon Sep 17 00:00:00 2001 From: Rongjian Zhang Date: Tue, 13 Aug 2019 11:31:24 +0800 Subject: [PATCH 1/2] refactor: extract common keys to utility --- packages/graphiql/src/components/QueryEditor.js | 15 +++------------ packages/graphiql/src/components/ResultViewer.js | 15 ++------------- .../graphiql/src/components/VariableEditor.js | 13 ++----------- packages/graphiql/src/utility/commonKeys.js | 15 +++++++++++++++ 4 files changed, 22 insertions(+), 36 deletions(-) create mode 100644 packages/graphiql/src/utility/commonKeys.js diff --git a/packages/graphiql/src/components/QueryEditor.js b/packages/graphiql/src/components/QueryEditor.js index 929667f4382..cc450b3eb6d 100644 --- a/packages/graphiql/src/components/QueryEditor.js +++ b/packages/graphiql/src/components/QueryEditor.js @@ -11,6 +11,7 @@ import { GraphQLSchema } from 'graphql'; import MD from 'markdown-it'; import { normalizeWhitespace } from '../utility/normalizeWhitespace'; import onHasCompletion from '../utility/onHasCompletion'; +import commonKeys from '../utility/commonKeys'; const md = new MD(); const AUTO_COMPLETE_AFTER_KEY = /^[a-zA-Z0-9_@(]$/; @@ -148,17 +149,7 @@ export class QueryEditor extends React.Component { } }, - // Persistent search box in Query Editor - 'Cmd-F': 'findPersistent', - 'Ctrl-F': 'findPersistent', - 'Cmd-G': 'findPersistent', - 'Ctrl-G': 'findPersistent', - - // Editor improvements - 'Ctrl-Left': 'goSubwordLeft', - 'Ctrl-Right': 'goSubwordRight', - 'Alt-Left': 'goGroupLeft', - 'Alt-Right': 'goGroupRight', + ...commonKeys, }, }); @@ -197,7 +188,7 @@ export class QueryEditor extends React.Component { this.editor.off('change', this._onEdit); this.editor.off('keyup', this._onKeyUp); this.editor.off('hasCompletion', this._onHasCompletion); - this.editor = null; + this.editor = null; } } diff --git a/packages/graphiql/src/components/ResultViewer.js b/packages/graphiql/src/components/ResultViewer.js index 9d6ff1d1344..84ff08e8d76 100644 --- a/packages/graphiql/src/components/ResultViewer.js +++ b/packages/graphiql/src/components/ResultViewer.js @@ -8,6 +8,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import PropTypes from 'prop-types'; +import commonKeys from '../utility/commonKeys'; /** * ResultViewer @@ -86,19 +87,7 @@ export class ResultViewer extends React.Component { }, gutters: ['CodeMirror-foldgutter'], info: Boolean(this.props.ResultsTooltip || this.props.ImagePreview), - extraKeys: { - // Persistent search box in Query Editor - 'Cmd-F': 'findPersistent', - 'Ctrl-F': 'findPersistent', - 'Cmd-G': 'findPersistent', - 'Ctrl-G': 'findPersistent', - - // Editor improvements - 'Ctrl-Left': 'goSubwordLeft', - 'Ctrl-Right': 'goSubwordRight', - 'Alt-Left': 'goGroupLeft', - 'Alt-Right': 'goGroupRight', - }, + extraKeys: commonKeys, }); } diff --git a/packages/graphiql/src/components/VariableEditor.js b/packages/graphiql/src/components/VariableEditor.js index dc5e2228e13..90a3b884682 100644 --- a/packages/graphiql/src/components/VariableEditor.js +++ b/packages/graphiql/src/components/VariableEditor.js @@ -9,6 +9,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import onHasCompletion from '../utility/onHasCompletion'; +import commonKeys from '../utility/commonKeys'; /** * VariableEditor @@ -132,17 +133,7 @@ export class VariableEditor extends React.Component { } }, - // Persistent search box in Query Editor - 'Cmd-F': 'findPersistent', - 'Ctrl-F': 'findPersistent', - 'Cmd-G': 'findPersistent', - 'Ctrl-G': 'findPersistent', - - // Editor improvements - 'Ctrl-Left': 'goSubwordLeft', - 'Ctrl-Right': 'goSubwordRight', - 'Alt-Left': 'goGroupLeft', - 'Alt-Right': 'goGroupRight', + ...commonKeys, }, }); diff --git a/packages/graphiql/src/utility/commonKeys.js b/packages/graphiql/src/utility/commonKeys.js new file mode 100644 index 00000000000..fca71b24060 --- /dev/null +++ b/packages/graphiql/src/utility/commonKeys.js @@ -0,0 +1,15 @@ +const commonKeys = { + // Persistent search box in Query Editor + 'Cmd-F': 'findPersistent', + 'Ctrl-F': 'findPersistent', + 'Cmd-G': 'findPersistent', + 'Ctrl-G': 'findPersistent', + + // Editor improvements + 'Ctrl-Left': 'goSubwordLeft', + 'Ctrl-Right': 'goSubwordRight', + 'Alt-Left': 'goGroupLeft', + 'Alt-Right': 'goGroupRight', +}; + +export default commonKeys; From aa82f547b61c8aa40aa4467613456580dd556e95 Mon Sep 17 00:00:00 2001 From: Rongjian Zhang Date: Tue, 13 Aug 2019 11:31:58 +0800 Subject: [PATCH 2/2] fix: preserve ctrl-f key for macOS --- packages/graphiql/src/utility/commonKeys.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/graphiql/src/utility/commonKeys.js b/packages/graphiql/src/utility/commonKeys.js index fca71b24060..e05cdb42e83 100644 --- a/packages/graphiql/src/utility/commonKeys.js +++ b/packages/graphiql/src/utility/commonKeys.js @@ -1,7 +1,8 @@ +const isMacOs = window.navigator.platform === 'MacIntel'; + const commonKeys = { // Persistent search box in Query Editor - 'Cmd-F': 'findPersistent', - 'Ctrl-F': 'findPersistent', + [isMacOs ? 'Cmd-F' : 'Ctrl-F']: 'findPersistent', 'Cmd-G': 'findPersistent', 'Ctrl-G': 'findPersistent',