Fixed broken dataset rendering if key exists but is empty

openflexure_microscope/api/static/src/components/tabContentComponents/galleryContent.vue

@@ -24,7 +24,7 @@
             <a href="#">Filter</a>
             <div
               :class="{
-                'uk-light uk-background-secondary': $store.state.darkMode
+                'uk-light uk-background-secondary': $store.state.darkMode,
               }"
               class="uk-navbar-dropdown"
             >
@@ -159,7 +159,7 @@ export default {
     captureCard,
     scanCard,
     ZipDownloader,
-    Paginate
+    Paginate,
   },
 
   data: function () {
@@ -171,7 +171,7 @@ export default {
       scanTag: "scan",
       unwatchStoreFunction: null,
       maxitems: 10,
-      page: 1
+      page: 1,
     };
   },
 
@@ -197,7 +197,11 @@ export default {
       var captures = [];
       for (var capture of this.captures) {
         // Add to capture list if matched
-        if (!capture.dataset) {
+        if (
+          !capture.dataset || // If no dataset key
+          (capture.dataset.constructor === Object && // Or dataset is an object...
+            Object.keys(capture.dataset).length === 0) // ...but it's empty
+        ) {
           captures.push(capture);
         }
       }
@@ -300,7 +304,7 @@ export default {
 
     numberOfPages: function () {
       return Math.floor(this.sortedItems.length / this.maxitems);
-    }
+    },
   },
 
   mounted() {
@@ -318,7 +322,7 @@ export default {
       (state, getters) => {
         return getters.ready;
       },
-      ready => {
+      (ready) => {
         if (ready) {
           // If the connection is now ready, update capture list
           this.updateCaptures();
@@ -352,10 +356,10 @@ export default {
       if (this.$store.state.available) {
         axios
           .get(this.capturesUri)
-          .then(response => {
+          .then((response) => {
             this.captures = response.data;
           })
-          .catch(error => {
+          .catch((error) => {
             this.modalError(error); // Let mixin handle error
           });
       }
@@ -370,7 +374,7 @@ export default {
 
         // Filter by selected tags
         var tags = capture.tags;
-        let checker = (arr, target) => target.every(v => arr.includes(v));
+        let checker = (arr, target) => target.every((v) => arr.includes(v));
         // True if all tags match
         includeCapture = checker(tags, filterTags);
 
@@ -405,8 +409,8 @@ export default {
 
     selectFolder: function (folderID) {
       this.galleryFolder = folderID;
-    }
-  }
+    },
+  },
 };
 </script>