From 475a6a161f42d0cefa961be67a5e4061ea28dfed Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Tue, 30 Jul 2024 10:51:13 +1200
Subject: [PATCH 01/32] Add initial image implementation

---
 src/App.vue                             |  4 +-
 src/components/ScaffoldTooltip.vue      | 10 +++
 src/components/ScaffoldTreeControls.vue | 31 +++++++++
 src/components/ScaffoldVuer.vue         | 29 +++++++-
 src/mixins/imageMixin.js                | 87 ++++++++++++++++++++++++
 src/services/scicrunchMixin.js          | 89 +++++++++++++++++++++++++
 6 files changed, 247 insertions(+), 3 deletions(-)
 create mode 100644 src/mixins/imageMixin.js
 create mode 100644 src/services/scicrunchMixin.js

diff --git a/src/App.vue b/src/App.vue
index 0782460..e333a0a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -28,6 +28,7 @@
         :format="format"
         :marker-labels="markerLabels"
         :enableLocalAnnotations="false"
+        :sparcAPI="sparcAPI"
         @open-map="openMap"
         @on-ready="onReady"
         @scaffold-selected="onSelected"
@@ -406,7 +407,8 @@ export default {
       router: useRouter(),
       ElIconSetting: shallowRef(ElIconSetting),
       ElIconFolderOpened: shallowRef(ElIconFolderOpened),
-      auto: NaN
+      auto: NaN,
+      sparcAPI: "http://localhost:8000"
     };
   },
   watch: {
diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 2cb25c2..6f3eef4 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -14,6 +14,7 @@
       <template #default>
         <div class="tooltip-text">{{ label }}</div>
         <div class="tooltip-text" v-if="region">Region: {{ region }}</div>
+        <div v-show="imageSrc"><el-image :src="imageSrc" /></div>
         <CreateTooltiipContent
           v-show="createData.toBeConfirmed"
           :createData="createData"
@@ -121,6 +122,10 @@ export default {
       type: Number,
       default: 200,
     },
+    regionImages: {
+      type: Object,
+      default: [],
+    },
   },
   inject: ['scaffoldUrl'],
   provide() {
@@ -145,6 +150,11 @@ export default {
       const x = this.x - 40;
       return { left: x + "px", top: this.y - yOffset + "px" };
     },
+    imageSrc: function () {
+      if (this.label in this.regionImages) {
+        return this.regionImages[this.label][0].thumbnail;
+      }
+    },
   },
   methods: {
     checkForDisplay: function () {
diff --git a/src/components/ScaffoldTreeControls.vue b/src/components/ScaffoldTreeControls.vue
index c5db0aa..cf6732e 100644
--- a/src/components/ScaffoldTreeControls.vue
+++ b/src/components/ScaffoldTreeControls.vue
@@ -1,6 +1,14 @@
 <template>
   <div class="tree-controls" :class="{ open: drawerOpen, close: !drawerOpen }">
     <div class="traditional-container">
+      <div v-show="filteredImages?.length">
+        <div>{{ label }}</div>
+        <el-carousel>
+          <el-carousel-item v-for="image, index in filteredImages" :key="index">
+            <el-image :src="image.thumbnail"/>
+          </el-carousel-item>
+        </el-carousel>
+      </div>
       <TreeControls
         mapType="scaffold"
         title="Regions"
@@ -28,6 +36,10 @@
 
 <script>
 /* eslint-disable no-alert, no-console */
+import {
+  ElCarousel as Carousel,
+  ElImage as Image,
+} from "element-plus";
 import { ArrowLeft as ElIconArrowLeft } from "@element-plus/icons-vue";
 import {
   convertUUIDsToFullPaths,
@@ -59,6 +71,8 @@ export default {
   components: {
     ElIconArrowLeft,
     TreeControls,
+    Carousel,
+    Image,
   },
   props: {
     /**
@@ -66,6 +80,14 @@ export default {
      */
     showColourPicker: Boolean,
     isReady: Boolean,
+    label: {
+      type: String,
+      default: "",
+    },
+    regionImages: {
+      type: Object,
+      default: [],
+    },
   },
   data: function () {
     return {
@@ -83,6 +105,15 @@ export default {
     treeDataEntry: function () {
       return this.treeData[0].children;
     },
+    filteredImages: function () {
+      if (this.label in this.regionImages) {
+        const images = this.regionImages[this.label];
+        if (images.length > 6) {
+          return images.slice(0, 6);
+        }
+        return images;
+      }
+    },
   },
   watch: {
     treeDataEntry: {
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 15df890..5a771b9 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -15,6 +15,7 @@
       :x="tData.x"
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
+      :regionImages="regionImages"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
@@ -97,6 +98,8 @@
             ref="scaffoldTreeControls"
             :isReady="isReady"
             :show-colour-picker="showColourPicker"
+            :label="tData.label"
+            :regionImages="regionImages"
             @object-selected="objectSelected"
             @object-hovered="objectHovered"
             @drawer-toggled="drawerToggled"
@@ -421,6 +424,8 @@ import { OrgansViewer } from "../scripts/OrgansRenderer.js";
 import { SearchIndex } from "../scripts/Search.js";
 import { mapState } from 'pinia';
 import { useMainStore } from "@/store/index";
+import scicrunchMixin from '../services/scicrunchMixin.js'
+import imageMixin from '../mixins/imageMixin.js'
 
 /**
  * A vue component of the scaffold viewer.
@@ -430,6 +435,7 @@ import { useMainStore } from "@/store/index";
  */
 export default {
   name: "ScaffoldVuer",
+  mixins: [scicrunchMixin,imageMixin],
   components: {
     Button,
     Col,
@@ -673,10 +679,17 @@ export default {
     /**
      * Enable local annotations
      */
-     enableLocalAnnotations: {
+    enableLocalAnnotations: {
       type: Boolean,
       default: false
     },
+    /**
+     * Specify the endpoint of the SPARC API.
+     */
+    sparcAPI: {
+      type: String,
+      default: 'https://api.sparc.science/',
+    },
   },
   provide() {
     return {
@@ -796,6 +809,8 @@ export default {
         centre: [0, 0, 0],
         size:[1, 1, 1],
       },
+      images: [],
+      regionImages: {},
     };
   },
   watch: {
@@ -2069,6 +2084,7 @@ export default {
         //Emit when all objects have been loaded
         this.$emit("on-ready");
         this.setMarkers();
+        this.addImagesToMap();
         //Create a bounding box.
         this._boundingBoxGeo = this.$module.scene.addBoundingBoxPrimitive(
           "_helper", "boundingBox", 0x40E0D0, 0.15);
@@ -2301,7 +2317,6 @@ export default {
       this.$module.toggleSyncControl(flag, rotateMode);
       this.$module.setSyncControlCallback(this.syncControlCallback);
     },
-
     /**
      * Set the markers for the scene.
      */
@@ -2310,6 +2325,16 @@ export default {
         this.setMarkerModeForObjectsWithName(key, value, "on");
       }
     },
+    /**
+     * Get the images from Scicrunch and add them to the map.
+     */
+    addImagesToMap: async function () {
+      let response = await this.getImagesFromScicrunch()
+      if (response && response.success) {
+        this.images = response.images
+        this.regionImages = this.assignImagesToRegions(this.images, this.markerLabels)
+      }
+    }
   },
 };
 </script>
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
new file mode 100644
index 0000000..6288638
--- /dev/null
+++ b/src/mixins/imageMixin.js
@@ -0,0 +1,87 @@
+export default {
+  // Note that the setting store is included in MapContent.vue
+  methods: {
+    populateWithImages: function (mapImp, images = []) {
+      let anatomyList = []
+      console.log('images in populate', images)
+      images.forEach((image) => {
+        if (image.value && image.value.length > 0)
+          image.value.forEach((image) => {
+            if (image.anatomy && image.anatomy.length > 0) {
+              image.anatomy.forEach((anatomy) => {
+                if (!anatomyList.includes(anatomy.curie)) {
+                  anatomyList.push(anatomy.curie)
+                  this.createImageThumbnailMarkerUrl(mapImp, anatomy.curie, image.thumbnail)
+                }
+              })
+            }
+          })
+      })
+    },
+    findImagesForAnatomy: function (images = [], anatomyToFind) {
+      let imageList = []
+      images.forEach((image) => {
+        if (image.value && image.value.length > 0)
+          image.value.forEach((image) => {
+            if (image.anatomy && image.anatomy.length > 0) {
+              image.anatomy.forEach((anatomy) => {
+                if (anatomy.curie === anatomyToFind) {
+                  imageList.push(image)
+                }
+              })
+            }
+          })
+      })
+      return imageList
+    },
+    assignImagesToRegions: function (images, regions) {
+      let imageObject = {}
+      images.forEach((image) => {
+        if (image.value && image.value.length > 0) {
+          image.value.forEach((image) => {
+            if (image.anatomy && image.anatomy.length > 0) {
+              image.anatomy.forEach((anatomy) => {
+                if (Object.keys(regions).includes(anatomy.name) || Object.keys(regions).includes(anatomy.name.toLowerCase())) {
+                  if (anatomy.name in imageObject) {
+                    imageObject[anatomy.name].push(image)
+                  } else {
+                    imageObject[anatomy.name] = [image]
+                  }
+                }
+              })
+            }
+          })
+        }
+      });
+      return imageObject
+    },
+    createImageThumbnailMarkerUrl: function (mapImp, id, image) {
+      return new Promise((resolve, reject) => {
+        // create the image element
+        let wrapperElement = document.createElement("div");
+
+        // download image:
+        let img = new Image();
+        img.src = image;
+        img.style = "height: auto;width: 50px;margin-right: 80px;"
+        img.onload = function () {
+          wrapperElement.appendChild(img);
+
+          // add it to the flatmap
+          const markerIdentifier = mapImp.addMarker(id, {
+            element: wrapperElement,
+            className: "highlight-marker",
+            cluster: false,
+            type: "image",
+          });
+
+          resolve(markerIdentifier);
+        };
+
+        img.onerror = function () {
+          reject(new Error("Failed to load image at " + image));
+        };
+      });
+    },
+  }
+}
diff --git a/src/services/scicrunchMixin.js b/src/services/scicrunchMixin.js
new file mode 100644
index 0000000..57ff334
--- /dev/null
+++ b/src/services/scicrunchMixin.js
@@ -0,0 +1,89 @@
+/* eslint-disable no-alert, no-console */
+const imageQuery = '"*jp2* OR *vnd.ome.xml* OR *jpx*"';
+
+const generateShareLink = (datasetId, datasetVersion, filePath) => {
+  const prefix = 'https://sparc.biolucida.net';
+  return `${prefix}/dataviewer?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}`;
+}
+
+const getBiolucidaInfo = async function (sparcAPI, datasetId) {
+  return new Promise((resolve, reject) => {
+    const endpoint = `${sparcAPI}/image_search/${datasetId}`
+    fetch(endpoint)
+      .then((response) => response.json())
+      .then((data) => {
+        if (data.status == 'success') resolve(data);
+        else reject(data.reason);
+      })
+  })
+}
+
+export default {
+  // Note that the setting store is included in MapContent.vue
+  methods: {
+    getThumbnailURL: function (thumbnailId) {
+      console.log('thumbnail url', `${this.sparcAPI}/thumbnail/${thumbnailId}`)
+      return `${this.sparcAPI}/thumbnail/${thumbnailId}`
+    },
+
+    getSegmentationThumbnailURL: function (datasetId, datasetVersion, filePath, s3uri) {
+      console.log('thumbnail url', `${this.sparcAPI}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}&s3uri=${s3uri}`)
+      return `${this.sparcAPI}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}&s3uri=${s3uri}`;
+    },
+
+    getImagesFromScicrunch: async function () {
+      try {
+        const response = await fetch(`${this.sparcAPI}/multiple_dataset_info/using_multiple_mimetype/?${new URLSearchParams({ q: imageQuery })}`);
+        const data = await response.json();
+        console.log('number of hits:', data.numberOfHits);
+        if (data.numberOfHits >= 1) {
+          let images = await this.processResults(data.results);
+          return { success: true, images: images };
+        }
+        return { success: false };
+      } catch (error) {
+        console.error('Error:', error);
+        return { success: false };
+      }
+    },
+
+    processResults: async function (results) {
+      try {
+        let images = [];
+        const dataType = 'segmentation';
+        console.log('starting promise list')
+        let promiseList = results.map(async (result, i) => {
+          const datasetId = result.dataset_identifier;
+          const datasetVersion = result.dataset_version;
+          const s3uri = result.s3uri;
+          const biolucidaInfo = await getBiolucidaInfo(this.sparcAPI, datasetId);
+          return biolucidaInfo.dataset_images.map(bioImage => {
+            return {
+              resource: {
+                share_link: bioImage.share_link,
+              },
+              title: 'Image',
+              anatomy: result.organs,
+              species: result.organisms,
+              datasetId: datasetId,
+              datasetVersion: datasetVersion,
+              link: bioImage.share_link,
+              s3uri: s3uri,
+              type: dataType,
+              thumbnail: bioImage.thumbnail_url,
+            };
+          });
+        });
+        console.log('promiseList:', promiseList);
+        let biolucidaInfos = await Promise.allSettled(promiseList);
+        images = biolucidaInfos.flat();
+        console.log('biolucidaInfos:', biolucidaInfos);
+        console.log('finished!')
+        return images;
+      } catch (error) {
+        console.error('Error:', error);
+        return [];
+      }
+    }
+  }
+}

From 9b9e1e4febd0a34908523ba10f0d9017bc1da0e4 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Tue, 30 Jul 2024 15:45:09 +1200
Subject: [PATCH 02/32] Update for map utilities component

---
 src/components/ScaffoldTooltip.vue      | 28 ++++++++++++----------
 src/components/ScaffoldTreeControls.vue | 31 -------------------------
 src/components/ScaffoldVuer.vue         |  4 +---
 src/mixins/imageMixin.js                | 13 ++++-------
 4 files changed, 22 insertions(+), 54 deletions(-)

diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 6f3eef4..7c34921 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -14,8 +14,7 @@
       <template #default>
         <div class="tooltip-text">{{ label }}</div>
         <div class="tooltip-text" v-if="region">Region: {{ region }}</div>
-        <div v-show="imageSrc"><el-image :src="imageSrc" /></div>
-        <CreateTooltiipContent
+        <CreateTooltipContent
           v-show="createData.toBeConfirmed"
           :createData="createData"
           @confirm-create="$emit('confirm-create', $event)"
@@ -25,9 +24,17 @@
           class="p-tooltip"
           v-show="annotationDisplay && !createData.toBeConfirmed"
           ref="annotationTooltip"
-          :annotationDisplay="true"
+          :tooltipType="'annotation'"
+          :annotationDisplay="annotationDisplay"
           :annotationEntry="annotationEntry"
         />
+        <Tooltip
+          class="p-tooltip"
+          v-show="imageEntry.length"
+          ref="imageTooltip"
+          :tooltipType="'image'"
+          :imageEntry="imageEntry"
+        />
         <div v-if="createData.toBeDeleted" class="delete-container">
           <el-row>
             <el-col :span="10">Delete this feature?</el-col>
@@ -67,9 +74,9 @@ import {
 import {
   Delete as ElIconDelete,
 } from '@element-plus/icons-vue'
-import CreateTooltiipContent from "./CreateTooltipContent.vue";
 import { mapState } from 'pinia';
 import { useMainStore } from "@/store/index";
+import CreateTooltipContent from "./CreateTooltipContent.vue";
 import { Tooltip } from '@abi-software/map-utilities'
 import '@abi-software/map-utilities/dist/style.css'
 
@@ -80,7 +87,7 @@ export default {
   name: "ScaffoldTooltip",
   components: {
     Col,
-    CreateTooltiipContent,
+    CreateTooltipContent,
     ElIconDelete,
     Icon,
     Popover,
@@ -135,7 +142,6 @@ export default {
   },
   data: function () {
     return {
-      display: false,
       annotationEntry: { },
       ElIconDelete: shallowRef(ElIconDelete),
     };
@@ -150,16 +156,16 @@ export default {
       const x = this.x - 40;
       return { left: x + "px", top: this.y - yOffset + "px" };
     },
-    imageSrc: function () {
+    imageEntry: function () {
       if (this.label in this.regionImages) {
-        return this.regionImages[this.label][0].thumbnail;
+        return this.regionImages[this.label];
       }
+      return [];
     },
   },
   methods: {
     checkForDisplay: function () {
       if (this.visible && this.label && this.label !== "") {
-        this.display = true;
         if (this.annotationDisplay) {
           const region = this.region ? this.region +"/" : "";
           this.annotationEntry = {
@@ -168,9 +174,7 @@ export default {
             "resource": encodeURIComponent(this.scaffoldUrl),
           };
         }
-      }
-      else {
-        this.display = false;
+      } else {
         this.annotationEntry = { };
       }
     },
diff --git a/src/components/ScaffoldTreeControls.vue b/src/components/ScaffoldTreeControls.vue
index cf6732e..c5db0aa 100644
--- a/src/components/ScaffoldTreeControls.vue
+++ b/src/components/ScaffoldTreeControls.vue
@@ -1,14 +1,6 @@
 <template>
   <div class="tree-controls" :class="{ open: drawerOpen, close: !drawerOpen }">
     <div class="traditional-container">
-      <div v-show="filteredImages?.length">
-        <div>{{ label }}</div>
-        <el-carousel>
-          <el-carousel-item v-for="image, index in filteredImages" :key="index">
-            <el-image :src="image.thumbnail"/>
-          </el-carousel-item>
-        </el-carousel>
-      </div>
       <TreeControls
         mapType="scaffold"
         title="Regions"
@@ -36,10 +28,6 @@
 
 <script>
 /* eslint-disable no-alert, no-console */
-import {
-  ElCarousel as Carousel,
-  ElImage as Image,
-} from "element-plus";
 import { ArrowLeft as ElIconArrowLeft } from "@element-plus/icons-vue";
 import {
   convertUUIDsToFullPaths,
@@ -71,8 +59,6 @@ export default {
   components: {
     ElIconArrowLeft,
     TreeControls,
-    Carousel,
-    Image,
   },
   props: {
     /**
@@ -80,14 +66,6 @@ export default {
      */
     showColourPicker: Boolean,
     isReady: Boolean,
-    label: {
-      type: String,
-      default: "",
-    },
-    regionImages: {
-      type: Object,
-      default: [],
-    },
   },
   data: function () {
     return {
@@ -105,15 +83,6 @@ export default {
     treeDataEntry: function () {
       return this.treeData[0].children;
     },
-    filteredImages: function () {
-      if (this.label in this.regionImages) {
-        const images = this.regionImages[this.label];
-        if (images.length > 6) {
-          return images.slice(0, 6);
-        }
-        return images;
-      }
-    },
   },
   watch: {
     treeDataEntry: {
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 5a771b9..dd2cdcb 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -98,8 +98,6 @@
             ref="scaffoldTreeControls"
             :isReady="isReady"
             :show-colour-picker="showColourPicker"
-            :label="tData.label"
-            :regionImages="regionImages"
             @object-selected="objectSelected"
             @object-hovered="objectHovered"
             @drawer-toggled="drawerToggled"
@@ -2332,7 +2330,7 @@ export default {
       let response = await this.getImagesFromScicrunch()
       if (response && response.success) {
         this.images = response.images
-        this.regionImages = this.assignImagesToRegions(this.images, this.markerLabels)
+        this.regionImages = this.assignImagesToRegions(this.images)
       }
     }
   },
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
index 6288638..1c740b7 100644
--- a/src/mixins/imageMixin.js
+++ b/src/mixins/imageMixin.js
@@ -34,20 +34,17 @@ export default {
       })
       return imageList
     },
-    assignImagesToRegions: function (images, regions) {
-      let imageObject = {}
+    assignImagesToRegions: function (images) {
+      let imageObjects = {}
       images.forEach((image) => {
         if (image.value && image.value.length > 0) {
           image.value.forEach((image) => {
             if (image.anatomy && image.anatomy.length > 0) {
               image.anatomy.forEach((anatomy) => {
-                if (Object.keys(regions).includes(anatomy.name) || Object.keys(regions).includes(anatomy.name.toLowerCase())) {
-                  if (anatomy.name in imageObject) {
-                    imageObject[anatomy.name].push(image)
-                  } else {
-                    imageObject[anatomy.name] = [image]
-                  }
+                if (!(anatomy.name in imageObjects)) {
+                  imageObjects[anatomy.name] = []
                 }
+                imageObjects[anatomy.name].push(image)
               })
             }
           })

From 7216c2e1c29f552210a874a9ca57d73fc18090ea Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Wed, 31 Jul 2024 10:31:09 +1200
Subject: [PATCH 03/32] Update image display issue

---
 src/components/ScaffoldTooltip.vue | 18 +++++++-----------
 src/components/ScaffoldVuer.vue    |  2 +-
 src/mixins/imageMixin.js           |  2 +-
 3 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 7c34921..02d9dd0 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -22,17 +22,13 @@
         />
         <Tooltip
           class="p-tooltip"
-          v-show="annotationDisplay && !createData.toBeConfirmed"
-          ref="annotationTooltip"
-          :tooltipType="'annotation'"
-          :annotationDisplay="annotationDisplay"
+          v-show="
+            (annotationDisplay && !createData.toBeConfirmed) ||
+            imageEntry.length
+          "
+          ref="tooltip"
+          :tooltipType="annotationDisplay ? 'annotation' : 'image'"
           :annotationEntry="annotationEntry"
-        />
-        <Tooltip
-          class="p-tooltip"
-          v-show="imageEntry.length"
-          ref="imageTooltip"
-          :tooltipType="'image'"
           :imageEntry="imageEntry"
         />
         <div v-if="createData.toBeDeleted" class="delete-container">
@@ -131,7 +127,7 @@ export default {
     },
     regionImages: {
       type: Object,
-      default: [],
+      default: {},
     },
   },
   inject: ['scaffoldUrl'],
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index dd2cdcb..553bcfd 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -15,7 +15,7 @@
       :x="tData.x"
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
-      :regionImages="regionImages"
+      :regionImages="viewingMode === 'Exploration' ? regionImages : {}"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
index 1c740b7..3b899a7 100644
--- a/src/mixins/imageMixin.js
+++ b/src/mixins/imageMixin.js
@@ -50,7 +50,7 @@ export default {
           })
         }
       });
-      return imageObject
+      return imageObjects
     },
     createImageThumbnailMarkerUrl: function (mapImp, id, image) {
       return new Promise((resolve, reject) => {

From b33e2ab4b45bdae3e0545388ea443a49fd7639c4 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Wed, 31 Jul 2024 14:29:01 +1200
Subject: [PATCH 04/32] Use map-utilities v1.0.0-beta.1

---
 package-lock.json | 2141 +++++++++++++++++++++++++++++----------------
 package.json      |    2 +-
 2 files changed, 1399 insertions(+), 744 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 80cb1a6..8154f30 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.3.3",
       "license": "Apache-2.0",
       "dependencies": {
-        "@abi-software/map-utilities": "^1.0.0",
+        "@abi-software/map-utilities": "^1.0.0-beta.1",
         "@abi-software/sparc-annotation": "^0.3.1",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
@@ -44,19 +44,23 @@
         "webpack-node-externals": "^2.5.2"
       }
     },
-    "node_modules/@aashutoshrathi/word-wrap": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz",
-      "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==",
-      "engines": {
-        "node": ">=0.10.0"
+    "node_modules/@abi-software/gallery": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@abi-software/gallery/-/gallery-1.1.1.tgz",
+      "integrity": "sha512-EOnKEQpL/6R7UZQpjiaBn5g4KPxc8RHrIfyTf4ukA+WJ2SU5T+R5GIYzi8Kuzgh797NehPpe/iFzPa21FvN+HQ==",
+      "dependencies": {
+        "axios": "^1.6.5",
+        "element-plus": "^2.4.4",
+        "unplugin-vue-components": "^0.26.0",
+        "vue": "^3.3.13"
       }
     },
     "node_modules/@abi-software/map-utilities": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.0.0.tgz",
-      "integrity": "sha512-TJiDVSXrL/u2s5FiUbaX5UQiwktoCQieRTnxi//2owDyEasqjIkK0GPUaLK+Ru3VQMbNfwFUvPd2Q2extW76cA==",
+      "version": "1.0.0-beta.1",
+      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.0.0-beta.1.tgz",
+      "integrity": "sha512-gOMGlaAqY8Rv6rXJ64oqOeTJHO1W0FigQZnTJKMOj9wMA0jWYsHHREyP8FKbEZZ0YGk9l2cJGL38K/sHTkcNpw==",
       "dependencies": {
+        "@abi-software/gallery": "^1.1.0",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
         "element-plus": "^2.7.3",
@@ -128,168 +132,168 @@
       }
     },
     "node_modules/@algolia/cache-browser-local-storage": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/cache-browser-local-storage/-/cache-browser-local-storage-4.23.3.tgz",
-      "integrity": "sha512-vRHXYCpPlTDE7i6UOy2xE03zHF2C8MEFjPN2v7fRbqVpcOvAUQK81x3Kc21xyb5aSIpYCjWCZbYZuz8Glyzyyg==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/cache-browser-local-storage/-/cache-browser-local-storage-4.24.0.tgz",
+      "integrity": "sha512-t63W9BnoXVrGy9iYHBgObNXqYXM3tYXCjDSHeNwnsc324r4o5UiVKUiAB4THQ5z9U5hTj6qUvwg/Ez43ZD85ww==",
       "dev": true,
       "dependencies": {
-        "@algolia/cache-common": "4.23.3"
+        "@algolia/cache-common": "4.24.0"
       }
     },
     "node_modules/@algolia/cache-common": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/cache-common/-/cache-common-4.23.3.tgz",
-      "integrity": "sha512-h9XcNI6lxYStaw32pHpB1TMm0RuxphF+Ik4o7tcQiodEdpKK+wKufY6QXtba7t3k8eseirEMVB83uFFF3Nu54A==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/cache-common/-/cache-common-4.24.0.tgz",
+      "integrity": "sha512-emi+v+DmVLpMGhp0V9q9h5CdkURsNmFC+cOS6uK9ndeJm9J4TiqSvPYVu+THUP8P/S08rxf5x2P+p3CfID0Y4g==",
       "dev": true
     },
     "node_modules/@algolia/cache-in-memory": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/cache-in-memory/-/cache-in-memory-4.23.3.tgz",
-      "integrity": "sha512-yvpbuUXg/+0rbcagxNT7un0eo3czx2Uf0y4eiR4z4SD7SiptwYTpbuS0IHxcLHG3lq22ukx1T6Kjtk/rT+mqNg==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/cache-in-memory/-/cache-in-memory-4.24.0.tgz",
+      "integrity": "sha512-gDrt2so19jW26jY3/MkFg5mEypFIPbPoXsQGQWAi6TrCPsNOSEYepBMPlucqWigsmEy/prp5ug2jy/N3PVG/8w==",
       "dev": true,
       "dependencies": {
-        "@algolia/cache-common": "4.23.3"
+        "@algolia/cache-common": "4.24.0"
       }
     },
     "node_modules/@algolia/client-account": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/client-account/-/client-account-4.23.3.tgz",
-      "integrity": "sha512-hpa6S5d7iQmretHHF40QGq6hz0anWEHGlULcTIT9tbUssWUriN9AUXIFQ8Ei4w9azD0hc1rUok9/DeQQobhQMA==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-account/-/client-account-4.24.0.tgz",
+      "integrity": "sha512-adcvyJ3KjPZFDybxlqnf+5KgxJtBjwTPTeyG2aOyoJvx0Y8dUQAEOEVOJ/GBxX0WWNbmaSrhDURMhc+QeevDsA==",
       "dev": true,
       "dependencies": {
-        "@algolia/client-common": "4.23.3",
-        "@algolia/client-search": "4.23.3",
-        "@algolia/transporter": "4.23.3"
+        "@algolia/client-common": "4.24.0",
+        "@algolia/client-search": "4.24.0",
+        "@algolia/transporter": "4.24.0"
       }
     },
     "node_modules/@algolia/client-analytics": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/client-analytics/-/client-analytics-4.23.3.tgz",
-      "integrity": "sha512-LBsEARGS9cj8VkTAVEZphjxTjMVCci+zIIiRhpFun9jGDUlS1XmhCW7CTrnaWeIuCQS/2iPyRqSy1nXPjcBLRA==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-analytics/-/client-analytics-4.24.0.tgz",
+      "integrity": "sha512-y8jOZt1OjwWU4N2qr8G4AxXAzaa8DBvyHTWlHzX/7Me1LX8OayfgHexqrsL4vSBcoMmVw2XnVW9MhL+Y2ZDJXg==",
       "dev": true,
       "dependencies": {
-        "@algolia/client-common": "4.23.3",
-        "@algolia/client-search": "4.23.3",
-        "@algolia/requester-common": "4.23.3",
-        "@algolia/transporter": "4.23.3"
+        "@algolia/client-common": "4.24.0",
+        "@algolia/client-search": "4.24.0",
+        "@algolia/requester-common": "4.24.0",
+        "@algolia/transporter": "4.24.0"
       }
     },
     "node_modules/@algolia/client-common": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/client-common/-/client-common-4.23.3.tgz",
-      "integrity": "sha512-l6EiPxdAlg8CYhroqS5ybfIczsGUIAC47slLPOMDeKSVXYG1n0qGiz4RjAHLw2aD0xzh2EXZ7aRguPfz7UKDKw==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-common/-/client-common-4.24.0.tgz",
+      "integrity": "sha512-bc2ROsNL6w6rqpl5jj/UywlIYC21TwSSoFHKl01lYirGMW+9Eek6r02Tocg4gZ8HAw3iBvu6XQiM3BEbmEMoiA==",
       "dev": true,
       "dependencies": {
-        "@algolia/requester-common": "4.23.3",
-        "@algolia/transporter": "4.23.3"
+        "@algolia/requester-common": "4.24.0",
+        "@algolia/transporter": "4.24.0"
       }
     },
     "node_modules/@algolia/client-personalization": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/client-personalization/-/client-personalization-4.23.3.tgz",
-      "integrity": "sha512-3E3yF3Ocr1tB/xOZiuC3doHQBQ2zu2MPTYZ0d4lpfWads2WTKG7ZzmGnsHmm63RflvDeLK/UVx7j2b3QuwKQ2g==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-personalization/-/client-personalization-4.24.0.tgz",
+      "integrity": "sha512-l5FRFm/yngztweU0HdUzz1rC4yoWCFo3IF+dVIVTfEPg906eZg5BOd1k0K6rZx5JzyyoP4LdmOikfkfGsKVE9w==",
       "dev": true,
       "dependencies": {
-        "@algolia/client-common": "4.23.3",
-        "@algolia/requester-common": "4.23.3",
-        "@algolia/transporter": "4.23.3"
+        "@algolia/client-common": "4.24.0",
+        "@algolia/requester-common": "4.24.0",
+        "@algolia/transporter": "4.24.0"
       }
     },
     "node_modules/@algolia/client-search": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/client-search/-/client-search-4.23.3.tgz",
-      "integrity": "sha512-P4VAKFHqU0wx9O+q29Q8YVuaowaZ5EM77rxfmGnkHUJggh28useXQdopokgwMeYw2XUht49WX5RcTQ40rZIabw==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-search/-/client-search-4.24.0.tgz",
+      "integrity": "sha512-uRW6EpNapmLAD0mW47OXqTP8eiIx5F6qN9/x/7HHO6owL3N1IXqydGwW5nhDFBrV+ldouro2W1VX3XlcUXEFCA==",
       "dev": true,
       "dependencies": {
-        "@algolia/client-common": "4.23.3",
-        "@algolia/requester-common": "4.23.3",
-        "@algolia/transporter": "4.23.3"
+        "@algolia/client-common": "4.24.0",
+        "@algolia/requester-common": "4.24.0",
+        "@algolia/transporter": "4.24.0"
       }
     },
     "node_modules/@algolia/logger-common": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/logger-common/-/logger-common-4.23.3.tgz",
-      "integrity": "sha512-y9kBtmJwiZ9ZZ+1Ek66P0M68mHQzKRxkW5kAAXYN/rdzgDN0d2COsViEFufxJ0pb45K4FRcfC7+33YB4BLrZ+g==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/logger-common/-/logger-common-4.24.0.tgz",
+      "integrity": "sha512-LLUNjkahj9KtKYrQhFKCzMx0BY3RnNP4FEtO+sBybCjJ73E8jNdaKJ/Dd8A/VA4imVHP5tADZ8pn5B8Ga/wTMA==",
       "dev": true
     },
     "node_modules/@algolia/logger-console": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/logger-console/-/logger-console-4.23.3.tgz",
-      "integrity": "sha512-8xoiseoWDKuCVnWP8jHthgaeobDLolh00KJAdMe9XPrWPuf1by732jSpgy2BlsLTaT9m32pHI8CRfrOqQzHv3A==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/logger-console/-/logger-console-4.24.0.tgz",
+      "integrity": "sha512-X4C8IoHgHfiUROfoRCV+lzSy+LHMgkoEEU1BbKcsfnV0i0S20zyy0NLww9dwVHUWNfPPxdMU+/wKmLGYf96yTg==",
       "dev": true,
       "dependencies": {
-        "@algolia/logger-common": "4.23.3"
+        "@algolia/logger-common": "4.24.0"
       }
     },
     "node_modules/@algolia/recommend": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/recommend/-/recommend-4.23.3.tgz",
-      "integrity": "sha512-9fK4nXZF0bFkdcLBRDexsnGzVmu4TSYZqxdpgBW2tEyfuSSY54D4qSRkLmNkrrz4YFvdh2GM1gA8vSsnZPR73w==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/recommend/-/recommend-4.24.0.tgz",
+      "integrity": "sha512-P9kcgerfVBpfYHDfVZDvvdJv0lEoCvzNlOy2nykyt5bK8TyieYyiD0lguIJdRZZYGre03WIAFf14pgE+V+IBlw==",
       "dev": true,
       "dependencies": {
-        "@algolia/cache-browser-local-storage": "4.23.3",
-        "@algolia/cache-common": "4.23.3",
-        "@algolia/cache-in-memory": "4.23.3",
-        "@algolia/client-common": "4.23.3",
-        "@algolia/client-search": "4.23.3",
-        "@algolia/logger-common": "4.23.3",
-        "@algolia/logger-console": "4.23.3",
-        "@algolia/requester-browser-xhr": "4.23.3",
-        "@algolia/requester-common": "4.23.3",
-        "@algolia/requester-node-http": "4.23.3",
-        "@algolia/transporter": "4.23.3"
+        "@algolia/cache-browser-local-storage": "4.24.0",
+        "@algolia/cache-common": "4.24.0",
+        "@algolia/cache-in-memory": "4.24.0",
+        "@algolia/client-common": "4.24.0",
+        "@algolia/client-search": "4.24.0",
+        "@algolia/logger-common": "4.24.0",
+        "@algolia/logger-console": "4.24.0",
+        "@algolia/requester-browser-xhr": "4.24.0",
+        "@algolia/requester-common": "4.24.0",
+        "@algolia/requester-node-http": "4.24.0",
+        "@algolia/transporter": "4.24.0"
       }
     },
     "node_modules/@algolia/requester-browser-xhr": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/requester-browser-xhr/-/requester-browser-xhr-4.23.3.tgz",
-      "integrity": "sha512-jDWGIQ96BhXbmONAQsasIpTYWslyjkiGu0Quydjlowe+ciqySpiDUrJHERIRfELE5+wFc7hc1Q5hqjGoV7yghw==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-browser-xhr/-/requester-browser-xhr-4.24.0.tgz",
+      "integrity": "sha512-Z2NxZMb6+nVXSjF13YpjYTdvV3032YTBSGm2vnYvYPA6mMxzM3v5rsCiSspndn9rzIW4Qp1lPHBvuoKJV6jnAA==",
       "dev": true,
       "dependencies": {
-        "@algolia/requester-common": "4.23.3"
+        "@algolia/requester-common": "4.24.0"
       }
     },
     "node_modules/@algolia/requester-common": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/requester-common/-/requester-common-4.23.3.tgz",
-      "integrity": "sha512-xloIdr/bedtYEGcXCiF2muajyvRhwop4cMZo+K2qzNht0CMzlRkm8YsDdj5IaBhshqfgmBb3rTg4sL4/PpvLYw==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-common/-/requester-common-4.24.0.tgz",
+      "integrity": "sha512-k3CXJ2OVnvgE3HMwcojpvY6d9kgKMPRxs/kVohrwF5WMr2fnqojnycZkxPoEg+bXm8fi5BBfFmOqgYztRtHsQA==",
       "dev": true
     },
     "node_modules/@algolia/requester-node-http": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/requester-node-http/-/requester-node-http-4.23.3.tgz",
-      "integrity": "sha512-zgu++8Uj03IWDEJM3fuNl34s746JnZOWn1Uz5taV1dFyJhVM/kTNw9Ik7YJWiUNHJQXcaD8IXD1eCb0nq/aByA==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-node-http/-/requester-node-http-4.24.0.tgz",
+      "integrity": "sha512-JF18yTjNOVYvU/L3UosRcvbPMGT9B+/GQWNWnenIImglzNVGpyzChkXLnrSf6uxwVNO6ESGu6oN8MqcGQcjQJw==",
       "dev": true,
       "dependencies": {
-        "@algolia/requester-common": "4.23.3"
+        "@algolia/requester-common": "4.24.0"
       }
     },
     "node_modules/@algolia/transporter": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/@algolia/transporter/-/transporter-4.23.3.tgz",
-      "integrity": "sha512-Wjl5gttqnf/gQKJA+dafnD0Y6Yw97yvfY8R9h0dQltX1GXTgNs1zWgvtWW0tHl1EgMdhAyw189uWiZMnL3QebQ==",
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/@algolia/transporter/-/transporter-4.24.0.tgz",
+      "integrity": "sha512-86nI7w6NzWxd1Zp9q3413dRshDqAzSbsQjhcDhPIatEFiZrL1/TjnHL8S7jVKFePlIMzDsZWXAXwXzcok9c5oA==",
       "dev": true,
       "dependencies": {
-        "@algolia/cache-common": "4.23.3",
-        "@algolia/logger-common": "4.23.3",
-        "@algolia/requester-common": "4.23.3"
+        "@algolia/cache-common": "4.24.0",
+        "@algolia/logger-common": "4.24.0",
+        "@algolia/requester-common": "4.24.0"
       }
     },
     "node_modules/@antfu/utils": {
-      "version": "0.7.7",
-      "resolved": "https://registry.npmjs.org/@antfu/utils/-/utils-0.7.7.tgz",
-      "integrity": "sha512-gFPqTG7otEJ8uP6wrhDv6mqwGWYZKNvAcCq6u9hOj0c+IKCEsY4L1oC9trPq2SaWIzAfHvqfBDxF591JkMf+kg==",
+      "version": "0.7.10",
+      "resolved": "https://registry.npmjs.org/@antfu/utils/-/utils-0.7.10.tgz",
+      "integrity": "sha512-+562v9k4aI80m1+VuMHehNJWLOFjBnXn3tdOitzD0il5b7smkSBal4+a3oKiQTbrwMmN/TBUMDvbdoWDehgOww==",
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/@babel/code-frame": {
-      "version": "7.24.2",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.2.tgz",
-      "integrity": "sha512-y5+tLQyV8pg3fsiln67BVLD1P13Eg4lh5RW9mF0zUuvLrv9uIQ4MCL+CRT+FTsBlBjcIan6PGsLcBN0m3ClUyQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.7.tgz",
+      "integrity": "sha512-BcYH1CVJBO9tvyIZ2jVeXgSIMvGZ2FDRvDdOIVQyuklNKSsx+eppDEBq/g47Ayw+RqNFE+URvOShmf+f/qwAlA==",
       "dev": true,
       "dependencies": {
-        "@babel/highlight": "^7.24.2",
+        "@babel/highlight": "^7.24.7",
         "picocolors": "^1.0.0"
       },
       "engines": {
@@ -297,12 +301,12 @@
       }
     },
     "node_modules/@babel/generator": {
-      "version": "7.24.4",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.24.4.tgz",
-      "integrity": "sha512-Xd6+v6SnjWVx/nus+y0l1sxMOTOMBkyL4+BIdbALyatQnAe/SRVjANeDPSCYaX+i1iJmuGSKf3Z+E+V/va1Hvw==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.25.0.tgz",
+      "integrity": "sha512-3LEEcj3PVW8pW2R1SR1M89g/qrYk/m/mB/tLqn7dn4sbBUQyTqnlod+II2U4dqiGtUmkcnAmkMDralTFZttRiw==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.24.0",
+        "@babel/types": "^7.25.0",
         "@jridgewell/gen-mapping": "^0.3.5",
         "@jridgewell/trace-mapping": "^0.3.25",
         "jsesc": "^2.5.1"
@@ -311,40 +315,6 @@
         "node": ">=6.9.0"
       }
     },
-    "node_modules/@babel/helper-environment-visitor": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz",
-      "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==",
-      "dev": true,
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-function-name": {
-      "version": "7.23.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz",
-      "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/template": "^7.22.15",
-        "@babel/types": "^7.23.0"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-hoist-variables": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz",
-      "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/types": "^7.22.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/@babel/helper-module-imports": {
       "version": "7.0.0-beta.35",
       "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.0.0-beta.35.tgz",
@@ -366,43 +336,31 @@
         "to-fast-properties": "^2.0.0"
       }
     },
-    "node_modules/@babel/helper-split-export-declaration": {
-      "version": "7.22.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz",
-      "integrity": "sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==",
-      "dev": true,
-      "dependencies": {
-        "@babel/types": "^7.22.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/@babel/helper-string-parser": {
-      "version": "7.24.1",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.1.tgz",
-      "integrity": "sha512-2ofRCjnnA9y+wk8b9IAREroeUP02KHp431N2mhKniy2yKIDKpbrHv9eXwm8cBeWQYcJmzv5qKCu65P47eCF7CQ==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz",
+      "integrity": "sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-validator-identifier": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz",
-      "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.24.7.tgz",
+      "integrity": "sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/highlight": {
-      "version": "7.24.2",
-      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.2.tgz",
-      "integrity": "sha512-Yac1ao4flkTxTteCDZLEvdxg2fZfz1v8M4QpaGypq/WPDqg3ijHYbDfs+LG5hvzSoqaSZ9/Z9lKSP3CjZjv+pA==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.7.tgz",
+      "integrity": "sha512-EStJpq4OuY8xYfhGVXngigBJRWxftKX9ksiGDnmlY3o7B/V7KIAc9X4oiK87uPJSc/vs5L869bem5fhZa8caZw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-validator-identifier": "^7.22.20",
+        "@babel/helper-validator-identifier": "^7.24.7",
         "chalk": "^2.4.2",
         "js-tokens": "^4.0.0",
         "picocolors": "^1.0.0"
@@ -412,9 +370,9 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.24.4",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.4.tgz",
-      "integrity": "sha512-zTvEBcghmeBma9QIGunWevvBAp4/Qu9Bdq+2k0Ot4fVMD6v3dsC9WOcRSKk7tRRyBM/53yKMJko9xOatGQAwSg==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.25.0.tgz",
+      "integrity": "sha512-CzdIU9jdP0dg7HdyB+bHvDJGagUv+qtzZt5rYCWwW6tITNqV9odjp6Qu41gkG0ca5UfdDUWrKkiAnHHdGRnOrA==",
       "bin": {
         "parser": "bin/babel-parser.js"
       },
@@ -423,9 +381,9 @@
       }
     },
     "node_modules/@babel/runtime": {
-      "version": "7.24.4",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.4.tgz",
-      "integrity": "sha512-dkxf7+hn8mFBwKjs9bvBlArzLVxVbS8usaPUDd5p2a9JCL9tB8OaOVN1isD4+Xyk4ns89/xeOmbQvgdK7IIVdA==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.0.tgz",
+      "integrity": "sha512-7dRy4DwXwtzBrPbZflqxnvfxLF8kdZXPkhymtDeFoFqE6ldzjQFgYTtYIFARcLEYDrqfBfYcZt1WqFxRoyC9Rw==",
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
       },
@@ -434,33 +392,30 @@
       }
     },
     "node_modules/@babel/template": {
-      "version": "7.24.0",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.24.0.tgz",
-      "integrity": "sha512-Bkf2q8lMB0AFpX0NFEqSbx1OkTHf0f+0j82mkw+ZpzBnkk7e9Ql0891vlfgi+kHwOk8tQjiQHpqh4LaSa0fKEA==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.25.0.tgz",
+      "integrity": "sha512-aOOgh1/5XzKvg1jvVz7AVrx2piJ2XBi227DHmbY6y+bM9H2FlN+IfecYu4Xl0cNiiVejlsCri89LUsbj8vJD9Q==",
       "dev": true,
       "dependencies": {
-        "@babel/code-frame": "^7.23.5",
-        "@babel/parser": "^7.24.0",
-        "@babel/types": "^7.24.0"
+        "@babel/code-frame": "^7.24.7",
+        "@babel/parser": "^7.25.0",
+        "@babel/types": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/traverse": {
-      "version": "7.24.1",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.24.1.tgz",
-      "integrity": "sha512-xuU6o9m68KeqZbQuDt2TcKSxUw/mrsvavlEqQ1leZ/B+C9tk6E4sRWy97WaXgvq5E+nU3cXMxv3WKOCanVMCmQ==",
-      "dev": true,
-      "dependencies": {
-        "@babel/code-frame": "^7.24.1",
-        "@babel/generator": "^7.24.1",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-hoist-variables": "^7.22.5",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/parser": "^7.24.1",
-        "@babel/types": "^7.24.0",
+      "version": "7.25.1",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.25.1.tgz",
+      "integrity": "sha512-LrHHoWq08ZpmmFqBAzN+hUdWwy5zt7FGa/hVwMcOqW6OVtwqaoD5utfuGYU87JYxdZgLUvktAsn37j/sYR9siA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/code-frame": "^7.24.7",
+        "@babel/generator": "^7.25.0",
+        "@babel/parser": "^7.25.0",
+        "@babel/template": "^7.25.0",
+        "@babel/types": "^7.25.0",
         "debug": "^4.3.1",
         "globals": "^11.1.0"
       },
@@ -469,13 +424,13 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.24.0",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.24.0.tgz",
-      "integrity": "sha512-+j7a5c253RfKh8iABBhywc8NSfP5LURe7Uh4qpsh6jc+aLJguvmIUBdjSdEMQv2bENrCR5MfRdjGo7vzS/ob7w==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.25.0.tgz",
+      "integrity": "sha512-LcnxQSsd9aXOIgmmSpvZ/1yo46ra2ESYyqLcryaBZOghxy5qqOBjvCWP5JfkI8yl9rlxRgdLTTMCQQRcN2hdCg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-string-parser": "^7.23.4",
-        "@babel/helper-validator-identifier": "^7.22.20",
+        "@babel/helper-string-parser": "^7.24.8",
+        "@babel/helper-validator-identifier": "^7.24.7",
         "to-fast-properties": "^2.0.0"
       },
       "engines": {
@@ -504,30 +459,30 @@
       }
     },
     "node_modules/@docsearch/css": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/@docsearch/css/-/css-3.6.0.tgz",
-      "integrity": "sha512-+sbxb71sWre+PwDK7X2T8+bhS6clcVMLwBPznX45Qu6opJcgRjAp7gYSDzVFp187J+feSj5dNBN1mJoi6ckkUQ==",
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/@docsearch/css/-/css-3.6.1.tgz",
+      "integrity": "sha512-VtVb5DS+0hRIprU2CO6ZQjK2Zg4QU5HrDM1+ix6rT0umsYvFvatMAnf97NHZlVWDaaLlx7GRfR/7FikANiM2Fg==",
       "dev": true
     },
     "node_modules/@docsearch/js": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/@docsearch/js/-/js-3.6.0.tgz",
-      "integrity": "sha512-QujhqINEElrkIfKwyyyTfbsfMAYCkylInLYMRqHy7PHc8xTBQCow73tlo/Kc7oIwBrCLf0P3YhjlOeV4v8hevQ==",
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/@docsearch/js/-/js-3.6.1.tgz",
+      "integrity": "sha512-erI3RRZurDr1xES5hvYJ3Imp7jtrXj6f1xYIzDzxiS7nNBufYWPbJwrmMqWC5g9y165PmxEmN9pklGCdLi0Iqg==",
       "dev": true,
       "dependencies": {
-        "@docsearch/react": "3.6.0",
+        "@docsearch/react": "3.6.1",
         "preact": "^10.0.0"
       }
     },
     "node_modules/@docsearch/react": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/@docsearch/react/-/react-3.6.0.tgz",
-      "integrity": "sha512-HUFut4ztcVNmqy9gp/wxNbC7pTOHhgVVkHVGCACTuLhUKUhKAF9KYHJtMiLUJxEqiFLQiuri1fWF8zqwM/cu1w==",
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/@docsearch/react/-/react-3.6.1.tgz",
+      "integrity": "sha512-qXZkEPvybVhSXj0K7U3bXc233tk5e8PfhoZ6MhPOiik/qUQxYC+Dn9DnoS7CxHQQhHfCvTiN0eY9M12oRghEXw==",
       "dev": true,
       "dependencies": {
         "@algolia/autocomplete-core": "1.9.3",
         "@algolia/autocomplete-preset-algolia": "1.9.3",
-        "@docsearch/css": "3.6.0",
+        "@docsearch/css": "3.6.1",
         "algoliasearch": "^4.19.1"
       },
       "peerDependencies": {
@@ -559,10 +514,266 @@
         "vue": "^3.2.0"
       }
     },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz",
+      "integrity": "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz",
+      "integrity": "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz",
+      "integrity": "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz",
+      "integrity": "sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz",
+      "integrity": "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz",
+      "integrity": "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz",
+      "integrity": "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz",
+      "integrity": "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz",
+      "integrity": "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz",
+      "integrity": "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz",
+      "integrity": "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz",
+      "integrity": "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz",
+      "integrity": "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz",
+      "integrity": "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.20.2.tgz",
-      "integrity": "sha512-1MdwI6OOTsfQfek8sLwgyjOXAu+wKhLEoaOLTjbijk6E2WONYpH9ZU2mNtR+lZ2B4uwr+usqGuVfFT9tMtGvGw==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz",
+      "integrity": "sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==",
       "cpu": [
         "x64"
       ],
@@ -575,6 +786,102 @@
         "node": ">=12"
       }
     },
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz",
+      "integrity": "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz",
+      "integrity": "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz",
+      "integrity": "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz",
+      "integrity": "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@eslint-community/eslint-utils": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
@@ -601,9 +908,9 @@
       }
     },
     "node_modules/@eslint-community/regexpp": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.0.tgz",
-      "integrity": "sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.11.0.tgz",
+      "integrity": "sha512-G/M/tIiMrTAxEWRfLfQJMmGNX28IxBg4PBz8XqQhqUHLFI6TL2htpIB1iQCj144V5ee/JaKyT9/WZ0MGZWfA7A==",
       "engines": {
         "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
       }
@@ -672,26 +979,26 @@
       }
     },
     "node_modules/@floating-ui/core": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.0.tgz",
-      "integrity": "sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g==",
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.5.tgz",
+      "integrity": "sha512-8GrTWmoFhm5BsMZOTHeGD2/0FLKLQQHvO/ZmQga4tKempYRLz8aqJGqXVuQgisnMObq2YZ2SgkwctN1LOOxcqA==",
       "dependencies": {
-        "@floating-ui/utils": "^0.2.1"
+        "@floating-ui/utils": "^0.2.5"
       }
     },
     "node_modules/@floating-ui/dom": {
-      "version": "1.6.3",
-      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.3.tgz",
-      "integrity": "sha512-RnDthu3mzPlQ31Ss/BTwQ1zjzIhr3lk1gZB1OC56h/1vEtaXkESrOqL5fQVMfXpwGtRwX+YsZBdyHtJMQnkArw==",
+      "version": "1.6.8",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.8.tgz",
+      "integrity": "sha512-kx62rP19VZ767Q653wsP1XZCGIirkE09E0QUGNYTM/ttbbQHqcGPdSfWFxUyyNLc/W6aoJRBajOSXhP6GXjC0Q==",
       "dependencies": {
-        "@floating-ui/core": "^1.0.0",
-        "@floating-ui/utils": "^0.2.0"
+        "@floating-ui/core": "^1.6.0",
+        "@floating-ui/utils": "^0.2.5"
       }
     },
     "node_modules/@floating-ui/utils": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz",
-      "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.5.tgz",
+      "integrity": "sha512-sTcG+QZ6fdEUObICavU+aB3Mp8HY4n14wYHdxK4fXjPmv3PXZZeY5RaguJmGyeH/CJQhX3fqKUtS4qc1LoHwhQ=="
     },
     "node_modules/@frogcat/ttl2jsonld": {
       "version": "0.0.9",
@@ -705,6 +1012,7 @@
       "version": "0.11.14",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
       "integrity": "sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==",
+      "deprecated": "Use @eslint/config-array instead",
       "dependencies": {
         "@humanwhocodes/object-schema": "^2.0.2",
         "debug": "^4.3.1",
@@ -729,7 +1037,8 @@
     "node_modules/@humanwhocodes/object-schema": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.3.tgz",
-      "integrity": "sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA=="
+      "integrity": "sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==",
+      "deprecated": "Use @eslint/object-schema instead"
     },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.3.5",
@@ -771,9 +1080,9 @@
       }
     },
     "node_modules/@jridgewell/sourcemap-codec": {
-      "version": "1.4.15",
-      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
-      "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
+      "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ=="
     },
     "node_modules/@jridgewell/trace-mapping": {
       "version": "0.3.25",
@@ -831,48 +1140,191 @@
       "resolved": "https://registry.npmjs.org/@rollup/plugin-inject/-/plugin-inject-5.0.5.tgz",
       "integrity": "sha512-2+DEJbNBoPROPkgTDNe8/1YXWcqxbN5DTjASVIOx8HS+pITXushyNiBV56RB08zuptzz8gT3YfkqriTBVycepg==",
       "dev": true,
-      "dependencies": {
-        "@rollup/pluginutils": "^5.0.1",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.3"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      },
-      "peerDependencies": {
-        "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
-      },
-      "peerDependenciesMeta": {
-        "rollup": {
-          "optional": true
-        }
-      }
+      "dependencies": {
+        "@rollup/pluginutils": "^5.0.1",
+        "estree-walker": "^2.0.2",
+        "magic-string": "^0.30.3"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "rollup": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@rollup/pluginutils": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
+      "integrity": "sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==",
+      "dependencies": {
+        "@types/estree": "^1.0.0",
+        "estree-walker": "^2.0.2",
+        "picomatch": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "rollup": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.19.1.tgz",
+      "integrity": "sha512-XzqSg714++M+FXhHfXpS1tDnNZNpgxxuGZWlRG/jSj+VEPmZ0yg6jV4E0AL3uyBKxO8mO3xtOsP5mQ+XLfrlww==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.19.1.tgz",
+      "integrity": "sha512-thFUbkHteM20BGShD6P08aungq4irbIZKUNbG70LN8RkO7YztcGPiKTTGZS7Kw+x5h8hOXs0i4OaHwFxlpQN6A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.19.1.tgz",
+      "integrity": "sha512-8o6eqeFZzVLia2hKPUZk4jdE3zW7LCcZr+MD18tXkgBBid3lssGVAYuox8x6YHoEPDdDa9ixTaStcmx88lio5Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.19.1.tgz",
+      "integrity": "sha512-4T42heKsnbjkn7ovYiAdDVRRWZLU9Kmhdt6HafZxFcUdpjlBlxj4wDrt1yFWLk7G4+E+8p2C9tcmSu0KA6auGA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.19.1.tgz",
+      "integrity": "sha512-MXg1xp+e5GhZ3Vit1gGEyoC+dyQUBy2JgVQ+3hUrD9wZMkUw/ywgkpK7oZgnB6kPpGrxJ41clkPPnsknuD6M2Q==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.19.1.tgz",
+      "integrity": "sha512-DZNLwIY4ftPSRVkJEaxYkq7u2zel7aah57HESuNkUnz+3bZHxwkCUkrfS2IWC1sxK6F2QNIR0Qr/YXw7nkF3Pw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.19.1.tgz",
+      "integrity": "sha512-C7evongnjyxdngSDRRSQv5GvyfISizgtk9RM+z2biV5kY6S/NF/wta7K+DanmktC5DkuaJQgoKGf7KUDmA7RUw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.19.1.tgz",
+      "integrity": "sha512-89tFWqxfxLLHkAthAcrTs9etAoBFRduNfWdl2xUs/yLV+7XDrJ5yuXMHptNqf1Zw0UCA3cAutkAiAokYCkaPtw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.19.1.tgz",
+      "integrity": "sha512-PromGeV50sq+YfaisG8W3fd+Cl6mnOOiNv2qKKqKCpiiEke2KiKVyDqG/Mb9GWKbYMHj5a01fq/qlUR28PFhCQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.19.1.tgz",
+      "integrity": "sha512-/1BmHYh+iz0cNCP0oHCuF8CSiNj0JOGf0jRlSo3L/FAyZyG2rGBuKpkZVH9YF+x58r1jgWxvm1aRg3DHrLDt6A==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@rollup/pluginutils": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
-      "integrity": "sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==",
-      "dependencies": {
-        "@types/estree": "^1.0.0",
-        "estree-walker": "^2.0.2",
-        "picomatch": "^2.3.1"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      },
-      "peerDependencies": {
-        "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
-      },
-      "peerDependenciesMeta": {
-        "rollup": {
-          "optional": true
-        }
-      }
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.19.1.tgz",
+      "integrity": "sha512-0cYP5rGkQWRZKy9/HtsWVStLXzCF3cCBTRI+qRL8Z+wkYlqN7zrSYm6FuY5Kd5ysS5aH0q5lVgb/WbG4jqXN1Q==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.16.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.16.2.tgz",
-      "integrity": "sha512-oc5/SlITI/Vj/qL4UM+lXN7MERpiy1HEOnrE+SegXwzf7WP9bzmZd6+MDljCEZTdSY84CpvUv9Rq7bCaftn1+g==",
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.19.1.tgz",
+      "integrity": "sha512-XUXeI9eM8rMP8aGvii/aOOiMvTs7xlCosq9xCjcqI9+5hBxtjDpD+7Abm1ZhVIFE1J2h2VIg0t2DX/gjespC2Q==",
       "cpu": [
         "x64"
       ],
@@ -883,9 +1335,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.16.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.16.2.tgz",
-      "integrity": "sha512-/2VWEBG6mKbS2itm7hzPwhIPaxfZh/KLWrYg20pCRLHhNFtF+epLgcBtwy3m07bl/k86Q3PFRAf2cX+VbZbwzQ==",
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.19.1.tgz",
+      "integrity": "sha512-V7cBw/cKXMfEVhpSvVZhC+iGifD6U1zJ4tbibjjN+Xi3blSXaj/rJynAkCFFQfoG6VZrAiP7uGVzL440Q6Me2Q==",
       "cpu": [
         "x64"
       ],
@@ -895,25 +1347,67 @@
         "linux"
       ]
     },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.19.1.tgz",
+      "integrity": "sha512-88brja2vldW/76jWATlBqHEoGjJLRnP0WOEKAUbMcXaAZnemNhlAHSyj4jIwMoP2T750LE9lblvD4e2jXleZsA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.19.1.tgz",
+      "integrity": "sha512-LdxxcqRVSXi6k6JUrTah1rHuaupoeuiv38du8Mt4r4IPer3kwlTo+RuvfE8KzZ/tL6BhaPlzJ3835i6CxrFIRQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.19.1.tgz",
+      "integrity": "sha512-2bIrL28PcK3YCqD9anGxDxamxdiJAxA+l7fWIwM5o8UqNy1t3d1NdAweO2XhA0KTDJ5aH1FsuiT5+7VhtHliXg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
     "node_modules/@shikijs/core": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-1.3.0.tgz",
-      "integrity": "sha512-7fedsBfuILDTBmrYZNFI8B6ATTxhQAasUHllHmjvSZPnoq4bULWoTpHwmuQvZ8Aq03/tAa2IGo6RXqWtHdWaCA==",
-      "dev": true
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-1.12.0.tgz",
+      "integrity": "sha512-mc1cLbm6UQ8RxLc0dZES7v5rkH+99LxQp/ZvTqV3NLyYsO/fD6JhEflP1H5b2SDq9gI0+0G36AVZWxvounfR9w==",
+      "dev": true,
+      "dependencies": {
+        "@types/hast": "^3.0.4"
+      }
     },
     "node_modules/@shikijs/transformers": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@shikijs/transformers/-/transformers-1.3.0.tgz",
-      "integrity": "sha512-3mlpg2I9CjhjE96dEWQOGeCWoPcyTov3s4aAsHmgvnTHa8MBknEnCQy8/xivJPSpD+olqOqIEoHnLfbNJK29AA==",
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/@shikijs/transformers/-/transformers-1.12.0.tgz",
+      "integrity": "sha512-ZS6RzDCWbnDljViMaeuraGaoMesCzDxzO2Slhpvic6j+Wqq4RXfQgb2ITTSrtBjv2HGCLP22mvXydtWCOKea8g==",
       "dev": true,
       "dependencies": {
-        "shiki": "1.3.0"
+        "shiki": "1.12.0"
       }
     },
     "node_modules/@types/eslint": {
-      "version": "8.56.10",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.10.tgz",
-      "integrity": "sha512-Shavhk87gCtY2fhXDctcfS3e6FdxWkCx1iUZ9eEUbh7rTqlZT0/IzOkCOVt0fCjcFuZ9FPYfuezTBImfHCDBGQ==",
+      "version": "9.6.0",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.0.tgz",
+      "integrity": "sha512-gi6WQJ7cHRgZxtkQEoyHMppPjq9Kxo5Tjn2prSKDSmZrCz8TZ3jSRCeTJm+WoM+oB0WG37bRqLzaaU3q7JypGg==",
       "peer": true,
       "dependencies": {
         "@types/estree": "*",
@@ -935,6 +1429,15 @@
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
       "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw=="
     },
+    "node_modules/@types/hast": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/hast/-/hast-3.0.4.tgz",
+      "integrity": "sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==",
+      "dev": true,
+      "dependencies": {
+        "@types/unist": "*"
+      }
+    },
     "node_modules/@types/js-cookie": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/@types/js-cookie/-/js-cookie-3.0.6.tgz",
@@ -951,15 +1454,15 @@
       "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ=="
     },
     "node_modules/@types/linkify-it": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-3.0.5.tgz",
-      "integrity": "sha512-yg6E+u0/+Zjva+buc3EIb+29XEg4wltq7cSmd4Uc2EE/1nUVmxyzpX6gUXD0V8jIrG0r7YeOGVIbYRkxeooCtw==",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",
+      "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==",
       "dev": true
     },
     "node_modules/@types/lodash": {
-      "version": "4.17.0",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.0.tgz",
-      "integrity": "sha512-t7dhREVv6dbNj0q17X12j7yDG4bD/DHYX7o5/DbDxobP0HnGPgpRz2Ej77aL7TZT3DSw13fqUTj8J4mMnqa7WA=="
+      "version": "4.17.7",
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.7.tgz",
+      "integrity": "sha512-8wTvZawATi/lsmNu10/j2hk1KEP0IvjubqPE3cu1Xz7xfXXt5oCq3SNUz4fMIP4XGF9Ky+Ue2tBA3hcS7LSBlA=="
     },
     "node_modules/@types/lodash-es": {
       "version": "4.17.12",
@@ -970,30 +1473,36 @@
       }
     },
     "node_modules/@types/markdown-it": {
-      "version": "14.0.1",
-      "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.0.1.tgz",
-      "integrity": "sha512-6WfOG3jXR78DW8L5cTYCVVGAsIFZskRHCDo5tbqa+qtKVt4oDRVH7hyIWu1SpDQJlmIoEivNQZ5h+AGAOrgOtQ==",
+      "version": "14.1.2",
+      "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.1.2.tgz",
+      "integrity": "sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==",
       "dev": true,
       "dependencies": {
-        "@types/linkify-it": "*",
-        "@types/mdurl": "*"
+        "@types/linkify-it": "^5",
+        "@types/mdurl": "^2"
       }
     },
     "node_modules/@types/mdurl": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-1.0.5.tgz",
-      "integrity": "sha512-6L6VymKTzYSrEf4Nev4Xa1LCHKrlTlYCBMTlQKFuddo1CvQcE52I0mwfOJayueUC7MJuXOeHTcIU683lzd0cUA==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-2.0.0.tgz",
+      "integrity": "sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==",
       "dev": true
     },
     "node_modules/@types/node": {
-      "version": "20.12.7",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.7.tgz",
-      "integrity": "sha512-wq0cICSkRLVaf3UGLMGItu/PtdY7oaXaI/RVU+xliKVOtRna3PRY57ZDfztpDL0n11vfymMUnXv8QwYCO7L1wg==",
+      "version": "22.0.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.0.0.tgz",
+      "integrity": "sha512-VT7KSYudcPOzP5Q0wfbowyNLaVR8QWUdw+088uFWwfvpY6uCWaXpqV6ieLAu9WBcnTa7H4Z5RLK8I5t2FuOcqw==",
       "peer": true,
       "dependencies": {
-        "undici-types": "~5.26.4"
+        "undici-types": "~6.11.1"
       }
     },
+    "node_modules/@types/unist": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
+      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
+      "dev": true
+    },
     "node_modules/@types/web-bluetooth": {
       "version": "0.0.16",
       "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",
@@ -1018,137 +1527,137 @@
       }
     },
     "node_modules/@vue/compat": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/compat/-/compat-3.4.24.tgz",
-      "integrity": "sha512-WvE+MhHCEnlIaRECWPe/eSb09EhB3lUJHyKag8uJ5bf0O3ZUnhvqvI+bD7e3kHm1lSckN13ezlqt5uSeH4ruMQ==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compat/-/compat-3.4.34.tgz",
+      "integrity": "sha512-mYzw20yLQP0CZ7jPyt3/3OMU4cAe6ZqdlrR4ba5oAawyHiuvhu1eNS1YmEbeY3nqm0qXLXLeDmbB5rY4dyTd+A==",
       "dependencies": {
-        "@babel/parser": "^7.24.4",
+        "@babel/parser": "^7.24.7",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.2.0"
       },
       "peerDependencies": {
-        "vue": "3.4.24"
+        "vue": "3.4.34"
       }
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.24.tgz",
-      "integrity": "sha512-vbW/tgbwJYj62N/Ww99x0zhFTkZDTcGh3uwJEuadZ/nF9/xuFMC4693P9r+3sxGXISABpDKvffY5ApH9pmdd1A==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.34.tgz",
+      "integrity": "sha512-Z0izUf32+wAnQewjHu+pQf1yw00EGOmevl1kE+ljjjMe7oEfpQ+BI3/JNK7yMB4IrUsqLDmPecUrpj3mCP+yJQ==",
       "dependencies": {
-        "@babel/parser": "^7.24.4",
-        "@vue/shared": "3.4.24",
+        "@babel/parser": "^7.24.7",
+        "@vue/shared": "3.4.34",
         "entities": "^4.5.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.2.0"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.24.tgz",
-      "integrity": "sha512-4XgABML/4cNndVsQndG6BbGN7+EoisDwi3oXNovqL/4jdNhwvP8/rfRMTb6FxkxIxUUtg6AI1/qZvwfSjxJiWA==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.34.tgz",
+      "integrity": "sha512-3PUOTS1h5cskdOJMExCu2TInXuM0j60DRPpSCJDqOCupCfUZCJoyQmKtRmA8EgDNZ5kcEE7vketamRZfrEuVDw==",
       "dependencies": {
-        "@vue/compiler-core": "3.4.24",
-        "@vue/shared": "3.4.24"
+        "@vue/compiler-core": "3.4.34",
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.24.tgz",
-      "integrity": "sha512-nRAlJUK02FTWfA2nuvNBAqsDZuERGFgxZ8sGH62XgFSvMxO2URblzulExsmj4gFZ8e+VAyDooU9oAoXfEDNxTA==",
-      "dependencies": {
-        "@babel/parser": "^7.24.4",
-        "@vue/compiler-core": "3.4.24",
-        "@vue/compiler-dom": "3.4.24",
-        "@vue/compiler-ssr": "3.4.24",
-        "@vue/shared": "3.4.24",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.34.tgz",
+      "integrity": "sha512-x6lm0UrM03jjDXTPZgD9Ad8bIVD1ifWNit2EaWQIZB5CULr46+FbLQ5RpK7AXtDHGjx9rmvC7QRCTjsiGkAwRw==",
+      "dependencies": {
+        "@babel/parser": "^7.24.7",
+        "@vue/compiler-core": "3.4.34",
+        "@vue/compiler-dom": "3.4.34",
+        "@vue/compiler-ssr": "3.4.34",
+        "@vue/shared": "3.4.34",
         "estree-walker": "^2.0.2",
         "magic-string": "^0.30.10",
-        "postcss": "^8.4.38",
+        "postcss": "^8.4.39",
         "source-map-js": "^1.2.0"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.24.tgz",
-      "integrity": "sha512-ZsAtr4fhaUFnVcDqwW3bYCSDwq+9Gk69q2r/7dAHDrOMw41kylaMgOP4zRnn6GIEJkQznKgrMOGPMFnLB52RbQ==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.34.tgz",
+      "integrity": "sha512-8TDBcLaTrFm5rnF+Qm4BlliaopJgqJ28Nsrc80qazynm5aJO+Emu7y0RWw34L8dNnTRdcVBpWzJxhGYzsoVu4g==",
       "dependencies": {
-        "@vue/compiler-dom": "3.4.24",
-        "@vue/shared": "3.4.24"
+        "@vue/compiler-dom": "3.4.34",
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/devtools-api": {
-      "version": "6.6.1",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.1.tgz",
-      "integrity": "sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA=="
+      "version": "6.6.3",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.3.tgz",
+      "integrity": "sha512-0MiMsFma/HqA6g3KLKn+AGpL1kgKhFWszC9U29NfpWK5LE7bjeXxySWJrOJ77hBz+TBrBQ7o4QJqbPbqbs8rJw=="
     },
     "node_modules/@vue/devtools-kit": {
-      "version": "7.0.27",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.0.27.tgz",
-      "integrity": "sha512-/A5xM38pPCFX5Yhl/lRFAzjyK6VNsH670nww2WbjFKWqlu3I+lMxWKzQkCW6A1V8bduITgl2kHORfg2gTw6QaA==",
+      "version": "7.3.7",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.3.7.tgz",
+      "integrity": "sha512-ktHhhjI4CoUrwdSUF5b/MFfjrtAtK8r4vhOkFyRN5Yp9kdXTwsRBYcwarHuP+wFPKf4/KM7DVBj2ELO8SBwdsw==",
       "dev": true,
       "dependencies": {
-        "@vue/devtools-shared": "^7.0.27",
+        "@vue/devtools-shared": "^7.3.7",
+        "birpc": "^0.2.17",
         "hookable": "^5.5.3",
         "mitt": "^3.0.1",
         "perfect-debounce": "^1.0.0",
-        "speakingurl": "^14.0.1"
-      },
-      "peerDependencies": {
-        "vue": "^3.0.0"
+        "speakingurl": "^14.0.1",
+        "superjson": "^2.2.1"
       }
     },
     "node_modules/@vue/devtools-shared": {
-      "version": "7.0.27",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.0.27.tgz",
-      "integrity": "sha512-4VxtmZ6yjhiSloqZZq2UYU0TBGxOJ8GxWvp5OlAH70zYqi0FIAyWGPkOhvfoZ7DKQyv2UU0mmKzFHjsEkelGyQ==",
+      "version": "7.3.7",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.3.7.tgz",
+      "integrity": "sha512-M9EU1/bWi5GNS/+IZrAhwGOVZmUTN4MH22Hvh35nUZZg9AZP2R2OhfCb+MG4EtAsrUEYlu3R43/SIj3G7EZYtQ==",
       "dev": true,
       "dependencies": {
-        "rfdc": "^1.3.1"
+        "rfdc": "^1.4.1"
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.24.tgz",
-      "integrity": "sha512-nup3fSYg4i4LtNvu9slF/HF/0dkMQYfepUdORBcMSsankzRPzE7ypAFurpwyRBfU1i7Dn1kcwpYsE1wETSh91g==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.34.tgz",
+      "integrity": "sha512-ua+Lo+wBRlBEX9TtgPOShE2JwIO7p6BTZ7t1KZVPoaBRfqbC7N3c8Mpzicx173fXxx5VXeU6ykiHo7WgLzJQDA==",
       "dependencies": {
-        "@vue/shared": "3.4.24"
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.24.tgz",
-      "integrity": "sha512-c7iMfj6cJMeAG3s5yOn9Rc5D9e2/wIuaozmGf/ICGCY3KV5H7mbTVdvEkd4ZshTq7RUZqj2k7LMJWVx+EBiY1g==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.34.tgz",
+      "integrity": "sha512-PXhkiRPwcPGJ1BnyBZFI96GfInCVskd0HPNIAZn7i3YOmLbtbTZpB7/kDTwC1W7IqdGPkTVC63IS7J2nZs4Ebg==",
       "dependencies": {
-        "@vue/reactivity": "3.4.24",
-        "@vue/shared": "3.4.24"
+        "@vue/reactivity": "3.4.34",
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.24.tgz",
-      "integrity": "sha512-uXKzuh/Emfad2Y7Qm0ABsLZZV6H3mAJ5ZVqmAOlrNQRf+T5mxpPGZBfec1hkP41t6h6FwF6RSGCs/gd8WbuySQ==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.34.tgz",
+      "integrity": "sha512-dXqIe+RqFAK2Euak4UsvbIupalrhc67OuQKpD7HJ3W2fv8jlqvI7szfBCsAEcE8o/wyNpkloxB6J8viuF/E3gw==",
       "dependencies": {
-        "@vue/runtime-core": "3.4.24",
-        "@vue/shared": "3.4.24",
+        "@vue/reactivity": "3.4.34",
+        "@vue/runtime-core": "3.4.34",
+        "@vue/shared": "3.4.34",
         "csstype": "^3.1.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.24.tgz",
-      "integrity": "sha512-H+DLK4sQF6sRgzKyofmlEVBIV/9KrQU6HIV7nt6yIwSGGKvSwlV8pqJlebUKLpbXaNHugdSfAbP6YmXF69lxow==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.34.tgz",
+      "integrity": "sha512-GeyEUfMVRZMD/mZcNONEqg7MiU10QQ1DB3O/Qr6+8uXpbwdlmVgQ5Qs1/ZUAFX1X2UUtqMoGrDRbxdWfOJFT7Q==",
       "dependencies": {
-        "@vue/compiler-ssr": "3.4.24",
-        "@vue/shared": "3.4.24"
+        "@vue/compiler-ssr": "3.4.34",
+        "@vue/shared": "3.4.34"
       },
       "peerDependencies": {
-        "vue": "3.4.24"
+        "vue": "3.4.34"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.24.tgz",
-      "integrity": "sha512-BW4tajrJBM9AGAknnyEw5tO2xTmnqgup0VTnDAMcxYmqOX0RG0b9aSUGAbEKolD91tdwpA6oCwbltoJoNzpItw=="
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.34.tgz",
+      "integrity": "sha512-x5LmiRLpRsd9KTjAB8MPKf0CDPMcuItjP0gbNqFCIgL1I8iYp4zglhj9w9FPCdIbHG2M91RVeIbArFfFTz9I3A=="
     },
     "node_modules/@vuese/markdown-render": {
       "version": "2.11.3",
@@ -1184,9 +1693,9 @@
       }
     },
     "node_modules/@vueuse/core/node_modules/vue-demi": {
-      "version": "0.14.7",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
-      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
       "hasInstallScript": true,
       "bin": {
         "vue-demi-fix": "bin/vue-demi-fix.js",
@@ -1209,31 +1718,31 @@
       }
     },
     "node_modules/@vueuse/integrations": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmjs.org/@vueuse/integrations/-/integrations-10.9.0.tgz",
-      "integrity": "sha512-acK+A01AYdWSvL4BZmCoJAcyHJ6EqhmkQEXbQLwev1MY7NBnS+hcEMx/BzVoR9zKI+UqEPMD9u6PsyAuiTRT4Q==",
+      "version": "10.11.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/integrations/-/integrations-10.11.0.tgz",
+      "integrity": "sha512-Pp6MtWEIr+NDOccWd8j59Kpjy5YDXogXI61Kb1JxvSfVBO8NzFQkmrKmSZz47i+ZqHnIzxaT38L358yDHTncZg==",
       "dev": true,
       "dependencies": {
-        "@vueuse/core": "10.9.0",
-        "@vueuse/shared": "10.9.0",
-        "vue-demi": ">=0.14.7"
+        "@vueuse/core": "10.11.0",
+        "@vueuse/shared": "10.11.0",
+        "vue-demi": ">=0.14.8"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       },
       "peerDependencies": {
-        "async-validator": "*",
-        "axios": "*",
-        "change-case": "*",
-        "drauu": "*",
-        "focus-trap": "*",
-        "fuse.js": "*",
-        "idb-keyval": "*",
-        "jwt-decode": "*",
-        "nprogress": "*",
-        "qrcode": "*",
-        "sortablejs": "*",
-        "universal-cookie": "*"
+        "async-validator": "^4",
+        "axios": "^1",
+        "change-case": "^4",
+        "drauu": "^0.3",
+        "focus-trap": "^7",
+        "fuse.js": "^6",
+        "idb-keyval": "^6",
+        "jwt-decode": "^3",
+        "nprogress": "^0.2",
+        "qrcode": "^1.5",
+        "sortablejs": "^1",
+        "universal-cookie": "^6"
       },
       "peerDependenciesMeta": {
         "async-validator": {
@@ -1281,45 +1790,45 @@
       "dev": true
     },
     "node_modules/@vueuse/integrations/node_modules/@vueuse/core": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.9.0.tgz",
-      "integrity": "sha512-/1vjTol8SXnx6xewDEKfS0Ra//ncg4Hb0DaZiwKf7drgfMsKFExQ+FnnENcN6efPen+1kIzhLQoGSy0eDUVOMg==",
+      "version": "10.11.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.0.tgz",
+      "integrity": "sha512-x3sD4Mkm7PJ+pcq3HX8PLPBadXCAlSDR/waK87dz0gQE+qJnaaFhc/dZVfJz+IUYzTMVGum2QlR7ImiJQN4s6g==",
       "dev": true,
       "dependencies": {
         "@types/web-bluetooth": "^0.0.20",
-        "@vueuse/metadata": "10.9.0",
-        "@vueuse/shared": "10.9.0",
-        "vue-demi": ">=0.14.7"
+        "@vueuse/metadata": "10.11.0",
+        "@vueuse/shared": "10.11.0",
+        "vue-demi": ">=0.14.8"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/@vueuse/integrations/node_modules/@vueuse/metadata": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.9.0.tgz",
-      "integrity": "sha512-iddNbg3yZM0X7qFY2sAotomgdHK7YJ6sKUvQqbvwnf7TmaVPxS4EJydcNsVejNdS8iWCtDk+fYXr7E32nyTnGA==",
+      "version": "10.11.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.0.tgz",
+      "integrity": "sha512-kQX7l6l8dVWNqlqyN3ePW3KmjCQO3ZMgXuBMddIu83CmucrsBfXlH+JoviYyRBws/yLTQO8g3Pbw+bdIoVm4oQ==",
       "dev": true,
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/@vueuse/integrations/node_modules/@vueuse/shared": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.9.0.tgz",
-      "integrity": "sha512-Uud2IWncmAfJvRaFYzv5OHDli+FbOzxiVEQdLCKQKLyhz94PIyFC3CHcH7EDMwIn8NPtD06+PNbC/PiO0LGLtw==",
+      "version": "10.11.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.0.tgz",
+      "integrity": "sha512-fyNoIXEq3PfX1L3NkNhtVQUSRtqYwJtJg+Bp9rIzculIZWHTkKSysujrOk2J+NrRulLTQH9+3gGSfYLWSEWU1A==",
       "dev": true,
       "dependencies": {
-        "vue-demi": ">=0.14.7"
+        "vue-demi": ">=0.14.8"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/@vueuse/integrations/node_modules/vue-demi": {
-      "version": "0.14.7",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
-      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
       "dev": true,
       "hasInstallScript": true,
       "bin": {
@@ -1362,9 +1871,9 @@
       }
     },
     "node_modules/@vueuse/shared/node_modules/vue-demi": {
-      "version": "0.14.7",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
-      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
       "hasInstallScript": true,
       "bin": {
         "vue-demi-fix": "bin/vue-demi-fix.js",
@@ -1564,9 +2073,9 @@
       }
     },
     "node_modules/acorn": {
-      "version": "8.11.3",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
-      "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==",
+      "version": "8.12.1",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
+      "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -1574,10 +2083,10 @@
         "node": ">=0.4.0"
       }
     },
-    "node_modules/acorn-import-assertions": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/acorn-import-assertions/-/acorn-import-assertions-1.9.0.tgz",
-      "integrity": "sha512-cmMwop9x+8KFhxvKrKfPYmN6/pKTYYHBqLa0DfvVZcKMJWNyWLnaqND7dx/qn66R7ewM1UX5XMaDVP5wlVTaVA==",
+    "node_modules/acorn-import-attributes": {
+      "version": "1.9.5",
+      "resolved": "https://registry.npmjs.org/acorn-import-attributes/-/acorn-import-attributes-1.9.5.tgz",
+      "integrity": "sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ==",
       "peer": true,
       "peerDependencies": {
         "acorn": "^8"
@@ -1615,26 +2124,26 @@
       }
     },
     "node_modules/algoliasearch": {
-      "version": "4.23.3",
-      "resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-4.23.3.tgz",
-      "integrity": "sha512-Le/3YgNvjW9zxIQMRhUHuhiUjAlKY/zsdZpfq4dlLqg6mEm0nL6yk+7f2hDOtLpxsgE4jSzDmvHL7nXdBp5feg==",
-      "dev": true,
-      "dependencies": {
-        "@algolia/cache-browser-local-storage": "4.23.3",
-        "@algolia/cache-common": "4.23.3",
-        "@algolia/cache-in-memory": "4.23.3",
-        "@algolia/client-account": "4.23.3",
-        "@algolia/client-analytics": "4.23.3",
-        "@algolia/client-common": "4.23.3",
-        "@algolia/client-personalization": "4.23.3",
-        "@algolia/client-search": "4.23.3",
-        "@algolia/logger-common": "4.23.3",
-        "@algolia/logger-console": "4.23.3",
-        "@algolia/recommend": "4.23.3",
-        "@algolia/requester-browser-xhr": "4.23.3",
-        "@algolia/requester-common": "4.23.3",
-        "@algolia/requester-node-http": "4.23.3",
-        "@algolia/transporter": "4.23.3"
+      "version": "4.24.0",
+      "resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-4.24.0.tgz",
+      "integrity": "sha512-bf0QV/9jVejssFBmz2HQLxUadxk574t4iwjCKp5E7NBzwKkrDEhKPISIIjAU/p6K5qDx3qoeh4+26zWN1jmw3g==",
+      "dev": true,
+      "dependencies": {
+        "@algolia/cache-browser-local-storage": "4.24.0",
+        "@algolia/cache-common": "4.24.0",
+        "@algolia/cache-in-memory": "4.24.0",
+        "@algolia/client-account": "4.24.0",
+        "@algolia/client-analytics": "4.24.0",
+        "@algolia/client-common": "4.24.0",
+        "@algolia/client-personalization": "4.24.0",
+        "@algolia/client-search": "4.24.0",
+        "@algolia/logger-common": "4.24.0",
+        "@algolia/logger-console": "4.24.0",
+        "@algolia/recommend": "4.24.0",
+        "@algolia/requester-browser-xhr": "4.24.0",
+        "@algolia/requester-common": "4.24.0",
+        "@algolia/requester-node-http": "4.24.0",
+        "@algolia/transporter": "4.24.0"
       }
     },
     "node_modules/ansi-regex": {
@@ -1780,27 +2289,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/array.prototype.toreversed": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/array.prototype.toreversed/-/array.prototype.toreversed-1.1.2.tgz",
-      "integrity": "sha512-wwDCoT4Ck4Cz7sLtgUmzR5UV3YF5mFHUlbChCzZBQZ+0m2cl/DH3tKgvphv1nKgFsJ48oCSg6p91q2Vm0I/ZMA==",
-      "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "es-shim-unscopables": "^1.0.0"
-      }
-    },
     "node_modules/array.prototype.tosorted": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.3.tgz",
-      "integrity": "sha512-/DdH4TiTmOKzyQbp/eadcCVexiCb36xJg7HshYOYJnNZFDj33GEv0P7GxsynpShhq4OLYJzbGcBDkLsDt7MnNg==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.4.tgz",
+      "integrity": "sha512-p6Fx8B7b7ZhL/gmUsAy0D15WhvDccw3mnGNbZpi3pmeJdxtWsj2jEaI4Y6oo3XiHfzuSgPwKc04MYt6KgvC/wA==",
       "dependencies": {
-        "call-bind": "^1.0.5",
+        "call-bind": "^1.0.7",
         "define-properties": "^1.2.1",
-        "es-abstract": "^1.22.3",
-        "es-errors": "^1.1.0",
+        "es-abstract": "^1.23.3",
+        "es-errors": "^1.3.0",
         "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/arraybuffer.prototype.slice": {
@@ -1859,6 +2360,11 @@
       "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.2.5.tgz",
       "integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg=="
     },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+    },
     "node_modules/auto-changelog": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/auto-changelog/-/auto-changelog-2.4.0.tgz",
@@ -1892,6 +2398,16 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/axios": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
+      "integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
+      "dependencies": {
+        "follow-redirects": "^1.15.6",
+        "form-data": "^4.0.0",
+        "proxy-from-env": "^1.1.0"
+      }
+    },
     "node_modules/babel-eslint": {
       "version": "10.1.0",
       "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
@@ -1979,6 +2495,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/birpc": {
+      "version": "0.2.17",
+      "resolved": "https://registry.npmjs.org/birpc/-/birpc-0.2.17.tgz",
+      "integrity": "sha512-+hkTxhot+dWsLpp3gia5AkVHIsKlZybNT5gIYiDlNzJrmYPcTM9k5/w2uaj3IPpd7LlEYpmCj4Jj1nC41VhDFg==",
+      "dev": true,
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
     "node_modules/bn.js": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.2.1.tgz",
@@ -2146,9 +2671,9 @@
       }
     },
     "node_modules/browserslist": {
-      "version": "4.23.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.0.tgz",
-      "integrity": "sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==",
+      "version": "4.23.2",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.2.tgz",
+      "integrity": "sha512-qkqSyistMYdxAcw+CzbZwlBy8AGmS/eEWs+sEV5TnLRGDOL+C5M2EnH6tlZyg0YoAxGJAFKh61En9BR941GnHA==",
       "funding": [
         {
           "type": "opencollective",
@@ -2165,10 +2690,10 @@
       ],
       "peer": true,
       "dependencies": {
-        "caniuse-lite": "^1.0.30001587",
-        "electron-to-chromium": "^1.4.668",
+        "caniuse-lite": "^1.0.30001640",
+        "electron-to-chromium": "^1.4.820",
         "node-releases": "^2.0.14",
-        "update-browserslist-db": "^1.0.13"
+        "update-browserslist-db": "^1.1.0"
       },
       "bin": {
         "browserslist": "cli.js"
@@ -2253,9 +2778,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001612",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001612.tgz",
-      "integrity": "sha512-lFgnZ07UhaCcsSZgWW0K5j4e69dK1u/ltrL9lTUiFOwNHs12S3UMIEYgBV0Z6C6hRDev7iRnMzzYmKabYdXF9g==",
+      "version": "1.0.30001643",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001643.tgz",
+      "integrity": "sha512-ERgWGNleEilSrHM6iUz/zJNSQTP8Mr21wDWpdgvRwcTXGAq6jMtOUPP4dqFPTdKqZ2wKTdtB+uucZ3MRpAUSmg==",
       "funding": [
         {
           "type": "opencollective",
@@ -2315,9 +2840,9 @@
       }
     },
     "node_modules/chrome-trace-event": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz",
-      "integrity": "sha512-p3KULyQg4S7NIHixdwbGX+nFHkoBiA4YQmyWtjb8XngSKV124nJmRysgAeujbUVb15vh+RvFUfCPqU7rXk+hZg==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz",
+      "integrity": "sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==",
       "peer": true,
       "engines": {
         "node": ">=6.0"
@@ -2362,6 +2887,17 @@
       "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
       "dev": true
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/commander": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
@@ -2500,10 +3036,25 @@
       "integrity": "sha512-xFxOwqIzR/e1k1gLiWEophSCMqXcwVHIH7akf7b/vxcUeGunlj3hvZaaqxwHsTgn+IndtkQJgSztIDWeumWJDQ==",
       "dev": true
     },
+    "node_modules/copy-anything": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-3.0.5.tgz",
+      "integrity": "sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==",
+      "dev": true,
+      "dependencies": {
+        "is-what": "^4.1.8"
+      },
+      "engines": {
+        "node": ">=12.13"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mesqueeb"
+      }
+    },
     "node_modules/core-js": {
-      "version": "3.37.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.37.0.tgz",
-      "integrity": "sha512-fu5vHevQ8ZG4og+LXug8ulUtVxjOcEYvifJr7L5Bfq9GOztVqsKd9/59hUk2ZSbCrS3BqUr3EpaYGIYzq7g3Ug==",
+      "version": "3.37.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.37.1.tgz",
+      "integrity": "sha512-Xn6qmxrQZyB0FFY8E3bgRXei3lWDJHhvI+u0q9TKIYM49G8pAr0FgnnrFRAmsbptZL1yxRADVXn+x5AGsbBfyw==",
       "hasInstallScript": true,
       "funding": {
         "type": "opencollective",
@@ -2703,9 +3254,9 @@
       }
     },
     "node_modules/dayjs": {
-      "version": "1.11.10",
-      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
-      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
+      "version": "1.11.12",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.12.tgz",
+      "integrity": "sha512-Rt2g+nTbLlDWZTwwrIXjy9MeiZmSDI375FvZs72ngxx8PDC6YXOeR3q5LAuPzjZQxhiWdRKac7RKV+YyQYfYIg=="
     },
     "node_modules/de-indent": {
       "version": "1.0.2",
@@ -2714,9 +3265,9 @@
       "dev": true
     },
     "node_modules/debug": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
-      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.6.tgz",
+      "integrity": "sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==",
       "dependencies": {
         "ms": "2.1.2"
       },
@@ -2766,6 +3317,14 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/des.js": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.1.0.tgz",
@@ -2817,15 +3376,15 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.746",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.746.tgz",
-      "integrity": "sha512-jeWaIta2rIG2FzHaYIhSuVWqC6KJYo7oSBX4Jv7g+aVujKztfvdpf+n6MGwZdC5hQXbax4nntykLH2juIQrfPg==",
+      "version": "1.5.3",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.3.tgz",
+      "integrity": "sha512-QNdYSS5i8D9axWp/6XIezRObRHqaav/ur9z1VzCDUCH1XIFOr9WQk5xmgunhsTpjjgDy3oLxO/WMOVZlpUQrlA==",
       "peer": true
     },
     "node_modules/element-plus": {
-      "version": "2.7.6",
-      "resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.7.6.tgz",
-      "integrity": "sha512-36sw1K23hYjgeooR10U6CiCaCp2wvOqwoFurADZVlekeQ9v5U1FhJCFGEXO6i/kZBBMwsE1c9fxjLs9LENw2Rg==",
+      "version": "2.7.8",
+      "resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.7.8.tgz",
+      "integrity": "sha512-h6dx2XihAbQaud0v+6O7Fy0b0G3YNplNVH7QnK3csTcvQd4y4raiyMRQpf9EKbRbTMdNrFsqAZrs9ok9DMcJHg==",
       "dependencies": {
         "@ctrl/tinycolor": "^3.4.1",
         "@element-plus/icons-vue": "^2.3.1",
@@ -2848,9 +3407,9 @@
       }
     },
     "node_modules/elliptic": {
-      "version": "6.5.5",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.5.tgz",
-      "integrity": "sha512-7EjbcmUm17NQFu4Pmgmq2olYMj8nwMnpcddByChSUjArp8F5DQWcIcpriwO4ZToLNAJig0yiyjswfyGNje/ixw==",
+      "version": "6.5.6",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.6.tgz",
+      "integrity": "sha512-mpzdtpeCLuS3BmE3pO3Cpp5bbjlOPY2Q0PgoF+Od1XZrHLYI28Xe3ossCmYCQt11FQKEYd9+PF8jymTvtWJSHQ==",
       "dev": true,
       "dependencies": {
         "bn.js": "^4.11.9",
@@ -2883,9 +3442,9 @@
       }
     },
     "node_modules/enhanced-resolve": {
-      "version": "5.16.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.16.0.tgz",
-      "integrity": "sha512-O+QWCviPNSSLAD9Ucn8Awv+poAkqn3T1XY5/N7kR7rQO9yfSGWkYZDwpJ+iKF7B8rxaQKWngSqACpgzeapSyoA==",
+      "version": "5.17.1",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.17.1.tgz",
+      "integrity": "sha512-LMHl3dXhTcfv8gM4kEzIUeTQ+7fpdA0l2tUf34BddXPkz2A5xJ5L/Pchd5BL6rdccM9QGvu0sWZzK1Z1t4wwyg==",
       "peer": true,
       "dependencies": {
         "graceful-fs": "^4.2.4",
@@ -3017,9 +3576,9 @@
       }
     },
     "node_modules/es-module-lexer": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.0.tgz",
-      "integrity": "sha512-pqrTKmwEIgafsYZAGw9kszYzmagcE/n4dbgwGWLEXg7J4QFJVQRBld8j3Q3GNez79jzxZshq0bcT962QHOghjw==",
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.4.tgz",
+      "integrity": "sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==",
       "peer": true
     },
     "node_modules/es-object-atoms": {
@@ -3071,9 +3630,9 @@
       }
     },
     "node_modules/esbuild": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.20.2.tgz",
-      "integrity": "sha512-WdOOppmUNU+IbZ0PaDiTst80zjnrOkyJNHoKupIcVyU8Lvla3Ugx94VzkQ32Ijqd7UhHJy75gNWDMUekcrSJ6g==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
+      "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==",
       "dev": true,
       "hasInstallScript": true,
       "bin": {
@@ -3083,29 +3642,29 @@
         "node": ">=12"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.20.2",
-        "@esbuild/android-arm": "0.20.2",
-        "@esbuild/android-arm64": "0.20.2",
-        "@esbuild/android-x64": "0.20.2",
-        "@esbuild/darwin-arm64": "0.20.2",
-        "@esbuild/darwin-x64": "0.20.2",
-        "@esbuild/freebsd-arm64": "0.20.2",
-        "@esbuild/freebsd-x64": "0.20.2",
-        "@esbuild/linux-arm": "0.20.2",
-        "@esbuild/linux-arm64": "0.20.2",
-        "@esbuild/linux-ia32": "0.20.2",
-        "@esbuild/linux-loong64": "0.20.2",
-        "@esbuild/linux-mips64el": "0.20.2",
-        "@esbuild/linux-ppc64": "0.20.2",
-        "@esbuild/linux-riscv64": "0.20.2",
-        "@esbuild/linux-s390x": "0.20.2",
-        "@esbuild/linux-x64": "0.20.2",
-        "@esbuild/netbsd-x64": "0.20.2",
-        "@esbuild/openbsd-x64": "0.20.2",
-        "@esbuild/sunos-x64": "0.20.2",
-        "@esbuild/win32-arm64": "0.20.2",
-        "@esbuild/win32-ia32": "0.20.2",
-        "@esbuild/win32-x64": "0.20.2"
+        "@esbuild/aix-ppc64": "0.21.5",
+        "@esbuild/android-arm": "0.21.5",
+        "@esbuild/android-arm64": "0.21.5",
+        "@esbuild/android-x64": "0.21.5",
+        "@esbuild/darwin-arm64": "0.21.5",
+        "@esbuild/darwin-x64": "0.21.5",
+        "@esbuild/freebsd-arm64": "0.21.5",
+        "@esbuild/freebsd-x64": "0.21.5",
+        "@esbuild/linux-arm": "0.21.5",
+        "@esbuild/linux-arm64": "0.21.5",
+        "@esbuild/linux-ia32": "0.21.5",
+        "@esbuild/linux-loong64": "0.21.5",
+        "@esbuild/linux-mips64el": "0.21.5",
+        "@esbuild/linux-ppc64": "0.21.5",
+        "@esbuild/linux-riscv64": "0.21.5",
+        "@esbuild/linux-s390x": "0.21.5",
+        "@esbuild/linux-x64": "0.21.5",
+        "@esbuild/netbsd-x64": "0.21.5",
+        "@esbuild/openbsd-x64": "0.21.5",
+        "@esbuild/sunos-x64": "0.21.5",
+        "@esbuild/win32-arm64": "0.21.5",
+        "@esbuild/win32-ia32": "0.21.5",
+        "@esbuild/win32-x64": "0.21.5"
       }
     },
     "node_modules/escalade": {
@@ -3391,45 +3950,48 @@
       }
     },
     "node_modules/eslint-plugin-promise": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz",
-      "integrity": "sha512-tjqWDwVZQo7UIPMeDReOpUgHCmCiH+ePnVT+5zVapL0uuHnegBUs2smM13CzOs2Xb5+MHMRFTs9v24yjba4Oig==",
+      "version": "6.6.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-6.6.0.tgz",
+      "integrity": "sha512-57Zzfw8G6+Gq7axm2Pdo3gW/Rx3h9Yywgn61uE/3elTCOePEHVrn2i5CdfBwA1BLK0Q0WqctICIUSqXZW/VprQ==",
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
       "peerDependencies": {
-        "eslint": "^7.0.0 || ^8.0.0"
+        "eslint": "^7.0.0 || ^8.0.0 || ^9.0.0"
       }
     },
     "node_modules/eslint-plugin-react": {
-      "version": "7.34.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.34.1.tgz",
-      "integrity": "sha512-N97CxlouPT1AHt8Jn0mhhN2RrADlUAsk1/atcT2KyA/l9Q/E6ll7OIGwNumFmWfZ9skV3XXccYS19h80rHtgkw==",
+      "version": "7.35.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.35.0.tgz",
+      "integrity": "sha512-v501SSMOWv8gerHkk+IIQBkcGRGrO2nfybfj5pLxuJNFTPxxA3PSryhXTK+9pNbtkggheDdsC0E9Q8CuPk6JKA==",
       "dependencies": {
-        "array-includes": "^3.1.7",
-        "array.prototype.findlast": "^1.2.4",
+        "array-includes": "^3.1.8",
+        "array.prototype.findlast": "^1.2.5",
         "array.prototype.flatmap": "^1.3.2",
-        "array.prototype.toreversed": "^1.1.2",
-        "array.prototype.tosorted": "^1.1.3",
+        "array.prototype.tosorted": "^1.1.4",
         "doctrine": "^2.1.0",
-        "es-iterator-helpers": "^1.0.17",
+        "es-iterator-helpers": "^1.0.19",
         "estraverse": "^5.3.0",
+        "hasown": "^2.0.2",
         "jsx-ast-utils": "^2.4.1 || ^3.0.0",
         "minimatch": "^3.1.2",
-        "object.entries": "^1.1.7",
-        "object.fromentries": "^2.0.7",
-        "object.hasown": "^1.1.3",
-        "object.values": "^1.1.7",
+        "object.entries": "^1.1.8",
+        "object.fromentries": "^2.0.8",
+        "object.values": "^1.2.0",
         "prop-types": "^15.8.1",
         "resolve": "^2.0.0-next.5",
         "semver": "^6.3.1",
-        "string.prototype.matchall": "^4.0.10"
+        "string.prototype.matchall": "^4.0.11",
+        "string.prototype.repeat": "^1.0.0"
       },
       "engines": {
         "node": ">=4"
       },
       "peerDependencies": {
-        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8"
+        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7"
       }
     },
     "node_modules/eslint-plugin-react/node_modules/doctrine": {
@@ -3468,9 +4030,9 @@
       }
     },
     "node_modules/eslint-plugin-vue": {
-      "version": "9.25.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.25.0.tgz",
-      "integrity": "sha512-tDWlx14bVe6Bs+Nnh3IGrD+hb11kf2nukfm6jLsmJIhmiRQ1SUaksvwY9U5MvPB0pcrg0QK0xapQkfITs3RKOA==",
+      "version": "9.27.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.27.0.tgz",
+      "integrity": "sha512-5Dw3yxEyuBSXTzT5/Ge1X5kIkRTQ3nvBn/VwPwInNiZBSJOO/timWMUaflONnFBzU6NhB68lxnCda7ULV5N7LA==",
       "dev": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.4.0",
@@ -3479,7 +4041,7 @@
         "nth-check": "^2.1.1",
         "postcss-selector-parser": "^6.0.15",
         "semver": "^7.6.0",
-        "vue-eslint-parser": "^9.4.2",
+        "vue-eslint-parser": "^9.4.3",
         "xml-name-validator": "^4.0.0"
       },
       "engines": {
@@ -3714,9 +4276,9 @@
       }
     },
     "node_modules/esquery": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.5.0.tgz",
-      "integrity": "sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.6.0.tgz",
+      "integrity": "sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==",
       "dependencies": {
         "estraverse": "^5.1.0"
       },
@@ -3906,6 +4468,25 @@
         "tabbable": "^6.2.0"
       }
     },
+    "node_modules/follow-redirects": {
+      "version": "1.15.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/for-each": {
       "version": "0.3.3",
       "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
@@ -3914,6 +4495,19 @@
         "is-callable": "^1.1.3"
       }
     },
+    "node_modules/form-data": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+      "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/formdata-polyfill": {
       "version": "4.0.10",
       "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
@@ -3930,6 +4524,19 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw=="
     },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "hasInstallScript": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
     "node_modules/function-bind": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -4021,6 +4628,7 @@
       "version": "7.2.3",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
       "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
+      "deprecated": "Glob versions prior to v9 are no longer supported",
       "dependencies": {
         "fs.realpath": "^1.0.0",
         "inflight": "^1.0.4",
@@ -4277,9 +4885,9 @@
       }
     },
     "node_modules/immutable": {
-      "version": "4.3.5",
-      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.5.tgz",
-      "integrity": "sha512-8eabxkth9gZatlwl5TBuJnCsoTADlL6ftEr7A4qgdaTsPyreilDSnUk57SO+jfKcNtxPa22U5KK6DSeAYhpBJw==",
+      "version": "4.3.7",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.7.tgz",
+      "integrity": "sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==",
       "dev": true
     },
     "node_modules/import-fresh": {
@@ -4309,6 +4917,7 @@
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
       "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
+      "deprecated": "This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.",
       "dependencies": {
         "once": "^1.3.0",
         "wrappy": "1"
@@ -4431,11 +5040,14 @@
       }
     },
     "node_modules/is-core-module": {
-      "version": "2.13.1",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz",
-      "integrity": "sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==",
+      "version": "2.15.0",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.0.tgz",
+      "integrity": "sha512-Dd+Lb2/zvk9SKy1TGCt1wFJFo/MWBPMX5x7KcvLajWTGuomczdQX61PvY5yK6SVACwpoexWo81IfFyoKY2QnTA==",
       "dependencies": {
-        "hasown": "^2.0.0"
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -4709,6 +5321,18 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-what": {
+      "version": "4.1.16",
+      "resolved": "https://registry.npmjs.org/is-what/-/is-what-4.1.16.tgz",
+      "integrity": "sha512-ZhMwEosbFJkA0YhFnNDgTM4ZxDRsS6HqTo7qsZM08fehyRYIYa0yHu5R6mgo1n/8MgaPBXiPimPD77baVFYg+A==",
+      "dev": true,
+      "engines": {
+        "node": ">=12.13"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mesqueeb"
+      }
+    },
     "node_modules/isarray": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
@@ -5061,11 +5685,11 @@
       }
     },
     "node_modules/magic-string": {
-      "version": "0.30.10",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz",
-      "integrity": "sha512-iIRwTIf0QKV3UAnYK4PU8uiEc4SRh5jX0mwpIwETPpHdhVM4f53RSwS/vXvN1JhGX+Cs7B8qIq3d6AH49O5fAQ==",
+      "version": "0.30.11",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.11.tgz",
+      "integrity": "sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==",
       "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.4.15"
+        "@jridgewell/sourcemap-codec": "^1.5.0"
       }
     },
     "node_modules/mark.js": {
@@ -5105,11 +5729,11 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
-      "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
+      "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
       "dependencies": {
-        "braces": "^3.0.2",
+        "braces": "^3.0.3",
         "picomatch": "^2.3.1"
       },
       "engines": {
@@ -5201,10 +5825,11 @@
       "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
     },
     "node_modules/n3": {
-      "version": "1.17.3",
-      "resolved": "https://registry.npmjs.org/n3/-/n3-1.17.3.tgz",
-      "integrity": "sha512-ZHc24eZi2GIJcJQVxtL6NT3g+mTHRNeTVfXWELzeUOirqLrh2AAyg0nfYZ/kryJWKFSCgO37DGB6Ok3qmGgEcA==",
+      "version": "1.19.0",
+      "resolved": "https://registry.npmjs.org/n3/-/n3-1.19.0.tgz",
+      "integrity": "sha512-6pOBoFQOOCx/BihbUEj3nweyYWK8t3/Xj2i/QBgvV/rm7Gr3IrrnR3OgxyNIX8TZhJWLWLlPLPO/9a9BTwr6dg==",
       "dependencies": {
+        "buffer": "^6.0.3",
         "queue-microtask": "^1.1.2",
         "readable-stream": "^4.0.0"
       },
@@ -5277,9 +5902,9 @@
       }
     },
     "node_modules/node-releases": {
-      "version": "2.0.14",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
-      "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
+      "version": "2.0.18",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.18.tgz",
+      "integrity": "sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g==",
       "peer": true
     },
     "node_modules/node-stdlib-browser": {
@@ -5398,9 +6023,12 @@
       }
     },
     "node_modules/object-inspect": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz",
-      "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==",
+      "version": "1.13.2",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.2.tgz",
+      "integrity": "sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==",
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -5489,22 +6117,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/object.hasown": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/object.hasown/-/object.hasown-1.1.4.tgz",
-      "integrity": "sha512-FZ9LZt9/RHzGySlBARE3VF+gE26TxR38SdmqOqliuTnl9wrKulaQs+4dee1V+Io8VfxqzAfHu6YuRgUy8OHoTg==",
-      "dependencies": {
-        "define-properties": "^1.2.1",
-        "es-abstract": "^1.23.2",
-        "es-object-atoms": "^1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/object.values": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.0.tgz",
@@ -5530,16 +6142,16 @@
       }
     },
     "node_modules/optionator": {
-      "version": "0.9.3",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz",
-      "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==",
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
+      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
       "dependencies": {
-        "@aashutoshrathi/word-wrap": "^1.2.3",
         "deep-is": "^0.1.3",
         "fast-levenshtein": "^2.0.6",
         "levn": "^0.4.1",
         "prelude-ls": "^1.2.1",
-        "type-check": "^0.4.0"
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.5"
       },
       "engines": {
         "node": ">= 0.8.0"
@@ -5622,15 +6234,15 @@
       }
     },
     "node_modules/parse-github-url": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/parse-github-url/-/parse-github-url-1.0.2.tgz",
-      "integrity": "sha512-kgBf6avCbO3Cn6+RnzRGLkUsv4ZVqv/VfAYkRsyBcgkshNvVBkRn1FEZcW0Jb+npXQWm2vHPnnOqFteZxRRGNw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/parse-github-url/-/parse-github-url-1.0.3.tgz",
+      "integrity": "sha512-tfalY5/4SqGaV/GIGzWyHnFjlpTPTNpENR9Ea2lLldSJ8EWXMsvacWucqY3m3I4YPtas15IxTLQVQ5NSYXPrww==",
       "dev": true,
       "bin": {
         "parse-github-url": "cli.js"
       },
       "engines": {
-        "node": ">=0.10.0"
+        "node": ">= 0.10"
       }
     },
     "node_modules/parse-json": {
@@ -5703,9 +6315,9 @@
       "dev": true
     },
     "node_modules/picocolors": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
-      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz",
+      "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew=="
     },
     "node_modules/picomatch": {
       "version": "2.3.1",
@@ -5727,12 +6339,12 @@
       }
     },
     "node_modules/pinia": {
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/pinia/-/pinia-2.1.7.tgz",
-      "integrity": "sha512-+C2AHFtcFqjPih0zpYuvof37SFxMQ7OEG2zV9jRI12i9BOy3YQVAHwdKtyyc8pDcDyIc33WCIsZaCFWU7WWxGQ==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/pinia/-/pinia-2.2.0.tgz",
+      "integrity": "sha512-iPrIh26GMqfpUlMOGyxuDowGmYousTecbTHFwT0xZ1zJvh23oQ+Cj99ZoPQA1TnUPhU6AuRPv6/drkTCJ0VHQA==",
       "dependencies": {
-        "@vue/devtools-api": "^6.5.0",
-        "vue-demi": ">=0.14.5"
+        "@vue/devtools-api": "^6.6.3",
+        "vue-demi": "^0.14.8"
       },
       "funding": {
         "url": "https://github.com/sponsors/posva"
@@ -5752,9 +6364,9 @@
       }
     },
     "node_modules/pinia/node_modules/vue-demi": {
-      "version": "0.14.7",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
-      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
       "hasInstallScript": true,
       "bin": {
         "vue-demi-fix": "bin/vue-demi-fix.js",
@@ -5865,9 +6477,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.38",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
-      "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
+      "version": "8.4.40",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.40.tgz",
+      "integrity": "sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q==",
       "funding": [
         {
           "type": "opencollective",
@@ -5884,7 +6496,7 @@
       ],
       "dependencies": {
         "nanoid": "^3.3.7",
-        "picocolors": "^1.0.0",
+        "picocolors": "^1.0.1",
         "source-map-js": "^1.2.0"
       },
       "engines": {
@@ -5892,9 +6504,9 @@
       }
     },
     "node_modules/postcss-selector-parser": {
-      "version": "6.0.16",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.16.tgz",
-      "integrity": "sha512-A0RVJrX+IUkVZbW3ClroRWurercFhieevHB38sr2+l9eUClMqome3LmEmnhlNy+5Mr2EYN6B2Kaw9wYdd+VHiw==",
+      "version": "6.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.1.tgz",
+      "integrity": "sha512-b4dlw/9V8A71rLIDsSwVmak9z2DuBUB7CA1/wSdelNEzqsjoSPeADTWNO09lpH49Diy3/JIZ2bSPB1dI3LJCHg==",
       "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
@@ -5905,9 +6517,9 @@
       }
     },
     "node_modules/preact": {
-      "version": "10.20.2",
-      "resolved": "https://registry.npmjs.org/preact/-/preact-10.20.2.tgz",
-      "integrity": "sha512-S1d1ernz3KQ+Y2awUxKakpfOg2CEmJmwOP+6igPx6dgr6pgDvenqYviyokWso2rhHvGtTlWWnJDa7RaPbQerTg==",
+      "version": "10.23.1",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.23.1.tgz",
+      "integrity": "sha512-O5UdRsNh4vdZaTieWe3XOgSpdMAmkIYBCT3VhQDlKrzyCm8lUYsk0fmVEvoQQifoOjFRTaHZO69ylrzTW2BH+A==",
       "dev": true,
       "funding": {
         "type": "opencollective",
@@ -5951,6 +6563,11 @@
         "react-is": "^16.13.1"
       }
     },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
+    },
     "node_modules/public-encrypt": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.3.tgz",
@@ -5980,9 +6597,9 @@
       }
     },
     "node_modules/qs": {
-      "version": "6.12.1",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.12.1.tgz",
-      "integrity": "sha512-zWmv4RSuB9r2mYQw3zxQuHWeU+42aKi1wWig/j4ele4ygELZ7PEO6MM7rim9oAQH2A5MWfsAVf/jPvTPgCbvUQ==",
+      "version": "6.12.3",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.12.3.tgz",
+      "integrity": "sha512-AWJm14H1vVaO/iNZ4/hO+HyaTehuy9nRqVdkTqlJt0HWvBiBIEXFmb4C0DGeYo3Xes9rrEW+TxHsaigCbN5ICQ==",
       "dev": true,
       "dependencies": {
         "side-channel": "^1.0.6"
@@ -6192,15 +6809,16 @@
       }
     },
     "node_modules/rfdc": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.3.1.tgz",
-      "integrity": "sha512-r5a3l5HzYlIC68TpmYKlxWjmOP6wiPJ1vWv2HeLhNsRZMrCkxeqxiHlQ21oXmQ4F3SiryXBHhAD7JZqvOJjFmg==",
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz",
+      "integrity": "sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==",
       "dev": true
     },
     "node_modules/rimraf": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
       "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+      "deprecated": "Rimraf versions prior to v4 are no longer supported",
       "dependencies": {
         "glob": "^7.1.3"
       },
@@ -6222,9 +6840,9 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.16.2",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.16.2.tgz",
-      "integrity": "sha512-sxDP0+pya/Yi5ZtptF4p3avI+uWCIf/OdrfdH2Gbv1kWddLKk0U7WE3PmQokhi5JrektxsK3sK8s4hzAmjqahw==",
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.19.1.tgz",
+      "integrity": "sha512-K5vziVlg7hTpYfFBI+91zHBEMo6jafYXpkMlqZjg7/zhIG9iHqazBf4xz9AVdjS9BruRn280ROqLI7G3OFRIlw==",
       "devOptional": true,
       "dependencies": {
         "@types/estree": "1.0.5"
@@ -6237,22 +6855,22 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.16.2",
-        "@rollup/rollup-android-arm64": "4.16.2",
-        "@rollup/rollup-darwin-arm64": "4.16.2",
-        "@rollup/rollup-darwin-x64": "4.16.2",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.16.2",
-        "@rollup/rollup-linux-arm-musleabihf": "4.16.2",
-        "@rollup/rollup-linux-arm64-gnu": "4.16.2",
-        "@rollup/rollup-linux-arm64-musl": "4.16.2",
-        "@rollup/rollup-linux-powerpc64le-gnu": "4.16.2",
-        "@rollup/rollup-linux-riscv64-gnu": "4.16.2",
-        "@rollup/rollup-linux-s390x-gnu": "4.16.2",
-        "@rollup/rollup-linux-x64-gnu": "4.16.2",
-        "@rollup/rollup-linux-x64-musl": "4.16.2",
-        "@rollup/rollup-win32-arm64-msvc": "4.16.2",
-        "@rollup/rollup-win32-ia32-msvc": "4.16.2",
-        "@rollup/rollup-win32-x64-msvc": "4.16.2",
+        "@rollup/rollup-android-arm-eabi": "4.19.1",
+        "@rollup/rollup-android-arm64": "4.19.1",
+        "@rollup/rollup-darwin-arm64": "4.19.1",
+        "@rollup/rollup-darwin-x64": "4.19.1",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.19.1",
+        "@rollup/rollup-linux-arm-musleabihf": "4.19.1",
+        "@rollup/rollup-linux-arm64-gnu": "4.19.1",
+        "@rollup/rollup-linux-arm64-musl": "4.19.1",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.19.1",
+        "@rollup/rollup-linux-riscv64-gnu": "4.19.1",
+        "@rollup/rollup-linux-s390x-gnu": "4.19.1",
+        "@rollup/rollup-linux-x64-gnu": "4.19.1",
+        "@rollup/rollup-linux-x64-musl": "4.19.1",
+        "@rollup/rollup-win32-arm64-msvc": "4.19.1",
+        "@rollup/rollup-win32-ia32-msvc": "4.19.1",
+        "@rollup/rollup-win32-x64-msvc": "4.19.1",
         "fsevents": "~2.3.2"
       }
     },
@@ -6340,9 +6958,9 @@
       }
     },
     "node_modules/sass": {
-      "version": "1.75.0",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.75.0.tgz",
-      "integrity": "sha512-ShMYi3WkrDWxExyxSZPst4/okE9ts46xZmJDSawJQrnte7M1V9fScVB+uNXOVKRBt0PggHOwoZcn8mYX4trnBw==",
+      "version": "1.77.8",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.8.tgz",
+      "integrity": "sha512-4UHg6prsrycW20fqLGPShtEvo/WyHRVRHwOP4DzkUrObWoWI05QBSfzU71TVB7PFaL104TwNaHpjlWXAZbQiNQ==",
       "dev": true,
       "dependencies": {
         "chokidar": ">=3.0.0 <4.0.0",
@@ -6374,19 +6992,16 @@
       }
     },
     "node_modules/search-insights": {
-      "version": "2.13.0",
-      "resolved": "https://registry.npmjs.org/search-insights/-/search-insights-2.13.0.tgz",
-      "integrity": "sha512-Orrsjf9trHHxFRuo9/rzm0KIWmgzE8RMlZMzuhZOJ01Rnz3D0YBAe+V6473t6/H6c7irs6Lt48brULAiRWb3Vw==",
+      "version": "2.15.0",
+      "resolved": "https://registry.npmjs.org/search-insights/-/search-insights-2.15.0.tgz",
+      "integrity": "sha512-ch2sPCUDD4sbPQdknVl9ALSi9H7VyoeVbsxznYz6QV55jJ8CI3EtwpO1i84keN4+hF5IeHWIeGvc08530JkVXQ==",
       "dev": true,
       "peer": true
     },
     "node_modules/semver": {
-      "version": "7.6.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
-      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -6480,12 +7095,13 @@
       }
     },
     "node_modules/shiki": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/shiki/-/shiki-1.3.0.tgz",
-      "integrity": "sha512-9aNdQy/etMXctnPzsje1h1XIGm9YfRcSksKOGqZWXA/qP9G18/8fpz5Bjpma8bOgz3tqIpjERAd6/lLjFyzoww==",
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/shiki/-/shiki-1.12.0.tgz",
+      "integrity": "sha512-BuAxWOm5JhRcbSOl7XCei8wGjgJJonnV0oipUupPY58iULxUGyHhW5CF+9FRMuM1pcJ5cGEJGll1LusX6FwpPA==",
       "dev": true,
       "dependencies": {
-        "@shikijs/core": "1.3.0"
+        "@shikijs/core": "1.12.0",
+        "@types/hast": "^3.0.4"
       }
     },
     "node_modules/side-channel": {
@@ -6723,6 +7339,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/string.prototype.repeat": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/string.prototype.repeat/-/string.prototype.repeat-1.0.0.tgz",
+      "integrity": "sha512-0u/TldDbKD8bFCQ/4f5+mNRrXwZ8hg2w7ZR8wa16e8z9XpePWl3eGEcUD0OXpEH/VJH/2G3gjUtR3ZOiBe2S/w==",
+      "dependencies": {
+        "define-properties": "^1.1.3",
+        "es-abstract": "^1.17.5"
+      }
+    },
     "node_modules/string.prototype.trim": {
       "version": "1.2.9",
       "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz",
@@ -6799,6 +7424,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/superjson": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/superjson/-/superjson-2.2.1.tgz",
+      "integrity": "sha512-8iGv75BYOa0xRJHK5vRLEjE2H/i4lulTjzpUXic3Eg8akftYjkmQDa8JARQ42rlczXyFR3IeRoeFCc7RxHsYZA==",
+      "dev": true,
+      "dependencies": {
+        "copy-anything": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/supports-color": {
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -6838,9 +7475,9 @@
       }
     },
     "node_modules/terser": {
-      "version": "5.30.4",
-      "resolved": "https://registry.npmjs.org/terser/-/terser-5.30.4.tgz",
-      "integrity": "sha512-xRdd0v64a8mFK9bnsKVdoNP9GQIKUAaJPTaqEQDL4w/J8WaW4sWXXoMZ+6SimPkfT5bElreXf8m9HnmPc3E1BQ==",
+      "version": "5.31.3",
+      "resolved": "https://registry.npmjs.org/terser/-/terser-5.31.3.tgz",
+      "integrity": "sha512-pAfYn3NIZLyZpa83ZKigvj6Rn9c/vd5KfYGX7cN1mnzqgDcxWvrU5ZtAfIKhEXz9nRecw4z3LXkjaq96/qZqAA==",
       "peer": true,
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
@@ -6982,9 +7619,9 @@
       }
     },
     "node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==",
+      "version": "2.6.3",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz",
+      "integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ==",
       "dev": true
     },
     "node_modules/tty-browserify": {
@@ -7082,9 +7719,9 @@
       }
     },
     "node_modules/uglify-js": {
-      "version": "3.17.4",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.17.4.tgz",
-      "integrity": "sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==",
+      "version": "3.19.1",
+      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.19.1.tgz",
+      "integrity": "sha512-y/2wiW+ceTYR2TSSptAhfnEtpLaQ4Ups5zrjB2d3kuVxHj16j/QJwPl5PvuGy9uARb39J0+iKxcRPvtpsx4A4A==",
       "dev": true,
       "optional": true,
       "bin": {
@@ -7120,20 +7757,20 @@
       }
     },
     "node_modules/undici-types": {
-      "version": "5.26.5",
-      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
-      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
+      "version": "6.11.1",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.11.1.tgz",
+      "integrity": "sha512-mIDEX2ek50x0OlRgxryxsenE5XaQD4on5U2inY7RApK3SOJpofyw7uW2AyfMKkhAxXIceo2DeWGVGwyvng1GNQ==",
       "peer": true
     },
     "node_modules/unplugin": {
-      "version": "1.10.1",
-      "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.10.1.tgz",
-      "integrity": "sha512-d6Mhq8RJeGA8UfKCu54Um4lFA0eSaRa3XxdAJg8tIdxbu1ubW0hBCZUL7yI2uGyYCRndvbK8FLHzqy2XKfeMsg==",
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.12.0.tgz",
+      "integrity": "sha512-KeczzHl2sATPQUx1gzo+EnUkmN4VmGBYRRVOZSGvGITE9rGHRDGqft6ONceP3vgXcyJ2XjX5axG5jMWUwNCYLw==",
       "dependencies": {
-        "acorn": "^8.11.3",
+        "acorn": "^8.12.1",
         "chokidar": "^3.6.0",
         "webpack-sources": "^3.2.3",
-        "webpack-virtual-modules": "^0.6.1"
+        "webpack-virtual-modules": "^0.6.2"
       },
       "engines": {
         "node": ">=14.0.0"
@@ -7184,9 +7821,9 @@
       }
     },
     "node_modules/unplugin-vue-components/node_modules/minimatch": {
-      "version": "9.0.4",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz",
-      "integrity": "sha512-KqWh+VchfxcMNRAJjj2tnsSJdNbHsVgnkBhTNrW7AjVo6OvLtxw8zfT9oLw1JSohlFzJ8jCoTgaoXvJ+kHt6fw==",
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -7198,9 +7835,9 @@
       }
     },
     "node_modules/update-browserslist-db": {
-      "version": "1.0.13",
-      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz",
-      "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.0.tgz",
+      "integrity": "sha512-EdRAaAyk2cUE1wOf2DkEhzxqOQvFOoRJFNS6NeyJ01Gp2beMRpBAINjM2iDXE3KCuKhwnvHIQCJm6ThL2Z+HzQ==",
       "funding": [
         {
           "type": "opencollective",
@@ -7217,8 +7854,8 @@
       ],
       "peer": true,
       "dependencies": {
-        "escalade": "^3.1.1",
-        "picocolors": "^1.0.0"
+        "escalade": "^3.1.2",
+        "picocolors": "^1.0.1"
       },
       "bin": {
         "update-browserslist-db": "cli.js"
@@ -7236,13 +7873,16 @@
       }
     },
     "node_modules/url": {
-      "version": "0.11.3",
-      "resolved": "https://registry.npmjs.org/url/-/url-0.11.3.tgz",
-      "integrity": "sha512-6hxOLGfZASQK/cijlZnZJTq8OXAkt/3YGfQX45vvMYXpZoo8NdWZcY73K108Jf759lS1Bv/8wXnHDTSz17dSRw==",
+      "version": "0.11.4",
+      "resolved": "https://registry.npmjs.org/url/-/url-0.11.4.tgz",
+      "integrity": "sha512-oCwdVC7mTuWiPyjLUz/COz5TLk6wgp0RCsN+wHZ2Ekneac9w8uuV0njcbbie2ME+Vs+d6duwmYuR3HgQXs1fOg==",
       "dev": true,
       "dependencies": {
         "punycode": "^1.4.1",
-        "qs": "^6.11.2"
+        "qs": "^6.12.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/url-loader": {
@@ -7310,13 +7950,13 @@
       }
     },
     "node_modules/vite": {
-      "version": "5.2.10",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.2.10.tgz",
-      "integrity": "sha512-PAzgUZbP7msvQvqdSD+ErD5qGnSFiGOoWmV5yAKUEI0kdhjbH6nMWVyZQC/hSc4aXwc0oJ9aEdIiF9Oje0JFCw==",
+      "version": "5.3.5",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.5.tgz",
+      "integrity": "sha512-MdjglKR6AQXQb9JGiS7Rc2wC6uMjcm7Go/NHNO63EwiJXfuk9PgqiP/n5IDJCziMkfw9n4Ubp7lttNwz+8ZVKA==",
       "dev": true,
       "dependencies": {
-        "esbuild": "^0.20.1",
-        "postcss": "^8.4.38",
+        "esbuild": "^0.21.3",
+        "postcss": "^8.4.39",
         "rollup": "^4.13.0"
       },
       "bin": {
@@ -7381,26 +8021,27 @@
       }
     },
     "node_modules/vitepress": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/vitepress/-/vitepress-1.1.3.tgz",
-      "integrity": "sha512-hGrIYN0w9IHWs0NQSnlMjKV/v/HLfD+Ywv5QdvCSkiT32mpNOOwUrZjnqZv/JL/WBPpUc94eghTUvmipxw0xrA==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/vitepress/-/vitepress-1.3.1.tgz",
+      "integrity": "sha512-soZDpg2rRVJNIM/IYMNDPPr+zTHDA5RbLDHAxacRu+Q9iZ2GwSR0QSUlLs+aEZTkG0SOX1dc8RmUYwyuxK8dfQ==",
       "dev": true,
       "dependencies": {
         "@docsearch/css": "^3.6.0",
         "@docsearch/js": "^3.6.0",
-        "@shikijs/core": "^1.3.0",
-        "@shikijs/transformers": "^1.3.0",
-        "@types/markdown-it": "^14.0.1",
-        "@vitejs/plugin-vue": "^5.0.4",
-        "@vue/devtools-api": "^7.0.27",
-        "@vueuse/core": "^10.9.0",
-        "@vueuse/integrations": "^10.9.0",
+        "@shikijs/core": "^1.10.3",
+        "@shikijs/transformers": "^1.10.3",
+        "@types/markdown-it": "^14.1.1",
+        "@vitejs/plugin-vue": "^5.0.5",
+        "@vue/devtools-api": "^7.3.5",
+        "@vue/shared": "^3.4.31",
+        "@vueuse/core": "^10.11.0",
+        "@vueuse/integrations": "^10.11.0",
         "focus-trap": "^7.5.4",
         "mark.js": "8.11.1",
-        "minisearch": "^6.3.0",
-        "shiki": "^1.3.0",
-        "vite": "^5.2.9",
-        "vue": "^3.4.23"
+        "minisearch": "^7.0.0",
+        "shiki": "^1.10.3",
+        "vite": "^5.3.3",
+        "vue": "^3.4.31"
       },
       "bin": {
         "vitepress": "bin/vitepress.js"
@@ -7425,9 +8066,9 @@
       "dev": true
     },
     "node_modules/vitepress/node_modules/@vitejs/plugin-vue": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.0.4.tgz",
-      "integrity": "sha512-WS3hevEszI6CEVEx28F8RjTX97k3KsrcY6kvTg7+Whm5y3oYvcqzVeGCU3hxSAn4uY2CLCkeokkGKpoctccilQ==",
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.1.1.tgz",
+      "integrity": "sha512-sDckXxlHpMsjRQbAH9WanangrfrblsOd3pNifePs+FOHjJg1jfWq5L/P0PsBRndEt3nmdUnmvieP8ULDeX5AvA==",
       "dev": true,
       "engines": {
         "node": "^18.0.0 || >=20.0.0"
@@ -7438,33 +8079,33 @@
       }
     },
     "node_modules/vitepress/node_modules/@vue/devtools-api": {
-      "version": "7.0.27",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-7.0.27.tgz",
-      "integrity": "sha512-BFCFCusSDcw2UcOFD/QeK7OxD1x2C/m+uAN30Q7jLKECSW53hmz0urzJmX834GuWDZX/hIxkyUKnLLfEIP1c/w==",
+      "version": "7.3.7",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-7.3.7.tgz",
+      "integrity": "sha512-kvjQ6nmsqTp7SrmpwI2G0MgbC4ys0bPsgQirHXJM8y1m7siQ5RnWQUHJVfyUrHNguCySW1cevAdIw87zrPTl9g==",
       "dev": true,
       "dependencies": {
-        "@vue/devtools-kit": "^7.0.27"
+        "@vue/devtools-kit": "^7.3.7"
       }
     },
     "node_modules/vitepress/node_modules/@vueuse/core": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.9.0.tgz",
-      "integrity": "sha512-/1vjTol8SXnx6xewDEKfS0Ra//ncg4Hb0DaZiwKf7drgfMsKFExQ+FnnENcN6efPen+1kIzhLQoGSy0eDUVOMg==",
+      "version": "10.11.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.0.tgz",
+      "integrity": "sha512-x3sD4Mkm7PJ+pcq3HX8PLPBadXCAlSDR/waK87dz0gQE+qJnaaFhc/dZVfJz+IUYzTMVGum2QlR7ImiJQN4s6g==",
       "dev": true,
       "dependencies": {
         "@types/web-bluetooth": "^0.0.20",
-        "@vueuse/metadata": "10.9.0",
-        "@vueuse/shared": "10.9.0",
-        "vue-demi": ">=0.14.7"
+        "@vueuse/metadata": "10.11.0",
+        "@vueuse/shared": "10.11.0",
+        "vue-demi": ">=0.14.8"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/vitepress/node_modules/@vueuse/core/node_modules/vue-demi": {
-      "version": "0.14.7",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
-      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
       "dev": true,
       "hasInstallScript": true,
       "bin": {
@@ -7488,30 +8129,30 @@
       }
     },
     "node_modules/vitepress/node_modules/@vueuse/metadata": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.9.0.tgz",
-      "integrity": "sha512-iddNbg3yZM0X7qFY2sAotomgdHK7YJ6sKUvQqbvwnf7TmaVPxS4EJydcNsVejNdS8iWCtDk+fYXr7E32nyTnGA==",
+      "version": "10.11.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.0.tgz",
+      "integrity": "sha512-kQX7l6l8dVWNqlqyN3ePW3KmjCQO3ZMgXuBMddIu83CmucrsBfXlH+JoviYyRBws/yLTQO8g3Pbw+bdIoVm4oQ==",
       "dev": true,
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/vitepress/node_modules/@vueuse/shared": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.9.0.tgz",
-      "integrity": "sha512-Uud2IWncmAfJvRaFYzv5OHDli+FbOzxiVEQdLCKQKLyhz94PIyFC3CHcH7EDMwIn8NPtD06+PNbC/PiO0LGLtw==",
+      "version": "10.11.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.0.tgz",
+      "integrity": "sha512-fyNoIXEq3PfX1L3NkNhtVQUSRtqYwJtJg+Bp9rIzculIZWHTkKSysujrOk2J+NrRulLTQH9+3gGSfYLWSEWU1A==",
       "dev": true,
       "dependencies": {
-        "vue-demi": ">=0.14.7"
+        "vue-demi": ">=0.14.8"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/vitepress/node_modules/@vueuse/shared/node_modules/vue-demi": {
-      "version": "0.14.7",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
-      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
       "dev": true,
       "hasInstallScript": true,
       "bin": {
@@ -7534,6 +8175,12 @@
         }
       }
     },
+    "node_modules/vitepress/node_modules/minisearch": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/minisearch/-/minisearch-7.1.0.tgz",
+      "integrity": "sha512-tv7c/uefWdEhcu6hvrfTihflgeEi2tN6VV7HJnCjK6VxM75QQJh4t9FwJCsA2EsRS8LCnu3W87CuGPWMocOLCA==",
+      "dev": true
+    },
     "node_modules/vm-browserify": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
@@ -7541,15 +8188,15 @@
       "dev": true
     },
     "node_modules/vue": {
-      "version": "3.4.24",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.24.tgz",
-      "integrity": "sha512-NPdx7dLGyHmKHGRRU5bMRYVE+rechR+KDU5R2tSTNG36PuMwbfAJ+amEvOAw7BPfZp5sQulNELSLm5YUkau+Sg==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.34.tgz",
+      "integrity": "sha512-VZze05HWlA3ItreQ/ka7Sx7PoD0/3St8FEiSlSTVgb6l4hL+RjtP2/8g5WQBzZgyf8WG2f+g1bXzC7zggLhAJA==",
       "dependencies": {
-        "@vue/compiler-dom": "3.4.24",
-        "@vue/compiler-sfc": "3.4.24",
-        "@vue/runtime-dom": "3.4.24",
-        "@vue/server-renderer": "3.4.24",
-        "@vue/shared": "3.4.24"
+        "@vue/compiler-dom": "3.4.34",
+        "@vue/compiler-sfc": "3.4.34",
+        "@vue/runtime-dom": "3.4.34",
+        "@vue/server-renderer": "3.4.34",
+        "@vue/shared": "3.4.34"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -7561,9 +8208,9 @@
       }
     },
     "node_modules/vue-eslint-parser": {
-      "version": "9.4.2",
-      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.2.tgz",
-      "integrity": "sha512-Ry9oiGmCAK91HrKMtCrKFWmSFWvYkpGglCeFAIqDdr9zdXmMMpJOmUJS7WWsW7fX81h6mwHmUZCQQ1E0PkSwYQ==",
+      "version": "9.4.3",
+      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.3.tgz",
+      "integrity": "sha512-2rYRLWlIpaiN8xbPiDyXZXRgLGOtWxERV7ND5fFAv5qo1D2N9Fu9MNajBNc6o13lZ+24DAWCkQCvj4klgmcITg==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4",
@@ -7597,9 +8244,9 @@
       }
     },
     "node_modules/vue-router": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.3.2.tgz",
-      "integrity": "sha512-hKQJ1vDAZ5LVkKEnHhmm1f9pMiWIBNGF5AwU67PdH7TyXCj/a4hTccuUuYCAMgJK6rO/NVYtQIEN3yL8CECa7Q==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.4.0.tgz",
+      "integrity": "sha512-HB+t2p611aIZraV2aPSRNXf0Z/oLZFrlygJm+sZbdJaW6lcFqEDQwnzUBXn+DApw+/QzDU/I9TeWx9izEjTmsA==",
       "dependencies": {
         "@vue/devtools-api": "^6.5.1"
       },
@@ -7656,9 +8303,9 @@
       "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ=="
     },
     "node_modules/webpack": {
-      "version": "5.91.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.91.0.tgz",
-      "integrity": "sha512-rzVwlLeBWHJbmgTC/8TvAcu5vpJNII+MelQpylD4jNERPwpBJOE2lEcko1zJX3QJeLjTTAnQxn/OJ8bjDzVQaw==",
+      "version": "5.93.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.93.0.tgz",
+      "integrity": "sha512-Y0m5oEY1LRuwly578VqluorkXbvXKh7U3rLoQCEO04M97ScRr44afGVkI0FQFsXzysk5OgFAxjZAb9rsGQVihA==",
       "peer": true,
       "dependencies": {
         "@types/eslint-scope": "^3.7.3",
@@ -7667,10 +8314,10 @@
         "@webassemblyjs/wasm-edit": "^1.12.1",
         "@webassemblyjs/wasm-parser": "^1.12.1",
         "acorn": "^8.7.1",
-        "acorn-import-assertions": "^1.9.0",
+        "acorn-import-attributes": "^1.9.5",
         "browserslist": "^4.21.10",
         "chrome-trace-event": "^1.0.2",
-        "enhanced-resolve": "^5.16.0",
+        "enhanced-resolve": "^5.17.0",
         "es-module-lexer": "^1.2.1",
         "eslint-scope": "5.1.1",
         "events": "^3.2.0",
@@ -7717,9 +8364,9 @@
       }
     },
     "node_modules/webpack-virtual-modules": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/webpack-virtual-modules/-/webpack-virtual-modules-0.6.1.tgz",
-      "integrity": "sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg=="
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/webpack-virtual-modules/-/webpack-virtual-modules-0.6.2.tgz",
+      "integrity": "sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ=="
     },
     "node_modules/webpack/node_modules/eslint-scope": {
       "version": "5.1.1",
@@ -7787,12 +8434,12 @@
       }
     },
     "node_modules/which-builtin-type": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.1.3.tgz",
-      "integrity": "sha512-YmjsSMDBYsM1CaFiayOVT06+KJeXf0o5M/CAd4o1lTadFAtacTUM49zoYxr/oroopFDfhvN6iEcBxUyc3gvKmw==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.1.4.tgz",
+      "integrity": "sha512-bppkmBSsHFmIMSl8BO9TbsyzsvGjVoppt8xUiGzwiu/bhDCGxnpOKCxgqj6GuyHE0mINMDecBFPlOm2hzY084w==",
       "dependencies": {
-        "function.prototype.name": "^1.1.5",
-        "has-tostringtag": "^1.0.0",
+        "function.prototype.name": "^1.1.6",
+        "has-tostringtag": "^1.0.2",
         "is-async-function": "^2.0.0",
         "is-date-object": "^1.0.5",
         "is-finalizationregistry": "^1.0.2",
@@ -7801,8 +8448,8 @@
         "is-weakref": "^1.0.2",
         "isarray": "^2.0.5",
         "which-boxed-primitive": "^1.0.2",
-        "which-collection": "^1.0.1",
-        "which-typed-array": "^1.1.9"
+        "which-collection": "^1.0.2",
+        "which-typed-array": "^1.1.15"
       },
       "engines": {
         "node": ">= 0.4"
@@ -7846,6 +8493,14 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/word-wrap": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/wordwrap": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
diff --git a/package.json b/package.json
index 4c14787..ca2e3e5 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "*.js"
   ],
   "dependencies": {
-    "@abi-software/map-utilities": "^1.0.0",
+    "@abi-software/map-utilities": "^1.0.0-beta.1",
     "@abi-software/sparc-annotation": "^0.3.1",
     "@abi-software/svg-sprite": "^1.0.0",
     "@element-plus/icons-vue": "^2.3.1",

From a284af0b3223ae204d4dd325ad63467c76a52d47 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Wed, 31 Jul 2024 14:35:06 +1200
Subject: [PATCH 05/32] Some scicrunch mixin updates

---
 src/App.vue                     |   4 +-
 src/components/ScaffoldVuer.vue |  27 ++++-
 src/mixins/imageMixin.js        |  84 ---------------
 src/services/scicrunchMixin.js  | 177 ++++++++++++++++++++++++--------
 4 files changed, 159 insertions(+), 133 deletions(-)
 delete mode 100644 src/mixins/imageMixin.js

diff --git a/src/App.vue b/src/App.vue
index e333a0a..c7e0de4 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -28,6 +28,7 @@
         :format="format"
         :marker-labels="markerLabels"
         :enableLocalAnnotations="false"
+        :rootURL="rootURL"
         :sparcAPI="sparcAPI"
         @open-map="openMap"
         @on-ready="onReady"
@@ -408,7 +409,8 @@ export default {
       ElIconSetting: shallowRef(ElIconSetting),
       ElIconFolderOpened: shallowRef(ElIconFolderOpened),
       auto: NaN,
-      sparcAPI: "http://localhost:8000"
+      rootURL: "http://localhost:3000/",
+      sparcAPI: "http://localhost:8000/"
     };
   },
   watch: {
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 553bcfd..e1bdb6c 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -423,7 +423,6 @@ import { SearchIndex } from "../scripts/Search.js";
 import { mapState } from 'pinia';
 import { useMainStore } from "@/store/index";
 import scicrunchMixin from '../services/scicrunchMixin.js'
-import imageMixin from '../mixins/imageMixin.js'
 
 /**
  * A vue component of the scaffold viewer.
@@ -433,7 +432,7 @@ import imageMixin from '../mixins/imageMixin.js'
  */
 export default {
   name: "ScaffoldVuer",
-  mixins: [scicrunchMixin,imageMixin],
+  mixins: [scicrunchMixin],
   components: {
     Button,
     Col,
@@ -681,6 +680,13 @@ export default {
       type: Boolean,
       default: false
     },
+    /**
+     * Specify the root url of the SPARC portal.
+     */
+    rootURL: {
+      type: String,
+      default: 'https://sparc.science/',
+    },
     /**
      * Specify the endpoint of the SPARC API.
      */
@@ -2330,7 +2336,22 @@ export default {
       let response = await this.getImagesFromScicrunch()
       if (response && response.success) {
         this.images = response.images
-        this.regionImages = this.assignImagesToRegions(this.images)
+        let imageObjects = {}
+        this.images.forEach((image) => {
+          if (image.value && image.value.length > 0) {
+            image.value.forEach((image) => {
+              if (image.anatomy && image.anatomy.length > 0) {
+                image.anatomy.forEach((anatomy) => {
+                  if (!(anatomy.name in imageObjects)) {
+                    imageObjects[anatomy.name] = []
+                  }
+                  imageObjects[anatomy.name].push(image)
+                })
+              }
+            })
+          }
+        });
+        this.regionImages = imageObjects
       }
     }
   },
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
deleted file mode 100644
index 3b899a7..0000000
--- a/src/mixins/imageMixin.js
+++ /dev/null
@@ -1,84 +0,0 @@
-export default {
-  // Note that the setting store is included in MapContent.vue
-  methods: {
-    populateWithImages: function (mapImp, images = []) {
-      let anatomyList = []
-      console.log('images in populate', images)
-      images.forEach((image) => {
-        if (image.value && image.value.length > 0)
-          image.value.forEach((image) => {
-            if (image.anatomy && image.anatomy.length > 0) {
-              image.anatomy.forEach((anatomy) => {
-                if (!anatomyList.includes(anatomy.curie)) {
-                  anatomyList.push(anatomy.curie)
-                  this.createImageThumbnailMarkerUrl(mapImp, anatomy.curie, image.thumbnail)
-                }
-              })
-            }
-          })
-      })
-    },
-    findImagesForAnatomy: function (images = [], anatomyToFind) {
-      let imageList = []
-      images.forEach((image) => {
-        if (image.value && image.value.length > 0)
-          image.value.forEach((image) => {
-            if (image.anatomy && image.anatomy.length > 0) {
-              image.anatomy.forEach((anatomy) => {
-                if (anatomy.curie === anatomyToFind) {
-                  imageList.push(image)
-                }
-              })
-            }
-          })
-      })
-      return imageList
-    },
-    assignImagesToRegions: function (images) {
-      let imageObjects = {}
-      images.forEach((image) => {
-        if (image.value && image.value.length > 0) {
-          image.value.forEach((image) => {
-            if (image.anatomy && image.anatomy.length > 0) {
-              image.anatomy.forEach((anatomy) => {
-                if (!(anatomy.name in imageObjects)) {
-                  imageObjects[anatomy.name] = []
-                }
-                imageObjects[anatomy.name].push(image)
-              })
-            }
-          })
-        }
-      });
-      return imageObjects
-    },
-    createImageThumbnailMarkerUrl: function (mapImp, id, image) {
-      return new Promise((resolve, reject) => {
-        // create the image element
-        let wrapperElement = document.createElement("div");
-
-        // download image:
-        let img = new Image();
-        img.src = image;
-        img.style = "height: auto;width: 50px;margin-right: 80px;"
-        img.onload = function () {
-          wrapperElement.appendChild(img);
-
-          // add it to the flatmap
-          const markerIdentifier = mapImp.addMarker(id, {
-            element: wrapperElement,
-            className: "highlight-marker",
-            cluster: false,
-            type: "image",
-          });
-
-          resolve(markerIdentifier);
-        };
-
-        img.onerror = function () {
-          reject(new Error("Failed to load image at " + image));
-        };
-      });
-    },
-  }
-}
diff --git a/src/services/scicrunchMixin.js b/src/services/scicrunchMixin.js
index 57ff334..9aef575 100644
--- a/src/services/scicrunchMixin.js
+++ b/src/services/scicrunchMixin.js
@@ -1,48 +1,108 @@
 /* eslint-disable no-alert, no-console */
 const imageQuery = '"*jp2* OR *vnd.ome.xml* OR *jpx*"';
 
-const generateShareLink = (datasetId, datasetVersion, filePath) => {
-  const prefix = 'https://sparc.biolucida.net';
-  return `${prefix}/dataviewer?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}`;
-}
+const getView2DImageLink = (rootURL, datasetId, datasetVersion, filePath) => {
+  return `${rootURL}datasets/file/${datasetId}/${datasetVersion}?path=files/${filePath}`;
+};
+
+const getView3DImageLink = (
+  rootURL,
+  datasetId,
+  datasetVersion,
+  dataset_image
+) => {
+  const viewEncoding = dataset_image.share_link.replace(
+    "https://sparc.biolucida.net/image?c=",
+    ""
+  );
+  return (
+    rootURL +
+    "datasets/biolucidaviewer/" +
+    dataset_image.image_id +
+    "?view=" +
+    viewEncoding +
+    "&dataset_version=" +
+    datasetVersion +
+    "&dataset_id=" +
+    datasetId +
+    "&item_id=" +
+    dataset_image.sourcepkg_id
+  );
+};
 
 const getBiolucidaInfo = async function (sparcAPI, datasetId) {
   return new Promise((resolve, reject) => {
-    const endpoint = `${sparcAPI}/image_search/${datasetId}`
+    const endpoint = `${sparcAPI}image_search/${datasetId}`;
     fetch(endpoint)
       .then((response) => response.json())
       .then((data) => {
-        if (data.status == 'success') resolve(data);
-        else reject(data.reason);
-      })
-  })
-}
+        if (data.status == "success") {
+          let imageObjects = {};
+          data.dataset_images.forEach((image) => {
+            if (!(image.image_id in imageObjects)) {
+              imageObjects[image.image_id] = image;
+            }
+          });
+          resolve(imageObjects);
+        } else {
+          reject(data.reason);
+        }
+      });
+  });
+};
+
+const getAnnotatedBiolucida = function (data) {
+  let annBiolucida = [];
+  let ann2DBiolucida = [];
+  if ("biolucida-2d" in data) {
+    annBiolucida = [...annBiolucida, ...data["biolucida-2d"]];
+    ann2DBiolucida = [...annBiolucida, ...data["biolucida-2d"]];
+  }
+  if ("biolucida-3d" in data) {
+    annBiolucida = [...annBiolucida, ...data["biolucida-3d"]];
+  }
+  annBiolucida = annBiolucida.filter((biolucida) => biolucida.biolucida);
+  ann2DBiolucida = ann2DBiolucida.filter((biolucida) => biolucida.biolucida);
+  ann2DBiolucida.map((biolucida) => {
+    biolucida.biolucida.identifier;
+  });
+  return { annBiolucida, ann2DBiolucida };
+};
 
 export default {
   // Note that the setting store is included in MapContent.vue
   methods: {
     getThumbnailURL: function (thumbnailId) {
-      console.log('thumbnail url', `${this.sparcAPI}/thumbnail/${thumbnailId}`)
-      return `${this.sparcAPI}/thumbnail/${thumbnailId}`
+      return `${this.sparcAPI}thumbnail/${thumbnailId}`;
     },
 
-    getSegmentationThumbnailURL: function (datasetId, datasetVersion, filePath, s3uri) {
-      console.log('thumbnail url', `${this.sparcAPI}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}&s3uri=${s3uri}`)
-      return `${this.sparcAPI}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}&s3uri=${s3uri}`;
+    getSegmentationThumbnailURL: function (
+      datasetId,
+      datasetVersion,
+      filePath,
+      s3uri
+    ) {
+      return `${this.sparcAPI}thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}&s3uri=${s3uri}`;
     },
 
     getImagesFromScicrunch: async function () {
       try {
-        const response = await fetch(`${this.sparcAPI}/multiple_dataset_info/using_multiple_mimetype/?${new URLSearchParams({ q: imageQuery })}`);
+        const response = await fetch(
+          `${
+            this.sparcAPI
+          }multiple_dataset_info/using_multiple_mimetype/?${new URLSearchParams(
+            { q: imageQuery }
+          )}`
+        );
         const data = await response.json();
-        console.log('number of hits:', data.numberOfHits);
+        console.log("number of hits:", data.numberOfHits);
         if (data.numberOfHits >= 1) {
           let images = await this.processResults(data.results);
           return { success: true, images: images };
         }
         return { success: false };
       } catch (error) {
-        console.error('Error:', error);
+        console.error("Error:", error);
         return { success: false };
       }
     },
@@ -50,40 +110,67 @@ export default {
     processResults: async function (results) {
       try {
         let images = [];
-        const dataType = 'segmentation';
-        console.log('starting promise list')
+        const dataType = "Image";
+        console.log("starting promise list");
         let promiseList = results.map(async (result, i) => {
           const datasetId = result.dataset_identifier;
           const datasetVersion = result.dataset_version;
-          const s3uri = result.s3uri;
-          const biolucidaInfo = await getBiolucidaInfo(this.sparcAPI, datasetId);
-          return biolucidaInfo.dataset_images.map(bioImage => {
-            return {
-              resource: {
-                share_link: bioImage.share_link,
-              },
-              title: 'Image',
-              anatomy: result.organs,
-              species: result.organisms,
-              datasetId: datasetId,
-              datasetVersion: datasetVersion,
-              link: bioImage.share_link,
-              s3uri: s3uri,
-              type: dataType,
-              thumbnail: bioImage.thumbnail_url,
-            };
-          });
+          const biolucidaInfo = await getBiolucidaInfo(
+            this.sparcAPI,
+            datasetId
+          );
+          const imageIds = Object.values(biolucidaInfo).map(
+            (image) => image.image_id
+          );
+          const { annBiolucida, ann2DBiolucida } =
+            getAnnotatedBiolucida(result);
+          return annBiolucida
+            .filter((bioImage) =>
+              imageIds.includes(bioImage.biolucida.identifier)
+            )
+            .map((bioImage) => {
+              const datasetImage = biolucidaInfo[bioImage.biolucida.identifier];
+              const link = ann2DBiolucida.includes(
+                bioImage.biolucida.identifier
+              )
+                ? getView2DImageLink(
+                    this.rootURL,
+                    datasetId,
+                    datasetVersion,
+                    bioImage.dataset.path
+                  )
+                : getView3DImageLink(
+                    this.rootURL,
+                    datasetId,
+                    datasetVersion,
+                    datasetImage
+                  );
+              return {
+                resource: {
+                  share_link: datasetImage.share_link,
+                },
+                title: bioImage.name,
+                anatomy: result.organs,
+                species: result.organisms,
+                datasetId: datasetId,
+                datasetVersion: datasetVersion,
+                link: link,
+                s3uri: result.s3uri,
+                type: dataType,
+                thumbnail: datasetImage.thumbnail_url,
+              };
+            });
         });
-        console.log('promiseList:', promiseList);
+        console.log("promiseList:", promiseList);
         let biolucidaInfos = await Promise.allSettled(promiseList);
         images = biolucidaInfos.flat();
-        console.log('biolucidaInfos:', biolucidaInfos);
-        console.log('finished!')
+        console.log("biolucidaInfos:", biolucidaInfos);
+        console.log("finished!");
         return images;
       } catch (error) {
-        console.error('Error:', error);
+        console.error("Error:", error);
         return [];
       }
-    }
-  }
-}
+    },
+  },
+};

From e59c03ac78f328ce0b84cd12c436b5c862c85f4d Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Fri, 2 Aug 2024 16:28:49 +1200
Subject: [PATCH 06/32] Update to use same mixin as flatmap

---
 src/components/ScaffoldTooltip.vue |   6 +-
 src/components/ScaffoldVuer.vue    |  28 +---
 src/services/imageMixin.js         | 213 +++++++++++++++++++++++++++++
 src/services/scicrunchMixin.js     | 176 ------------------------
 4 files changed, 222 insertions(+), 201 deletions(-)
 create mode 100644 src/services/imageMixin.js
 delete mode 100644 src/services/scicrunchMixin.js

diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 02d9dd0..688839f 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -125,7 +125,7 @@ export default {
       type: Number,
       default: 200,
     },
-    regionImages: {
+    anatomyImages: {
       type: Object,
       default: {},
     },
@@ -153,8 +153,8 @@ export default {
       return { left: x + "px", top: this.y - yOffset + "px" };
     },
     imageEntry: function () {
-      if (this.label in this.regionImages) {
-        return this.regionImages[this.label];
+      if (this.label in this.anatomyImages) {
+        return this.anatomyImages[this.label];
       }
       return [];
     },
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index e1bdb6c..d38373d 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -15,7 +15,7 @@
       :x="tData.x"
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
-      :regionImages="viewingMode === 'Exploration' ? regionImages : {}"
+      :anatomyImages="viewingMode === 'Exploration' ? anatomyImages : {}"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
@@ -422,7 +422,7 @@ import { OrgansViewer } from "../scripts/OrgansRenderer.js";
 import { SearchIndex } from "../scripts/Search.js";
 import { mapState } from 'pinia';
 import { useMainStore } from "@/store/index";
-import scicrunchMixin from '../services/scicrunchMixin.js'
+import imageMixin from '../services/imageMixin.js'
 
 /**
  * A vue component of the scaffold viewer.
@@ -432,7 +432,7 @@ import scicrunchMixin from '../services/scicrunchMixin.js'
  */
 export default {
   name: "ScaffoldVuer",
-  mixins: [scicrunchMixin],
+  mixins: [imageMixin],
   components: {
     Button,
     Col,
@@ -814,7 +814,7 @@ export default {
         size:[1, 1, 1],
       },
       images: [],
-      regionImages: {},
+      anatomyImages: {},
     };
   },
   watch: {
@@ -2333,25 +2333,9 @@ export default {
      * Get the images from Scicrunch and add them to the map.
      */
     addImagesToMap: async function () {
-      let response = await this.getImagesFromScicrunch()
+      let response = await this.getImageDatasetFromScicrunch()
       if (response && response.success) {
-        this.images = response.images
-        let imageObjects = {}
-        this.images.forEach((image) => {
-          if (image.value && image.value.length > 0) {
-            image.value.forEach((image) => {
-              if (image.anatomy && image.anatomy.length > 0) {
-                image.anatomy.forEach((anatomy) => {
-                  if (!(anatomy.name in imageObjects)) {
-                    imageObjects[anatomy.name] = []
-                  }
-                  imageObjects[anatomy.name].push(image)
-                })
-              }
-            })
-          }
-        });
-        this.regionImages = imageObjects
+        this.anatomyImages = this.populateViewerWithImages(response.datasets)
       }
     }
   },
diff --git a/src/services/imageMixin.js b/src/services/imageMixin.js
new file mode 100644
index 0000000..89faf1a
--- /dev/null
+++ b/src/services/imageMixin.js
@@ -0,0 +1,213 @@
+const imageQuery = '"*jp2* OR *vnd.ome.xml* OR *jpx*"';
+
+const getView2DImageLink = (rootURL, datasetId, datasetVersion, filePath) => {
+  return `${rootURL}datasets/file/${datasetId}/${datasetVersion}?path=files/${filePath}`;
+};
+
+const getView3DImageLink = (
+  rootURL,
+  datasetId,
+  datasetVersion,
+  dataset_image
+) => {
+  const viewEncoding = dataset_image.share_link.replace(
+    "https://sparc.biolucida.net/image?c=",
+    ""
+  );
+  return (
+    rootURL +
+    "datasets/biolucidaviewer/" +
+    dataset_image.image_id +
+    "?view=" +
+    viewEncoding +
+    "&dataset_version=" +
+    datasetVersion +
+    "&dataset_id=" +
+    datasetId +
+    "&item_id=" +
+    dataset_image.sourcepkg_id
+  );
+};
+
+const getBiolucidaInfo = async function (sparcAPI, datasetId) {
+  return new Promise((resolve, reject) => {
+    const endpoint = `${sparcAPI}image_search/${datasetId}`;
+    fetch(endpoint)
+      .then((response) => response.json())
+      .then((data) => {
+        if (data.status == "success") {
+          let imageObjects = {};
+          data.dataset_images.forEach((image) => {
+            if (!(image.image_id in imageObjects)) {
+              imageObjects[image.image_id] = image;
+            }
+          });
+          resolve(imageObjects);
+        } else {
+          reject(data.reason);
+        }
+      });
+  });
+};
+
+const getAnnotatedBiolucida = function (data) {
+  let bioList = [];
+  let bio2DIds = [];
+  if ("biolucida-2d" in data) {
+    const bio2DLength = data["biolucida-2d"].length;
+    for (let i = 0; i < bio2DLength; i++) {
+      const biolucida = data["biolucida-2d"][i];
+      if (biolucida.biolucida) {
+        bioList.push(biolucida);
+        bio2DIds.push(biolucida.biolucida.identifier);
+      }
+    }
+  }
+  if ("biolucida-3d" in data) {
+    const bio3DLength = data["biolucida-3d"].length;
+    for (let i = 0; i < bio3DLength; i++) {
+      const biolucida = data["biolucida-3d"][i];
+      if (biolucida.biolucida) {
+        bioList.push(biolucida);
+      }
+    }
+  }
+  return { bioList, bio2DIds };
+};
+
+export default {
+  // Note that the setting store is included in MapContent.vue
+  methods: {
+    createThumbnailMarkers: function (mapImp, id, image) {
+      return new Promise((resolve, reject) => {
+        let wrapperElement = document.createElement("div");
+        let img = new Image();
+        img.src = image;
+        img.style = "height: auto;width: 50px;margin-right: 80px;";
+        img.onload = function () {
+          wrapperElement.appendChild(img);
+          const markerIdentifier = mapImp.addMarker(id, {
+            element: wrapperElement,
+            className: "highlight-marker",
+            cluster: false,
+            type: "image",
+          });
+          resolve(markerIdentifier);
+        };
+        img.onerror = function () {
+          reject(new Error("Failed to load image at " + image));
+        };
+      });
+    },
+
+    populateViewerWithImages: function (datasets, mapImp = undefined) {
+      let anatomyImageObjects = {};
+      const datasetsLength = datasets.length;
+      for (let i = 0; i < datasetsLength; i++) {
+        const dataset = datasets[i];
+        if (dataset.value && dataset.value.length) {
+          const imagesLength = dataset.value.length;
+          for (let j = 0; j < imagesLength; j++) {
+            const image = dataset.value[j];
+            if (image.anatomy && image.anatomy.length) {
+              const anatomyLength = image.anatomy.length;
+              for (let k = 0; k < anatomyLength; k++) {
+                const anatomy = image.anatomy[k];
+                const locationIdentifier = mapImp
+                  ? anatomy.curie
+                  : anatomy.name;
+                if (!(locationIdentifier in anatomyImageObjects)) {
+                  anatomyImageObjects[locationIdentifier] = [];
+                  if (mapImp) {
+                    this.createThumbnailMarkers(
+                      mapImp,
+                      locationIdentifier,
+                      image.thumbnail
+                    );
+                  }
+                }
+                anatomyImageObjects[locationIdentifier].push(image);
+              }
+            }
+          }
+        }
+      }
+      return anatomyImageObjects;
+    },
+
+    processResults: async function (results) {
+      try {
+        let datasets = [];
+        const dataType = "Image";
+        console.log("starting promise list");
+        let promiseList = results.map(async (result) => {
+          const datasetId = result.dataset_identifier;
+          const datasetVersion = result.dataset_version;
+          const biolucidaInfo = await getBiolucidaInfo(
+            this.sparcAPI,
+            datasetId
+          );
+          const imageIds = Object.values(biolucidaInfo).map(
+            (image) => image.image_id
+          );
+          const { bioList, bio2DIds } = getAnnotatedBiolucida(result);
+          return bioList
+            .filter((bioImage) =>
+              imageIds.includes(bioImage.biolucida.identifier)
+            )
+            .map((bioImage) => {
+              const datasetImage = biolucidaInfo[bioImage.biolucida.identifier];
+              const link = bio2DIds.includes(bioImage.biolucida.identifier)
+                ? getView2DImageLink(
+                    this.rootURL,
+                    datasetId,
+                    datasetVersion,
+                    bioImage.dataset.path
+                  )
+                : getView3DImageLink(
+                    this.rootURL,
+                    datasetId,
+                    datasetVersion,
+                    datasetImage
+                  );
+              return {
+                title: bioImage.name,
+                anatomy: result.organs,
+                species: result.organisms,
+                datasetId: datasetId,
+                datasetVersion: datasetVersion,
+                link: link,
+                type: dataType,
+                thumbnail: datasetImage.thumbnail_url,
+              };
+            });
+        });
+        console.log("promiseList:", promiseList);
+        let promiseResult = await Promise.allSettled(promiseList);
+        datasets = promiseResult.flat();
+        console.log("promiseResult:", promiseResult);
+        return datasets;
+      } catch (error) {
+        console.error("Error:", error);
+        return [];
+      }
+    },
+
+    getImageDatasetFromScicrunch: async function () {
+      const endpoint =
+        `${this.sparcAPI}multiple_dataset_info/using_multiple_mimetype/?` +
+        `${new URLSearchParams({ q: imageQuery })}`;
+      try {
+        const response = await fetch(endpoint);
+        const data = await response.json();
+        if (data.numberOfHits >= 1) {
+          let datasets = await this.processResults(data.results);
+          return { success: true, datasets: datasets };
+        }
+        return { success: false, error: "No datasets found" };
+      } catch (error) {
+        return { success: false, error: error };
+      }
+    },
+  },
+};
diff --git a/src/services/scicrunchMixin.js b/src/services/scicrunchMixin.js
deleted file mode 100644
index 9aef575..0000000
--- a/src/services/scicrunchMixin.js
+++ /dev/null
@@ -1,176 +0,0 @@
-/* eslint-disable no-alert, no-console */
-const imageQuery = '"*jp2* OR *vnd.ome.xml* OR *jpx*"';
-
-const getView2DImageLink = (rootURL, datasetId, datasetVersion, filePath) => {
-  return `${rootURL}datasets/file/${datasetId}/${datasetVersion}?path=files/${filePath}`;
-};
-
-const getView3DImageLink = (
-  rootURL,
-  datasetId,
-  datasetVersion,
-  dataset_image
-) => {
-  const viewEncoding = dataset_image.share_link.replace(
-    "https://sparc.biolucida.net/image?c=",
-    ""
-  );
-  return (
-    rootURL +
-    "datasets/biolucidaviewer/" +
-    dataset_image.image_id +
-    "?view=" +
-    viewEncoding +
-    "&dataset_version=" +
-    datasetVersion +
-    "&dataset_id=" +
-    datasetId +
-    "&item_id=" +
-    dataset_image.sourcepkg_id
-  );
-};
-
-const getBiolucidaInfo = async function (sparcAPI, datasetId) {
-  return new Promise((resolve, reject) => {
-    const endpoint = `${sparcAPI}image_search/${datasetId}`;
-    fetch(endpoint)
-      .then((response) => response.json())
-      .then((data) => {
-        if (data.status == "success") {
-          let imageObjects = {};
-          data.dataset_images.forEach((image) => {
-            if (!(image.image_id in imageObjects)) {
-              imageObjects[image.image_id] = image;
-            }
-          });
-          resolve(imageObjects);
-        } else {
-          reject(data.reason);
-        }
-      });
-  });
-};
-
-const getAnnotatedBiolucida = function (data) {
-  let annBiolucida = [];
-  let ann2DBiolucida = [];
-  if ("biolucida-2d" in data) {
-    annBiolucida = [...annBiolucida, ...data["biolucida-2d"]];
-    ann2DBiolucida = [...annBiolucida, ...data["biolucida-2d"]];
-  }
-  if ("biolucida-3d" in data) {
-    annBiolucida = [...annBiolucida, ...data["biolucida-3d"]];
-  }
-  annBiolucida = annBiolucida.filter((biolucida) => biolucida.biolucida);
-  ann2DBiolucida = ann2DBiolucida.filter((biolucida) => biolucida.biolucida);
-  ann2DBiolucida.map((biolucida) => {
-    biolucida.biolucida.identifier;
-  });
-  return { annBiolucida, ann2DBiolucida };
-};
-
-export default {
-  // Note that the setting store is included in MapContent.vue
-  methods: {
-    getThumbnailURL: function (thumbnailId) {
-      return `${this.sparcAPI}thumbnail/${thumbnailId}`;
-    },
-
-    getSegmentationThumbnailURL: function (
-      datasetId,
-      datasetVersion,
-      filePath,
-      s3uri
-    ) {
-      return `${this.sparcAPI}thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}&s3uri=${s3uri}`;
-    },
-
-    getImagesFromScicrunch: async function () {
-      try {
-        const response = await fetch(
-          `${
-            this.sparcAPI
-          }multiple_dataset_info/using_multiple_mimetype/?${new URLSearchParams(
-            { q: imageQuery }
-          )}`
-        );
-        const data = await response.json();
-        console.log("number of hits:", data.numberOfHits);
-        if (data.numberOfHits >= 1) {
-          let images = await this.processResults(data.results);
-          return { success: true, images: images };
-        }
-        return { success: false };
-      } catch (error) {
-        console.error("Error:", error);
-        return { success: false };
-      }
-    },
-
-    processResults: async function (results) {
-      try {
-        let images = [];
-        const dataType = "Image";
-        console.log("starting promise list");
-        let promiseList = results.map(async (result, i) => {
-          const datasetId = result.dataset_identifier;
-          const datasetVersion = result.dataset_version;
-          const biolucidaInfo = await getBiolucidaInfo(
-            this.sparcAPI,
-            datasetId
-          );
-          const imageIds = Object.values(biolucidaInfo).map(
-            (image) => image.image_id
-          );
-          const { annBiolucida, ann2DBiolucida } =
-            getAnnotatedBiolucida(result);
-          return annBiolucida
-            .filter((bioImage) =>
-              imageIds.includes(bioImage.biolucida.identifier)
-            )
-            .map((bioImage) => {
-              const datasetImage = biolucidaInfo[bioImage.biolucida.identifier];
-              const link = ann2DBiolucida.includes(
-                bioImage.biolucida.identifier
-              )
-                ? getView2DImageLink(
-                    this.rootURL,
-                    datasetId,
-                    datasetVersion,
-                    bioImage.dataset.path
-                  )
-                : getView3DImageLink(
-                    this.rootURL,
-                    datasetId,
-                    datasetVersion,
-                    datasetImage
-                  );
-              return {
-                resource: {
-                  share_link: datasetImage.share_link,
-                },
-                title: bioImage.name,
-                anatomy: result.organs,
-                species: result.organisms,
-                datasetId: datasetId,
-                datasetVersion: datasetVersion,
-                link: link,
-                s3uri: result.s3uri,
-                type: dataType,
-                thumbnail: datasetImage.thumbnail_url,
-              };
-            });
-        });
-        console.log("promiseList:", promiseList);
-        let biolucidaInfos = await Promise.allSettled(promiseList);
-        images = biolucidaInfos.flat();
-        console.log("biolucidaInfos:", biolucidaInfos);
-        console.log("finished!");
-        return images;
-      } catch (error) {
-        console.error("Error:", error);
-        return [];
-      }
-    },
-  },
-};

From bc53ec43b04716ded05de8a0ce4061833d41be23 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Mon, 12 Aug 2024 12:39:33 +1200
Subject: [PATCH 07/32] Option to replace markers with images

---
 package-lock.json               |  8 ++++----
 package.json                    |  2 +-
 src/App.vue                     | 21 +++++++++++++++++++--
 src/components/ScaffoldVuer.vue |  9 +++++++--
 src/services/imageMixin.js      |  4 ++--
 5 files changed, 33 insertions(+), 11 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 8154f30..9c053c1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,7 +23,7 @@
         "vue": "^3.4.15",
         "vue-router": "^4.2.5",
         "vue3-component-svg-sprite": "^0.0.1",
-        "zincjs": "^1.10.3"
+        "zincjs": "^1.11.1"
       },
       "devDependencies": {
         "@vitejs/plugin-vue": "^4.6.2",
@@ -8641,9 +8641,9 @@
       }
     },
     "node_modules/zincjs": {
-      "version": "1.10.3",
-      "resolved": "https://registry.npmjs.org/zincjs/-/zincjs-1.10.3.tgz",
-      "integrity": "sha512-GAQetO7Xuhvp8pyosBNY4V/FFsreRLF055ICs/fZ6lnp+/ZlNTcoQipLrxgXzC++SHq3jaNs9Ya8Zo4vpuDhBA==",
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/zincjs/-/zincjs-1.11.1.tgz",
+      "integrity": "sha512-q9u/9dXhRca1WRIJFkLSw1thmrVnWe9C9+7gxorpqCVNVcdudGdCgAgKxdj2CDodsHAoVgSkhIi82vguphdz9A==",
       "dependencies": {
         "css-element-queries": "^1.2.2",
         "lodash": "^4.17.19",
diff --git a/package.json b/package.json
index ca2e3e5..6f64b68 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "vue": "^3.4.15",
     "vue-router": "^4.2.5",
     "vue3-component-svg-sprite": "^0.0.1",
-    "zincjs": "^1.10.3"
+    "zincjs": "^1.11.1"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^4.6.2",
diff --git a/src/App.vue b/src/App.vue
index c7e0de4..1eb4344 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -38,6 +38,7 @@
         @timeChanged="updateCurrentTime"
         @zinc-object-added="objectAdded"
         @vue:mounted="viewerMounted"
+        @images-loaded="imagesLoaded"
       />
     </drop-zone>
 
@@ -79,6 +80,10 @@
             <el-switch v-model="markerCluster" active-text="Marker Cluster" active-icon-class="el-icon-location"
               active-color="#8300bf" />
           </el-col>
+          <el-col :span="auto">
+            <el-switch v-show="Object.keys(images).length > 0" v-model="markerCluster" active-text="Marker Images" active-icon-class="el-icon-location"
+              active-color="#8300bf" />
+          </el-col>
           <el-col :span="auto">
             <el-switch v-model="displayMinimap" active-text="Minimap" active-icon-class="el-icon-discover"
               active-color="#8300bf" />
@@ -360,7 +365,7 @@ export default {
   },
   data: function () {
     return {
-      consoleOn: true,
+      consoleOn: false,
       createLinesWithNormal: false,
       url: undefined,
       input: undefined,
@@ -410,7 +415,8 @@ export default {
       ElIconFolderOpened: shallowRef(ElIconFolderOpened),
       auto: NaN,
       rootURL: "http://localhost:3000/",
-      sparcAPI: "http://localhost:8000/"
+      sparcAPI: "http://localhost:8000/",
+      images: {}
     };
   },
   watch: {
@@ -438,6 +444,14 @@ export default {
           "esophagus": 1,
           "urethra": 3
         };
+        if (Object.keys(this.images).length) {
+          for (const [key, value] of Object.entries(this.markerLabels)) {
+            const imageLabel = key.toLowerCase()
+            if (imageLabel in this.images) {
+              this.markerLabels[key] = { number: value, imgURL: this.images[imageLabel][0].thumbnail }
+            }
+          }
+        }
       } else {
         this.markerLabels = { };
       }
@@ -466,6 +480,9 @@ export default {
     this.$refs.dropzone.revokeURLs();
   },
   methods: {
+    imagesLoaded:function (value) {
+      this.images = value 
+    },
     exportGLTF: function () {
       this.$refs.scaffold.exportGLTF(false).then((data) => {
         const filename = 'export' + JSON.stringify(new Date()) + '.gltf';
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index d38373d..9278691 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -1939,12 +1939,16 @@ export default {
      * Set the marker modes for objects with the provided name, mode can
      * be "on", "off" or "inherited".
      */
-    setMarkerModeForObjectsWithName: function (name, number, mode) {
+    setMarkerModeForObjectsWithName: function (name, value, mode) {
       if (name && this.$module.scene) {
+        let options = value;
+        if (typeof value === 'number') {
+          options = { number: value, imgURL: undefined };
+        }
         const rootRegion = this.$module.scene.getRootRegion();
         const groups = [name];
         const objects = findObjectsWithNames(rootRegion, groups, "", true);
-        objects.forEach(object => object.setMarkerMode(mode, { number }));
+        objects.forEach(object => object.setMarkerMode(mode, options));
       }
     },
     /**
@@ -2336,6 +2340,7 @@ export default {
       let response = await this.getImageDatasetFromScicrunch()
       if (response && response.success) {
         this.anatomyImages = this.populateViewerWithImages(response.datasets)
+        this.$emit("images-loaded", this.anatomyImages)
       }
     }
   },
diff --git a/src/services/imageMixin.js b/src/services/imageMixin.js
index 89faf1a..7397e8c 100644
--- a/src/services/imageMixin.js
+++ b/src/services/imageMixin.js
@@ -114,8 +114,8 @@ export default {
               for (let k = 0; k < anatomyLength; k++) {
                 const anatomy = image.anatomy[k];
                 const locationIdentifier = mapImp
-                  ? anatomy.curie
-                  : anatomy.name;
+                  ? anatomy.curie.toLowerCase()
+                  : anatomy.name.toLowerCase();
                 if (!(locationIdentifier in anatomyImageObjects)) {
                   anatomyImageObjects[locationIdentifier] = [];
                   if (mapImp) {

From 608fb10fdf95df511d94691a804350b49f872c39 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Thu, 15 Aug 2024 16:03:36 +1200
Subject: [PATCH 08/32] Update image marker control

---
 src/App.vue                            | 38 ++++++++++++++++++--------
 src/components/ScaffoldVuer.vue        |  2 +-
 src/{services => mixins}/imageMixin.js |  0
 3 files changed, 27 insertions(+), 13 deletions(-)
 rename src/{services => mixins}/imageMixin.js (100%)

diff --git a/src/App.vue b/src/App.vue
index 1eb4344..3324338 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -81,8 +81,8 @@
               active-color="#8300bf" />
           </el-col>
           <el-col :span="auto">
-            <el-switch v-show="Object.keys(images).length > 0" v-model="markerCluster" active-text="Marker Images" active-icon-class="el-icon-location"
-              active-color="#8300bf" />
+            <el-switch v-model="imageMarker" active-text="Marker Images" active-icon-class="el-icon-location"
+              active-color="#8300bf" :disabled="!this.markerCluster" @change="imageMarkerLabels" />
           </el-col>
           <el-col :span="auto">
             <el-switch v-model="displayMinimap" active-text="Minimap" active-icon-class="el-icon-discover"
@@ -416,7 +416,8 @@ export default {
       auto: NaN,
       rootURL: "http://localhost:3000/",
       sparcAPI: "http://localhost:8000/",
-      images: {}
+      anatomyImages: {},
+      imageMarker: false
     };
   },
   watch: {
@@ -444,14 +445,6 @@ export default {
           "esophagus": 1,
           "urethra": 3
         };
-        if (Object.keys(this.images).length) {
-          for (const [key, value] of Object.entries(this.markerLabels)) {
-            const imageLabel = key.toLowerCase()
-            if (imageLabel in this.images) {
-              this.markerLabels[key] = { number: value, imgURL: this.images[imageLabel][0].thumbnail }
-            }
-          }
-        }
       } else {
         this.markerLabels = { };
       }
@@ -480,8 +473,29 @@ export default {
     this.$refs.dropzone.revokeURLs();
   },
   methods: {
+    imageMarkerLabels:function (value) {
+      let imageLabels = {}
+      if (value) {
+        for (const [key, value] of Object.entries(this.markerLabels)) {
+          const imageLabel = key.toLowerCase()
+          imageLabels[key] = value
+          if (imageLabel in this.anatomyImages) {
+            imageLabels[key] = { number: value, imgURL: this.anatomyImages[imageLabel][0].thumbnail }
+          }
+        }
+      } else {
+        for (const [key, value] of Object.entries(this.markerLabels)) {
+          if (typeof value === "object") {
+            imageLabels[key] = this.markerLabels[key].number
+          } else {
+            imageLabels[key] = value
+          }
+        }
+      }
+      this.markerLabels = imageLabels
+    },
     imagesLoaded:function (value) {
-      this.images = value 
+      this.anatomyImages = value
     },
     exportGLTF: function () {
       this.$refs.scaffold.exportGLTF(false).then((data) => {
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 9278691..c2bf8f3 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -422,7 +422,7 @@ import { OrgansViewer } from "../scripts/OrgansRenderer.js";
 import { SearchIndex } from "../scripts/Search.js";
 import { mapState } from 'pinia';
 import { useMainStore } from "@/store/index";
-import imageMixin from '../services/imageMixin.js'
+import imageMixin from '../mixins/imageMixin.js'
 
 /**
  * A vue component of the scaffold viewer.
diff --git a/src/services/imageMixin.js b/src/mixins/imageMixin.js
similarity index 100%
rename from src/services/imageMixin.js
rename to src/mixins/imageMixin.js

From e2f837c35ab7f8930b2783356d591967d8fed215 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Fri, 16 Aug 2024 12:56:42 +1200
Subject: [PATCH 09/32] Add switch to control image display

---
 package-lock.json               | 45 +++++++++------------
 package.json                    |  2 +-
 src/App.vue                     | 21 +++++-----
 src/components.d.ts             |  2 +
 src/components/ScaffoldVuer.vue | 66 +++++++++++++++++++++---------
 src/mixins/imageMixin.js        | 72 +++++++++++----------------------
 6 files changed, 104 insertions(+), 104 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6cc35a4..fdca1c6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.4.0",
       "license": "Apache-2.0",
       "dependencies": {
-        "@abi-software/map-utilities": "^1.1.0",
+        "@abi-software/map-utilities": "^1.0.0-beta.1",
         "@abi-software/sparc-annotation": "^0.3.1",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
@@ -44,11 +44,23 @@
         "webpack-node-externals": "^2.5.2"
       }
     },
+    "node_modules/@abi-software/gallery": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@abi-software/gallery/-/gallery-1.1.1.tgz",
+      "integrity": "sha512-EOnKEQpL/6R7UZQpjiaBn5g4KPxc8RHrIfyTf4ukA+WJ2SU5T+R5GIYzi8Kuzgh797NehPpe/iFzPa21FvN+HQ==",
+      "dependencies": {
+        "axios": "^1.6.5",
+        "element-plus": "^2.4.4",
+        "unplugin-vue-components": "^0.26.0",
+        "vue": "^3.3.13"
+      }
+    },
     "node_modules/@abi-software/map-utilities": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.1.0.tgz",
-      "integrity": "sha512-icRE0/VTa4RollDDHSqKsK63gwUAxAepDoAYPJCljgsnW6TxVyXOt9Olacwd3k2u0jfKOaUt1QfdTlpVxY4QpQ==",
+      "version": "1.0.0-beta.1",
+      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.0.0-beta.1.tgz",
+      "integrity": "sha512-gOMGlaAqY8Rv6rXJ64oqOeTJHO1W0FigQZnTJKMOj9wMA0jWYsHHREyP8FKbEZZ0YGk9l2cJGL38K/sHTkcNpw==",
       "dependencies": {
+        "@abi-software/gallery": "^1.1.0",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
         "element-plus": "^2.7.3",
@@ -1804,10 +1816,7 @@
     "node_modules/asynckit": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
-      "dev": true,
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
     },
     "node_modules/auto-changelog": {
       "version": "2.4.0",
@@ -1846,9 +1855,6 @@
       "version": "1.7.2",
       "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
       "integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
-      "dev": true,
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "follow-redirects": "^1.15.6",
         "form-data": "^4.0.0",
@@ -2338,9 +2344,6 @@
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
       "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-      "dev": true,
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "delayed-stream": "~1.0.0"
       },
@@ -2771,9 +2774,6 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
       "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
-      "dev": true,
-      "optional": true,
-      "peer": true,
       "engines": {
         "node": ">=0.4.0"
       }
@@ -3925,15 +3925,12 @@
       "version": "1.15.6",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
       "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
-      "dev": true,
       "funding": [
         {
           "type": "individual",
           "url": "https://github.com/sponsors/RubenVerborgh"
         }
       ],
-      "optional": true,
-      "peer": true,
       "engines": {
         "node": ">=4.0"
       },
@@ -3955,9 +3952,6 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
       "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
-      "dev": true,
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "asynckit": "^0.4.0",
         "combined-stream": "^1.0.8",
@@ -6025,10 +6019,7 @@
     "node_modules/proxy-from-env": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
-      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
-      "dev": true,
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
     },
     "node_modules/public-encrypt": {
       "version": "4.0.3",
diff --git a/package.json b/package.json
index 963c87b..ac4f200 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "*.js"
   ],
   "dependencies": {
-    "@abi-software/map-utilities": "^1.1.0",
+    "@abi-software/map-utilities": "^1.0.0-beta.1",
     "@abi-software/sparc-annotation": "^0.3.1",
     "@abi-software/svg-sprite": "^1.0.0",
     "@element-plus/icons-vue": "^2.3.1",
diff --git a/src/App.vue b/src/App.vue
index 8f66fd6..d8b4f4b 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -38,7 +38,7 @@
         @timeChanged="updateCurrentTime"
         @zinc-object-added="objectAdded"
         @vue:mounted="viewerMounted"
-        @images-loaded="imagesLoaded"
+        :anatomyImages=anatomyImages
       />
     </drop-zone>
 
@@ -80,10 +80,6 @@
             <el-switch v-model="markerCluster" active-text="Marker Cluster" active-icon-class="el-icon-location"
               active-color="#8300bf" />
           </el-col>
-          <el-col :span="auto">
-            <el-switch v-model="imageMarker" active-text="Marker Images" active-icon-class="el-icon-location"
-              active-color="#8300bf" :disabled="!this.markerCluster" @change="imageMarkerLabels" />
-          </el-col>
           <el-col :span="auto">
             <el-switch v-model="displayMinimap" active-text="Minimap" active-icon-class="el-icon-discover"
               active-color="#8300bf" />
@@ -328,6 +324,7 @@ import {
 import { useRoute, useRouter } from 'vue-router'
 import { HelpModeDialog } from '@abi-software/map-utilities'
 import '@abi-software/map-utilities/dist/style.css'
+import imageMixin from './mixins/imageMixin';
 
 let texture_prefix = undefined;
 
@@ -345,6 +342,7 @@ const writeTextFile = (filename, data) => {
 
 export default {
   name: "app",
+  mixins:[imageMixin],
   components: {
     Autocomplete,
     Button,
@@ -417,7 +415,6 @@ export default {
       rootURL: "http://localhost:3000/",
       sparcAPI: "http://localhost:8000/",
       anatomyImages: {},
-      imageMarker: false
     };
   },
   watch: {
@@ -433,7 +430,7 @@ export default {
           "body proper": 9,
           "Spinal cord": 8,
           "lung": 11,
-          "stomach": {number:12, imgURL: 'https://mapcore-bucket1.s3.us-west-2.amazonaws.com/texture/arm1/jpg/0984.jpg'},
+          "stomach": 12,
           "urinary bladder": 11,
           "Brainstem": 11,
           "heart": 9,
@@ -465,6 +462,7 @@ export default {
   },
   mounted: function () {
     this._objects = [];
+    this.processAnatomyImages()
   },
   created: function () {
     texture_prefix = import.meta.env.VITE_TEXTURE_FOOT_PREFIX;
@@ -494,9 +492,6 @@ export default {
       }
       this.markerLabels = imageLabels
     },
-    imagesLoaded:function (value) {
-      this.anatomyImages = value
-    },
     exportGLTF: function () {
       this.$refs.scaffold.exportGLTF(false).then((data) => {
         const filename = 'export' + JSON.stringify(new Date()) + '.gltf';
@@ -790,6 +785,12 @@ export default {
         this.$refs.scaffoldHelp.toggleTooltipPinHighlight();
       }
     },
+    processAnatomyImages: async function () {
+      let response = await this.getImageDatasetFromScicrunch()
+      if (response && response.success) {
+        this.anatomyImages = this.populateAnatomyImageObjects(response.datasets).anatomyName
+      }
+    },
   },
 };
 </script>
diff --git a/src/components.d.ts b/src/components.d.ts
index 0ea73c3..520ae6b 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -27,6 +27,8 @@ declare module 'vue' {
     ElMain: typeof import('element-plus/es')['ElMain']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElSlider: typeof import('element-plus/es')['ElSlider']
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 5826621..610a751 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -15,7 +15,7 @@
       :x="tData.x"
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
-      :anatomyImages="viewingMode === 'Exploration' ? anatomyImages : {}"
+      :anatomyImages="imageRadio ? anatomyImages : {}"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
@@ -311,6 +311,18 @@
               {{ viewingModes[viewingMode] }}
             </el-row>
           </el-row>
+          <el-row class="backgroundSpacer" v-if="viewingMode === 'Exploration'"></el-row>
+          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">View Image</el-row>
+          <el-row class="backgroundControl" v-if="viewingMode === 'Exploration'">
+            <el-radio-group
+              v-model="imageRadio"
+              class="flatmap-radio"
+              @change="setImage"
+            >
+            <el-radio :value="false">Hide</el-radio>
+            <el-radio :value="true">Show</el-radio>
+            </el-radio-group>
+          </el-row>
           <el-row class="backgroundSpacer"></el-row>
           <el-row class="backgroundText"> Change background </el-row>
           <el-row class="backgroundChooser">
@@ -710,6 +722,10 @@ export default {
       type: String,
       default: 'https://api.sparc.science/',
     },
+    anatomyImages: {
+      type: Object,
+      default: {},
+    },
   },
   provide() {
     return {
@@ -717,6 +733,7 @@ export default {
       scaffoldUrl: this.url,
       $annotator: this.annotator,
       boundingDims: this.boundingDims,
+      getFeaturesAlert: () => undefined,
     };
   },
   data: function () {
@@ -807,7 +824,8 @@ export default {
         active: false,
       },
       fileFormat: "metadata",
-      previousMarkerLabels: markRaw({}),
+      markerLabelEntry: markRaw({}),
+      previousMarkerLabelEntry: markRaw({}),
       viewingMode: "Exploration",
       viewingModes: {
         "Exploration": "View and explore detailed visualization of 3D scaffolds",
@@ -829,8 +847,7 @@ export default {
         centre: [0, 0, 0],
         size:[1, 1, 1],
       },
-      images: [],
-      anatomyImages: {},
+      imageRadio: false,
     };
   },
   watch: {
@@ -911,14 +928,17 @@ export default {
       immediate: true,
     },
     markerLabels: function(labels) {
-      for (const [key, value] of Object.entries(this.previousMarkerLabels)) {
+      this.markerLabelEntry = markRaw({...labels})
+    },
+    markerLabelEntry: function (entry) {
+      for (const [key, value] of Object.entries(this.previousMarkerLabelEntry)) {
         this.setMarkerModeForObjectsWithName(key, value, "off");
       }
-      for (const [key, value] of Object.entries(labels)) {
+      for (const [key, value] of Object.entries(entry)) {
         this.setMarkerModeForObjectsWithName(key, value, "on");
       }
-      this.previousMarkerLabels = markRaw({...labels});
-    },
+      this.previousMarkerLabelEntry = markRaw({...entry});
+    }
   },
   beforeCreate: function () {
     this.$module = new OrgansViewer();
@@ -2114,7 +2134,6 @@ export default {
         //Emit when all objects have been loaded
         this.$emit("on-ready");
         this.setMarkers();
-        this.addImagesToMap();
         //Create a bounding box.
         this._boundingBoxGeo = this.$module.scene.addBoundingBoxPrimitive(
           "_helper", "boundingBox", 0x40E0D0, 0.15);
@@ -2351,19 +2370,30 @@ export default {
      * Set the markers for the scene.
      */
     setMarkers: function () {
-      for (const [key, value] of Object.entries(this.markerLabels)) {
+      for (const [key, value] of Object.entries(this.markerLabelEntry)) {
         this.setMarkerModeForObjectsWithName(key, value, "on");
       }
     },
-    /**
-     * Get the images from Scicrunch and add them to the map.
-     */
-    addImagesToMap: async function () {
-      let response = await this.getImageDatasetFromScicrunch()
-      if (response && response.success) {
-        this.anatomyImages = this.populateViewerWithImages(response.datasets)
-        this.$emit("images-loaded", this.anatomyImages)
+    setImage: function (flag) {
+      let imageLabels = {}
+      if (flag) {
+        for (const [key, value] of Object.entries(this.markerLabels)) {
+          const imageLabel = key.toLowerCase()
+          imageLabels[key] = value
+          if (imageLabel in this.anatomyImages) {
+            imageLabels[key] = { number: value, imgURL: this.anatomyImages[imageLabel][0].thumbnail }
+          }
+        }
+      } else {
+        for (const [key, value] of Object.entries(this.markerLabels)) {
+          if (typeof value === "object") {
+            imageLabels[key] = this.markerLabels[key].number
+          } else {
+            imageLabels[key] = value
+          }
+        }
       }
+      this.markerLabelEntry = imageLabels
     }
   },
 };
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
index 7397e8c..fc4b520 100644
--- a/src/mixins/imageMixin.js
+++ b/src/mixins/imageMixin.js
@@ -78,30 +78,9 @@ const getAnnotatedBiolucida = function (data) {
 export default {
   // Note that the setting store is included in MapContent.vue
   methods: {
-    createThumbnailMarkers: function (mapImp, id, image) {
-      return new Promise((resolve, reject) => {
-        let wrapperElement = document.createElement("div");
-        let img = new Image();
-        img.src = image;
-        img.style = "height: auto;width: 50px;margin-right: 80px;";
-        img.onload = function () {
-          wrapperElement.appendChild(img);
-          const markerIdentifier = mapImp.addMarker(id, {
-            element: wrapperElement,
-            className: "highlight-marker",
-            cluster: false,
-            type: "image",
-          });
-          resolve(markerIdentifier);
-        };
-        img.onerror = function () {
-          reject(new Error("Failed to load image at " + image));
-        };
-      });
-    },
-
-    populateViewerWithImages: function (datasets, mapImp = undefined) {
-      let anatomyImageObjects = {};
+    populateAnatomyImageObjects: function (datasets) {
+      let anatomyCurieImageObjects = {};
+      let anatomyNameImageObjects = {};
       const datasetsLength = datasets.length;
       for (let i = 0; i < datasetsLength; i++) {
         const dataset = datasets[i];
@@ -113,26 +92,23 @@ export default {
               const anatomyLength = image.anatomy.length;
               for (let k = 0; k < anatomyLength; k++) {
                 const anatomy = image.anatomy[k];
-                const locationIdentifier = mapImp
-                  ? anatomy.curie.toLowerCase()
-                  : anatomy.name.toLowerCase();
-                if (!(locationIdentifier in anatomyImageObjects)) {
-                  anatomyImageObjects[locationIdentifier] = [];
-                  if (mapImp) {
-                    this.createThumbnailMarkers(
-                      mapImp,
-                      locationIdentifier,
-                      image.thumbnail
-                    );
-                  }
+                if (!(anatomy.curie in anatomyCurieImageObjects)) {
+                  anatomyCurieImageObjects[anatomy.curie] = [];
+                }
+                anatomyCurieImageObjects[anatomy.curie].push(image);
+                if (!(anatomy.name in anatomyNameImageObjects)) {
+                  anatomyNameImageObjects[anatomy.name] = [];
                 }
-                anatomyImageObjects[locationIdentifier].push(image);
+                anatomyNameImageObjects[anatomy.name].push(image);
               }
             }
           }
         }
       }
-      return anatomyImageObjects;
+      return {
+        "anatomyCurie": anatomyCurieImageObjects,
+        "anatomyName": anatomyNameImageObjects
+      };
     },
 
     processResults: async function (results) {
@@ -159,17 +135,17 @@ export default {
               const datasetImage = biolucidaInfo[bioImage.biolucida.identifier];
               const link = bio2DIds.includes(bioImage.biolucida.identifier)
                 ? getView2DImageLink(
-                    this.rootURL,
-                    datasetId,
-                    datasetVersion,
-                    bioImage.dataset.path
-                  )
+                  this.rootURL,
+                  datasetId,
+                  datasetVersion,
+                  bioImage.dataset.path
+                )
                 : getView3DImageLink(
-                    this.rootURL,
-                    datasetId,
-                    datasetVersion,
-                    datasetImage
-                  );
+                  this.rootURL,
+                  datasetId,
+                  datasetVersion,
+                  datasetImage
+                );
               return {
                 title: bioImage.name,
                 anatomy: result.organs,

From 5126a62c3dd4231e1a57ccde7a277c4a84ac203a Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Wed, 21 Aug 2024 15:18:46 +1200
Subject: [PATCH 10/32] Update to use new image api

Have issue after removing images.
---
 src/App.vue                        |  14 +-
 src/components/ScaffoldTooltip.vue |   8 +-
 src/components/ScaffoldVuer.vue    | 100 ++++++-----
 src/mixins/imageMixin.js           | 272 ++++++++++-------------------
 src/mixins/scicrunchMixin.js       | 124 +++++++++++++
 5 files changed, 290 insertions(+), 228 deletions(-)
 create mode 100644 src/mixins/scicrunchMixin.js

diff --git a/src/App.vue b/src/App.vue
index d8b4f4b..59e2853 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -28,7 +28,6 @@
         :format="format"
         :marker-labels="markerLabels"
         :enableLocalAnnotations="false"
-        :rootURL="rootURL"
         :sparcAPI="sparcAPI"
         @open-map="openMap"
         @on-ready="onReady"
@@ -324,7 +323,6 @@ import {
 import { useRoute, useRouter } from 'vue-router'
 import { HelpModeDialog } from '@abi-software/map-utilities'
 import '@abi-software/map-utilities/dist/style.css'
-import imageMixin from './mixins/imageMixin';
 
 let texture_prefix = undefined;
 
@@ -342,7 +340,6 @@ const writeTextFile = (filename, data) => {
 
 export default {
   name: "app",
-  mixins:[imageMixin],
   components: {
     Autocomplete,
     Button,
@@ -412,8 +409,8 @@ export default {
       ElIconSetting: shallowRef(ElIconSetting),
       ElIconFolderOpened: shallowRef(ElIconFolderOpened),
       auto: NaN,
-      rootURL: "http://localhost:3000/",
-      sparcAPI: "http://localhost:8000/",
+      sparcAPI: import.meta.env.VITE_SPARC_API,
+      // sparcAPI: "http://localhost:8000/",
       anatomyImages: {},
     };
   },
@@ -462,7 +459,6 @@ export default {
   },
   mounted: function () {
     this._objects = [];
-    this.processAnatomyImages()
   },
   created: function () {
     texture_prefix = import.meta.env.VITE_TEXTURE_FOOT_PREFIX;
@@ -785,12 +781,6 @@ export default {
         this.$refs.scaffoldHelp.toggleTooltipPinHighlight();
       }
     },
-    processAnatomyImages: async function () {
-      let response = await this.getImageDatasetFromScicrunch()
-      if (response && response.success) {
-        this.anatomyImages = this.populateAnatomyImageObjects(response.datasets).anatomyName
-      }
-    },
   },
 };
 </script>
diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 688839f..23e73b0 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -153,8 +153,12 @@ export default {
       return { left: x + "px", top: this.y - yOffset + "px" };
     },
     imageEntry: function () {
-      if (this.label in this.anatomyImages) {
-        return this.anatomyImages[this.label];
+      const anatomyImageEntries = {}
+      Object.entries(this.anatomyImages).forEach(([key, value]) => {
+        Object.assign(anatomyImageEntries, { [key.toLowerCase()]: value })
+      })
+      if (this.label in anatomyImageEntries) {
+        return anatomyImageEntries[this.label];
       }
       return [];
     },
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 610a751..4dcc972 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -15,7 +15,7 @@
       :x="tData.x"
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
-      :anatomyImages="imageRadio ? anatomyImages : {}"
+      :anatomyImages="imageRadio ? anatomyImages[imageType] : {}"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
@@ -285,7 +285,7 @@
         ref="backgroundPopover"
         :virtual-ref="backgroundIconRef"
         placement="top-start"
-        width="128"
+        width="320"
         :teleported="false"
         trigger="click"
         popper-class="background-popper non-selectable h-auto"
@@ -314,14 +314,37 @@
           <el-row class="backgroundSpacer" v-if="viewingMode === 'Exploration'"></el-row>
           <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">View Image</el-row>
           <el-row class="backgroundControl" v-if="viewingMode === 'Exploration'">
-            <el-radio-group
-              v-model="imageRadio"
-              class="flatmap-radio"
-              @change="setImage"
-            >
-            <el-radio :value="false">Hide</el-radio>
-            <el-radio :value="true">Show</el-radio>
-            </el-radio-group>
+            <el-col :span="12">
+              <el-radio-group
+                v-model="imageRadio"
+                class="flatmap-radio"
+                @change="setImage"
+              >
+                <el-radio :value="false">Hide</el-radio>
+                <el-radio :value="true">Show</el-radio>
+              </el-radio-group>
+            </el-col>
+            <el-col :span="12" v-if="imageRadio">
+              <el-select
+                :teleported="false"
+                v-model="imageType"
+                placeholder="Select"
+                class="select-box"
+                popper-class="scaffold_viewer_dropdown"
+                @change="setImageType"
+              >
+                <el-option
+                  v-for="item in imageTypes"
+                  :key="item"
+                  :label="item"
+                  :value="item"
+                >
+                  <el-row>
+                    <el-col :span="12">{{ item }}</el-col>
+                  </el-row>
+                </el-option>
+              </el-select>
+            </el-col>
           </el-row>
           <el-row class="backgroundSpacer"></el-row>
           <el-row class="backgroundText"> Change background </el-row>
@@ -395,7 +418,7 @@
 
 <script>
 /* eslint-disable no-alert, no-console */
-import { markRaw, shallowRef } from 'vue';
+import { markRaw, toRaw, shallowRef } from 'vue';
 import {
   WarningFilled as ElIconWarningFilled,
   ArrowDown as ElIconArrowDown,
@@ -436,6 +459,7 @@ import { OrgansViewer } from "../scripts/OrgansRenderer.js";
 import { SearchIndex } from "../scripts/Search.js";
 import { mapState } from 'pinia';
 import { useMainStore } from "@/store/index";
+import scicrunchMixin from '../mixins/scicrunchMixin.js'
 import imageMixin from '../mixins/imageMixin.js'
 
 /**
@@ -446,7 +470,7 @@ import imageMixin from '../mixins/imageMixin.js'
  */
 export default {
   name: "ScaffoldVuer",
-  mixins: [imageMixin],
+  mixins: [scicrunchMixin,imageMixin],
   components: {
     Button,
     Col,
@@ -708,13 +732,6 @@ export default {
       type: Boolean,
       default: false
     },
-    /**
-     * Specify the root url of the SPARC portal.
-     */
-    rootURL: {
-      type: String,
-      default: 'https://sparc.science/',
-    },
     /**
      * Specify the endpoint of the SPARC API.
      */
@@ -722,10 +739,6 @@ export default {
       type: String,
       default: 'https://api.sparc.science/',
     },
-    anatomyImages: {
-      type: Object,
-      default: {},
-    },
   },
   provide() {
     return {
@@ -847,7 +860,10 @@ export default {
         centre: [0, 0, 0],
         size:[1, 1, 1],
       },
+      anatomyImages: markRaw({}),
       imageRadio: false,
+      imageType: 'Image',
+      imageTypes: ['Image', 'Plot', 'Scaffold', 'Segmentation']
     };
   },
   watch: {
@@ -2374,26 +2390,32 @@ export default {
         this.setMarkerModeForObjectsWithName(key, value, "on");
       }
     },
+    removeImageFromMap: function () {
+      this.markerLabelEntry = this.markerLabels
+    },
     setImage: function (flag) {
-      let imageLabels = {}
       if (flag) {
-        for (const [key, value] of Object.entries(this.markerLabels)) {
-          const imageLabel = key.toLowerCase()
-          imageLabels[key] = value
-          if (imageLabel in this.anatomyImages) {
-            imageLabels[key] = { number: value, imgURL: this.anatomyImages[imageLabel][0].thumbnail }
-          }
-        }
+        this.setImageType(this.imageType)
       } else {
-        for (const [key, value] of Object.entries(this.markerLabels)) {
-          if (typeof value === "object") {
-            imageLabels[key] = this.markerLabels[key].number
-          } else {
-            imageLabels[key] = value
-          }
-        }
+        this.removeImageFromMap()
+      }
+    },
+    setImageType: async function (type) {
+      this.imageType = type
+      this.loading = true
+      if (type === "Image"  && !(type in this.anatomyImages)) {
+        this.anatomyImages["Image"] = await this.getBiolucidaThumbnails("name", Object.keys(this.markerLabels))
+      } else if (type === "Segmentation" && !(type in this.anatomyImages)) {
+        this.anatomyImages["Segmentation"] = await this.getSegmentationThumbnails("name", Object.keys(this.markerLabels))
+      } else {
+        console.log('switch to', type);
+        this.removeImageFromMap()
+      }
+      if (this.anatomyImages[type]) {
+        console.log("🚀 ~ this.anatomyImages[type]:", this.anatomyImages[type])
+        this.populateMapWithImages(this.anatomyImages[type], type)
       }
-      this.markerLabelEntry = imageLabels
+      this.loading = false
     }
   },
 };
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
index fc4b520..c80c07f 100644
--- a/src/mixins/imageMixin.js
+++ b/src/mixins/imageMixin.js
@@ -1,189 +1,111 @@
-const imageQuery = '"*jp2* OR *vnd.ome.xml* OR *jpx*"';
-
-const getView2DImageLink = (rootURL, datasetId, datasetVersion, filePath) => {
-  return `${rootURL}datasets/file/${datasetId}/${datasetVersion}?path=files/${filePath}`;
-};
-
-const getView3DImageLink = (
-  rootURL,
-  datasetId,
-  datasetVersion,
-  dataset_image
-) => {
-  const viewEncoding = dataset_image.share_link.replace(
-    "https://sparc.biolucida.net/image?c=",
-    ""
-  );
-  return (
-    rootURL +
-    "datasets/biolucidaviewer/" +
-    dataset_image.image_id +
-    "?view=" +
-    viewEncoding +
-    "&dataset_version=" +
-    datasetVersion +
-    "&dataset_id=" +
-    datasetId +
-    "&item_id=" +
-    dataset_image.sourcepkg_id
-  );
-};
-
-const getBiolucidaInfo = async function (sparcAPI, datasetId) {
-  return new Promise((resolve, reject) => {
-    const endpoint = `${sparcAPI}image_search/${datasetId}`;
-    fetch(endpoint)
-      .then((response) => response.json())
-      .then((data) => {
-        if (data.status == "success") {
-          let imageObjects = {};
-          data.dataset_images.forEach((image) => {
-            if (!(image.image_id in imageObjects)) {
-              imageObjects[image.image_id] = image;
+export default {
+  methods: {
+    populateMapWithImages: function (images, type, mapImp = undefined) {
+      for (const [key, list] of Object.entries(images)) {
+        this.downloadImageThumbnail(key, list, type, mapImp);
+      }
+    },
+    downloadImageThumbnail: async function (key, list, type, mapImp) {
+      const count = list.length;
+      if (count > 0) {
+        //Pick a random image
+        const index = Math.floor(Math.random() * count);
+        const thumbnail = list[index].thumbnail;
+        this.getThumbnail(thumbnail, type)
+          .then((response) => {
+            let result = { type: "generic", data: response };
+            if (type === "Segmentation" || type === "Image") {
+              result["type"] = "binary";
             }
+            this.attachThumbnailToMap(key, result, mapImp);
+          })
+          .catch((error) => {
+            console.log("🚀 ~ error:", error);
+            //Failed to download, pick another one
+            list.splice(index);
+            this.downloadImageThumbnail(key, list, type, mapImp);
           });
-          resolve(imageObjects);
+      }
+    },
+    getThumbnail: async function (url, type) {
+      return new Promise((resolve, reject) => {
+        if (type === "Segmentation" || type === "Image") {
+          return this.getBinaryThumbnail(url)
+            .then((response) => resolve(response))
+            .catch((response) => reject(response));
         } else {
-          reject(data.reason);
+          this.getGenericThumbnail(url)
+            .then((response) => resolve(response))
+            .catch((response) => reject(response));
         }
       });
-  });
-};
-
-const getAnnotatedBiolucida = function (data) {
-  let bioList = [];
-  let bio2DIds = [];
-  if ("biolucida-2d" in data) {
-    const bio2DLength = data["biolucida-2d"].length;
-    for (let i = 0; i < bio2DLength; i++) {
-      const biolucida = data["biolucida-2d"][i];
-      if (biolucida.biolucida) {
-        bioList.push(biolucida);
-        bio2DIds.push(biolucida.biolucida.identifier);
-      }
-    }
-  }
-  if ("biolucida-3d" in data) {
-    const bio3DLength = data["biolucida-3d"].length;
-    for (let i = 0; i < bio3DLength; i++) {
-      const biolucida = data["biolucida-3d"][i];
-      if (biolucida.biolucida) {
-        bioList.push(biolucida);
-      }
-    }
-  }
-  return { bioList, bio2DIds };
-};
-
-export default {
-  // Note that the setting store is included in MapContent.vue
-  methods: {
-    populateAnatomyImageObjects: function (datasets) {
-      let anatomyCurieImageObjects = {};
-      let anatomyNameImageObjects = {};
-      const datasetsLength = datasets.length;
-      for (let i = 0; i < datasetsLength; i++) {
-        const dataset = datasets[i];
-        if (dataset.value && dataset.value.length) {
-          const imagesLength = dataset.value.length;
-          for (let j = 0; j < imagesLength; j++) {
-            const image = dataset.value[j];
-            if (image.anatomy && image.anatomy.length) {
-              const anatomyLength = image.anatomy.length;
-              for (let k = 0; k < anatomyLength; k++) {
-                const anatomy = image.anatomy[k];
-                if (!(anatomy.curie in anatomyCurieImageObjects)) {
-                  anatomyCurieImageObjects[anatomy.curie] = [];
-                }
-                anatomyCurieImageObjects[anatomy.curie].push(image);
-                if (!(anatomy.name in anatomyNameImageObjects)) {
-                  anatomyNameImageObjects[anatomy.name] = [];
-                }
-                anatomyNameImageObjects[anatomy.name].push(image);
-              }
-            }
+    },
+    getBinaryThumbnail: async function (url) {
+      return new Promise((resolve, reject) => {
+        fetch(url).then((response) => {
+          if (response.status >= 200 && response.status < 300) {
+            resolve(response.text());
+          } else {
+            reject();
           }
-        }
-      }
-      return {
-        "anatomyCurie": anatomyCurieImageObjects,
-        "anatomyName": anatomyNameImageObjects
-      };
+        });
+      });
     },
-
-    processResults: async function (results) {
-      try {
-        let datasets = [];
-        const dataType = "Image";
-        console.log("starting promise list");
-        let promiseList = results.map(async (result) => {
-          const datasetId = result.dataset_identifier;
-          const datasetVersion = result.dataset_version;
-          const biolucidaInfo = await getBiolucidaInfo(
-            this.sparcAPI,
-            datasetId
-          );
-          const imageIds = Object.values(biolucidaInfo).map(
-            (image) => image.image_id
-          );
-          const { bioList, bio2DIds } = getAnnotatedBiolucida(result);
-          return bioList
-            .filter((bioImage) =>
-              imageIds.includes(bioImage.biolucida.identifier)
-            )
-            .map((bioImage) => {
-              const datasetImage = biolucidaInfo[bioImage.biolucida.identifier];
-              const link = bio2DIds.includes(bioImage.biolucida.identifier)
-                ? getView2DImageLink(
-                  this.rootURL,
-                  datasetId,
-                  datasetVersion,
-                  bioImage.dataset.path
-                )
-                : getView3DImageLink(
-                  this.rootURL,
-                  datasetId,
-                  datasetVersion,
-                  datasetImage
-                );
-              return {
-                title: bioImage.name,
-                anatomy: result.organs,
-                species: result.organisms,
-                datasetId: datasetId,
-                datasetVersion: datasetVersion,
-                link: link,
-                type: dataType,
-                thumbnail: datasetImage.thumbnail_url,
-              };
-            });
+    getGenericThumbnail: async function (url) {
+      return new Promise((resolve, reject) => {
+        fetch(url).then((response) => {
+          if (response.status === 200) {
+            resolve(url);
+          } else {
+            reject();
+          }
         });
-        console.log("promiseList:", promiseList);
-        let promiseResult = await Promise.allSettled(promiseList);
-        datasets = promiseResult.flat();
-        console.log("promiseResult:", promiseResult);
-        return datasets;
-      } catch (error) {
-        console.error("Error:", error);
-        return [];
+      });
+    },
+    attachThumbnailToMap: function (id, source, mapImp) {
+      // add it to the maps
+      if (mapImp) {
+        this.attachThumbnailToFlatmap(id, source, mapImp);
+      } else {
+        this.attachThumbnailToScaffold(id, source);
       }
     },
+    attachThumbnailToFlatmap: function (id, source, mapImp) {
+      return new Promise((resolve, reject) => {
+        let img = new Image();
+        let wrapperElement = document.createElement("div");
+        img.style = "height: auto;width: 50px;margin-right: 80px;";
+        img.onload = function () {
+          wrapperElement.appendChild(img);
+        };
+        img.onerror = function () {
+          reject(new Error("Failed to load image at " + url));
+        };
+        img.src =
+          source.type === "binary"
+            ? `data:'image/png';base64,${source.data}`
+            : source.data;
 
-    getImageDatasetFromScicrunch: async function () {
-      const endpoint =
-        `${this.sparcAPI}multiple_dataset_info/using_multiple_mimetype/?` +
-        `${new URLSearchParams({ q: imageQuery })}`;
-      try {
-        const response = await fetch(endpoint);
-        const data = await response.json();
-        if (data.numberOfHits >= 1) {
-          let datasets = await this.processResults(data.results);
-          return { success: true, datasets: datasets };
-        }
-        return { success: false, error: "No datasets found" };
-      } catch (error) {
-        return { success: false, error: error };
-      }
+        // add it to the flatmap
+        const markerIdentifier = mapImp.addMarker(id, {
+          element: wrapperElement,
+          className: "highlight-marker",
+          cluster: false,
+          type: "image",
+        });
+
+        const marker = mapImp.addMarker(id);
+        resolve(marker);
+      });
     },
+    attachThumbnailToScaffold: async function (id, source) {
+      if (source) {
+        const blob = await (
+          await fetch(`data:'image/png';base64,${source.data}`)
+        ).blob();
+        const blobUrl = URL.createObjectURL(blob);
+        this.setMarkerModeForObjectsWithName(id, { number: this.markerLabels[id], imgURL: blobUrl }, "on");
+      }
+    }
   },
 };
diff --git a/src/mixins/scicrunchMixin.js b/src/mixins/scicrunchMixin.js
new file mode 100644
index 0000000..6f71456
--- /dev/null
+++ b/src/mixins/scicrunchMixin.js
@@ -0,0 +1,124 @@
+const getFilesInfo = async (api, key, idsList, types) => {
+  let params = new URLSearchParams();
+  types.forEach((type) => {
+    params.append("filetypes", type);
+  });
+  let response = await fetch(`${api}/get-organ-curies/?${params}`);
+  let data = await response.json();
+  const identifiers = [];
+  data.uberon.array.forEach((pair) => {
+    const identifier = {
+      id: pair.id.toUpperCase(),
+      name: pair.name,
+    };
+    if (idsList.includes(identifier[key])) {
+      identifiers.push(identifier);
+    }
+  });
+  const keys = identifiers.map((item) => item.id);
+  response = await fetch(`${api}/get-files-info-for-curies`, {
+    method: "POST",
+    body: JSON.stringify({
+      filetypes: types,
+      curies: keys,
+    }),
+    headers: {
+      "Content-Type": "application/json",
+    },
+  });
+  data = await response.json();
+  return { data: data, identifiers: identifiers };
+};
+
+const getFileName = (filePath) => {
+  return filePath.substring(filePath.lastIndexOf("/") + 1);
+};
+
+export default {
+  methods: {
+    getBiolucidaThumbnails: async function (key, idsList) {
+      try {
+        const { data, identifiers } = await getFilesInfo(
+          this.sparcAPI,
+          key,
+          idsList,
+          ["biolucida-2d", "biolucida-3d"]
+        );
+        if (data["files_info"]) {
+          const images = {};
+          for (const [key, value] of Object.entries(data["files_info"])) {
+            const nameLabel = identifiers.find((item) => item.id === key).name;
+            if (value.length > 0) {
+              const list = [];
+              value.forEach((entry) => {
+                if (entry.biolucida_id) {
+                  let image = {
+                    thumbnail: this.getBiolucidaThumbnailURL(
+                      entry.biolucida_id
+                    ),
+                    id: entry.id,
+                    title: getFileName(entry.file_path),
+                    type: "Image",
+                    link: `https://sparc.biolucida.net/api/v1/thumbnail/${entry.biolucida_id}`,
+                    mimetype: "image/png",
+                  };
+                  list.push(image);
+                }
+              });
+              images[nameLabel] = list;
+            }
+          }
+          return images;
+        }
+      } catch (error) {
+        console.error("Error:", error);
+      }
+      return {};
+    },
+    getBiolucidaThumbnailURL: function (biolucidaId) {
+      return `${this.sparcAPI}/thumbnail/${biolucidaId}`;
+    },
+    getSegmentationThumbnails: async function (key, idsList) {
+      try {
+        const data = await getFilesInfo(this.sparcAPI, key, idsList, [
+          "mbf-segmentation",
+        ]);
+        if (data["files_info"]) {
+          const images = {};
+          for (const [key, value] of Object.entries(data["files_info"])) {
+            if (value.length > 0) {
+              const list = [];
+              value.forEach((entry) => {
+                let image = {
+                  thumbnail: this.getSegmentationThumbnailURL(
+                    entry.id,
+                    entry.version,
+                    entry.file_path
+                  ),
+                  id: entry.id,
+                  title: getFileName(entry.file_path),
+                  type: "Segmentation",
+                  link: this.getBiolucidaThumbnailURL(entry.biolucida_id),
+                  mimetype: "image/png",
+                };
+                list.push(image);
+              });
+              images[key] = list;
+            }
+          }
+          return images;
+        }
+      } catch (error) {
+        console.error("Error:", error);
+      }
+      return {};
+    },
+    getSegmentationThumbnailURL: function (
+      datasetId,
+      datasetVersion,
+      filePath
+    ) {
+      return `${this.sparcAPI}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}`;
+    },
+  },
+};

From 8bd207cac2a9d6bfae372297f7bef9c36fb23c26 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Thu, 22 Aug 2024 13:12:01 +1200
Subject: [PATCH 11/32] Support to show more image types

---
 src/components/ScaffoldVuer.vue  |  33 ++--
 src/mixins/imageMixin.js         | 104 +++++--------
 src/mixins/scicrunchMixin.js     | 124 ---------------
 src/services/scicrunchQueries.js | 258 +++++++++++++++++++++++++++++++
 4 files changed, 320 insertions(+), 199 deletions(-)
 delete mode 100644 src/mixins/scicrunchMixin.js
 create mode 100644 src/services/scicrunchQueries.js

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 4dcc972..6bacd4a 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -293,7 +293,7 @@
       >
         <div>
           <el-row class="backgroundText">Viewing Mode</el-row>
-          <el-row class="backgroundControl">
+          <el-row class="backgroundChooser">
             <div style="margin-bottom: 2px;">
               <template
                   v-for="(value, key, index) in viewingModes"
@@ -312,8 +312,8 @@
             </el-row>
           </el-row>
           <el-row class="backgroundSpacer" v-if="viewingMode === 'Exploration'"></el-row>
-          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">View Image</el-row>
-          <el-row class="backgroundControl" v-if="viewingMode === 'Exploration'">
+          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">Images Display</el-row>
+          <el-row class="backgroundChooser" v-if="viewingMode === 'Exploration'">
             <el-col :span="12">
               <el-radio-group
                 v-model="imageRadio"
@@ -459,7 +459,12 @@ import { OrgansViewer } from "../scripts/OrgansRenderer.js";
 import { SearchIndex } from "../scripts/Search.js";
 import { mapState } from 'pinia';
 import { useMainStore } from "@/store/index";
-import scicrunchMixin from '../mixins/scicrunchMixin.js'
+import {
+  getBiolucidaThumbnails,
+  getSegmentationThumbnails,
+  getScaffoldThumbnails,
+  getPlotThumbnails
+} from '../services/scicrunchQueries'
 import imageMixin from '../mixins/imageMixin.js'
 
 /**
@@ -470,7 +475,7 @@ import imageMixin from '../mixins/imageMixin.js'
  */
 export default {
   name: "ScaffoldVuer",
-  mixins: [scicrunchMixin,imageMixin],
+  mixins: [imageMixin],
   components: {
     Button,
     Col,
@@ -863,7 +868,7 @@ export default {
       anatomyImages: markRaw({}),
       imageRadio: false,
       imageType: 'Image',
-      imageTypes: ['Image', 'Plot', 'Scaffold', 'Segmentation']
+      imageTypes: ['Image', 'Segmentation', 'Scaffold', 'Plot'],
     };
   },
   watch: {
@@ -2403,16 +2408,17 @@ export default {
     setImageType: async function (type) {
       this.imageType = type
       this.loading = true
+      this.removeImageFromMap()
       if (type === "Image"  && !(type in this.anatomyImages)) {
-        this.anatomyImages["Image"] = await this.getBiolucidaThumbnails("name", Object.keys(this.markerLabels))
+        this.anatomyImages["Image"] = await getBiolucidaThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
       } else if (type === "Segmentation" && !(type in this.anatomyImages)) {
-        this.anatomyImages["Segmentation"] = await this.getSegmentationThumbnails("name", Object.keys(this.markerLabels))
-      } else {
-        console.log('switch to', type);
-        this.removeImageFromMap()
+        this.anatomyImages["Segmentation"] = await getSegmentationThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
+      } else if (type === "Scaffold" && !(type in this.anatomyImages)) {
+        this.anatomyImages["Scaffold"] = await getScaffoldThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
+      } else if (type === "Plot" && !(type in this.anatomyImages)) {
+        this.anatomyImages["Plot"] = await getPlotThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
       }
       if (this.anatomyImages[type]) {
-        console.log("🚀 ~ this.anatomyImages[type]:", this.anatomyImages[type])
         this.populateMapWithImages(this.anatomyImages[type], type)
       }
       this.loading = false
@@ -2440,6 +2446,7 @@ export default {
 .backgroundSpacer {
   border-bottom: 1px solid #e4e7ed;
   margin-bottom: 10px;
+  margin-top: 5px;
 }
 
 .warning-icon {
@@ -2576,7 +2583,7 @@ export default {
   background-color: #ffffff;
   border: 1px solid $app-primary-color;
   box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.06);
-  height: 140px;
+  height: fit-content;
   min-width: 200px;
   .el-popper__arrow {
     &:before {
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
index c80c07f..6896053 100644
--- a/src/mixins/imageMixin.js
+++ b/src/mixins/imageMixin.js
@@ -1,29 +1,24 @@
 export default {
   methods: {
-    populateMapWithImages: function (images, type, mapImp = undefined) {
+    populateMapWithImages: function (images, type) {
       for (const [key, list] of Object.entries(images)) {
-        this.downloadImageThumbnail(key, list, type, mapImp);
+        this.downloadImageThumbnail(key, list, type);
       }
     },
-    downloadImageThumbnail: async function (key, list, type, mapImp) {
+    downloadImageThumbnail: async function (key, list, type) {
       const count = list.length;
       if (count > 0) {
         //Pick a random image
         const index = Math.floor(Math.random() * count);
         const thumbnail = list[index].thumbnail;
         this.getThumbnail(thumbnail, type)
-          .then((response) => {
-            let result = { type: "generic", data: response };
-            if (type === "Segmentation" || type === "Image") {
-              result["type"] = "binary";
-            }
-            this.attachThumbnailToMap(key, result, mapImp);
+          .then((source) => {
+            this.addImageThumbnailMarker(key, source);
           })
-          .catch((error) => {
-            console.log("🚀 ~ error:", error);
+          .catch(() => {
             //Failed to download, pick another one
             list.splice(index);
-            this.downloadImageThumbnail(key, list, type, mapImp);
+            this.downloadImageThumbnail(key, list, type);
           });
       }
     },
@@ -42,70 +37,55 @@ export default {
     },
     getBinaryThumbnail: async function (url) {
       return new Promise((resolve, reject) => {
-        fetch(url).then((response) => {
-          if (response.status >= 200 && response.status < 300) {
-            resolve(response.text());
-          } else {
-            reject();
-          }
-        });
+        fetch(url)
+          .then((response) => {
+            if (response.status >= 200 && response.status < 300) {
+              return response.text();
+            } else {
+              reject();
+            }
+          })
+          .then((data) => {
+            if (data) {
+              let img = new Image();
+              let wrapperElement = document.createElement("div");
+              img.style = "height: auto;width: 50px;margin-right: 80px;";
+              img.onload = function () {
+                wrapperElement.appendChild(img);
+                resolve(`data:'image/png';base64,${data}`);
+              };
+              img.onerror = function () {
+                reject(new Error("Failed to load image at " + url));
+              };
+              img.src = `data:'image/png';base64,${data}`;
+            } else {
+              reject(new Error("Failed to load image at " + url));
+            }
+          });
       });
     },
     getGenericThumbnail: async function (url) {
-      return new Promise((resolve, reject) => {
-        fetch(url).then((response) => {
-          if (response.status === 200) {
-            resolve(url);
-          } else {
-            reject();
-          }
-        });
-      });
-    },
-    attachThumbnailToMap: function (id, source, mapImp) {
-      // add it to the maps
-      if (mapImp) {
-        this.attachThumbnailToFlatmap(id, source, mapImp);
-      } else {
-        this.attachThumbnailToScaffold(id, source);
-      }
-    },
-    attachThumbnailToFlatmap: function (id, source, mapImp) {
       return new Promise((resolve, reject) => {
         let img = new Image();
         let wrapperElement = document.createElement("div");
         img.style = "height: auto;width: 50px;margin-right: 80px;";
         img.onload = function () {
           wrapperElement.appendChild(img);
+          resolve(url);
         };
         img.onerror = function () {
           reject(new Error("Failed to load image at " + url));
         };
-        img.src =
-          source.type === "binary"
-            ? `data:'image/png';base64,${source.data}`
-            : source.data;
-
-        // add it to the flatmap
-        const markerIdentifier = mapImp.addMarker(id, {
-          element: wrapperElement,
-          className: "highlight-marker",
-          cluster: false,
-          type: "image",
-        });
-
-        const marker = mapImp.addMarker(id);
-        resolve(marker);
+        img.src = url;
       });
     },
-    attachThumbnailToScaffold: async function (id, source) {
-      if (source) {
-        const blob = await (
-          await fetch(`data:'image/png';base64,${source.data}`)
-        ).blob();
-        const blobUrl = URL.createObjectURL(blob);
-        this.setMarkerModeForObjectsWithName(id, { number: this.markerLabels[id], imgURL: blobUrl }, "on");
-      }
-    }
+    addImageThumbnailMarker: async function (id, source) {
+      const blob = await (await fetch(source)).blob();
+      const blobUrl = URL.createObjectURL(blob);
+      let imageMarker = {};
+      imageMarker[id] = { number: this.markerLabels[id], imgURL: blobUrl };
+      this.setMarkerModeForObjectsWithName(id, { number: this.markerLabels[id], imgURL: blobUrl }, "on");
+      // this.markerLabelEntry = imageMarker;
+    },
   },
 };
diff --git a/src/mixins/scicrunchMixin.js b/src/mixins/scicrunchMixin.js
deleted file mode 100644
index 6f71456..0000000
--- a/src/mixins/scicrunchMixin.js
+++ /dev/null
@@ -1,124 +0,0 @@
-const getFilesInfo = async (api, key, idsList, types) => {
-  let params = new URLSearchParams();
-  types.forEach((type) => {
-    params.append("filetypes", type);
-  });
-  let response = await fetch(`${api}/get-organ-curies/?${params}`);
-  let data = await response.json();
-  const identifiers = [];
-  data.uberon.array.forEach((pair) => {
-    const identifier = {
-      id: pair.id.toUpperCase(),
-      name: pair.name,
-    };
-    if (idsList.includes(identifier[key])) {
-      identifiers.push(identifier);
-    }
-  });
-  const keys = identifiers.map((item) => item.id);
-  response = await fetch(`${api}/get-files-info-for-curies`, {
-    method: "POST",
-    body: JSON.stringify({
-      filetypes: types,
-      curies: keys,
-    }),
-    headers: {
-      "Content-Type": "application/json",
-    },
-  });
-  data = await response.json();
-  return { data: data, identifiers: identifiers };
-};
-
-const getFileName = (filePath) => {
-  return filePath.substring(filePath.lastIndexOf("/") + 1);
-};
-
-export default {
-  methods: {
-    getBiolucidaThumbnails: async function (key, idsList) {
-      try {
-        const { data, identifiers } = await getFilesInfo(
-          this.sparcAPI,
-          key,
-          idsList,
-          ["biolucida-2d", "biolucida-3d"]
-        );
-        if (data["files_info"]) {
-          const images = {};
-          for (const [key, value] of Object.entries(data["files_info"])) {
-            const nameLabel = identifiers.find((item) => item.id === key).name;
-            if (value.length > 0) {
-              const list = [];
-              value.forEach((entry) => {
-                if (entry.biolucida_id) {
-                  let image = {
-                    thumbnail: this.getBiolucidaThumbnailURL(
-                      entry.biolucida_id
-                    ),
-                    id: entry.id,
-                    title: getFileName(entry.file_path),
-                    type: "Image",
-                    link: `https://sparc.biolucida.net/api/v1/thumbnail/${entry.biolucida_id}`,
-                    mimetype: "image/png",
-                  };
-                  list.push(image);
-                }
-              });
-              images[nameLabel] = list;
-            }
-          }
-          return images;
-        }
-      } catch (error) {
-        console.error("Error:", error);
-      }
-      return {};
-    },
-    getBiolucidaThumbnailURL: function (biolucidaId) {
-      return `${this.sparcAPI}/thumbnail/${biolucidaId}`;
-    },
-    getSegmentationThumbnails: async function (key, idsList) {
-      try {
-        const data = await getFilesInfo(this.sparcAPI, key, idsList, [
-          "mbf-segmentation",
-        ]);
-        if (data["files_info"]) {
-          const images = {};
-          for (const [key, value] of Object.entries(data["files_info"])) {
-            if (value.length > 0) {
-              const list = [];
-              value.forEach((entry) => {
-                let image = {
-                  thumbnail: this.getSegmentationThumbnailURL(
-                    entry.id,
-                    entry.version,
-                    entry.file_path
-                  ),
-                  id: entry.id,
-                  title: getFileName(entry.file_path),
-                  type: "Segmentation",
-                  link: this.getBiolucidaThumbnailURL(entry.biolucida_id),
-                  mimetype: "image/png",
-                };
-                list.push(image);
-              });
-              images[key] = list;
-            }
-          }
-          return images;
-        }
-      } catch (error) {
-        console.error("Error:", error);
-      }
-      return {};
-    },
-    getSegmentationThumbnailURL: function (
-      datasetId,
-      datasetVersion,
-      filePath
-    ) {
-      return `${this.sparcAPI}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}`;
-    },
-  },
-};
diff --git a/src/services/scicrunchQueries.js b/src/services/scicrunchQueries.js
new file mode 100644
index 0000000..3b7f405
--- /dev/null
+++ b/src/services/scicrunchQueries.js
@@ -0,0 +1,258 @@
+const getFilesInfo = async (api, key, idsList, types) => {
+  let params = new URLSearchParams();
+  types.forEach((type) => {
+    params.append("filetypes", type);
+  });
+  let response = await fetch(`${api}/get-organ-curies/?${params}`);
+  let data = await response.json();
+  const identifiers = [];
+  data.uberon.array.forEach((pair) => {
+    const identifier = {
+      id: pair.id.toUpperCase(),
+      name: pair.name,
+    };
+    if (idsList.includes(identifier[key])) {
+      identifiers.push(identifier);
+    }
+  });
+  const keys = identifiers.map((item) => item.id);
+  response = await fetch(`${api}/get-files-info-for-curies`, {
+    method: "POST",
+    body: JSON.stringify({
+      filetypes: types,
+      curies: keys,
+    }),
+    headers: {
+      "Content-Type": "application/json",
+    },
+  });
+  data = await response.json();
+  return { data: data, identifiers: identifiers };
+};
+
+const getFileName = (filePath) => {
+  return filePath.substring(filePath.lastIndexOf("/") + 1);
+};
+
+const getBiolucidaThumbnailURL = (sparcApi, biolucidaId) => {
+  return `${sparcApi}/thumbnail/${biolucidaId}`;
+};
+const getBiolucidaThumbnails = async (sparcApi, key, idsList) => {
+  try {
+    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
+      "biolucida-2d",
+      "biolucida-3d",
+    ]);
+    if (data["files_info"]) {
+      const images = {};
+      for (const [key, value] of Object.entries(data["files_info"])) {
+        const nameLabel = identifiers.find((item) => item.id === key).name;
+        if (value.length > 0) {
+          const list = [];
+          value.forEach((entry) => {
+            const thumbnailURL = getBiolucidaThumbnailURL(
+              sparcApi,
+              entry.biolucida_id
+            );
+            if (entry.biolucida_id) {
+              let image = {
+                thumbnail: thumbnailURL,
+                resource: entry.file_path,
+                id: entry.id,
+                title: getFileName(entry.file_path),
+                type: "Image",
+                link: thumbnailURL,
+                mimetype: entry.mimetype,
+              };
+              list.push(image);
+            }
+          });
+          images[nameLabel] = list;
+        }
+      }
+      return images;
+    }
+  } catch (error) {
+    console.error("Error:", error);
+  }
+  return {};
+};
+
+const getSegmentationThumbnailURL = (
+  sparcApi,
+  datasetId,
+  datasetVersion,
+  filePath
+) => {
+  return `${sparcApi}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}`;
+};
+const getSegmentationThumbnails = async (sparcApi, key, idsList) => {
+  try {
+    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
+      "mbf-segmentation",
+    ]);
+    if (data["files_info"]) {
+      const images = {};
+      for (const [key, value] of Object.entries(data["files_info"])) {
+        const nameLabel = identifiers.find((item) => item.id === key).name;
+        if (value.length > 0) {
+          const list = [];
+          value.forEach((entry) => {
+            const thumbnailURL = getSegmentationThumbnailURL(
+              sparcApi,
+              entry.id,
+              entry.version,
+              entry.file_path
+            );
+            let image = {
+              thumbnail: thumbnailURL,
+              resource: entry.file_path,
+              id: entry.id,
+              title: getFileName(entry.file_path),
+              type: "Segmentation",
+              link: thumbnailURL,
+              mimetype: entry.mimetype,
+            };
+            list.push(image);
+          });
+          images[nameLabel] = list;
+        }
+      }
+      return images;
+    }
+  } catch (error) {
+    console.error("Error:", error);
+  }
+  return {};
+};
+
+const findEntryWithPathInArray = (entry, list, type) => {
+  if (entry && list) {
+    for (let i = 0; i < entry.isSourceOf.length; i++) {
+      for (let l = 0; l < list.length; l++) {
+        const item = list[l];
+        if (
+          entry.id === item.id &&
+          (!type || item.type === type) &&
+          entry.isSourceOf[i] === item.file_path
+        ) {
+          return item;
+        }
+      }
+    }
+  }
+  return undefined;
+};
+const getScaffoldThumbnailURL = (sparcApi, entry, list) => {
+  const viewEntry = findEntryWithPathInArray(
+    entry,
+    list,
+    "abi-scaffold-view-file"
+  );
+  const thumbnailEntry = findEntryWithPathInArray(
+    viewEntry,
+    list,
+    "abi-thumbnail"
+  );
+  if (thumbnailEntry) {
+    return `${sparcApi}/s3-resource/${thumbnailEntry.id}/files/${thumbnailEntry.file_path}`;
+  }
+  return undefined;
+};
+const getScaffoldThumbnails = async (sparcApi, key, idsList) => {
+  try {
+    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
+      "abi-thumbnail",
+      "abi-scaffold-metadata-file",
+      "abi-scaffold-view-file",
+    ]);
+    if (data["files_info"]) {
+      const images = {};
+      for (const [key, value] of Object.entries(data["files_info"])) {
+        const nameLabel = identifiers.find((item) => item.id === key).name;
+        if (value.length > 0) {
+          const list = [];
+          value.forEach((entry) => {
+            if (entry.type === "abi-scaffold-metadata-file") {
+              const thumbnailURL = getScaffoldThumbnailURL(
+                sparcApi,
+                entry,
+                value
+              );
+              if (thumbnailURL) {
+                let image = {
+                  thumbnail: thumbnailURL,
+                  resource: entry.file_path,
+                  id: entry.id,
+                  title: getFileName(entry.file_path),
+                  type: "Scaffold",
+                  link: thumbnailURL,
+                };
+                list.push(image);
+              }
+            }
+          });
+          images[nameLabel] = list;
+        }
+      }
+      return images;
+    }
+  } catch (error) {
+    console.error("Error:", error);
+  }
+  return {};
+};
+
+const getPlotThumbnailURL = (sparcApi, entry) => {
+  //None of the thumbnail for plot is properly annotated.
+  //We will use the first in is source of for testing.
+  if (entry.isSourceOf.length > 0) {
+    return `${sparcApi}/s3-resource/${entry.id}/files/${entry.isSourceOf[0]}`;
+  }
+  return undefined;
+};
+const getPlotThumbnails = async (sparcApi, key, idsList) => {
+  try {
+    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
+      "abi-plot",
+      "abi-thumbnail",
+    ]);
+    if (data["files_info"]) {
+      const images = {};
+      for (const [key, value] of Object.entries(data["files_info"])) {
+        const nameLabel = identifiers.find((item) => item.id === key).name;
+        if (value.length > 0) {
+          const list = [];
+          value.forEach((entry) => {
+            if (entry.type === "abi-plot") {
+              const thumbnailURL = getPlotThumbnailURL(sparcApi, entry);
+              if (thumbnailURL) {
+                let image = {
+                  thumbnail: thumbnailURL,
+                  resource: entry.file_path,
+                  datasetId: entry.id,
+                  title: getFileName(entry.file_path),
+                  type: "Plot",
+                  link: thumbnailURL,
+                };
+                list.push(image);
+              }
+            }
+          });
+          images[nameLabel] = list;
+        }
+      }
+      return images;
+    }
+  } catch (error) {
+    console.error("Error:", error);
+  }
+  return {};
+};
+
+export {
+  getBiolucidaThumbnails,
+  getSegmentationThumbnails,
+  getScaffoldThumbnails,
+  getPlotThumbnails,
+};

From 21f288a4f86fecb0446d881233ede7dafad39e30 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Thu, 22 Aug 2024 15:19:24 +1200
Subject: [PATCH 12/32] Improve implementation

---
 src/components/ScaffoldVuer.vue | 19 ++++++++------
 src/mixins/imageMixin.js        | 46 ++++++++++++++++-----------------
 2 files changed, 33 insertions(+), 32 deletions(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 6bacd4a..ba22b91 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -2395,21 +2395,24 @@ export default {
         this.setMarkerModeForObjectsWithName(key, value, "on");
       }
     },
-    removeImageFromMap: function () {
-      this.markerLabelEntry = this.markerLabels
-    },
     setImage: function (flag) {
       if (flag) {
         this.setImageType(this.imageType)
       } else {
-        this.removeImageFromMap()
+        this.removeImageThumbnails()
       }
     },
-    setImageType: async function (type) {
+    setImageType: function (type) {
       this.imageType = type
+      this.removeImageThumbnails()
+      this.populateImageThumbnails(type)
+    },
+    removeImageThumbnails: function () {
+      this.markerLabelEntry = markRaw(this.markerLabels)
+    },
+    populateImageThumbnails: async function (type) {
       this.loading = true
-      this.removeImageFromMap()
-      if (type === "Image"  && !(type in this.anatomyImages)) {
+      if (type === "Image" && !(type in this.anatomyImages)) {
         this.anatomyImages["Image"] = await getBiolucidaThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
       } else if (type === "Segmentation" && !(type in this.anatomyImages)) {
         this.anatomyImages["Segmentation"] = await getSegmentationThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
@@ -2419,7 +2422,7 @@ export default {
         this.anatomyImages["Plot"] = await getPlotThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
       }
       if (this.anatomyImages[type]) {
-        this.populateMapWithImages(this.anatomyImages[type], type)
+        this.markerLabelEntry = markRaw(await this.populateMapWithImages(this.anatomyImages[type], type))
       }
       this.loading = false
     }
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
index 6896053..e1a9ef8 100644
--- a/src/mixins/imageMixin.js
+++ b/src/mixins/imageMixin.js
@@ -1,9 +1,16 @@
 export default {
   methods: {
-    populateMapWithImages: function (images, type) {
+    populateMapWithImages: async function (images, type) {
+      let imageMarkerLabels = {};
       for (const [key, list] of Object.entries(images)) {
-        this.downloadImageThumbnail(key, list, type);
+        const response = await this.downloadImageThumbnail(key, list, type);
+        if (response) {
+          imageMarkerLabels[key] = response;
+        } else {
+          imageMarkerLabels[key] = this.markerLabels[key];
+        }
       }
+      return imageMarkerLabels;
     },
     downloadImageThumbnail: async function (key, list, type) {
       const count = list.length;
@@ -11,21 +18,21 @@ export default {
         //Pick a random image
         const index = Math.floor(Math.random() * count);
         const thumbnail = list[index].thumbnail;
-        this.getThumbnail(thumbnail, type)
-          .then((source) => {
-            this.addImageThumbnailMarker(key, source);
-          })
-          .catch(() => {
-            //Failed to download, pick another one
-            list.splice(index);
-            this.downloadImageThumbnail(key, list, type);
-          });
+        try {
+          const response = await this.getImageThumbnail(thumbnail, type);
+          const markerObject = await this.addImageThumbnailMarker(key, response);
+          return markerObject;
+        } catch (error) {
+          // Failed to download, pick another one
+          list.splice(index);
+          this.downloadImageThumbnail(key, list, type);
+        }
       }
     },
-    getThumbnail: async function (url, type) {
+    getImageThumbnail: async function (url, type) {
       return new Promise((resolve, reject) => {
-        if (type === "Segmentation" || type === "Image") {
-          return this.getBinaryThumbnail(url)
+        if (type === "Image" || type === "Segmentation") {
+          this.getBinaryThumbnail(url)
             .then((response) => resolve(response))
             .catch((response) => reject(response));
         } else {
@@ -48,10 +55,7 @@ export default {
           .then((data) => {
             if (data) {
               let img = new Image();
-              let wrapperElement = document.createElement("div");
-              img.style = "height: auto;width: 50px;margin-right: 80px;";
               img.onload = function () {
-                wrapperElement.appendChild(img);
                 resolve(`data:'image/png';base64,${data}`);
               };
               img.onerror = function () {
@@ -67,10 +71,7 @@ export default {
     getGenericThumbnail: async function (url) {
       return new Promise((resolve, reject) => {
         let img = new Image();
-        let wrapperElement = document.createElement("div");
-        img.style = "height: auto;width: 50px;margin-right: 80px;";
         img.onload = function () {
-          wrapperElement.appendChild(img);
           resolve(url);
         };
         img.onerror = function () {
@@ -82,10 +83,7 @@ export default {
     addImageThumbnailMarker: async function (id, source) {
       const blob = await (await fetch(source)).blob();
       const blobUrl = URL.createObjectURL(blob);
-      let imageMarker = {};
-      imageMarker[id] = { number: this.markerLabels[id], imgURL: blobUrl };
-      this.setMarkerModeForObjectsWithName(id, { number: this.markerLabels[id], imgURL: blobUrl }, "on");
-      // this.markerLabelEntry = imageMarker;
+      return { number: this.markerLabels[id], imgURL: blobUrl };
     },
   },
 };

From 8cfc5fd12d278533c8eeb817799047846794a619 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Thu, 22 Aug 2024 15:25:50 +1200
Subject: [PATCH 13/32] Upgrade zincjs

---
 package-lock.json | 8 ++++----
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index fdca1c6..ba7f0a4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,7 +23,7 @@
         "vue": "^3.4.15",
         "vue-router": "^4.2.5",
         "vue3-component-svg-sprite": "^0.0.1",
-        "zincjs": "^1.11.1"
+        "zincjs": "^1.11.3"
       },
       "devDependencies": {
         "@vitejs/plugin-vue": "^4.6.2",
@@ -8094,9 +8094,9 @@
       }
     },
     "node_modules/zincjs": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/zincjs/-/zincjs-1.11.1.tgz",
-      "integrity": "sha512-q9u/9dXhRca1WRIJFkLSw1thmrVnWe9C9+7gxorpqCVNVcdudGdCgAgKxdj2CDodsHAoVgSkhIi82vguphdz9A==",
+      "version": "1.11.3",
+      "resolved": "https://registry.npmjs.org/zincjs/-/zincjs-1.11.3.tgz",
+      "integrity": "sha512-FF5mk+HxrDhO3Zd0N5C4mGkcGu9gyUEgKSaio8Yik25ySr7x6D/UQrTqZV0mvg6Zus3ETtbToh4nLtusM3+bcw==",
       "dependencies": {
         "css-element-queries": "^1.2.2",
         "lodash": "^4.17.19",
diff --git a/package.json b/package.json
index ac4f200..efc4a94 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "vue": "^3.4.15",
     "vue-router": "^4.2.5",
     "vue3-component-svg-sprite": "^0.0.1",
-    "zincjs": "^1.11.1"
+    "zincjs": "^1.11.3"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^4.6.2",

From 603ed9db10968ded5591dccb721eb1742f6ff010 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Thu, 22 Aug 2024 16:43:08 +1200
Subject: [PATCH 14/32] Fix image size issue

---
 package-lock.json | 8 ++++----
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index ba7f0a4..e726bab 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.4.0",
       "license": "Apache-2.0",
       "dependencies": {
-        "@abi-software/map-utilities": "^1.0.0-beta.1",
+        "@abi-software/map-utilities": "^1.1.0-beta.1",
         "@abi-software/sparc-annotation": "^0.3.1",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
@@ -56,9 +56,9 @@
       }
     },
     "node_modules/@abi-software/map-utilities": {
-      "version": "1.0.0-beta.1",
-      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.0.0-beta.1.tgz",
-      "integrity": "sha512-gOMGlaAqY8Rv6rXJ64oqOeTJHO1W0FigQZnTJKMOj9wMA0jWYsHHREyP8FKbEZZ0YGk9l2cJGL38K/sHTkcNpw==",
+      "version": "1.1.0-beta.1",
+      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.1.0-beta.1.tgz",
+      "integrity": "sha512-HMVxeoNn+iTGhw2Y2YOTXGjrxXeFyS1zrpUklLN9+5lGoCt2bakUbB+Xpc2rwgZUmTvWpPAeUzff1iDH5v/W3A==",
       "dependencies": {
         "@abi-software/gallery": "^1.1.0",
         "@abi-software/svg-sprite": "^1.0.0",
diff --git a/package.json b/package.json
index efc4a94..2c080c9 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "*.js"
   ],
   "dependencies": {
-    "@abi-software/map-utilities": "^1.0.0-beta.1",
+    "@abi-software/map-utilities": "^1.1.0-beta.1",
     "@abi-software/sparc-annotation": "^0.3.1",
     "@abi-software/svg-sprite": "^1.0.0",
     "@element-plus/icons-vue": "^2.3.1",

From df506425eca807be84cb41f9d0001958b813d64e Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Mon, 26 Aug 2024 10:36:20 +1200
Subject: [PATCH 15/32] Replace hover to show with click to show

---
 src/components/ScaffoldVuer.vue | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index ba22b91..fbf5f59 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -15,7 +15,7 @@
       :x="tData.x"
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
-      :anatomyImages="imageRadio ? anatomyImages[imageType] : {}"
+      :anatomyImages="anatomyImagesEntry"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
@@ -285,7 +285,7 @@
         ref="backgroundPopover"
         :virtual-ref="backgroundIconRef"
         placement="top-start"
-        width="320"
+        width="350"
         :teleported="false"
         trigger="click"
         popper-class="background-popper non-selectable h-auto"
@@ -312,7 +312,7 @@
             </el-row>
           </el-row>
           <el-row class="backgroundSpacer" v-if="viewingMode === 'Exploration'"></el-row>
-          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">Images Display</el-row>
+          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">Types display</el-row>
           <el-row class="backgroundChooser" v-if="viewingMode === 'Exploration'">
             <el-col :span="12">
               <el-radio-group
@@ -320,8 +320,8 @@
                 class="flatmap-radio"
                 @change="setImage"
               >
-                <el-radio :value="false">Hide</el-radio>
-                <el-radio :value="true">Show</el-radio>
+                <el-radio :value="false">Marker</el-radio>
+                <el-radio :value="true">Image</el-radio>
               </el-radio-group>
             </el-col>
             <el-col :span="12" v-if="imageRadio">
@@ -869,6 +869,7 @@ export default {
       imageRadio: false,
       imageType: 'Image',
       imageTypes: ['Image', 'Segmentation', 'Scaffold', 'Plot'],
+      imageClicked: false,
     };
   },
   watch: {
@@ -1001,6 +1002,9 @@ export default {
     annotationDisplay: function() {
       return this.viewingMode === 'Annotation' && this.tData.active === true &&
         (this.activeDrawMode === 'Edit' || this.activeDrawMode === 'Delete');
+    },
+    anatomyImagesEntry: function() {
+      return this.imageClicked ? this.anatomyImages[this.imageType] : {};
     }
   },
   methods: {
@@ -1563,6 +1567,11 @@ export default {
                 this.$refs.scaffoldTreeControls.removeActive(false);
               }
             }
+            if (this.imageRadio && event.identifiers.length) {
+              this.imageClicked = true
+            } else {
+              this.imageClicked = false
+            }
             //Emit when an object is selected
             //@arg Identifier of selected objects
             this.$emit("scaffold-selected", event.identifiers);

From f11e66812c568597a23c9b636c5e9878b33479cd Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Mon, 26 Aug 2024 11:23:34 +1200
Subject: [PATCH 16/32] Create setting store

---
 src/App.vue                        |  30 ++----
 src/components/ScaffoldTooltip.vue |   2 +-
 src/components/ScaffoldVuer.vue    |  40 ++++----
 src/main.js                        |   2 +-
 src/services/scicrunchQueries.js   | 143 ++++++++++++++++++++---------
 src/{store => stores}/index.js     |   0
 src/stores/settings.js             |  17 ++++
 7 files changed, 148 insertions(+), 86 deletions(-)
 rename src/{store => stores}/index.js (100%)
 create mode 100644 src/stores/settings.js

diff --git a/src/App.vue b/src/App.vue
index 59e2853..ca7f6a9 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -37,7 +37,6 @@
         @timeChanged="updateCurrentTime"
         @zinc-object-added="objectAdded"
         @vue:mounted="viewerMounted"
-        :anatomyImages=anatomyImages
       />
     </drop-zone>
 
@@ -323,6 +322,9 @@ import {
 import { useRoute, useRouter } from 'vue-router'
 import { HelpModeDialog } from '@abi-software/map-utilities'
 import '@abi-software/map-utilities/dist/style.css'
+import { mapStores } from 'pinia';
+import { useSettingsStore } from '@/stores/settings';
+import { getOrganCuries } from '@/services/scicrunchQueries'
 
 let texture_prefix = undefined;
 
@@ -411,9 +413,11 @@ export default {
       auto: NaN,
       sparcAPI: import.meta.env.VITE_SPARC_API,
       // sparcAPI: "http://localhost:8000/",
-      anatomyImages: {},
     };
   },
+  computed: {
+    ...mapStores(useSettingsStore),
+  },
   watch: {
     input: function () {
       this.parseInput();
@@ -459,6 +463,7 @@ export default {
   },
   mounted: function () {
     this._objects = [];
+    getOrganCuries(this.sparcAPI).then((organCuries) => this.settingsStore.updateOrganCuries(organCuries))
   },
   created: function () {
     texture_prefix = import.meta.env.VITE_TEXTURE_FOOT_PREFIX;
@@ -467,27 +472,6 @@ export default {
     this.$refs.dropzone.revokeURLs();
   },
   methods: {
-    imageMarkerLabels:function (value) {
-      let imageLabels = {}
-      if (value) {
-        for (const [key, value] of Object.entries(this.markerLabels)) {
-          const imageLabel = key.toLowerCase()
-          imageLabels[key] = value
-          if (imageLabel in this.anatomyImages) {
-            imageLabels[key] = { number: value, imgURL: this.anatomyImages[imageLabel][0].thumbnail }
-          }
-        }
-      } else {
-        for (const [key, value] of Object.entries(this.markerLabels)) {
-          if (typeof value === "object") {
-            imageLabels[key] = this.markerLabels[key].number
-          } else {
-            imageLabels[key] = value
-          }
-        }
-      }
-      this.markerLabels = imageLabels
-    },
     exportGLTF: function () {
       this.$refs.scaffold.exportGLTF(false).then((data) => {
         const filename = 'export' + JSON.stringify(new Date()) + '.gltf';
diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 23e73b0..e6be32a 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -71,7 +71,7 @@ import {
   Delete as ElIconDelete,
 } from '@element-plus/icons-vue'
 import { mapState } from 'pinia';
-import { useMainStore } from "@/store/index";
+import { useMainStore } from "@/stores/index";
 import CreateTooltipContent from "./CreateTooltipContent.vue";
 import { Tooltip } from '@abi-software/map-utilities'
 import '@abi-software/map-utilities/dist/style.css'
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index fbf5f59..2ca68d0 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -457,8 +457,9 @@ import { AnnotationService } from '@abi-software/sparc-annotation';
 import { EventNotifier } from "../scripts/EventNotifier.js";
 import { OrgansViewer } from "../scripts/OrgansRenderer.js";
 import { SearchIndex } from "../scripts/Search.js";
-import { mapState } from 'pinia';
-import { useMainStore } from "@/store/index";
+import { mapState, mapStores } from 'pinia';
+import { useMainStore } from "@/stores/index";
+import { useSettingsStore } from '@/stores/settings'
 import {
   getBiolucidaThumbnails,
   getSegmentationThumbnails,
@@ -949,7 +950,7 @@ export default {
       },
       immediate: true,
     },
-    markerLabels: function(labels) {
+    markerLabels: function (labels) {
       this.markerLabelEntry = markRaw({...labels})
     },
     markerLabelEntry: function (entry) {
@@ -960,7 +961,7 @@ export default {
         this.setMarkerModeForObjectsWithName(key, value, "on");
       }
       this.previousMarkerLabelEntry = markRaw({...entry});
-    }
+    },
   },
   beforeCreate: function () {
     this.$module = new OrgansViewer();
@@ -999,6 +1000,7 @@ export default {
   },
   computed: {
     ...mapState(useMainStore,  ['userToken']),
+    ...mapStores(useSettingsStore),
     annotationDisplay: function() {
       return this.viewingMode === 'Annotation' && this.tData.active === true &&
         (this.activeDrawMode === 'Edit' || this.activeDrawMode === 'Delete');
@@ -2404,6 +2406,9 @@ export default {
         this.setMarkerModeForObjectsWithName(key, value, "on");
       }
     },
+    removeImageThumbnails: function () {
+      this.markerLabelEntry = markRaw(this.markerLabels)
+    },
     setImage: function (flag) {
       if (flag) {
         this.setImageType(this.imageType)
@@ -2413,23 +2418,24 @@ export default {
     },
     setImageType: function (type) {
       this.imageType = type
-      this.removeImageThumbnails()
       this.populateImageThumbnails(type)
     },
-    removeImageThumbnails: function () {
-      this.markerLabelEntry = markRaw(this.markerLabels)
-    },
     populateImageThumbnails: async function (type) {
       this.loading = true
-      if (type === "Image" && !(type in this.anatomyImages)) {
-        this.anatomyImages["Image"] = await getBiolucidaThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
-      } else if (type === "Segmentation" && !(type in this.anatomyImages)) {
-        this.anatomyImages["Segmentation"] = await getSegmentationThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
-      } else if (type === "Scaffold" && !(type in this.anatomyImages)) {
-        this.anatomyImages["Scaffold"] = await getScaffoldThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
-      } else if (type === "Plot" && !(type in this.anatomyImages)) {
-        this.anatomyImages["Plot"] = await getPlotThumbnails(this.sparcAPI, "name", Object.keys(this.markerLabels))
-      }
+      const identifiers = Object.keys(this.markerLabels)
+      const organCuries = this.settingsStore.organCuries
+      this.removeImageThumbnails()
+      if (!(type in this.anatomyImages)) {
+        if (type === "Image") {
+          this.anatomyImages["Image"] = await getBiolucidaThumbnails(this.sparcAPI, "name", identifiers, organCuries)
+        } else if (type === "Segmentation") {
+          this.anatomyImages["Segmentation"] = await getSegmentationThumbnails(this.sparcAPI, "name", identifiers, organCuries)
+        } else if (type === "Scaffold") {
+          this.anatomyImages["Scaffold"] = await getScaffoldThumbnails(this.sparcAPI, "name", identifiers, organCuries)
+        } else if (type === "Plot") {
+          this.anatomyImages["Plot"] = await getPlotThumbnails(this.sparcAPI, "name", identifiers, organCuries)
+        }
+    }
       if (this.anatomyImages[type]) {
         this.markerLabelEntry = markRaw(await this.populateMapWithImages(this.anatomyImages[type], type))
       }
diff --git a/src/main.js b/src/main.js
index a78b61b..9217e2d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -2,7 +2,7 @@ import { createApp } from 'vue'
 import { createPinia } from 'pinia'
 import * as VueRouter from 'vue-router'
 import App from './App.vue'
-import { useMainStore } from '@/store/index'
+import { useMainStore } from '@/stores/index'
 
 const routes = [
   { path: '/'},
diff --git a/src/services/scicrunchQueries.js b/src/services/scicrunchQueries.js
index 3b7f405..e0e19c2 100644
--- a/src/services/scicrunchQueries.js
+++ b/src/services/scicrunchQueries.js
@@ -1,52 +1,79 @@
-const getFilesInfo = async (api, key, idsList, types) => {
+const getOrganCuries = async (sparcApi, filetypes = [], species = []) => {
   let params = new URLSearchParams();
-  types.forEach((type) => {
+  filetypes.forEach((type) => {
     params.append("filetypes", type);
   });
-  let response = await fetch(`${api}/get-organ-curies/?${params}`);
-  let data = await response.json();
-  const identifiers = [];
+  species.forEach((name) => {
+    params.append("species", name);
+  });
+
+  const response = await fetch(`${sparcApi}/get-organ-curies/?${params}`);
+  const data = await response.json();
+
+  let organCuries = [];
   data.uberon.array.forEach((pair) => {
-    const identifier = {
+    const organCurie = {
       id: pair.id.toUpperCase(),
       name: pair.name,
     };
-    if (idsList.includes(identifier[key])) {
-      identifiers.push(identifier);
-    }
+    organCuries.push(organCurie);
   });
-  const keys = identifiers.map((item) => item.id);
-  response = await fetch(`${api}/get-files-info-for-curies`, {
+
+  return organCuries;
+};
+
+const getFilesInfoForCuries = async (
+  sparcApi,
+  key,
+  identifiers,
+  organCuries,
+  filetypes
+) => {
+  const curies = organCuries
+    .filter((item) => identifiers.includes(item[key]))
+    .map((item) => item.id);
+
+  const response = await fetch(`${sparcApi}/get-files-info-for-curies`, {
     method: "POST",
     body: JSON.stringify({
-      filetypes: types,
-      curies: keys,
+      curies: curies,
+      filetypes: filetypes,
     }),
     headers: {
       "Content-Type": "application/json",
     },
   });
-  data = await response.json();
-  return { data: data, identifiers: identifiers };
+  const data = await response.json();
+
+  return data;
 };
 
-const getFileName = (filePath) => {
+const getFileNameFromPath = (filePath) => {
   return filePath.substring(filePath.lastIndexOf("/") + 1);
 };
 
 const getBiolucidaThumbnailURL = (sparcApi, biolucidaId) => {
   return `${sparcApi}/thumbnail/${biolucidaId}`;
 };
-const getBiolucidaThumbnails = async (sparcApi, key, idsList) => {
+
+const getBiolucidaThumbnails = async (
+  sparcApi,
+  key,
+  identifiers,
+  organCuries
+) => {
   try {
-    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
-      "biolucida-2d",
-      "biolucida-3d",
-    ]);
+    const data = await getFilesInfoForCuries(
+      sparcApi,
+      key,
+      identifiers,
+      organCuries,
+      ["biolucida-2d", "biolucida-3d"]
+    );
     if (data["files_info"]) {
       const images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = identifiers.find((item) => item.id === key).name;
+        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
           const list = [];
           value.forEach((entry) => {
@@ -59,10 +86,11 @@ const getBiolucidaThumbnails = async (sparcApi, key, idsList) => {
                 thumbnail: thumbnailURL,
                 resource: entry.file_path,
                 id: entry.id,
-                title: getFileName(entry.file_path),
+                title: getFileNameFromPath(entry.file_path),
                 type: "Image",
                 link: thumbnailURL,
                 mimetype: entry.mimetype,
+                species: entry.species,
               };
               list.push(image);
             }
@@ -86,15 +114,25 @@ const getSegmentationThumbnailURL = (
 ) => {
   return `${sparcApi}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}`;
 };
-const getSegmentationThumbnails = async (sparcApi, key, idsList) => {
+
+const getSegmentationThumbnails = async (
+  sparcApi,
+  key,
+  identifiers,
+  organCuries
+) => {
   try {
-    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
-      "mbf-segmentation",
-    ]);
+    const data = await getFilesInfoForCuries(
+      sparcApi,
+      key,
+      identifiers,
+      organCuries,
+      ["mbf-segmentation"]
+    );
     if (data["files_info"]) {
       const images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = identifiers.find((item) => item.id === key).name;
+        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
           const list = [];
           value.forEach((entry) => {
@@ -108,10 +146,11 @@ const getSegmentationThumbnails = async (sparcApi, key, idsList) => {
               thumbnail: thumbnailURL,
               resource: entry.file_path,
               id: entry.id,
-              title: getFileName(entry.file_path),
+              title: getFileNameFromPath(entry.file_path),
               type: "Segmentation",
               link: thumbnailURL,
               mimetype: entry.mimetype,
+              species: entry.species,
             };
             list.push(image);
           });
@@ -143,6 +182,7 @@ const findEntryWithPathInArray = (entry, list, type) => {
   }
   return undefined;
 };
+
 const getScaffoldThumbnailURL = (sparcApi, entry, list) => {
   const viewEntry = findEntryWithPathInArray(
     entry,
@@ -159,17 +199,25 @@ const getScaffoldThumbnailURL = (sparcApi, entry, list) => {
   }
   return undefined;
 };
-const getScaffoldThumbnails = async (sparcApi, key, idsList) => {
+
+const getScaffoldThumbnails = async (
+  sparcApi,
+  key,
+  identifiers,
+  organCuries
+) => {
   try {
-    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
-      "abi-thumbnail",
-      "abi-scaffold-metadata-file",
-      "abi-scaffold-view-file",
-    ]);
+    const data = await getFilesInfoForCuries(
+      sparcApi,
+      key,
+      identifiers,
+      organCuries,
+      ["abi-thumbnail", "abi-scaffold-metadata-file", "abi-scaffold-view-file"]
+    );
     if (data["files_info"]) {
       const images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = identifiers.find((item) => item.id === key).name;
+        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
           const list = [];
           value.forEach((entry) => {
@@ -184,9 +232,10 @@ const getScaffoldThumbnails = async (sparcApi, key, idsList) => {
                   thumbnail: thumbnailURL,
                   resource: entry.file_path,
                   id: entry.id,
-                  title: getFileName(entry.file_path),
+                  title: getFileNameFromPath(entry.file_path),
                   type: "Scaffold",
                   link: thumbnailURL,
+                  species: entry.species,
                 };
                 list.push(image);
               }
@@ -211,16 +260,20 @@ const getPlotThumbnailURL = (sparcApi, entry) => {
   }
   return undefined;
 };
-const getPlotThumbnails = async (sparcApi, key, idsList) => {
+
+const getPlotThumbnails = async (sparcApi, key, identifiers, organCuries) => {
   try {
-    const { data, identifiers } = await getFilesInfo(sparcApi, key, idsList, [
-      "abi-plot",
-      "abi-thumbnail",
-    ]);
+    const data = await getFilesInfoForCuries(
+      sparcApi,
+      key,
+      identifiers,
+      organCuries,
+      ["abi-plot", "abi-thumbnail"]
+    );
     if (data["files_info"]) {
       const images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = identifiers.find((item) => item.id === key).name;
+        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
           const list = [];
           value.forEach((entry) => {
@@ -231,9 +284,10 @@ const getPlotThumbnails = async (sparcApi, key, idsList) => {
                   thumbnail: thumbnailURL,
                   resource: entry.file_path,
                   datasetId: entry.id,
-                  title: getFileName(entry.file_path),
+                  title: getFileNameFromPath(entry.file_path),
                   type: "Plot",
                   link: thumbnailURL,
+                  species: entry.species,
                 };
                 list.push(image);
               }
@@ -251,6 +305,7 @@ const getPlotThumbnails = async (sparcApi, key, idsList) => {
 };
 
 export {
+  getOrganCuries,
   getBiolucidaThumbnails,
   getSegmentationThumbnails,
   getScaffoldThumbnails,
diff --git a/src/store/index.js b/src/stores/index.js
similarity index 100%
rename from src/store/index.js
rename to src/stores/index.js
diff --git a/src/stores/settings.js b/src/stores/settings.js
new file mode 100644
index 0000000..465d675
--- /dev/null
+++ b/src/stores/settings.js
@@ -0,0 +1,17 @@
+import { defineStore } from "pinia";
+
+/* eslint-disable no-alert, no-console */
+
+export const useSettingsStore = defineStore("settings", {
+  state: () => {
+    return {
+      organCuries: [],
+    };
+  },
+  getters: {},
+  actions: {
+    updateOrganCuries(organCuries) {
+      this.organCuries = organCuries;
+    },
+  },
+});

From 211a3f2b383fa00617ba15f0d41de1a1f98e1d04 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Mon, 26 Aug 2024 14:54:11 +1200
Subject: [PATCH 17/32] Add image data emit and flag to show in sidebar

---
 src/components/ScaffoldTooltip.vue | 13 +++++++++++--
 src/components/ScaffoldVuer.vue    | 16 ++++++++++++++--
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index e6be32a..dd972f6 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -129,6 +129,10 @@ export default {
       type: Object,
       default: {},
     },
+    imageThumbnailSidebar: {
+      type: Boolean,
+      default: false,
+    },
   },
   inject: ['scaffoldUrl'],
   provide() {
@@ -154,13 +158,18 @@ export default {
     },
     imageEntry: function () {
       const anatomyImageEntries = {}
+      let imageEntries = []
       Object.entries(this.anatomyImages).forEach(([key, value]) => {
         Object.assign(anatomyImageEntries, { [key.toLowerCase()]: value })
       })
       if (this.label in anatomyImageEntries) {
-        return anatomyImageEntries[this.label];
+        imageEntries = anatomyImageEntries[this.label];
+      }
+      if (this.imageThumbnailSidebar) {
+        this.$emit('image-thumbnail-open', imageEntries)
+        return [];
       }
-      return [];
+      return imageEntries;
     },
   },
   methods: {
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 2ca68d0..c752146 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -15,10 +15,12 @@
       :x="tData.x"
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
+      :imageThumbnailSidebar="imageThumbnailSidebar"
       :anatomyImages="anatomyImagesEntry"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
+      @image-thumbnail-open="onImageThumbnailOpen"
     />
     <div
       id="organsDisplayArea"
@@ -745,6 +747,13 @@ export default {
       type: String,
       default: 'https://api.sparc.science/',
     },
+    /**
+     * The option to show image thumbnail in sidebar
+     */
+    imageThumbnailSidebar: {
+      type: Boolean,
+      default: false,
+    },
   },
   provide() {
     return {
@@ -868,7 +877,7 @@ export default {
       },
       anatomyImages: markRaw({}),
       imageRadio: false,
-      imageType: 'Image',
+      imageType: 'Scaffold',
       imageTypes: ['Image', 'Segmentation', 'Scaffold', 'Plot'],
       imageClicked: false,
     };
@@ -2440,7 +2449,10 @@ export default {
         this.markerLabelEntry = markRaw(await this.populateMapWithImages(this.anatomyImages[type], type))
       }
       this.loading = false
-    }
+    },
+    onImageThumbnailOpen: function (payload) {
+      this.$emit('image-thumbnail-open', payload);
+    },
   },
 };
 </script>

From 8018dbbe9bfe164ee88c7d6c05921a61b0b56c8f Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Mon, 26 Aug 2024 16:31:07 +1200
Subject: [PATCH 18/32] Update default image type to Image

---
 src/components/ScaffoldVuer.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index c752146..d4f1828 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -877,7 +877,7 @@ export default {
       },
       anatomyImages: markRaw({}),
       imageRadio: false,
-      imageType: 'Scaffold',
+      imageType: 'Image',
       imageTypes: ['Image', 'Segmentation', 'Scaffold', 'Plot'],
       imageClicked: false,
     };

From 53106583124b9b3df180db96811e2b667c73078d Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Tue, 27 Aug 2024 12:44:22 +1200
Subject: [PATCH 19/32] minor update

---
 package-lock.json | 60 +++++++++++------------------------------------
 package.json      |  2 +-
 2 files changed, 15 insertions(+), 47 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e726bab..0980e7d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -28,7 +28,7 @@
       "devDependencies": {
         "@vitejs/plugin-vue": "^4.6.2",
         "@vuese/markdown-render": "^2.11.3",
-        "@vuese/parser": "^2.10.3",
+        "@vuese/parser": "^2.9.1",
         "auto-changelog": "^2.4.0",
         "babel-eslint": "^10.1.0",
         "babel-plugin-component": "^1.1.1",
@@ -1119,17 +1119,10 @@
       "dev": true
     },
     "node_modules/@vuese/parser": {
-      "version": "2.10.3",
-      "resolved": "https://registry.npmjs.org/@vuese/parser/-/parser-2.10.3.tgz",
-      "integrity": "sha512-Vcn++EJps0KS8fs9aBllFC6CKx6ttVPXtbbZCyXXWtoQC5VyDaydU0UFVaDciznUNGqwSzjNNVvxQqOPdmV0vQ==",
-      "dev": true,
-      "dependencies": {
-        "@babel/generator": "^7.12.10",
-        "@babel/parser": "^7.12.0",
-        "@babel/traverse": "^7.12.0",
-        "@babel/types": "^7.3.4",
-        "vue-template-compiler": "^2.6.11"
-      }
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@vuese/parser/-/parser-2.9.1.tgz",
+      "integrity": "sha512-5XVgmg9TviosbQEzo0Et1n/WX6s+fmK2l3DKEX8tGaPJLKN+Qh5GEosjHVYw1E4nZllPv2kDa7HqKwqR+0QUUw==",
+      "dev": true
     },
     "node_modules/@vueuse/core": {
       "version": "9.13.0",
@@ -1852,9 +1845,9 @@
       }
     },
     "node_modules/axios": {
-      "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
-      "integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.5.tgz",
+      "integrity": "sha512-fZu86yCo+svH3uqJ/yTdQ0QHpQu5oL+/QE+QPSv6BZSkDAoky9vytxp7u5qk83OJFS3kEBcesWni9WTZAv3tSw==",
       "dependencies": {
         "follow-redirects": "^1.15.6",
         "form-data": "^4.0.0",
@@ -2711,12 +2704,6 @@
       "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.12.tgz",
       "integrity": "sha512-Rt2g+nTbLlDWZTwwrIXjy9MeiZmSDI375FvZs72ngxx8PDC6YXOeR3q5LAuPzjZQxhiWdRKac7RKV+YyQYfYIg=="
     },
-    "node_modules/de-indent": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
-      "integrity": "sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==",
-      "dev": true
-    },
     "node_modules/debug": {
       "version": "4.3.6",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.6.tgz",
@@ -2860,9 +2847,9 @@
       }
     },
     "node_modules/elliptic": {
-      "version": "6.5.6",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.6.tgz",
-      "integrity": "sha512-mpzdtpeCLuS3BmE3pO3Cpp5bbjlOPY2Q0PgoF+Od1XZrHLYI28Xe3ossCmYCQt11FQKEYd9+PF8jymTvtWJSHQ==",
+      "version": "6.5.7",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.7.tgz",
+      "integrity": "sha512-ESVCtTwiA+XhY3wyh24QqRGBoP3rEdDUl3EDUUo9tft074fi19IrdpH7hLCMMP3CIj7jb3W96rn8lt/BqIlt5Q==",
       "dev": true,
       "dependencies": {
         "bn.js": "^4.11.9",
@@ -4278,15 +4265,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/he": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
-      "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
-      "dev": true,
-      "bin": {
-        "he": "bin/he"
-      }
-    },
     "node_modules/hmac-drbg": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
@@ -5182,9 +5160,9 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.7",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
-      "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
       "dependencies": {
         "braces": "^3.0.3",
         "picomatch": "^2.3.1"
@@ -7710,16 +7688,6 @@
         "vue": "^3.2.0"
       }
     },
-    "node_modules/vue-template-compiler": {
-      "version": "2.7.16",
-      "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.16.tgz",
-      "integrity": "sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ==",
-      "dev": true,
-      "dependencies": {
-        "de-indent": "^1.0.2",
-        "he": "^1.2.0"
-      }
-    },
     "node_modules/vue3-component-svg-sprite": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/vue3-component-svg-sprite/-/vue3-component-svg-sprite-0.0.1.tgz",
diff --git a/package.json b/package.json
index 2c080c9..438ef13 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,7 @@
   "devDependencies": {
     "@vitejs/plugin-vue": "^4.6.2",
     "@vuese/markdown-render": "^2.11.3",
-    "@vuese/parser": "^2.10.3",
+    "@vuese/parser": "^2.9.1",
     "auto-changelog": "^2.4.0",
     "babel-eslint": "^10.1.0",
     "babel-plugin-component": "^1.1.1",

From 192b82671861ff6ba81111461a9cba8422f17ccd Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Wed, 28 Aug 2024 15:08:10 +1200
Subject: [PATCH 20/32] Update setting store and click to show image logic

---
 package-lock.json                  |  39 ++-------
 package.json                       |   2 +-
 src/components/ScaffoldTooltip.vue |  15 ++--
 src/components/ScaffoldVuer.vue    |  75 +++++++++++------
 src/services/scicrunchQueries.js   | 127 +++++++++++------------------
 src/stores/settings.js             |  31 ++++++-
 6 files changed, 143 insertions(+), 146 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 0980e7d..6dbf899 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.4.0",
       "license": "Apache-2.0",
       "dependencies": {
-        "@abi-software/map-utilities": "^1.1.0-beta.1",
+        "@abi-software/map-utilities": "^1.1.0-beta.2",
         "@abi-software/sparc-annotation": "^0.3.1",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
@@ -56,11 +56,11 @@
       }
     },
     "node_modules/@abi-software/map-utilities": {
-      "version": "1.1.0-beta.1",
-      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.1.0-beta.1.tgz",
-      "integrity": "sha512-HMVxeoNn+iTGhw2Y2YOTXGjrxXeFyS1zrpUklLN9+5lGoCt2bakUbB+Xpc2rwgZUmTvWpPAeUzff1iDH5v/W3A==",
+      "version": "1.1.0-beta.2",
+      "resolved": "https://registry.npmjs.org/@abi-software/map-utilities/-/map-utilities-1.1.0-beta.2.tgz",
+      "integrity": "sha512-pDK6H8eciFgYl2XGVJIVuXmm+zvPI9VsM2NoN0mOX3kC1sMD7yL+dIO9VJe1xARg8zSZidAf1ra55je6Z31yTA==",
       "dependencies": {
-        "@abi-software/gallery": "^1.1.0",
+        "@abi-software/gallery": "^1.1.1",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
         "element-plus": "^2.7.3",
@@ -857,26 +857,6 @@
         "shiki": "1.12.0"
       }
     },
-    "node_modules/@types/eslint": {
-      "version": "9.6.0",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.0.tgz",
-      "integrity": "sha512-gi6WQJ7cHRgZxtkQEoyHMppPjq9Kxo5Tjn2prSKDSmZrCz8TZ3jSRCeTJm+WoM+oB0WG37bRqLzaaU3q7JypGg==",
-      "peer": true,
-      "dependencies": {
-        "@types/estree": "*",
-        "@types/json-schema": "*"
-      }
-    },
-    "node_modules/@types/eslint-scope": {
-      "version": "3.7.7",
-      "resolved": "https://registry.npmjs.org/@types/eslint-scope/-/eslint-scope-3.7.7.tgz",
-      "integrity": "sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==",
-      "peer": true,
-      "dependencies": {
-        "@types/eslint": "*",
-        "@types/estree": "*"
-      }
-    },
     "node_modules/@types/estree": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
@@ -7724,12 +7704,11 @@
       "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ=="
     },
     "node_modules/webpack": {
-      "version": "5.93.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.93.0.tgz",
-      "integrity": "sha512-Y0m5oEY1LRuwly578VqluorkXbvXKh7U3rLoQCEO04M97ScRr44afGVkI0FQFsXzysk5OgFAxjZAb9rsGQVihA==",
+      "version": "5.94.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.94.0.tgz",
+      "integrity": "sha512-KcsGn50VT+06JH/iunZJedYGUJS5FGjow8wb9c0v5n1Om8O1g4L6LjtfxwlXIATopoQu+vOXXa7gYisWxCoPyg==",
       "peer": true,
       "dependencies": {
-        "@types/eslint-scope": "^3.7.3",
         "@types/estree": "^1.0.5",
         "@webassemblyjs/ast": "^1.12.1",
         "@webassemblyjs/wasm-edit": "^1.12.1",
@@ -7738,7 +7717,7 @@
         "acorn-import-attributes": "^1.9.5",
         "browserslist": "^4.21.10",
         "chrome-trace-event": "^1.0.2",
-        "enhanced-resolve": "^5.17.0",
+        "enhanced-resolve": "^5.17.1",
         "es-module-lexer": "^1.2.1",
         "eslint-scope": "5.1.1",
         "events": "^3.2.0",
diff --git a/package.json b/package.json
index 438ef13..5ef7bb2 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "*.js"
   ],
   "dependencies": {
-    "@abi-software/map-utilities": "^1.1.0-beta.1",
+    "@abi-software/map-utilities": "^1.1.0-beta.2",
     "@abi-software/sparc-annotation": "^0.3.1",
     "@abi-software/svg-sprite": "^1.0.0",
     "@element-plus/icons-vue": "^2.3.1",
diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index dd972f6..5be2856 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -125,7 +125,7 @@ export default {
       type: Number,
       default: 200,
     },
-    anatomyImages: {
+    imageThumbnails: {
       type: Object,
       default: {},
     },
@@ -157,13 +157,14 @@ export default {
       return { left: x + "px", top: this.y - yOffset + "px" };
     },
     imageEntry: function () {
-      const anatomyImageEntries = {}
       let imageEntries = []
-      Object.entries(this.anatomyImages).forEach(([key, value]) => {
-        Object.assign(anatomyImageEntries, { [key.toLowerCase()]: value })
-      })
-      if (this.label in anatomyImageEntries) {
-        imageEntries = anatomyImageEntries[this.label];
+      const imageThumbnailsEntries = Object.assign({},
+        Object.fromEntries(
+          Object.entries(this.imageThumbnails)
+            .filter(([key, value]) => value.length > 0)
+            .map(([key, value]) => [key.toLowerCase(), value])))
+      if (this.label in imageThumbnailsEntries) {
+        imageEntries = imageThumbnailsEntries[this.label];
       }
       if (this.imageThumbnailSidebar) {
         this.$emit('image-thumbnail-open', imageEntries)
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index d4f1828..c35b283 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -16,7 +16,7 @@
       :y="tData.y"
       :annotationDisplay="annotationDisplay"
       :imageThumbnailSidebar="imageThumbnailSidebar"
-      :anatomyImages="anatomyImagesEntry"
+      :imageThumbnails="imageThumbnailsEntry"
       @confirm-create="confirmCreate($event)"
       @cancel-create="cancelCreate()"
       @confirm-delete="confirmDelete($event)"
@@ -875,11 +875,10 @@ export default {
         centre: [0, 0, 0],
         size:[1, 1, 1],
       },
-      anatomyImages: markRaw({}),
       imageRadio: false,
       imageType: 'Image',
       imageTypes: ['Image', 'Segmentation', 'Scaffold', 'Plot'],
-      imageClicked: false,
+      imageClicked: '',
     };
   },
   watch: {
@@ -1014,8 +1013,8 @@ export default {
       return this.viewingMode === 'Annotation' && this.tData.active === true &&
         (this.activeDrawMode === 'Edit' || this.activeDrawMode === 'Delete');
     },
-    anatomyImagesEntry: function() {
-      return this.imageClicked ? this.anatomyImages[this.imageType] : {};
+    imageThumbnailsEntry: function() {
+      return this.imageClicked ? this.convertUberonToName() : {};
     }
   },
   methods: {
@@ -1578,10 +1577,12 @@ export default {
                 this.$refs.scaffoldTreeControls.removeActive(false);
               }
             }
-            if (this.imageRadio && event.identifiers.length) {
-              this.imageClicked = true
+            if (this.imageRadio && event.identifiers.length && event.identifiers[0]) {
+              this.imageClicked = event.identifiers[0].data.id
+                ? event.identifiers[0].data.id
+                : event.identifiers[0].data.group;
             } else {
-              this.imageClicked = false
+              this.imageClicked = ''
             }
             //Emit when an object is selected
             //@arg Identifier of selected objects
@@ -1633,6 +1634,12 @@ export default {
               this.createEditTemporaryLines(event.identifiers[0].extraData.worldCoords);
             }
             this.createEditTemporaryLines(event.identifiers[0].extraData.worldCoords);
+            const id = event.identifiers[0].data.id
+              ? event.identifiers[0].data.id
+              : event.identifiers[0].data.group;
+            if (this.imageClicked !== id) {
+              this.imageClicked = ''
+            }
           }
         }
       }
@@ -2416,6 +2423,7 @@ export default {
       }
     },
     removeImageThumbnails: function () {
+      this.imageThumbnails = {}
       this.markerLabelEntry = markRaw(this.markerLabels)
     },
     setImage: function (flag) {
@@ -2425,29 +2433,43 @@ export default {
         this.removeImageThumbnails()
       }
     },
-    setImageType: function (type) {
+    setImageType: async function (type) {
       this.imageType = type
+      if (!this.settingsStore.imageTypeCached(type)) {
+        this.loading = true
+        await this.fetchImageThumbnails(type)
+        this.loading = false
+      }
       this.populateImageThumbnails(type)
     },
-    populateImageThumbnails: async function (type) {
-      this.loading = true
-      const identifiers = Object.keys(this.markerLabels)
+    fetchImageThumbnails: async function (type) {
+      let thumbnails = {}
+      const organCuries = this.settingsStore.organCuries
+      if (type === 'Image') {
+        thumbnails = await getBiolucidaThumbnails(this.sparcAPI, organCuries, type)
+      } else if (type === 'Segmentation') {
+        thumbnails = await getSegmentationThumbnails(this.sparcAPI, organCuries, type)
+      } else if (type === 'Scaffold') {
+        thumbnails = await getScaffoldThumbnails(this.sparcAPI, organCuries, type)
+      } else if (type === 'Plot') {
+        thumbnails = await getPlotThumbnails(this.sparcAPI, organCuries, type)
+      }
+      this.settingsStore.updateImageThumbnails(type, thumbnails)
+    },
+    convertUberonToName: function () {
       const organCuries = this.settingsStore.organCuries
+      const identifiers = organCuries.filter((curie) => curie.name in this.markerLabels).map((curie) => curie.id)
+      const imageThumbnails = this.settingsStore.getImageThumbnails(this.imageType, identifiers)
+      return Object.assign({},
+        Object.fromEntries(
+          Object.entries(imageThumbnails)
+            .map(([key, value]) => [organCuries.filter((curie) => curie.id === key)[0].name, value])))
+    },
+    populateImageThumbnails: async function (type) {
       this.removeImageThumbnails()
-      if (!(type in this.anatomyImages)) {
-        if (type === "Image") {
-          this.anatomyImages["Image"] = await getBiolucidaThumbnails(this.sparcAPI, "name", identifiers, organCuries)
-        } else if (type === "Segmentation") {
-          this.anatomyImages["Segmentation"] = await getSegmentationThumbnails(this.sparcAPI, "name", identifiers, organCuries)
-        } else if (type === "Scaffold") {
-          this.anatomyImages["Scaffold"] = await getScaffoldThumbnails(this.sparcAPI, "name", identifiers, organCuries)
-        } else if (type === "Plot") {
-          this.anatomyImages["Plot"] = await getPlotThumbnails(this.sparcAPI, "name", identifiers, organCuries)
-        }
-    }
-      if (this.anatomyImages[type]) {
-        this.markerLabelEntry = markRaw(await this.populateMapWithImages(this.anatomyImages[type], type))
-      }
+      const thumbnails = this.convertUberonToName()
+      this.loading = true
+      this.markerLabelEntry = markRaw(await this.populateMapWithImages(thumbnails, type))
       this.loading = false
     },
     onImageThumbnailOpen: function (payload) {
@@ -2476,7 +2498,6 @@ export default {
 .backgroundSpacer {
   border-bottom: 1px solid #e4e7ed;
   margin-bottom: 10px;
-  margin-top: 5px;
 }
 
 .warning-icon {
diff --git a/src/services/scicrunchQueries.js b/src/services/scicrunchQueries.js
index e0e19c2..a6ab34a 100644
--- a/src/services/scicrunchQueries.js
+++ b/src/services/scicrunchQueries.js
@@ -22,21 +22,11 @@ const getOrganCuries = async (sparcApi, filetypes = [], species = []) => {
   return organCuries;
 };
 
-const getFilesInfoForCuries = async (
-  sparcApi,
-  key,
-  identifiers,
-  organCuries,
-  filetypes
-) => {
-  const curies = organCuries
-    .filter((item) => identifiers.includes(item[key]))
-    .map((item) => item.id);
-
+const getFilesInfoForCuries = async (sparcApi, organCuries, filetypes) => {
   const response = await fetch(`${sparcApi}/get-files-info-for-curies`, {
     method: "POST",
     body: JSON.stringify({
-      curies: curies,
+      curies: organCuries.map((item) => item.id),
       filetypes: filetypes,
     }),
     headers: {
@@ -56,26 +46,18 @@ const getBiolucidaThumbnailURL = (sparcApi, biolucidaId) => {
   return `${sparcApi}/thumbnail/${biolucidaId}`;
 };
 
-const getBiolucidaThumbnails = async (
-  sparcApi,
-  key,
-  identifiers,
-  organCuries
-) => {
+const getBiolucidaThumbnails = async (sparcApi, organCuries, type) => {
   try {
-    const data = await getFilesInfoForCuries(
-      sparcApi,
-      key,
-      identifiers,
-      organCuries,
-      ["biolucida-2d", "biolucida-3d"]
-    );
+    const data = await getFilesInfoForCuries(sparcApi, organCuries, [
+      "biolucida-2d",
+      "biolucida-3d",
+    ]);
+
     if (data["files_info"]) {
-      const images = {};
+      let images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
-          const list = [];
+          let list = [];
           value.forEach((entry) => {
             const thumbnailURL = getBiolucidaThumbnailURL(
               sparcApi,
@@ -87,15 +69,16 @@ const getBiolucidaThumbnails = async (
                 resource: entry.file_path,
                 id: entry.id,
                 title: getFileNameFromPath(entry.file_path),
-                type: "Image",
+                type: type,
                 link: thumbnailURL,
                 mimetype: entry.mimetype,
                 species: entry.species,
+                version: entry.version,
               };
               list.push(image);
             }
           });
-          images[nameLabel] = list;
+          images[key] = list;
         }
       }
       return images;
@@ -115,26 +98,17 @@ const getSegmentationThumbnailURL = (
   return `${sparcApi}/thumbnail/neurolucida?datasetId=${datasetId}&version=${datasetVersion}&path=files/${filePath}`;
 };
 
-const getSegmentationThumbnails = async (
-  sparcApi,
-  key,
-  identifiers,
-  organCuries
-) => {
+const getSegmentationThumbnails = async (sparcApi, organCuries, type) => {
   try {
-    const data = await getFilesInfoForCuries(
-      sparcApi,
-      key,
-      identifiers,
-      organCuries,
-      ["mbf-segmentation"]
-    );
+    const data = await getFilesInfoForCuries(sparcApi, organCuries, [
+      "mbf-segmentation",
+    ]);
+
     if (data["files_info"]) {
-      const images = {};
+      let images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
-          const list = [];
+          let list = [];
           value.forEach((entry) => {
             const thumbnailURL = getSegmentationThumbnailURL(
               sparcApi,
@@ -147,14 +121,15 @@ const getSegmentationThumbnails = async (
               resource: entry.file_path,
               id: entry.id,
               title: getFileNameFromPath(entry.file_path),
-              type: "Segmentation",
+              type: type,
               link: thumbnailURL,
               mimetype: entry.mimetype,
               species: entry.species,
+              version: entry.version,
             };
             list.push(image);
           });
-          images[nameLabel] = list;
+          images[key] = list;
         }
       }
       return images;
@@ -200,26 +175,19 @@ const getScaffoldThumbnailURL = (sparcApi, entry, list) => {
   return undefined;
 };
 
-const getScaffoldThumbnails = async (
-  sparcApi,
-  key,
-  identifiers,
-  organCuries
-) => {
+const getScaffoldThumbnails = async (sparcApi, organCuries, type) => {
   try {
-    const data = await getFilesInfoForCuries(
-      sparcApi,
-      key,
-      identifiers,
-      organCuries,
-      ["abi-thumbnail", "abi-scaffold-metadata-file", "abi-scaffold-view-file"]
-    );
+    const data = await getFilesInfoForCuries(sparcApi, organCuries, [
+      "abi-thumbnail",
+      "abi-scaffold-metadata-file",
+      "abi-scaffold-view-file",
+    ]);
+
     if (data["files_info"]) {
-      const images = {};
+      let images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
-          const list = [];
+          let list = [];
           value.forEach((entry) => {
             if (entry.type === "abi-scaffold-metadata-file") {
               const thumbnailURL = getScaffoldThumbnailURL(
@@ -233,15 +201,16 @@ const getScaffoldThumbnails = async (
                   resource: entry.file_path,
                   id: entry.id,
                   title: getFileNameFromPath(entry.file_path),
-                  type: "Scaffold",
+                  type: type,
                   link: thumbnailURL,
                   species: entry.species,
+                  version: entry.version,
                 };
                 list.push(image);
               }
             }
           });
-          images[nameLabel] = list;
+          images[key] = list;
         }
       }
       return images;
@@ -261,21 +230,18 @@ const getPlotThumbnailURL = (sparcApi, entry) => {
   return undefined;
 };
 
-const getPlotThumbnails = async (sparcApi, key, identifiers, organCuries) => {
+const getPlotThumbnails = async (sparcApi, organCuries, type) => {
   try {
-    const data = await getFilesInfoForCuries(
-      sparcApi,
-      key,
-      identifiers,
-      organCuries,
-      ["abi-plot", "abi-thumbnail"]
-    );
+    const data = await getFilesInfoForCuries(sparcApi, organCuries, [
+      "abi-plot",
+      "abi-thumbnail",
+    ]);
+
     if (data["files_info"]) {
-      const images = {};
+      let images = {};
       for (const [key, value] of Object.entries(data["files_info"])) {
-        const nameLabel = organCuries.find((item) => item.id === key).name;
         if (value.length > 0) {
-          const list = [];
+          let list = [];
           value.forEach((entry) => {
             if (entry.type === "abi-plot") {
               const thumbnailURL = getPlotThumbnailURL(sparcApi, entry);
@@ -283,17 +249,18 @@ const getPlotThumbnails = async (sparcApi, key, identifiers, organCuries) => {
                 let image = {
                   thumbnail: thumbnailURL,
                   resource: entry.file_path,
-                  datasetId: entry.id,
+                  id: entry.id,
                   title: getFileNameFromPath(entry.file_path),
-                  type: "Plot",
+                  type: type,
                   link: thumbnailURL,
                   species: entry.species,
+                  version: entry.version,
                 };
                 list.push(image);
               }
             }
           });
-          images[nameLabel] = list;
+          images[key] = list;
         }
       }
       return images;
diff --git a/src/stores/settings.js b/src/stores/settings.js
index 465d675..67bc5a7 100644
--- a/src/stores/settings.js
+++ b/src/stores/settings.js
@@ -6,12 +6,41 @@ export const useSettingsStore = defineStore("settings", {
   state: () => {
     return {
       organCuries: [],
+      imageTypes: [],
+      imageThumbnails: {},
     };
   },
-  getters: {},
+  getters: {
+    imageTypeCached: (state) => (imageType) => {
+      return state.imageTypes.includes(imageType);
+    },
+    getImageThumbnails:
+      (state) =>
+        (imageType, uberonIds = undefined) => {
+          if (uberonIds) {
+            let thumbnails = {};
+            Object.entries(state.imageThumbnails).forEach(([key, value]) => {
+              if (uberonIds.includes(key)) {
+                thumbnails[key] = value.filter((item) => item.type === imageType);
+              }
+            });
+            return thumbnails;
+          }
+          return state.imageThumbnails;
+        },
+  },
   actions: {
     updateOrganCuries(organCuries) {
       this.organCuries = organCuries;
     },
+    updateImageThumbnails(imageType, imageThumbnails) {
+      this.imageTypes.push(imageType);
+      Object.keys(imageThumbnails).forEach((key) => {
+        if (!(key in this.imageThumbnails)) {
+          this.imageThumbnails[key] = [];
+        }
+        this.imageThumbnails[key].push(...imageThumbnails[key]);
+      });
+    },
   },
 });

From d54312a0bcac1b361f39b4f5f427f271f9f770ad Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Thu, 29 Aug 2024 13:11:24 +1200
Subject: [PATCH 21/32] Update image select box

---
 src/components/ScaffoldVuer.vue | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index c35b283..14cbdb8 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -287,7 +287,7 @@
         ref="backgroundPopover"
         :virtual-ref="backgroundIconRef"
         placement="top-start"
-        width="350"
+        width="330"
         :teleported="false"
         trigger="click"
         popper-class="background-popper non-selectable h-auto"
@@ -314,24 +314,24 @@
             </el-row>
           </el-row>
           <el-row class="backgroundSpacer" v-if="viewingMode === 'Exploration'"></el-row>
-          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">Types display</el-row>
+          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">Markers display</el-row>
           <el-row class="backgroundChooser" v-if="viewingMode === 'Exploration'">
-            <el-col :span="12">
+            <el-col :span="14">
               <el-radio-group
                 v-model="imageRadio"
                 class="flatmap-radio"
                 @change="setImage"
               >
-                <el-radio :value="false">Marker</el-radio>
+                <el-radio :value="false">Standard</el-radio>
                 <el-radio :value="true">Image</el-radio>
               </el-radio-group>
             </el-col>
-            <el-col :span="12" v-if="imageRadio">
+            <el-col :span="10" v-if="imageRadio">
               <el-select
                 :teleported="false"
                 v-model="imageType"
                 placeholder="Select"
-                class="select-box"
+                class="scaffold-select-box imageSelector"
                 popper-class="scaffold_viewer_dropdown"
                 @change="setImageType"
               >
@@ -2891,6 +2891,10 @@ export default {
       min-height: 24px
     }
   }
+
+  &.imageSelector {
+    width: 120px!important;
+  }
 }
 
 :deep(.scaffold_viewer_dropdown) {

From 2974d0dd512b9cd685aad01e9a22aca8764f87cb Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Thu, 29 Aug 2024 13:51:46 +1200
Subject: [PATCH 22/32] Increase select box width

---
 src/components/ScaffoldVuer.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 14cbdb8..64f7949 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -2893,7 +2893,7 @@ export default {
   }
 
   &.imageSelector {
-    width: 120px!important;
+    width: 125px!important;
   }
 }
 

From 206d31c1d9ecedfcd027d010bee678c1c5ec072e Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Fri, 30 Aug 2024 11:46:59 +1200
Subject: [PATCH 23/32] v1.4.0-beta.0 image selector

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6dbf899..19e1ecc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@abi-software/scaffoldvuer",
-  "version": "1.4.0",
+  "version": "1.4.0-beta.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@abi-software/scaffoldvuer",
-      "version": "1.4.0",
+      "version": "1.4.0-beta.0",
       "license": "Apache-2.0",
       "dependencies": {
         "@abi-software/map-utilities": "^1.1.0-beta.2",
diff --git a/package.json b/package.json
index 5ef7bb2..e27da57 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/scaffoldvuer",
-  "version": "1.4.0",
+  "version": "1.4.0-beta.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",

From 223d53beeee60f2aa85aa225ba4959d3fd65c528 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Fri, 30 Aug 2024 16:35:35 +1200
Subject: [PATCH 24/32] Fix a issue related to label case

---
 src/components/ScaffoldTooltip.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 5be2856..96333f2 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -163,8 +163,9 @@ export default {
           Object.entries(this.imageThumbnails)
             .filter(([key, value]) => value.length > 0)
             .map(([key, value]) => [key.toLowerCase(), value])))
-      if (this.label in imageThumbnailsEntries) {
-        imageEntries = imageThumbnailsEntries[this.label];
+      const lowerCaseLabel = this.label.toLowerCase()
+      if (lowerCaseLabel in imageThumbnailsEntries) {
+        imageEntries = imageThumbnailsEntries[lowerCaseLabel];
       }
       if (this.imageThumbnailSidebar) {
         this.$emit('image-thumbnail-open', imageEntries)

From 8521bca59e5ec0e6a2d86858291c2b0e91007786 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Mon, 2 Sep 2024 10:06:17 +1200
Subject: [PATCH 25/32] v1.4.0-beta.1 minor fix

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 19e1ecc..b05839a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@abi-software/scaffoldvuer",
-  "version": "1.4.0-beta.0",
+  "version": "1.4.0-beta.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@abi-software/scaffoldvuer",
-      "version": "1.4.0-beta.0",
+      "version": "1.4.0-beta.1",
       "license": "Apache-2.0",
       "dependencies": {
         "@abi-software/map-utilities": "^1.1.0-beta.2",
diff --git a/package.json b/package.json
index e27da57..bb453d8 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/scaffoldvuer",
-  "version": "1.4.0-beta.0",
+  "version": "1.4.0-beta.1",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",

From 1bb23e7aadfb1e62d6c7805981e1340f285ffbcd Mon Sep 17 00:00:00 2001
From: alan-wu <alan.wu@auckland.ac.nz>
Date: Mon, 2 Sep 2024 14:42:45 +1200
Subject: [PATCH 26/32] Add changes.

---
 package-lock.json | 210 ++++++++++++++++++++++++++++++++++++++++++++++
 package.json      |   5 +-
 2 files changed, 214 insertions(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index 6dbf899..c9b1821 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -42,6 +42,9 @@
         "vite-plugin-node-polyfills": "^0.21.0",
         "vitepress": "^1.0.0-rc.42",
         "webpack-node-externals": "^2.5.2"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-linux-x64-gnu": "^4.21.1"
       }
     },
     "node_modules/@abi-software/gallery": {
@@ -826,6 +829,32 @@
         }
       }
     },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.19.1.tgz",
+      "integrity": "sha512-XzqSg714++M+FXhHfXpS1tDnNZNpgxxuGZWlRG/jSj+VEPmZ0yg6jV4E0AL3uyBKxO8mO3xtOsP5mQ+XLfrlww==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.19.1.tgz",
+      "integrity": "sha512-thFUbkHteM20BGShD6P08aungq4irbIZKUNbG70LN8RkO7YztcGPiKTTGZS7Kw+x5h8hOXs0i4OaHwFxlpQN6A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
     "node_modules/@rollup/rollup-darwin-arm64": {
       "version": "4.19.1",
       "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.19.1.tgz",
@@ -839,6 +868,174 @@
         "darwin"
       ]
     },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.19.1.tgz",
+      "integrity": "sha512-4T42heKsnbjkn7ovYiAdDVRRWZLU9Kmhdt6HafZxFcUdpjlBlxj4wDrt1yFWLk7G4+E+8p2C9tcmSu0KA6auGA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.19.1.tgz",
+      "integrity": "sha512-MXg1xp+e5GhZ3Vit1gGEyoC+dyQUBy2JgVQ+3hUrD9wZMkUw/ywgkpK7oZgnB6kPpGrxJ41clkPPnsknuD6M2Q==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.19.1.tgz",
+      "integrity": "sha512-DZNLwIY4ftPSRVkJEaxYkq7u2zel7aah57HESuNkUnz+3bZHxwkCUkrfS2IWC1sxK6F2QNIR0Qr/YXw7nkF3Pw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.19.1.tgz",
+      "integrity": "sha512-C7evongnjyxdngSDRRSQv5GvyfISizgtk9RM+z2biV5kY6S/NF/wta7K+DanmktC5DkuaJQgoKGf7KUDmA7RUw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.19.1.tgz",
+      "integrity": "sha512-89tFWqxfxLLHkAthAcrTs9etAoBFRduNfWdl2xUs/yLV+7XDrJ5yuXMHptNqf1Zw0UCA3cAutkAiAokYCkaPtw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.19.1.tgz",
+      "integrity": "sha512-PromGeV50sq+YfaisG8W3fd+Cl6mnOOiNv2qKKqKCpiiEke2KiKVyDqG/Mb9GWKbYMHj5a01fq/qlUR28PFhCQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.19.1.tgz",
+      "integrity": "sha512-/1BmHYh+iz0cNCP0oHCuF8CSiNj0JOGf0jRlSo3L/FAyZyG2rGBuKpkZVH9YF+x58r1jgWxvm1aRg3DHrLDt6A==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.19.1.tgz",
+      "integrity": "sha512-0cYP5rGkQWRZKy9/HtsWVStLXzCF3cCBTRI+qRL8Z+wkYlqN7zrSYm6FuY5Kd5ysS5aH0q5lVgb/WbG4jqXN1Q==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.21.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.21.1.tgz",
+      "integrity": "sha512-kXQVcWqDcDKw0S2E0TmhlTLlUgAmMVqPrJZR+KpH/1ZaZhLSl23GZpQVmawBQGVhyP5WXIsIQ/zqbDBBYmxm5w==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.19.1.tgz",
+      "integrity": "sha512-V7cBw/cKXMfEVhpSvVZhC+iGifD6U1zJ4tbibjjN+Xi3blSXaj/rJynAkCFFQfoG6VZrAiP7uGVzL440Q6Me2Q==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.19.1.tgz",
+      "integrity": "sha512-88brja2vldW/76jWATlBqHEoGjJLRnP0WOEKAUbMcXaAZnemNhlAHSyj4jIwMoP2T750LE9lblvD4e2jXleZsA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.19.1.tgz",
+      "integrity": "sha512-LdxxcqRVSXi6k6JUrTah1rHuaupoeuiv38du8Mt4r4IPer3kwlTo+RuvfE8KzZ/tL6BhaPlzJ3835i6CxrFIRQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.19.1.tgz",
+      "integrity": "sha512-2bIrL28PcK3YCqD9anGxDxamxdiJAxA+l7fWIwM5o8UqNy1t3d1NdAweO2XhA0KTDJ5aH1FsuiT5+7VhtHliXg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
     "node_modules/@shikijs/core": {
       "version": "1.12.0",
       "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-1.12.0.tgz",
@@ -6285,6 +6482,19 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/rollup/node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.19.1.tgz",
+      "integrity": "sha512-XUXeI9eM8rMP8aGvii/aOOiMvTs7xlCosq9xCjcqI9+5hBxtjDpD+7Abm1ZhVIFE1J2h2VIg0t2DX/gjespC2Q==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
     "node_modules/run-parallel": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
diff --git a/package.json b/package.json
index 5ef7bb2..8408e16 100644
--- a/package.json
+++ b/package.json
@@ -92,5 +92,8 @@
   "browserslist": [
     "> 1%",
     "last 2 versions"
-  ]
+  ],
+  "optionalDependencies": {
+    "@rollup/rollup-linux-x64-gnu": "^4.21.1"
+  }
 }

From b1804a731b257f295886245b246a5696d8410d6a Mon Sep 17 00:00:00 2001
From: alan-wu <alan.wu@auckland.ac.nz>
Date: Mon, 2 Sep 2024 15:22:19 +1200
Subject: [PATCH 27/32] Add imageType to resource selected callback.

---
 src/components/ScaffoldVuer.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 64f7949..44054f8 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -1554,6 +1554,9 @@ export default {
                 ? identifier.data.id
                 : identifier.data.group;
               names.push(id);
+              if (identifier.data) {
+                identifier.data.imageType = this.imageRadio ? this.imageType : "Standard"
+              }
             }
           });
           zincObjects = event.zincObjects;

From 5208cbb87f2e57cac5c4f255585dfe20bf21a092 Mon Sep 17 00:00:00 2001
From: "David J. Yu" <87633683+ddjnw1yu@users.noreply.github.com>
Date: Tue, 3 Sep 2024 12:25:39 +1200
Subject: [PATCH 28/32] Hide maker display option when sparcAPI not exists

Some people may not able to access the api. This change not included in v1.4.0-beta.2.
---
 package-lock.json               |  4 +-
 package.json                    |  2 +-
 src/App.vue                     |  5 ++-
 src/components/ScaffoldVuer.vue | 72 +++++++++++++++++----------------
 4 files changed, 43 insertions(+), 40 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 8dc28d3..c3e6278 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@abi-software/scaffoldvuer",
-  "version": "1.4.0-beta.1",
+  "version": "1.4.0-beta.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@abi-software/scaffoldvuer",
-      "version": "1.4.0-beta.1",
+      "version": "1.4.0-beta.2",
       "license": "Apache-2.0",
       "dependencies": {
         "@abi-software/map-utilities": "^1.1.0-beta.2",
diff --git a/package.json b/package.json
index 41af8f7..bc7248e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/scaffoldvuer",
-  "version": "1.4.0-beta.1",
+  "version": "1.4.0-beta.2",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
diff --git a/src/App.vue b/src/App.vue
index ca7f6a9..771f529 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -412,7 +412,6 @@ export default {
       ElIconFolderOpened: shallowRef(ElIconFolderOpened),
       auto: NaN,
       sparcAPI: import.meta.env.VITE_SPARC_API,
-      // sparcAPI: "http://localhost:8000/",
     };
   },
   computed: {
@@ -463,7 +462,9 @@ export default {
   },
   mounted: function () {
     this._objects = [];
-    getOrganCuries(this.sparcAPI).then((organCuries) => this.settingsStore.updateOrganCuries(organCuries))
+    if (this.sparcAPI) {
+      getOrganCuries(this.sparcAPI).then((organCuries) => this.settingsStore.updateOrganCuries(organCuries))
+    }
   },
   created: function () {
     texture_prefix = import.meta.env.VITE_TEXTURE_FOOT_PREFIX;
diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 44054f8..6b74253 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -313,41 +313,43 @@
               {{ viewingModes[viewingMode] }}
             </el-row>
           </el-row>
-          <el-row class="backgroundSpacer" v-if="viewingMode === 'Exploration'"></el-row>
-          <el-row class="backgroundText" v-if="viewingMode === 'Exploration'">Markers display</el-row>
-          <el-row class="backgroundChooser" v-if="viewingMode === 'Exploration'">
-            <el-col :span="14">
-              <el-radio-group
-                v-model="imageRadio"
-                class="flatmap-radio"
-                @change="setImage"
-              >
-                <el-radio :value="false">Standard</el-radio>
-                <el-radio :value="true">Image</el-radio>
-              </el-radio-group>
-            </el-col>
-            <el-col :span="10" v-if="imageRadio">
-              <el-select
-                :teleported="false"
-                v-model="imageType"
-                placeholder="Select"
-                class="scaffold-select-box imageSelector"
-                popper-class="scaffold_viewer_dropdown"
-                @change="setImageType"
-              >
-                <el-option
-                  v-for="item in imageTypes"
-                  :key="item"
-                  :label="item"
-                  :value="item"
+          <template v-if="viewingMode === 'Exploration' && sparcAPI">
+            <el-row class="backgroundSpacer"></el-row>
+            <el-row class="backgroundText">Markers display</el-row>
+            <el-row class="backgroundChooser">
+              <el-col :span="14">
+                <el-radio-group
+                  v-model="imageRadio"
+                  class="flatmap-radio"
+                  @change="setImage"
                 >
-                  <el-row>
-                    <el-col :span="12">{{ item }}</el-col>
-                  </el-row>
-                </el-option>
-              </el-select>
-            </el-col>
-          </el-row>
+                  <el-radio :value="false">Standard</el-radio>
+                  <el-radio :value="true">Image</el-radio>
+                </el-radio-group>
+              </el-col>
+              <el-col :span="10" v-if="imageRadio">
+                <el-select
+                  :teleported="false"
+                  v-model="imageType"
+                  placeholder="Select"
+                  class="scaffold-select-box imageSelector"
+                  popper-class="scaffold_viewer_dropdown"
+                  @change="setImageType"
+                >
+                  <el-option
+                    v-for="item in imageTypes"
+                    :key="item"
+                    :label="item"
+                    :value="item"
+                  >
+                    <el-row>
+                      <el-col :span="12">{{ item }}</el-col>
+                    </el-row>
+                  </el-option>
+                </el-select>
+              </el-col>
+            </el-row>
+          </template>
           <el-row class="backgroundSpacer"></el-row>
           <el-row class="backgroundText"> Change background </el-row>
           <el-row class="backgroundChooser">
@@ -745,7 +747,7 @@ export default {
      */
     sparcAPI: {
       type: String,
-      default: 'https://api.sparc.science/',
+      default: '',
     },
     /**
      * The option to show image thumbnail in sidebar

From 5dac051dc0f51385527f245386d7bf1681322b7b Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Wed, 4 Sep 2024 15:04:57 +1200
Subject: [PATCH 29/32] Disable markers display switch while downloading
 thumbnail images

---
 src/components/ScaffoldVuer.vue | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 6b74253..282d4f8 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -321,6 +321,7 @@
                 <el-radio-group
                   v-model="imageRadio"
                   class="flatmap-radio"
+                  :disabled="imagesDownloading"
                   @change="setImage"
                 >
                   <el-radio :value="false">Standard</el-radio>
@@ -334,6 +335,7 @@
                   placeholder="Select"
                   class="scaffold-select-box imageSelector"
                   popper-class="scaffold_viewer_dropdown"
+                  :disabled="imagesDownloading"
                   @change="setImageType"
                 >
                   <el-option
@@ -619,12 +621,12 @@ export default {
      * GroupName to value pair.
      * The value can be a single number or and object in the following
      * form:
-     * 
+     *
      * {
      *  number: Number,
      *  imgURL: String
      * }
-     * 
+     *
      * When imgURL is specified, scaffoldvuer will attempt to render
      * the image in imgURL as marker instead.
      *
@@ -807,6 +809,7 @@ export default {
       inHelp: false,
       helpModeActiveIndex: this.helpModeInitialIndex,
       loading: false,
+      imagesDownloading: false,
       duration: 3000,
       drawerOpen: true,
       currentBackground: "white",
@@ -1153,7 +1156,7 @@ export default {
         region, group, this.url, comment);
       if (this.enableLocalAnnotations) {
         annotation.group = group;
-        let regionPath = region; 
+        let regionPath = region;
         if (regionPath.slice(-1) === "/") {
           regionPath = regionPath.slice(0, -1);
         }
@@ -1256,7 +1259,7 @@ export default {
         }
       }
       this.cancelCreate();
-    },  
+    },
     formatTooltip(val) {
       if (this.timeMax >= 1000) {
         if (val) {
@@ -1343,7 +1346,7 @@ export default {
       return objects;
     },
     /**
-     * Switch active drawing type 
+     * Switch active drawing type
      * @arg shapeName shape to toggle
      *
      * @vuese
@@ -1468,7 +1471,7 @@ export default {
           this.createData.points.push(coords);
         }
       }
-    },    
+    },
     /**
      * Return renderer information
      *
@@ -2031,7 +2034,7 @@ export default {
     /**
      * Set the marker modes for objects with the provided name, mode can
      * be "on", "off" or "inherited".
-     * Value can either be number or an object containing number and 
+     * Value can either be number or an object containing number and
      * imgURL.
      */
     setMarkerModeForObjectsWithName: function (name, value, mode) {
@@ -2290,7 +2293,7 @@ export default {
           const region = annotation.region;
           let fullName = region.slice(-1) === "/" ? region : region + "/";
           const noSlash = fullName.slice(0, -1);
-          annotation.region = noSlash; 
+          annotation.region = noSlash;
           fullName = fullName + group;
           const featureID = encodeURIComponent(fullName);
           annotation.item.id = featureID;
@@ -2440,6 +2443,7 @@ export default {
     },
     setImageType: async function (type) {
       this.imageType = type
+      this.imagesDownloading = true;
       if (!this.settingsStore.imageTypeCached(type)) {
         this.loading = true
         await this.fetchImageThumbnails(type)
@@ -2476,6 +2480,7 @@ export default {
       this.loading = true
       this.markerLabelEntry = markRaw(await this.populateMapWithImages(thumbnails, type))
       this.loading = false
+      this.imagesDownloading = false;
     },
     onImageThumbnailOpen: function (payload) {
       this.$emit('image-thumbnail-open', payload);

From ae080e5ab108643821b8e008104c41c272346406 Mon Sep 17 00:00:00 2001
From: alan-wu <alan.wu@auckland.ac.nz>
Date: Thu, 5 Sep 2024 16:42:11 +1200
Subject: [PATCH 30/32] Improve image thumbnails.

---
 src/components/ScaffoldVuer.vue | 72 ++++++++++++++++++++-------------
 src/mixins/imageMixin.js        |  2 -
 2 files changed, 43 insertions(+), 31 deletions(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 44054f8..ab71983 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -879,6 +879,10 @@ export default {
       imageType: 'Image',
       imageTypes: ['Image', 'Segmentation', 'Scaffold', 'Plot'],
       imageClicked: '',
+      /**
+       * List of group names 
+       */
+      groupNames: markRaw([]),
     };
   },
   watch: {
@@ -959,7 +963,10 @@ export default {
       immediate: true,
     },
     markerLabels: function (labels) {
-      this.markerLabelEntry = markRaw({...labels})
+      if (this.imageRadio === false) {
+        //Only updates the following if marker mode is standard
+        this.markerLabelEntry = markRaw({...labels});
+      }
     },
     markerLabelEntry: function (entry) {
       for (const [key, value] of Object.entries(this.previousMarkerLabelEntry)) {
@@ -1040,6 +1047,9 @@ export default {
       if (this.timeVarying === false && zincObject.isTimeVarying()) {
         this.timeVarying = true;
       }
+      if (zincObject.groupName) {
+        this.groupNames.push(zincObject.groupName.toLowerCase());
+      }
       //Emit when a new object is added to the scene
       //@arg The object added to the sceene
       this.$emit("zinc-object-added", zincObject);
@@ -2330,6 +2340,7 @@ export default {
             visibility: visibility,
           })
         );
+        this.groupNames.length = 0;
         if (this.fileFormat === "gltf") {
           this.$module.loadGLTFFromURL(newValue, "scene", true);
         } else {
@@ -2426,54 +2437,57 @@ export default {
       }
     },
     removeImageThumbnails: function () {
-      this.imageThumbnails = {}
-      this.markerLabelEntry = markRaw(this.markerLabels)
+      this.imageThumbnails = {};
+      this.markerLabelEntry = markRaw(this.markerLabels);
     },
-    setImage: function (flag) {
+    setImage: async function (flag) {
       if (flag) {
-        this.setImageType(this.imageType)
+        await this.setImageType(this.imageType);
+        this.$module.scene.enableMarkerCluster(false);
       } else {
-        this.removeImageThumbnails()
+        this.removeImageThumbnails();
+        this.$module.scene.enableMarkerCluster(this.markerCluster);
       }
     },
     setImageType: async function (type) {
-      this.imageType = type
+      this.imageType = type;
       if (!this.settingsStore.imageTypeCached(type)) {
-        this.loading = true
-        await this.fetchImageThumbnails(type)
-        this.loading = false
+        this.loading = true;
+        await this.fetchImageThumbnails(type);
+        this.loading = false;
       }
-      this.populateImageThumbnails(type)
+      this.populateImageThumbnails(type);
     },
     fetchImageThumbnails: async function (type) {
-      let thumbnails = {}
-      const organCuries = this.settingsStore.organCuries
+      let thumbnails = {};
+      const organCuries = this.settingsStore.organCuries;
       if (type === 'Image') {
-        thumbnails = await getBiolucidaThumbnails(this.sparcAPI, organCuries, type)
+        thumbnails = await getBiolucidaThumbnails(this.sparcAPI, organCuries, type);
       } else if (type === 'Segmentation') {
-        thumbnails = await getSegmentationThumbnails(this.sparcAPI, organCuries, type)
+        thumbnails = await getSegmentationThumbnails(this.sparcAPI, organCuries, type);
       } else if (type === 'Scaffold') {
-        thumbnails = await getScaffoldThumbnails(this.sparcAPI, organCuries, type)
+        thumbnails = await getScaffoldThumbnails(this.sparcAPI, organCuries, type);
       } else if (type === 'Plot') {
-        thumbnails = await getPlotThumbnails(this.sparcAPI, organCuries, type)
+        thumbnails = await getPlotThumbnails(this.sparcAPI, organCuries, type);
       }
-      this.settingsStore.updateImageThumbnails(type, thumbnails)
+      this.settingsStore.updateImageThumbnails(type, thumbnails);
     },
     convertUberonToName: function () {
-      const organCuries = this.settingsStore.organCuries
-      const identifiers = organCuries.filter((curie) => curie.name in this.markerLabels).map((curie) => curie.id)
-      const imageThumbnails = this.settingsStore.getImageThumbnails(this.imageType, identifiers)
-      return Object.assign({},
-        Object.fromEntries(
+      const organCuries = this.settingsStore.organCuries;
+      const identifiers = organCuries.filter(
+        (curie) => this.groupNames.includes(curie.name.toLowerCase())
+        ).map((curie) => curie.id);
+      const imageThumbnails = this.settingsStore.getImageThumbnails(this.imageType, identifiers);
+      return Object.fromEntries(
           Object.entries(imageThumbnails)
-            .map(([key, value]) => [organCuries.filter((curie) => curie.id === key)[0].name, value])))
+            .map(([key, value]) => [organCuries.filter((curie) => curie.id === key)[0].name, value]));
     },
     populateImageThumbnails: async function (type) {
-      this.removeImageThumbnails()
-      const thumbnails = this.convertUberonToName()
-      this.loading = true
-      this.markerLabelEntry = markRaw(await this.populateMapWithImages(thumbnails, type))
-      this.loading = false
+      this.removeImageThumbnails();
+      const thumbnails = this.convertUberonToName();
+      this.loading = true;
+      this.markerLabelEntry = markRaw(await this.populateMapWithImages(thumbnails, type));
+      this.loading = false;
     },
     onImageThumbnailOpen: function (payload) {
       this.$emit('image-thumbnail-open', payload);
diff --git a/src/mixins/imageMixin.js b/src/mixins/imageMixin.js
index e1a9ef8..e20fb82 100644
--- a/src/mixins/imageMixin.js
+++ b/src/mixins/imageMixin.js
@@ -6,8 +6,6 @@ export default {
         const response = await this.downloadImageThumbnail(key, list, type);
         if (response) {
           imageMarkerLabels[key] = response;
-        } else {
-          imageMarkerLabels[key] = this.markerLabels[key];
         }
       }
       return imageMarkerLabels;

From c21738e38d21a04d2c1792dd40c9792e3aed5028 Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Wed, 11 Sep 2024 15:45:13 +1200
Subject: [PATCH 31/32] Emit image thumbnail open only if there has data

---
 src/components/ScaffoldTooltip.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/ScaffoldTooltip.vue b/src/components/ScaffoldTooltip.vue
index 96333f2..cba41ed 100644
--- a/src/components/ScaffoldTooltip.vue
+++ b/src/components/ScaffoldTooltip.vue
@@ -168,7 +168,9 @@ export default {
         imageEntries = imageThumbnailsEntries[lowerCaseLabel];
       }
       if (this.imageThumbnailSidebar) {
-        this.$emit('image-thumbnail-open', imageEntries)
+        if (imageEntries.length) {
+          this.$emit('image-thumbnail-open', imageEntries)
+        }
         return [];
       }
       return imageEntries;

From dc7ff183add906e50deac6ea17828f398466232e Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Wed, 11 Sep 2024 16:53:58 +1200
Subject: [PATCH 32/32] Fix markers not showing on first load

---
 src/components/ScaffoldVuer.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ScaffoldVuer.vue b/src/components/ScaffoldVuer.vue
index 04874d7..32b0b9c 100644
--- a/src/components/ScaffoldVuer.vue
+++ b/src/components/ScaffoldVuer.vue
@@ -857,7 +857,7 @@ export default {
         active: false,
       },
       fileFormat: "metadata",
-      markerLabelEntry: markRaw({}),
+      markerLabelEntry: markRaw(this.markerLabels),
       previousMarkerLabelEntry: markRaw({}),
       viewingMode: "Exploration",
       viewingModes: {
@@ -885,7 +885,7 @@ export default {
       imageTypes: ['Image', 'Segmentation', 'Scaffold', 'Plot'],
       imageClicked: '',
       /**
-       * List of group names 
+       * List of group names
        */
       groupNames: markRaw([]),
     };