Fix problem with reactive property and use computed to get the length of the rooms

client/src/layouts/DefaultLayout.vue

@@ -41,7 +41,6 @@
         }
       }
     }
-
   }
 </script>
 

client/src/pages/room.vue

@@ -9,7 +9,7 @@
       <div class="room__meta">
         <room-group-widget :group="'Fábrica Nacional de Moneda y Timbre'"></room-group-widget>
 
-        <room-entry-count-widget :entry-count="room.roomEntries.length"></room-entry-count-widget>
+        <room-entry-count-widget :entry-count="roomEntryCount"></room-entry-count-widget>
       </div>
     </div>
     <div class="room__content">
@@ -47,27 +47,33 @@
       this.$store.dispatch('setSpecialContainerClass', 'red');
     },
 
+    data() {
+      return {
+        room: []
+      }
+    },
+
+    computed: {
+      roomEntryCount() {
+        return (this.room && this.room.roomEntries) ? this.room.roomEntries.length : 0
+      }
+    },
+
     apollo: {
       modules: {
         query: ROOM_ENTRIES_QUERY,
-        variables: {
-          slug: this.slug
-          // slug: "ein-historisches-festival"
+        variables() {
+          return {
+            slug: this.slug
+          }
         },
         manual: true,
         result({data, loading, networkStatus}) {
           if (!loading) {
-            debugger
             this.room = this.$getRidOfEdges(data).room
           }
         }
       }
-    },
-
-    data() {
-      return {
-        room: []
-      }
     }
 
     // data() {