gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix: stop Editor competing with Modal for focus

Browse Source 
Editor now checks if the modal is open before trying to obtain focus.
This commit is contained in:
Oliver Eyton-Williams
2019-09-19 13:44:02 +02:00
committed by mrugesh
parent 1dd13a5865
commit c483940da0
1 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
client/src/templates/Challenges/classic/Editor.js
View File

@ -5,12 +5,13 @@ import { connect } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import { executeChallenge, updateFile } from '../redux'; import { executeChallenge, updateFile } from '../redux';
import { userSelector } from '../../../redux'; import { userSelector, isDonationModalOpenSelector } from '../../../redux';
import { Loader } from '../../../components/helpers'; import { Loader } from '../../../components/helpers';
const MonacoEditor = React.lazy(() => import('react-monaco-editor')); const MonacoEditor = React.lazy(() => import('react-monaco-editor'));
const propTypes = { const propTypes = {
canFocus: PropTypes.bool,
contents: PropTypes.string, contents: PropTypes.string,
dimensions: PropTypes.object, dimensions: PropTypes.object,
executeChallenge: PropTypes.func.isRequired, executeChallenge: PropTypes.func.isRequired,
@ -21,8 +22,12 @@ const propTypes = {
}; };
const mapStateToProps = createSelector( const mapStateToProps = createSelector(
isDonationModalOpenSelector,
userSelector, userSelector,
({ theme = 'night' }) => ({ theme }) (open, { theme = 'night' }) => ({
canFocus: !open,
theme
})
); );
const mapDispatchToProps = dispatch => const mapDispatchToProps = dispatch =>
@ -104,7 +109,7 @@ class Editor extends Component {
editorDidMount = (editor, monaco) => { editorDidMount = (editor, monaco) => {
this._editor = editor; this._editor = editor;
this._editor.focus(); if (this.props.canFocus) this._editor.focus();
this._editor.addAction({ this._editor.addAction({
id: 'execute-challenge', id: 'execute-challenge',
label: 'Run tests', label: 'Run tests',