feat: configurable Klipper Save & Restart action (#1647)

Signed-off-by: Pedro Lamas <[email protected]>

Author: pedrolamas

src/components/settings/FileEditorSettings.vue

@@ -8,9 +8,7 @@
       dense
       class="mb-4"
     >
-      <app-setting
-        :title="$t('app.setting.label.confirm_dirty_editor_close')"
-      >
+      <app-setting :title="$t('app.setting.label.confirm_dirty_editor_close')">
         <v-switch
           v-model="confirmDirtyEditorClose"
           hide-details
@@ -36,9 +34,7 @@
 
       <v-divider />
 
-      <app-setting
-        :title="$t('app.setting.label.save_and_restore_view_state')"
-      >
+      <app-setting :title="$t('app.setting.label.save_and_restore_view_state')">
         <v-select
           v-model="restoreViewState"
           filled
@@ -50,9 +46,7 @@
 
       <v-divider />
 
-      <app-setting
-        :title="$t('app.setting.label.show_code_lens')"
-      >
+      <app-setting :title="$t('app.setting.label.show_code_lens')">
         <v-switch
           v-model="codeLens"
           hide-details
@@ -62,6 +56,18 @@
 
       <v-divider />
 
+      <app-setting :title="$t('app.setting.label.klipper_save_and_restart_action')">
+        <v-select
+          v-model="klipperSaveAndRestartAction"
+          filled
+          dense
+          hide-details="auto"
+          :items="availableKlipperSaveAndRestartActions"
+        />
+      </app-setting>
+
+      <v-divider />
+
       <app-setting :title="$t('app.setting.label.reset')">
         <app-btn
           outlined
@@ -80,11 +86,9 @@
 import { Component, Mixins } from 'vue-property-decorator'
 import StateMixin from '@/mixins/state'
 import { defaultState } from '@/store/config/state'
-import type { RestoreViewState } from '@/store/config/types'
+import type { KlipperSaveAndRestartAction, RestoreViewState } from '@/store/config/types'
 
-@Component({
-  components: {}
-})
+@Component({})
 export default class FileEditorSettings extends Mixins(StateMixin) {
   get confirmDirtyEditorClose (): boolean {
     return this.$typedState.config.uiSettings.editor.confirmDirtyEditorClose
@@ -153,6 +157,35 @@ export default class FileEditorSettings extends Mixins(StateMixin) {
     })
   }
 
+  get klipperSaveAndRestartAction (): KlipperSaveAndRestartAction {
+    return this.$typedState.config.uiSettings.editor.klipperSaveAndRestartAction
+  }
+
+  set klipperSaveAndRestartAction (value: KlipperSaveAndRestartAction) {
+    this.$typedDispatch('config/saveByPath', {
+      path: 'uiSettings.editor.klipperSaveAndRestartAction',
+      value,
+      server: true
+    })
+  }
+
+  get availableKlipperSaveAndRestartActions (): { value: KlipperSaveAndRestartAction, text: string }[] {
+    return [
+      {
+        value: 'firmware-restart',
+        text: this.$tc('app.setting.label.firmware_restart')
+      },
+      {
+        value: 'host-restart',
+        text: this.$tc('app.setting.label.host_restart')
+      },
+      {
+        value: 'service-restart',
+        text: this.$tc('app.setting.label.service_restart')
+      }
+    ]
+  }
+
   handleReset () {
     this.$typedDispatch('config/saveByPath', {
       path: 'uiSettings.editor',

src/components/widgets/filesystem/FileSystem.vue

@@ -153,6 +153,7 @@ import { getFilesFromDataTransfer, hasFilesInDataTransfer } from '@/util/file-sy
 import { getFileDataTransferDataFromDataTransfer, hasFileDataTransferTypeInDataTransfer, setFileDataTransferDataInDataTransfer } from '@/util/file-data-transfer'
 import { consola } from 'consola'
 import type { DataTableHeader } from 'vuetify'
+import type { KlipperSaveAndRestartAction } from '@/store/config/types'
 
 /**
  * Represents the filesystem, bound to moonrakers supplied roots.
@@ -912,22 +913,44 @@ export default class FileSystem extends Mixins(StateMixin, FilesMixin, ServicesM
     }
   }
 
-  async handleSaveFileChanges (contents: string, restart: string) {
+  async handleSaveFileChanges (contents: string, serviceToRestart?: string) {
     const file = new File([contents], this.fileEditorDialogState.filename)
-    if (!restart && this.fileEditorDialogState.open) this.fileEditorDialogState.loading = true
+
+    if (this.fileEditorDialogState.open) {
+      this.fileEditorDialogState.loading = true
+    }
 
     await this.uploadFile(file, this.visiblePath, this.currentRoot, false)
+
     this.fileEditorDialogState.loading = false
-    if (restart) {
-      if (restart === 'moonraker') {
+
+    switch (serviceToRestart) {
+      case 'moonraker':
         this.serviceRestartMoonraker()
-        return
-      }
-      if (restart === 'klipper') {
-        this.firmwareRestartKlippy()
-        return
+        break
+
+      case 'klipper': {
+        const klipperSaveAndRestartAction: KlipperSaveAndRestartAction = this.$typedState.config.uiSettings.editor.klipperSaveAndRestartAction
+
+        switch (klipperSaveAndRestartAction) {
+          case 'host-restart':
+            this.restartKlippy()
+            break
+
+          case 'service-restart':
+            this.serviceRestartKlipper()
+            break
+
+          default:
+            this.firmwareRestartKlippy()
+        }
+        break
       }
-      this.serviceRestartByName(restart)
+
+      default:
+        if (serviceToRestart) {
+          this.serviceRestartByName(serviceToRestart)
+        }
     }
   }
 

src/locales/en.yaml

@@ -620,6 +620,7 @@ app:
       enable_xy_homing: Enable XY Homing
       expression: Expression
       extrusion_line_width: Extrusion Line Width
+      firmware_restart: Firmware Restart
       flip_horizontal: Horizontal Flip
       flip_vertical: Vertical Flip
       fill_color: Fill color
@@ -631,11 +632,13 @@ app:
       height: Height
       hide_single_part_bounding_box: Hide part bounding box when printing a single part
       gcode_coords: Use GCode Coordinates
+      host_restart: Host Restart
       icon: Icon
       invert_x_control: Invert X control
       invert_y_control: Invert Y control
       invert_z_control: Invert Z control
       keyboard_shortcuts: Keyboard shortcuts
+      klipper_save_and_restart_action: Klipper Save & Restart action
       language: Display Language
       last_result: Last result
       left_y: Left Y-Axis
@@ -661,6 +664,7 @@ app:
       right_y: Right Y-Axis
       save_and_restore_view_state: Save and restore view state
       sections_to_ignore_pending_configuration_changes: Sections to ignore Pending Configuration Changes
+      service_restart: Service Restart
       show_animations: Show animations
       show_barometric_pressure: Show barometric pressure
       show_chart: Show chart

src/store/config/state.ts

@@ -83,7 +83,8 @@ export const defaultState = (): ConfigState => {
         confirmDirtyEditorClose: true,
         autoEditExtensions: ['.cfg', '.conf', '.ini', '.log', '.sh', '.txt'],
         restoreViewState: 'session',
-        codeLens: true
+        codeLens: true,
+        klipperSaveAndRestartAction: 'firmware-restart'
       },
       dashboard: {
         tempPresets: []

src/store/config/types.ts

@@ -148,11 +148,14 @@ export interface ThemeLogo {
 
 export type RestoreViewState = 'never' | 'session' | 'local'
 
+export type KlipperSaveAndRestartAction = 'firmware-restart' | 'host-restart' | 'service-restart'
+
 export interface EditorConfig {
   confirmDirtyEditorClose: boolean;
   autoEditExtensions: string[];
   restoreViewState: RestoreViewState,
   codeLens: boolean;
+  klipperSaveAndRestartAction: KlipperSaveAndRestartAction;
 }
 
 export interface Axis {

src/store/server/getters.ts

@@ -75,7 +75,7 @@ export const getters = {
       const instanceIds = rootState.server.system_info?.instance_ids
 
       return {
-        serviceSupported: (instanceIds && itemService in instanceIds) || getters.getServices.some((i: ServiceInfo) => i.name === itemService),
+        serviceSupported: (instanceIds && itemService in instanceIds) || (getters.getServices as ServiceInfo[]).some(i => i.name === itemService),
         ...item
       }
     }