From d490a5b19a0f9673a0bdd145f830a23b52aea72d Mon Sep 17 00:00:00 2001
From: Pedro Lamas <pedrolamas@gmail.com>
Date: Fri, 2 Jun 2023 17:04:49 +0100
Subject: [PATCH] feat: save file editor content with Ctrl+S

Signed-off-by: Pedro Lamas <pedrolamas@gmail.com>
---
 src/components/widgets/filesystem/FileEditor.vue  | 15 ++++++++++++++-
 .../widgets/filesystem/FileEditorDialog.vue       | 10 +++++++++-
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/components/widgets/filesystem/FileEditor.vue b/src/components/widgets/filesystem/FileEditor.vue
index c49ce643dd..11df8bcaca 100644
--- a/src/components/widgets/filesystem/FileEditor.vue
+++ b/src/components/widgets/filesystem/FileEditor.vue
@@ -101,6 +101,15 @@ export default class FileEditor extends Mixins(BrowserMixin) {
       rulers: (this.isMobileViewport) ? [80, 120] : []
     })
 
+    this.editor.addAction({
+      id: 'action-save-file',
+      label: this.$tc('app.general.btn.save'),
+      keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS],
+      run: () => {
+        this.$emit('save')
+      }
+    })
+
     const filename = this.path ? `${this.path}/${this.filename}` : this.filename
     const apiFileUrl = `${this.activeInstance.apiUrl}/server/files/${filename}`
 
@@ -126,7 +135,7 @@ export default class FileEditor extends Mixins(BrowserMixin) {
 
     // Focus the editor.
     this.$nextTick(() => {
-      this.editor?.focus()
+      focus()
     })
 
     this.$emit('ready')
@@ -138,6 +147,10 @@ export default class FileEditor extends Mixins(BrowserMixin) {
     })
   }
 
+  focus () {
+    this.editor?.focus()
+  }
+
   showCommandPalette () {
     if (this.editor) {
       this.editor.focus()
diff --git a/src/components/widgets/filesystem/FileEditorDialog.vue b/src/components/widgets/filesystem/FileEditorDialog.vue
index 9662a58a58..39d7b38aa8 100644
--- a/src/components/widgets/filesystem/FileEditorDialog.vue
+++ b/src/components/widgets/filesystem/FileEditorDialog.vue
@@ -104,6 +104,7 @@
         :readonly="readonly"
         :code-lens="codeLens"
         @ready="editorReady = true"
+        @save="emitSave(false)"
       />
 
       <file-editor-text-only
@@ -118,7 +119,7 @@
 </template>
 
 <script lang="ts">
-import { Component, Mixins, Prop, Ref, VModel } from 'vue-property-decorator'
+import { Component, Mixins, Prop, Ref, VModel, Watch } from 'vue-property-decorator'
 import StateMixin from '@/mixins/state'
 import BrowserMixin from '@/mixins/browser'
 import FileEditor from './FileEditor.vue'
@@ -168,6 +169,13 @@ export default class FileEditorDialog extends Mixins(StateMixin, BrowserMixin) {
     )
   }
 
+  @Watch('ready')
+  onReady (value: boolean) {
+    if (value) {
+      this.editor?.focus()
+    }
+  }
+
   get isWebAssemblySupported () {
     return isWebAssemblySupported()
   }