From b0f18cacc78a027b3411ed36d12a7991c4f5cc9c Mon Sep 17 00:00:00 2001
From: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
Date: Thu, 28 May 2020 11:10:07 +0200
Subject: [PATCH] fix: prevent unnecessary re-renders

The editor should handle its own rendering.  By including a key that
changes as the users changes tabs forces the editor to re-render.  This
gets triggered as the user types, resetting the cursor to the start of
the editor.

Now the key only changes if the theme changes.
---
 client/src/templates/Challenges/classic/Editor.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/client/src/templates/Challenges/classic/Editor.js b/client/src/templates/Challenges/classic/Editor.js
index 29474b0887..3b973a89e4 100644
--- a/client/src/templates/Challenges/classic/Editor.js
+++ b/client/src/templates/Challenges/classic/Editor.js
@@ -303,6 +303,7 @@ class Editor extends Component {
 
     // TODO: tabs should be dynamically created from the challengeFiles
     // TODO: a11y fixes.
+    // TODO: is the key necessary? Try switching themes without it.
     return (
       <Suspense fallback={<Loader timeout={600} />}>
         <span className='notranslate'>
@@ -335,7 +336,7 @@ class Editor extends Component {
           <MonacoEditor
             editorDidMount={this.editorDidMount}
             editorWillMount={this.editorWillMount}
-            key={`${editorTheme}-${this.currentFileKey}`}
+            key={`${editorTheme}`}
             onChange={this.onChange}
             options={this.options}
             theme={editorTheme}