Merge pull request #142 from Exabyte-io/hotfix/conditionally-disable-…

…hotkeys

chore: add check if interactive + bonds redraw on wave instance change

src/components/ThreeDEditor.jsx

@@ -172,23 +172,18 @@ export class ThreeDEditor extends React.Component {
     }
 
     handleKeyPress = (e) => {
-        // Check if the event originated from an input, textarea, select, or CodeMirror
+        const { isInteractive, isThreejsEditorModalShown } = this.state;
+
+        // Check if interactive mode is off, or if the event originated from an input-like element
         if (
+            !isInteractive ||
             e.target.closest(".cm-editor") ||
-            ["INPUT", "TEXTAREA", "SELECT"].includes(e.target.nodeName)
+            ["INPUT", "TEXTAREA", "SELECT"].includes(e.target.nodeName) ||
+            isThreejsEditorModalShown
         ) {
             return;
         }
 
-        // In threejs editor modal, only listen to "e" key not to interfere with its own hotkeys
-        const { isThreejsEditorModalShown } = this.state;
-        if (isThreejsEditorModalShown) {
-            if (e.key.toLowerCase() === "e") {
-                this.toggleThreejsEditorModal();
-            }
-            return;
-        }
-
         const handler = this.keyConfig[e.key.toLowerCase()];
         if (handler) {
             handler.call(this);

src/mixins/bonds.js

@@ -181,6 +181,7 @@ export const BondsMixin = (superclass) =>
          * We need this to block the UI until the bonds are drawn.
          */
         drawBonds() {
+            this.createBondsAsync();
             if (!this.areBondsCreated) {
                 this.bondsGroup = this.createBondsGroup();
                 this.areBondsCreated = true;