@abi-software/map-side-bar 2.9.2-beta.2 → 2.9.2-beta.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "2.9.2-beta.2",
+  "version": "2.9.2-beta.4",
   "files": [
     "dist/*",
     "src/*",
@@ -39,7 +39,7 @@
   },
   "dependencies": {
     "@abi-software/gallery": "^1.1.2",
-    "@abi-software/map-utilities": "^1.6.1-beta.3",
+    "@abi-software/map-utilities": "^1.6.1-beta.5",
     "@abi-software/svg-sprite": "^1.0.1",
     "@element-plus/icons-vue": "^2.3.1",
     "algoliasearch": "^4.10.5",

package/src/App.vue

@@ -210,14 +210,16 @@ export default {
     action: function (action) {
       console.log('action fired: ', action)
       let facets = [];
-      facets.push(
-        ...action.labels.map(val => ({
-          facet: capitalise(val),
-          term: "Anatomical structure",
-          facetPropPath: "anatomy.organ.category.name",
-        }))
-      );
-      if (this.$refs.sideBar) {
+      if (action.labels) {
+        facets.push(
+          ...action.labels.map(val => ({
+            facet: capitalise(val),
+            term: "Anatomical structure",
+            facetPropPath: "anatomy.organ.category.name",
+          }))
+        );
+      }
+      if (this.$refs.sideBar && facets?.length) {
         console.log('openSearch', facets)
         this.$refs.sideBar.openSearch(facets, "");
       }

package/src/components/ConnectivityExplorer.vue

@@ -246,9 +246,6 @@ export default {
         this.initLoading = false;
         this.numberOfHits = this.results.length;
         // knowledge is from the neuron click if there is 'ready' property
-        if (this.numberOfHits === 1 && !('ready' in this.results[0])) {
-          this.onConnectivityCollapseChange(this.results[0]);
-        }
         if (this.numberOfHits > 0 && ('ready' in this.results[0])) {
           this.$refs.filtersRef.checkShowAllBoxes();
           this.searchInput = '';
@@ -263,9 +260,12 @@ export default {
         JSON.stringify(newVal) !== JSON.stringify(oldVal) &&
         newVal.length === 1 && newVal[0].ready
       ) {
-        // if the changed property is connectivity source,
-        // or two different maps in split view, do not collapse
+        const hasValidFacet = this.filter.some(f => f.facet !== "Show all");
         if (
+          // card should not be expanded if only one entry and from neuron click
+          (this.numberOfHits === 1 && !this.searchInput && !hasValidFacet)||
+          // if the changed property is connectivity source,
+          // or two different maps in split view, do not collapse
           (
             newVal[0].connectivitySource !== oldVal[0].connectivitySource ||
             newVal[0].mapId !== oldVal[0].mapId
@@ -381,8 +381,20 @@ export default {
         // Show not found filter items warning message
         notFoundItems.forEach((notFoundItem) => {
           const itemLabel = notFoundItem.tagLabel || notFoundItem.facet;
+          const itemLabelLowerCase = itemLabel.charAt(0).toLowerCase() + itemLabel.slice(1);
+          let message = '';
+          if (notFoundItem.term.toLowerCase() === 'origin') {
+            message = `There are no neuron populations beginning at <strong>${itemLabelLowerCase}</strong>.`;
+          } else if (notFoundItem.term.toLowerCase() === 'via') {
+            message = `There are no neuron populations that run through <strong>${itemLabelLowerCase}</strong>.`;
+          } else if (notFoundItem.term.toLowerCase() === 'destination') {
+            message = `There are no neuron populations terminating at <strong>${itemLabelLowerCase}</strong>.`;
+          } else {
+            message = `There are no neuron populations beginning, terminating, or running through <strong>${itemLabelLowerCase}</strong>.`
+          }
           Message({
-            message: `${itemLabel} cannot be found in ${notFoundItem.term}!`,
+            dangerouslyUseHTMLString: true,
+            message: message,
             appendTo: this.$el,
             showClose: true,
             offset: 113,

package/src/components/{SidebarContent.vue → DatasetExplorer.vue}

@@ -132,7 +132,7 @@ export default {
     Input,
     Pagination
   },
-  name: 'SideBarContent',
+  name: 'DatasetExplorer',
   props: {
     visible: {
       type: Boolean,
@@ -430,7 +430,7 @@ export default {
               ? element['abi-contextual-information']
               : undefined,
           segmentation: element['mbf-segmentation'],
-          simulation: element['abi-simulation-file'],
+          simulation: element['abi-simulation-omex-file'] ? element['abi-simulation-omex-file'] : element['abi-simulation-file'],
           additionalLinks: element.additionalLinks,
           detailsReady: true,
         })

package/src/components/ImageGallery.vue

@@ -322,26 +322,67 @@ export default {
       }
     },
     createSimulationItems: function () {
-      if (this.entry.simulation && this.entry.simulation.length > 0) {
-        let action = {
-          label: undefined,
-          apiLocation: this.envVars.API_LOCATION,
-          s3uri: this.entry.s3uri,
-          version: this.datasetVersion,
-          title: 'View simulation',
-          type: 'Simulation',
-          name: this.entry.name,
-          description: this.entry.description,
-          discoverId: this.datasetId,
-          dataset: `${this.envVars.ROOT_URL}/datasets/${this.datasetId}?type=dataset`,
-        }
-        this.items['Simulations'].push({
-          id: 'simulation',
-          title: ' ',
-          type: 'Simulation',
-          hideType: true,
-          hideTitle: true,
-          userData: action,
+      if (this.entry.simulation) {
+        this.entry.simulation.forEach((simulation) => {
+          if (simulation.additional_mimetype.name === "application/x.vnd.abi.simulation+json") {
+            let action = {
+              label: undefined,
+              apiLocation: this.envVars.API_LOCATION,
+              s3uri: this.entry.s3uri,
+              version: this.datasetVersion,
+              title: 'View simulation',
+              type: 'Simulation',
+              name: this.entry.name,
+              description: this.entry.description,
+              discoverId: this.datasetId,
+              dataset: `${this.envVars.ROOT_URL}/datasets/${this.datasetId}?type=dataset`,
+            }
+            this.items['Simulations'].push({
+              id: 'simulation',
+              title: ' ',
+              type: 'Simulation',
+              hideType: true,
+              hideTitle: true,
+              userData: action,
+            })
+          } else {
+            const filePath = simulation.dataset.path
+            const id = simulation.identifier
+            const thumbnail = this.getThumbnailForPlot(
+              simulation,
+              this.entry.thumbnails
+            )
+            let thumbnailURL = undefined
+            let mimetype = ''
+            if (thumbnail) {
+              thumbnailURL = this.getImageURL(this.envVars.API_LOCATION, {
+                id,
+                prefix: this.getS3Prefix(),
+                file_path: thumbnail.dataset.path,
+                s3Bucket: this.s3Bucket,
+              })
+              mimetype = thumbnail.mimetype.name
+            }
+            const resource = `${this.envVars.API_LOCATION}s3-resource/${this.getS3Prefix()}files/${filePath}${this.getS3Args()}`
+            let action = {
+              label: capitalise(this.label),
+              resource: resource,
+              s3uri: this.entry.s3uri,
+              title: 'View simulation',
+              type: 'Simulation',
+              discoverId: this.discoverId,
+              version: this.datasetVersion,
+            }
+            this.items['Simulations'].push({
+              id,
+              title: baseName(filePath),
+              type: 'Simulation',
+              thumbnail: thumbnailURL,
+              userData: action,
+              hideType: true,
+              mimetype,
+            })
+          }
         })
       }
     },

package/src/components/SearchFilters.vue

@@ -662,7 +662,7 @@ export default {
           clearTimeout(this.filterTimeout);
         }
 
-        this.$emit('loading', true) // let sidebarcontent wait for the requests
+        this.$emit('loading', true) // let dataset explorer wait for the requests
         this.setCascader(filterKeys) //update our cascader v-model if we modified the event
 
         this.filterTimeout = setTimeout(() => {
@@ -1152,6 +1152,7 @@ export default {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  line-height: 1.2;
 }
 
 .connectivity-tag::first-letter,
@@ -1172,6 +1173,12 @@ export default {
   gap: 4px;
 }
 
+:deep(.connectivity-tag .el-tag__content) {
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 .el-tag {
   .cascader-tag &,
   .el-tags-container & {
@@ -1180,6 +1187,9 @@ export default {
     color: #303133 !important;
     background-color: #fff;
     border-color: #dcdfe6 !important;
+    width: auto;
+    max-width: 100%;
+    justify-content: flex-start;
   }
 }
 

package/src/components/SideBar.vue

@@ -64,7 +64,7 @@
               />
             </template>
             <template v-else>
-              <SidebarContent
+              <DatasetExplorer
                 class="sidebar-content-container"
                 v-show="tab.id === activeTabId"
                 :contextCardEntry="tab.contextCard"
@@ -88,7 +88,7 @@ import {
 } from '@element-plus/icons-vue'
 /* eslint-disable no-alert, no-console */
 import { ElDrawer as Drawer, ElIcon as Icon } from 'element-plus'
-import SidebarContent from './SidebarContent.vue'
+import DatasetExplorer from './DatasetExplorer.vue'
 import EventBus from './EventBus.js'
 import Tabs from './Tabs.vue'
 import AnnotationTool from './AnnotationTool.vue'
@@ -99,7 +99,7 @@ import ConnectivityExplorer from './ConnectivityExplorer.vue'
  */
 export default {
   components: {
-    SidebarContent,
+    DatasetExplorer,
     Tabs,
     ElIconArrowLeft,
     ElIconArrowRight,

package/src/components.d.ts

@@ -13,6 +13,7 @@ declare module 'vue' {
     ConnectivityExplorer: typeof import('./components/ConnectivityExplorer.vue')['default']
     ConnectivityInfo: typeof import('./components/ConnectivityInfo.vue')['default']
     DatasetCard: typeof import('./components/DatasetCard.vue')['default']
+    DatasetExplorer: typeof import('./components/DatasetExplorer.vue')['default']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCard: typeof import('element-plus/es')['ElCard']
     ElCascader: typeof import('element-plus/es')['ElCascader']
@@ -44,7 +45,6 @@ declare module 'vue' {
     SearchFilters: typeof import('./components/SearchFilters.vue')['default']
     SearchHistory: typeof import('./components/SearchHistory.vue')['default']
     SideBar: typeof import('./components/SideBar.vue')['default']
-    SidebarContent: typeof import('./components/SidebarContent.vue')['default']
     Tabs: typeof import('./components/Tabs.vue')['default']
   }
   export interface ComponentCustomProperties {