feat: add only save button to editor (mainsail-crew#1835)

LynxCrew · Mar 27, 2024 · 18a7f6e · 18a7f6e
1 parent c859440
commit 18a7f6e
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 17 deletions.
diff --git a/src/components/TheEditor.vue b/src/components/TheEditor.vue
@@ -27,15 +27,6 @@
                         <v-icon small class="mr-1">{{ mdiHelp }}</v-icon>
                         {{ $t('Editor.ConfigReference') }}
                     </v-btn>
-                    <v-btn
-                        v-if="isWriteable"
-                        text
-                        tile
-                        :color="restartServiceName === null ? 'primary' : ''"
-                        @click="save(null)">
-                        <v-icon small class="mr-1">{{ mdiContentSave }}</v-icon>
-                        <span class="d-none d-sm-inline">{{ $t('Editor.SaveClose') }}</span>
-                    </v-btn>
                     <v-btn
                         v-if="restartServiceNameExists"
                         color="primary"
@@ -46,6 +37,9 @@
                         <v-icon small class="mr-1">{{ mdiRestart }}</v-icon>
                         {{ $t('Editor.SaveRestart') }}
                     </v-btn>
+                    <v-btn v-if="isWriteable" icon tile @click="save(null)">
+                        <v-icon>{{ mdiContentSave }}</v-icon>
+                    </v-btn>
                     <v-btn icon tile @click="close">
                         <v-icon>{{ mdiCloseThick }}</v-icon>
                     </v-btn>
@@ -56,7 +50,7 @@
                         ref="editor"
                         v-model="sourcecode"
                         :name="filename"
-                        :file-extension="fileExtension"></codemirror-async>
+                        :file-extension="fileExtension" />
                 </v-card-text>
             </panel>
         </v-dialog>
@@ -105,7 +99,7 @@
                     </v-row>
                 </v-card-text>
                 <v-card-actions>
-                    <v-spacer></v-spacer>
+                    <v-spacer />
                     <v-btn text @click="discardChanges">
                         {{ $t('Editor.DontSave') }}
                     </v-btn>
@@ -167,8 +161,6 @@ export default class TheEditor extends Mixins(BaseMixin) {
     mdiFileDocumentOutline = mdiFileDocumentOutline
     mdiUsb = mdiUsb
 
-    private scrollbarOptions = { scrollbars: { autoHide: 'never' } }
-
     declare $refs: {
         editor: Codemirror
     }
@@ -343,10 +335,14 @@ export default class TheEditor extends Mixins(BaseMixin) {
 
     @Watch('changed')
     changedChanged(newVal: boolean) {
-        if (this.confirmUnsavedChanges) {
-            if (newVal) window.addEventListener('beforeunload', windowBeforeUnloadFunction)
-            else window.removeEventListener('beforeunload', windowBeforeUnloadFunction)
+        if (!this.confirmUnsavedChanges) return
+
+        if (newVal) {
+            window.addEventListener('beforeunload', windowBeforeUnloadFunction)
+            return
         }
+
+        window.removeEventListener('beforeunload', windowBeforeUnloadFunction)
     }
 }
 </script>

diff --git a/src/store/editor/actions.ts b/src/store/editor/actions.ts
@@ -133,7 +133,10 @@ export const actions: ActionTree<EditorState, RootState> = {
                 } else if (payload.restartServiceName !== null) {
                     Vue.$socket.emit('machine.services.restart', { service: payload.restartServiceName })
                 }
-                dispatch('close')
+
+                commit('updateLoadedHash', payload.content)
+
+                if (payload.restartServiceName !== null) dispatch('close')
             })
             .catch((error) => {
                 window.console.log(error.response?.data.error)

diff --git a/src/store/editor/mutations.ts b/src/store/editor/mutations.ts
@@ -68,4 +68,9 @@ export const mutations: MutationTree<EditorState> = {
 
         state.changed = sha256(payload) != state.loadedHash
     },
+
+    updateLoadedHash(state, payload) {
+        Vue.set(state, 'loadedHash', sha256(payload.replace(/(?:\r\n|\r|\n)/g, '\n')))
+        Vue.set(state, 'changed', false)
+    },
 }