refactor: handle undefined config items

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

Author: pedrolamas

src/components/settings/macros/MacroCategorySettings.vue

@@ -77,7 +77,7 @@
             </template>
 
             <template
-              v-if="macro.config.description && macro.config.description !== 'G-Code macro'"
+              v-if="macro.config?.description && macro.config.description !== 'G-Code macro'"
               #sub-title
             >
               <span class="ml-1 mr-2">

src/components/settings/macros/MacroSettingsDialog.vue

@@ -2,7 +2,7 @@
   <app-dialog
     v-model="open"
     :title="macro.name.toUpperCase()"
-    :sub-title="macro.config.description"
+    :sub-title="macro.config?.description"
     max-width="480"
     @save="handleSave"
   >

src/components/widgets/macros/Macros.vue

@@ -43,7 +43,7 @@
             v-for="macro in category.macros"
             :key="`category-${macro.name}`"
             top
-            :disabled="!macro.config.description || macro.config.description === 'G-Code macro'"
+            :disabled="!macro.config?.description || macro.config.description === 'G-Code macro'"
           >
             <template #activator="{ on, attrs }">
               <macro-btn
@@ -57,7 +57,7 @@
                 {{ macro.alias || macro.name }}
               </macro-btn>
             </template>
-            <span>{{ macro.config.description }}</span>
+            <span>{{ macro.config?.description }}</span>
           </v-tooltip>
         </v-expansion-panel-content>
       </v-expansion-panel>

src/components/widgets/outputs/OutputFan.vue

@@ -58,7 +58,7 @@ export default class OutputFan extends Mixins(StateMixin, BrowserMixin) {
 
   get value () {
     if (!this.fan.speed) return 0
-    const speed = this.fan.speed / (this.fan.config.max_power || 1)
+    const speed = this.fan.speed / (this.fan.config?.max_power || 1)
     return Math.round(speed * 100)
   }
 

src/components/widgets/outputs/OutputLed.vue

@@ -53,29 +53,31 @@ export default class OutputLed extends Mixins(StateMixin) {
   get supportedChannels (): string {
     const { type, config } = this.led
 
-    if ('color_order' in config) {
-      const colorOrder = Array.isArray(config.color_order)
-        ? config.color_order[0]
-        : config.color_order
-
-      if (typeof colorOrder === 'string') {
-        return colorOrder
+    if (config) {
+      if ('color_order' in config) {
+        const colorOrder = Array.isArray(config.color_order)
+          ? config.color_order[0]
+          : config.color_order
+
+        if (typeof colorOrder === 'string') {
+          return colorOrder
+        }
       }
-    }
 
-    switch (type) {
-      case 'dotstar':
-        return 'RGB'
+      switch (type) {
+        case 'dotstar':
+          return 'RGB'
 
-      case 'led': {
-        const channels = []
+        case 'led': {
+          const channels = []
 
-        if ('red_pin' in config) channels.push('R')
-        if ('green_pin' in config) channels.push('G')
-        if ('blue_pin' in config) channels.push('B')
-        if ('white_pin' in config) channels.push('W')
+          if ('red_pin' in config) channels.push('R')
+          if ('green_pin' in config) channels.push('G')
+          if ('blue_pin' in config) channels.push('B')
+          if ('white_pin' in config) channels.push('W')
 
-        return channels.join('')
+          return channels.join('')
+        }
       }
     }
 

src/components/widgets/toolhead/ExtruderStepperSync.vue

@@ -13,7 +13,7 @@
         ]"
         :disabled="!klippyReady || printerPrinting"
         :loading="hasWait(`${$waits.onSyncExtruder}${extruderStepper.name}`)"
-        :reset-value="extruderStepper.config.extruder"
+        :reset-value="extruderStepper.config?.extruder"
         item-value="key"
         item-text="name"
         @change="sendSyncExtruderMotion"

src/components/widgets/toolhead/ToolheadCard.vue

@@ -168,49 +168,48 @@ export default class ToolheadCard extends Mixins(StateMixin, ToolheadMixin) {
   }
 
   get printerSupportsQuadGantryLevel (): boolean {
-    return 'quad_gantry_level' in this.printerSettings
+    return this.printerSettings.quad_gantry_level != null
   }
 
   get printerSupportsZTiltAdjust (): boolean {
     return (
-      'z_tilt' in this.printerSettings ||
+      this.printerSettings.z_tilt != null ||
       (
         this.klippyApp.isKalico &&
-        'z_tilt_ng' in this.printerSettings
+        this.printerSettings.z_tilt_ng != null
       )
     )
   }
 
   get printerSupportsBedScrewsAdjust (): boolean {
-    return 'bed_screws' in this.printerSettings
+    return this.printerSettings.bed_screws != null
   }
 
   get printerSupportsBedScrewsCalculate (): boolean {
-    return 'screws_tilt_adjust' in this.printerSettings
+    return this.printerSettings.screws_tilt_adjust != null
   }
 
   get printerSupportsBedTiltCalibrate (): boolean {
-    return 'bed_tilt' in this.printerSettings
+    return this.printerSettings.bed_tilt != null
   }
 
   get printerSupportsDeltaCalibrate (): boolean {
-    return 'delta_calibrate' in this.printerSettings
+    return this.printerSettings.delta_calibrate != null
   }
 
   get printerSupportsProbeCalibrate (): boolean {
     return (
-      'probe' in this.printerSettings ||
-      'bltouch' in this.printerSettings ||
-      'smart_effector' in this.printerSettings ||
+      this.printerSettings.probe != null ||
+      this.printerSettings.bltouch != null ||
+      this.printerSettings.smart_effector != null ||
       Object.keys(this.printerSettings)
         .some(x => x.startsWith('probe_eddy_current '))
     )
   }
 
   get printerSupportsZEndstopCalibrate (): boolean {
     return (
-      'stepper_z' in this.printerSettings &&
-      'z_position_endstop' in this.printerSettings.stepper_z
+      this.printerSettings.stepper_z?.position_endstop != null
     )
   }
 

src/store/chart_helpers.ts

@@ -119,25 +119,28 @@ export const handleSystemStatsChange = (payload: KlipperPrinterState, state: Roo
  */
 export const handleAddChartEntry = (retention: number, state: RootState, commit: Commit, getters: any) => {
   const configureChartEntry = () => {
-    const date = new Date()
-    const r: ChartData = {
-      date
+    const chartData: ChartData = {
+      date: new Date()
     }
 
     const keys: string[] = getters.getChartableSensors
 
     keys.forEach((key) => {
-      const temp = state.printer.printer[key].temperature
-      const target = state.printer.printer[key].target
-      const power = state.printer.printer[key].power
-      const speed = state.printer.printer[key].speed
-      r[key] = temp
-      if (target != null) r[`${key}#target`] = target
-      if (power != null) r[`${key}#power`] = power
-      if (speed != null) r[`${key}#speed`] = speed
+      const sensor = state.printer.printer[key]
+
+      if (sensor != null) {
+        const temp = sensor.temperature
+        const target = sensor.target
+        const power = sensor.power
+        const speed = sensor.speed
+        chartData[key] = temp
+        if (target != null) chartData[`${key}#target`] = target
+        if (power != null) chartData[`${key}#power`] = power
+        if (speed != null) chartData[`${key}#speed`] = speed
+      }
     })
 
-    return r
+    return chartData
   }
 
   if (state.charts.ready) {

src/store/macros/types.ts

@@ -15,7 +15,7 @@ export interface Macro {
   assignTo?: string;
   disabledWhilePrinting?: boolean;
   color?: string;
-  config: KlipperPrinterGcodeMacroSettings;
+  config?: KlipperPrinterGcodeMacroSettings;
   order?: number;
   variables?: Record<string, unknown>
 }

src/store/printer/getters.ts

@@ -325,15 +325,22 @@ export const getters = {
    * Return MCU's and their state
    */
   getMcus: (state) => {
-    const mcus = Object.keys(state.printer)
-      .filter(key => key.startsWith('mcu'))
+    const mcus: MCU[] = []
+
+    const mcuKeys = Object.keys(state.printer)
+      .filter(key => key === 'mcu' || key.startsWith('mcu '))
       .sort()
-      .map((key): MCU => ({
+
+    for (const key of mcuKeys) {
+      const config = state.printer.configfile.settings[key.toLowerCase()]
+
+      mcus.push({
         name: key,
         prettyName: Vue.$filters.prettyCase(key),
         ...state.printer[key],
-        config: state.printer.configfile.settings[key.toLowerCase()]
-      }))
+        config,
+      })
+    }
 
     return mcus
   },
@@ -408,23 +415,23 @@ export const getters = {
   getSteppers: (state): Stepper[] => {
     const steppers: Stepper[] = []
 
-    const stepperKeys: string[] = state.printer.motion_report?.steppers ?? []
+    const stepperKeys = state.printer.motion_report?.steppers ?? []
 
     for (const item of stepperKeys) {
       const name = item.startsWith('stepper_')
         ? item.substring(8)
         : item.split(' ', 2).pop() || ''
 
       const e = state.printer[item]
-      const c = state.printer.configfile.settings[item.toLowerCase()]
+      const config = state.printer.configfile.settings[item.toLowerCase()]
 
       steppers.push({
         name,
         prettyName: Vue.$filters.prettyCase(name),
         key: item,
         enabled: state.printer.stepper_enable?.steppers[item],
         ...e,
-        config: { ...c }
+        config
       })
     }
 
@@ -515,45 +522,46 @@ export const getters = {
    * Return available heaters
    */
   getHeaters: (state): Heater[] => {
-    const heaters = state.printer.heaters?.available_heaters ?? []
-    if (
-      heaters.length
-    ) {
-      const r: Heater[] = []
-      heaters.forEach((e: string) => {
-        const heater = state.printer[e]
-        if (heater && Object.keys(heater).length > 0) {
-          const config = state.printer.configfile.settings[e.toLowerCase()]
-          // Some heater items may have a prefix determining type.
-          // Check for these and split as necessary.
-          const keys = [
-            'heater_generic'
-          ]
-
-          const [type, nameFromSplit] = e.split(' ', 2)
-          const name = nameFromSplit && keys.includes(type)
-            ? nameFromSplit
-            : e
-
-          const color = Vue.$colorset.next(getKlipperType(e), e)
-          const prettyName = Vue.$filters.prettyCase(name)
-
-          r.push({
-            ...heater,
-            name,
-            color,
-            prettyName,
-            key: e,
-            minTemp: config?.min_temp ?? 0,
-            maxTemp: config?.max_temp ?? 500,
-            config: { ...config }
-          })
-        }
-      })
+    const heaters: Heater[] = []
+
+    const heaterKeys = state.printer.heaters?.available_heaters ?? []
 
-      return r.sort((a, b) => a.name.localeCompare(b.name))
+    for (const key of heaterKeys) {
+      const heater = state.printer[key]
+
+      if (heater && Object.keys(heater).length > 0) {
+        const config = state.printer.configfile.settings[key.toLowerCase()]
+
+        // Some heater items may have a prefix determining type.
+        // Check for these and split as necessary.
+        const prefixedTypes = [
+          'heater_generic'
+        ]
+
+        const [type, nameFromSplit] = key.split(' ', 2)
+        const name = nameFromSplit && prefixedTypes.includes(type)
+          ? nameFromSplit
+          : key
+
+        const color = Vue.$colorset.next(getKlipperType(key), key)
+        const prettyName = Vue.$filters.prettyCase(name)
+
+        heaters.push({
+          ...heater,
+          name,
+          type,
+          color,
+          prettyName,
+          key,
+          minTemp: config?.min_temp ?? 0,
+          maxTemp: config?.max_temp ?? 500,
+          config
+        })
+      }
     }
-    return []
+
+    return heaters
+      .sort((a, b) => a.name.localeCompare(b.name))
   },
 
   getAllLeds: (_, getters) => {
@@ -871,7 +879,7 @@ export const getters = {
           break
         }
 
-        const name = config[`screw${index}_name`]
+        const name = config[`screw${index}_name`] ?? ''
         const prettyName = name
           ? Vue.$filters.prettyCase(name)
           : i18n.t('app.general.label.screw_number', { index: index + 1 }).toString()
@@ -907,8 +915,8 @@ export const getters = {
           break
         }
 
-        const coords = config[key]
-        const name = config[`${key}_name`]
+        const coords = config[key] ?? [0, 0]
+        const name = config[`${key}_name`] ?? ''
         const prettyName = name
           ? Vue.$filters.prettyCase(name)
           : i18n.t('app.general.label.screw_number', { index: index + 1 }).toString()