Evaluate active cell on Shift+Enter (#70)

* Evaluate active cell on Shift+Enter * Run linters --------- Co-authored-by: Lint Bot <[email protected]>
kuzudb · Jan 31, 2024 · a2aa944 · a2aa944
1 parent 6d8e5aa
commit a2aa944
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 7 deletions.
diff --git a/src/components/ShellView/CypherEditor.vue b/src/components/ShellView/CypherEditor.vue
@@ -16,6 +16,7 @@
       :style="{ width: editorWidth + 'px' }"
     >
       <textarea
+        ref="gptQuestionTextArea"
         v-model="gptQuestion"
         class="form-control"
         placeholder="Type your question here..."
@@ -44,7 +45,7 @@
           data-bs-toggle="tooltip"
           data-bs-placement="right"
           title="Run"
-          @click="evaluateCurrentCell"
+          @click="evaluateCell"
         />
       </div>
       <div
@@ -194,11 +195,6 @@ emits: ['remove', 'evaluateCypher', 'toggleMaximize', 'generateAndEvaluateQuery'
         fontSize: 16,
         scrollBeyondLastLine: false,
       });
-
-      this.editor.addCommand(window.Monaco.KeyMod.Shift | window.Monaco.KeyCode.Enter, () => {
-        this.evaluateCypher();
-      });
-
       new PlaceholderContentWidget('Type your Cypher code here...', this.editor);
     },
     toggleMaximize() {
@@ -220,7 +216,7 @@ emits: ['remove', 'evaluateCypher', 'toggleMaximize', 'generateAndEvaluateQuery'
     generateAndEvaluateQuery() {
       this.$emit("generateAndEvaluateQuery", this.gptQuestion);
     },
-    evaluateCurrentCell() {
+    evaluateCell() {
       if (this.isQueryGenerationMode) {
         this.generateAndEvaluateQuery();
       } else {
@@ -232,6 +228,10 @@ emits: ['remove', 'evaluateCypher', 'toggleMaximize', 'generateAndEvaluateQuery'
     },
     removeCell() {
       this.$emit("remove");
+    },
+    isActive(){
+      return (this.isQueryGenerationMode && this.$refs.gptQuestionTextArea === document.activeElement) ||
+        (!this.isQueryGenerationMode && this.editor && this.editor.hasTextFocus());
     }
   },
 }

diff --git a/src/components/ShellView/ShellCell.vue b/src/components/ShellView/ShellCell.vue
@@ -82,6 +82,9 @@ export default {
   },
 
   methods: {
+    isActive(){
+      return this.$refs.editor.isActive();
+    },
     evaluateCypher(query) {
       this.queryResult = null;
       this.errorMessage = "";
@@ -188,6 +191,9 @@ export default {
           }
         })
     },
+    evaluateCell() {
+      this.$refs.editor.evaluateCell();
+    },
     toggleMaximize() {
       if (this.isMaximized) {
         this.minimize();

diff --git a/src/components/ShellView/ShellMainView.vue b/src/components/ShellView/ShellMainView.vue
@@ -6,6 +6,7 @@
     <ShellCell
       v-for="(cell, index) in shellCell"
       v-show="index === maximizedCellIndex || maximizedCellIndex < 0"
+      :ref="getCellRef(index)"
       :key="cell.cellId"
       :schema="schema"
       :navbar-height="navbarHeight"
@@ -56,10 +57,12 @@ export default {
       this.updateContainerHeight();
     });
     window.addEventListener("resize", this.updateContainerHeight);
+    document.addEventListener("keydown",this.handleKeyDown);
   },
 
   beforeUnmount() {
     window.removeEventListener("resize", this.updateContainerHeight);
+    document.removeEventListener("keydown",this.handleKeyDown);
   },
 
   methods: {
@@ -97,6 +100,29 @@ export default {
     reloadSchema() {
       this.$emit("reloadSchema");
     },
+    getCellRef(index) {
+      return `shell-cell-${this.shellCell[index].cellId}`;
+    },
+    handleKeyDown(event) {
+      if (event.shiftKey && event.key === "Enter") {
+        event.preventDefault();
+        this.evaluateCurrentCell();
+      }
+    },
+    evaluateCurrentCell() {
+      for(let i = 0; i < this.shellCell.length; ++i) {
+        const currentCell = this.$refs[this.getCellRef(i)][0];
+        if(currentCell.isActive()) {
+          return currentCell.evaluateCell();
+        }
+      }
+      try{
+      const currentCell = this.$refs[this.getCellRef(0)][0];
+      return currentCell.evaluateCell();
+      }catch(e){
+        // Do nothing, there is no cell to evaluate
+      }
+    },
   },
 
 }