fix: correctly handle null styles

Author: ghusse

components/gymRoutes/GymRouteTable.vue

@@ -764,8 +764,8 @@ export default {
     formatRoutes () {
       for (const route of this.routes) {
         const styles = []
-        for (const section of route.sections) {
-          for (const style of section.styles) {
+        for (const section of route.sections ?? []) {
+          for (const style of section.styles ?? []) {
             styles.push(style)
           }
         }

components/gymRoutes/forms/GymRouteForm.vue

@@ -572,7 +572,7 @@ export default {
         gym_space_id: this.gymSector.gym_space.id,
         gym_sector_id: null,
         gym_id: this.gymSector.gym.id,
-        sections: this.gymRoute?.sections || [{ grade: null, height: null, styles: [] }]
+        sections: this.gymRoute?.sections ?? [{ grade: null, height: null, styles: [] }]
       },
       climbingGymList: [
         { text: this.$t('models.climbs.sport_climbing'), value: 'sport_climbing' },

components/gymRoutes/partial/GymRouteClimbingSimpleStyleIcons.vue

@@ -28,8 +28,8 @@ export default {
   methods: {
     icons () {
       const styles = []
-      for (const section of this.gymRoute.sections) {
-        for (const style of section.styles) {
+      for (const section of this.gymRoute.sections ?? []) {
+        for (const style of section.styles ?? []) {
           styles.push(style)
         }
       }

components/gymRoutes/partial/GymRouteClimbingStyleIcons.vue

@@ -2,7 +2,7 @@
   <div class="d-inline-bloc">
     <template v-for="section in gymRoute.sections">
       <v-icon
-        v-for="(style, styleIndex) in section.styles"
+        v-for="(style, styleIndex) in section.styles ?? []"
         :key="`style-${styleIndex}`"
         class="mr-1"
         :color="styleColor(style)"

components/gymRoutes/partial/GymRouteClimbingStyles.vue

@@ -8,7 +8,7 @@
         L.{{ sectionIndex + 1 }} :
       </span>
       <v-chip
-        v-for="(style, styleIndex) in section.styles"
+        v-for="(style, styleIndex) in section.styles ?? []"
         :key="`style-${styleIndex}`"
         small
         class="mr-2"

models/GymRoute.js

@@ -31,7 +31,7 @@ export default class GymRoute extends ActiveData {
 
   get hasStyles () {
     let styleCounter = 0
-    for (const section of this.sections) {
+    for (const section of this.sections ?? []) {
       styleCounter += section?.styles?.length || 0
     }
     return styleCounter > 0