refactor: move printer helper dialogs to root

Signed-off-by: Pedro Lamas <pedrolamas@gmail.com>

Author: pedrolamas

src/App.vue

@@ -83,6 +83,9 @@
       <spool-selection-dialog />
       <action-command-prompt-dialog />
       <keyboard-shortcuts-dialog />
+      <manual-probe-dialog />
+      <bed-screws-adjust-dialog />
+      <screws-tilt-adjust-dialog />
     </v-main>
 
     <app-footer />

src/components/common/BedScrewsAdjustDialog.vue

@@ -1,6 +1,6 @@
 <template>
   <app-dialog
-    v-model="open"
+    v-model="bedScrewsAdjustDialogOpen"
     :title="$t('app.tool.title.bed_screws_adjust')"
     max-width="450"
     @save="sendAccept"
@@ -91,22 +91,19 @@
 </template>
 
 <script lang="ts">
-import { Component, Mixins, VModel, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from 'vue-property-decorator'
 import StateMixin from '@/mixins/state'
 import ToolheadMixin from '@/mixins/toolhead'
 import type { BedScrews } from '@/store/printer/types'
 
 @Component({})
 export default class BedScrewsAdjustDialog extends Mixins(StateMixin, ToolheadMixin) {
-  @VModel({ type: Boolean })
-  open?: boolean
-
   get bedScrews (): BedScrews[] {
     return this.$store.getters['printer/getBedScrews'] as BedScrews[]
   }
 
   get bedScrewsAdjust () {
-    return this.$store.state.printer.printer.bed_screws
+    return this.$store.state.printer.printer.bed_screws ?? {}
   }
 
   get currentState () {
@@ -118,23 +115,34 @@ export default class BedScrewsAdjustDialog extends Mixins(StateMixin, ToolheadMi
   }
 
   get currentScrewName () {
-    return this.bedScrews[this.currentScrewIndex].prettyName
+    return this.bedScrews[this.currentScrewIndex]?.prettyName
   }
 
   get acceptedScrews () {
     return this.bedScrewsAdjust.accepted_screws
   }
 
+  get showBedScrewsAdjustDialogAutomatically (): boolean {
+    return this.$store.state.config.uiSettings.general.showBedScrewsAdjustDialogAutomatically
+  }
+
   @Watch('isBedScrewsAdjustActive')
   onBedScrewsAdjustActive (value: boolean) {
-    if (!value) {
-      this.open = false
+    if (
+      !value ||
+      (
+        this.showBedScrewsAdjustDialogAutomatically &&
+        this.klippyReady &&
+        !this.printerPrinting
+      )
+    ) {
+      this.bedScrewsAdjustDialogOpen = value
     }
   }
 
   sendAbort () {
     this.sendGcode('ABORT', this.$waits.onBedScrewsAdjust)
-    this.open = false
+    this.bedScrewsAdjustDialogOpen = false
   }
 
   sendAdjusted () {

src/components/common/ManualProbeDialog.vue

@@ -1,6 +1,6 @@
 <template>
   <app-dialog
-    v-model="open"
+    v-model="manualProbeDialogOpen"
     :title="$t('app.tool.title.manual_probe')"
     :cancel-button-text="$t('app.general.btn.abort')"
     :save-button-text="$t('app.general.btn.accept')"
@@ -134,15 +134,12 @@
 </template>
 
 <script lang="ts">
-import { Component, Mixins, VModel, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from 'vue-property-decorator'
 import StateMixin from '@/mixins/state'
 import ToolheadMixin from '@/mixins/toolhead'
 
 @Component({})
 export default class ManualProbeDialog extends Mixins(StateMixin, ToolheadMixin) {
-  @VModel({ type: Boolean })
-  open?: boolean
-
   get offsets () {
     return [
       1,
@@ -167,10 +164,21 @@ export default class ManualProbeDialog extends Mixins(StateMixin, ToolheadMixin)
     return this.manualProbe.z_position_upper?.toFixed(3)
   }
 
+  get showManualProbeDialogAutomatically (): boolean {
+    return this.$store.state.config.uiSettings.general.showManualProbeDialogAutomatically
+  }
+
   @Watch('isManualProbeActive')
   onIsManualProbeActive (value: boolean) {
-    if (!value) {
-      this.open = false
+    if (
+      !value ||
+      (
+        this.showManualProbeDialogAutomatically &&
+        this.klippyReady &&
+        !this.printerPrinting
+      )
+    ) {
+      this.manualProbeDialogOpen = value
     }
   }
 
@@ -180,7 +188,7 @@ export default class ManualProbeDialog extends Mixins(StateMixin, ToolheadMixin)
 
   sendAbort () {
     this.sendGcode('ABORT', this.$waits.onManualProbe)
-    this.open = false
+    this.manualProbeDialogOpen = false
   }
 
   sendAccept () {

src/components/common/ScrewsTiltAdjustDialog.vue

@@ -1,6 +1,6 @@
 <template>
   <app-dialog
-    v-model="open"
+    v-model="screwsTiltAdjustDialogOpen"
     :title="$t('app.tool.title.screws_tilt_adjust')"
     max-width="500"
     @save="retry"
@@ -70,23 +70,34 @@
 </template>
 
 <script lang="ts">
-import { Component, Mixins, VModel } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from 'vue-property-decorator'
 import StateMixin from '@/mixins/state'
 import ToolheadMixin from '@/mixins/toolhead'
 import type { ScrewsTiltAdjust } from '@/store/printer/types'
 
 @Component({})
 export default class ScrewsTiltAdjustDialog extends Mixins(StateMixin, ToolheadMixin) {
-  @VModel({ type: Boolean })
-  open?: boolean
-
   get screwsTiltAdjust (): ScrewsTiltAdjust {
     return this.$store.getters['printer/getScrewsTiltAdjust'] as ScrewsTiltAdjust
   }
 
+  get showScrewsTiltAdjustDialogAutomatically (): boolean {
+    return this.$store.state.config.uiSettings.general.showScrewsTiltAdjustDialogAutomatically
+  }
+
+  @Watch('hasScrewsTiltAdjustResults')
+  onHasScrewsTiltAdjustResults (value: boolean) {
+    this.screwsTiltAdjustDialogOpen = (
+      value &&
+      this.showScrewsTiltAdjustDialogAutomatically &&
+      this.klippyReady &&
+      !this.printerPrinting
+    )
+  }
+
   retry () {
     this.sendGcode('SCREWS_TILT_CALCULATE', this.$waits.onBedScrewsCalculate)
-    this.open = false
+    this.screwsTiltAdjustDialogOpen = false
   }
 
   destroyed () {

src/components/widgets/bedmesh/BedMeshControls.vue

@@ -264,16 +264,11 @@
       :adaptive="saveDialogState.adaptive"
       @save="handleMeshSave"
     />
-
-    <manual-probe-dialog
-      v-if="manualProbeDialogOpen"
-      v-model="manualProbeDialogOpen"
-    />
   </collapsable-card>
 </template>
 
 <script lang="ts">
-import { Component, Mixins, Watch } from 'vue-property-decorator'
+import { Component, Mixins } from 'vue-property-decorator'
 import SaveMeshDialog from './SaveMeshDialog.vue'
 import StateMixin from '@/mixins/state'
 import ToolheadMixin from '@/mixins/toolhead'
@@ -290,8 +285,6 @@ import type {
   }
 })
 export default class BedMesh extends Mixins(StateMixin, ToolheadMixin) {
-  manualProbeDialogOpen = false
-
   mapScaleLabels = ['min', '0.1', '0.2']
   boxScaleLabels = ['1.0', '1.5', '2.0']
 
@@ -418,18 +411,6 @@ export default class BedMesh extends Mixins(StateMixin, ToolheadMixin) {
       adaptive: profile?.adaptive ?? false
     }
   }
-
-  get showManualProbeDialogAutomatically (): boolean {
-    return this.$store.state.config.uiSettings.general.showManualProbeDialogAutomatically
-  }
-
-  @Watch('isManualProbeActive')
-  onIsManualProbeActive (value: boolean) {
-    if (value && this.showManualProbeDialogAutomatically &&
-      this.klippyReady && !this.printerPrinting) {
-      this.manualProbeDialogOpen = true
-    }
-  }
 }
 </script>
 

src/components/widgets/toolhead/ToolheadCard.vue

@@ -55,7 +55,7 @@
           :disabled="!klippyReady || printerPrinting"
           small
           class="me-1 my-1"
-          :color="forceMove ? 'error' : undefined"
+          :color="forceMoveEnabled ? 'error' : undefined"
           @click="toggleForceMove"
         >
           FORCE_MOVE
@@ -131,26 +131,11 @@
     </template>
 
     <toolhead />
-
-    <manual-probe-dialog
-      v-if="manualProbeDialogOpen"
-      v-model="manualProbeDialogOpen"
-    />
-
-    <bed-screws-adjust-dialog
-      v-if="bedScrewsAdjustDialogOpen"
-      v-model="bedScrewsAdjustDialogOpen"
-    />
-
-    <screws-tilt-adjust-dialog
-      v-if="screwsTiltAdjustDialogOpen"
-      v-model="screwsTiltAdjustDialogOpen"
-    />
   </collapsable-card>
 </template>
 
 <script lang="ts">
-import { Component, Mixins, Prop, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Prop } from 'vue-property-decorator'
 import StateMixin from '@/mixins/state'
 import ToolheadMixin from '@/mixins/toolhead'
 import Toolhead from './Toolhead.vue'
@@ -170,10 +155,6 @@ type Tool = {
   }
 })
 export default class ToolheadCard extends Mixins(StateMixin, ToolheadMixin) {
-  manualProbeDialogOpen = false
-  bedScrewsAdjustDialogOpen = false
-  screwsTiltAdjustDialogOpen = false
-
   @Prop({ type: Boolean })
   readonly menuCollapsed?: boolean
 
@@ -383,59 +364,9 @@ export default class ToolheadCard extends Mixins(StateMixin, ToolheadMixin) {
     return this.$store.getters['printer/getHasRoundBed'] as boolean
   }
 
-  get showManualProbeDialogAutomatically (): boolean {
-    return this.$store.state.config.uiSettings.general.showManualProbeDialogAutomatically
-  }
-
-  get showBedScrewsAdjustDialogAutomatically (): boolean {
-    return this.$store.state.config.uiSettings.general.showBedScrewsAdjustDialogAutomatically
-  }
-
-  get showScrewsTiltAdjustDialogAutomatically (): boolean {
-    return this.$store.state.config.uiSettings.general.showScrewsTiltAdjustDialogAutomatically
-  }
-
-  get forceMove (): boolean {
-    return this.$store.state.config.uiSettings.toolhead.forceMove
-  }
-
-  @Watch('isManualProbeActive')
-  onIsManualProbeActive (value: boolean) {
-    if (
-      value &&
-      this.showManualProbeDialogAutomatically &&
-      this.klippyReady &&
-      !this.printerPrinting
-    ) {
-      this.manualProbeDialogOpen = true
-    }
-  }
-
-  @Watch('isBedScrewsAdjustActive')
-  onIsBedScrewsAdjustActive (value: boolean) {
-    if (
-      value &&
-      this.showBedScrewsAdjustDialogAutomatically &&
-      this.klippyReady &&
-      !this.printerPrinting
-    ) {
-      this.bedScrewsAdjustDialogOpen = true
-    }
-  }
-
-  @Watch('hasScrewsTiltAdjustResults')
-  onHasScrewsTiltAdjustResults (value: boolean) {
-    this.screwsTiltAdjustDialogOpen = (
-      value &&
-      this.showScrewsTiltAdjustDialogAutomatically &&
-      this.klippyReady &&
-      !this.printerPrinting
-    )
-  }
-
   async toggleForceMove () {
     const result = (
-      this.forceMove ||
+      this.forceMoveEnabled ||
       !this.$store.state.config.uiSettings.general.forceMoveToggleWarning ||
       await this.$confirm(
         this.$tc('app.general.simple_form.msg.confirm_forcemove_toggle'),
@@ -444,11 +375,7 @@ export default class ToolheadCard extends Mixins(StateMixin, ToolheadMixin) {
     )
 
     if (result) {
-      this.$store.dispatch('config/saveByPath', {
-        path: 'uiSettings.toolhead.forceMove',
-        value: !this.forceMove,
-        server: false
-      })
+      this.$store.dispatch('printer/forceMoveEnabled', !this.forceMoveEnabled)
     }
   }
 }

src/components/widgets/toolhead/ToolheadControlBars.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!forceMove">
+  <div v-if="!forceMoveEnabled">
     <toolhead-control-bars-axis axis="X" />
     <toolhead-control-bars-axis axis="Y" />
     <toolhead-control-bars-axis axis="Z" />
@@ -73,9 +73,5 @@ export default class ToolheadControlBars extends Mixins(StateMixin, ToolheadMixi
     return steppers
       .filter(stepper => stepper.key.startsWith('stepper_'))
   }
-
-  get forceMove (): boolean {
-    return this.$store.state.config.uiSettings.toolhead.forceMove
-  }
 }
 </script>

src/components/widgets/toolhead/ToolheadControlCircle.vue

@@ -539,10 +539,6 @@ export default class ToolheadControlCircle extends Mixins(StateMixin, ToolheadMi
     return this.$store.state.config.uiSettings.general.toolheadCircleZMoveDistances
   }
 
-  get forceMove () {
-    return this.$store.state.config.uiSettings.toolhead.forceMove
-  }
-
   get hasSteppersEnabled (): boolean {
     return this.$store.getters['printer/getHasSteppersEnabled'] as boolean
   }
@@ -729,7 +725,7 @@ export default class ToolheadControlCircle extends Mixins(StateMixin, ToolheadMi
       ? -distance
       : distance
 
-    if (this.forceMove) {
+    if (this.forceMoveEnabled) {
       const accel = axis === 'Z'
         ? this.$store.getters['printer/getPrinterSettings']('printer.max_z_accel')
         : this.$store.state.printer.printer.toolhead.max_accel