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

package/package.json

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

package/src/components/ConnectivityExplorer.vue

@@ -22,7 +22,7 @@
         <el-button
           link
           class="el-button-link"
-          @click="onResetClick"
+          @click="openSearch([], '')"
           size="large"
         >
           Reset
@@ -363,10 +363,6 @@ export default {
         this.openSearch([], '');
       }
     },
-    onResetClick: function () {
-      this.openSearch([], '');
-      this.$emit('connectivity-explorer-reset');
-    },
     openSearch: function (filter, search = "") {
       this.searchInput = search;
       this.resetPageNavigation();
@@ -571,7 +567,6 @@ export default {
   width: 298px !important;
   height: 40px;
   padding-right: 14px;
-  font-family: inherit;
 
   :deep(.el-input__inner) {
     font-family: inherit;

package/src/components/ConnectivityInfo.vue

@@ -277,7 +277,7 @@ export default {
       return this.entry.destinationsWithDatasets;
     },
     resources: function () {
-      return this.entry.hyperlinks || [];
+      return this.entry.hyperlinks;
     },
     sckanVersion: function () {
       return this.entry.knowledgeSource;
@@ -528,17 +528,17 @@ export default {
       }
     },
     getConnectionsFromMap: async function () {
-      if (this.entry.mapuuid) {
+      if (this.entry.mapuuid) {        
         const url =
           this.flatmapApi +
           `flatmap/${this.entry.mapuuid}/connectivity/${this.entry.featureId[0]}`;
-
+  
         try {
           const response = await fetch(url);
           if (!response.ok) {
             throw new Error(`Response status: ${response.status}`);
           }
-
+  
           return await response.json();
         } catch (error) {
           throw new Error(error);

package/src/components/SearchFilters.vue

@@ -63,32 +63,16 @@
             popper-class="sidebar-cascader-popper"
           >
             <template #default="{ node, data }">
-              <div v-if="isFlatmapConnectionsFilterNode(node)">
-                <div class="el-input">
-                  <div class="el-input__wrapper">
-                    <input
-                      class="el-input__inner"
-                      :value="searchInputs[node.value]"
-                      @input="searchInputChange($event, node)"
-                      style="width: 100%"
-                      autocomplete="off"
-                      placeholder="Search"
-                    />
+              <el-row>
+                <el-col :span="4" v-if="hasLineStyles(data)">
+                  <div class="path-visual" :style="getLineStyles(data)"></div>
+                </el-col>
+                <el-col :span="20">
+                  <div :style="getBackgroundStyles(data)">
+                    {{ data.label }}
                   </div>
-                </div>
-              </div>
-              <div v-else>
-                <el-row>
-                  <el-col :span="4" v-if="hasLineStyles(data)">
-                    <div class="path-visual" :style="getLineStyles(data)"></div>
-                  </el-col>
-                  <el-col :span="20">
-                    <div :style="getBackgroundStyles(data)">
-                      {{ data.label }}
-                    </div>
-                  </el-col>
-                </el-row>
-              </div>
+                </el-col>
+              </el-row>
             </template>
           </el-cascader>
           <div v-if="showFiltersText" class="filter-default-value">Filters</div>
@@ -215,7 +199,6 @@ export default {
         },
       ],
       presentTags:[],
-      searchInputs: {},
     }
   },
   setup() {
@@ -271,14 +254,6 @@ export default {
         )
       return value
     },
-    isFlatmapConnectionsFilterNode: function (node) {
-      return (
-        node.pathValues[0].includes('flatmap.connectivity.source') &&
-        node.pathLabels.includes('Filters') &&
-        node.isDisabled &&
-        node.isLeaf
-      )
-    },
     processOptions: function () {
       // create top level of options in cascader
       this.options.forEach((facet, i) => {
@@ -298,14 +273,6 @@ export default {
           })
         }
 
-        if (facet.key.includes('flatmap.connectivity.source')) {
-          this.options[i].children.unshift({
-            value: this.createCascaderItemValue('ConnectivityFilters'),
-            label: 'Filters',
-            disabled: true,
-          });
-        }
-
         // populate second level of options
         this.options[i].children.forEach((facetItem, j) => {
           // Format labels except funding program
@@ -682,24 +649,6 @@ export default {
       this.__expandItem__ = event
       this.cssMods()
     },
-    searchInputChange: function (event, node) {
-      event.preventDefault();
-      const { target } = event;
-      if (target) {
-        const value = target.value;
-        const ul = target.closest('.el-cascader-menu__list');
-        ul.querySelectorAll('.el-cascader-node').forEach((li, index) => {
-          if (index > 0) {
-            const content = li.querySelector('.el-cascader-node__label').textContent;
-            if (content.toLowerCase().includes(value.toLowerCase())) {
-              li.classList.remove('hide');
-            } else {
-              li.classList.add('hide');
-            }
-          }
-        })
-      }
-    },
     numberShownChanged: function (event) {
       this.$emit('numberPerPage', parseInt(event))
     },
@@ -1144,36 +1093,6 @@ export default {
   border-color: $app-primary-color;
 }
 
-.sidebar-cascader-popper .el-cascader-menu:last-child .el-cascader-node {
-  &.is-disabled {
-    border-bottom: 1px solid #e4e7ed;
-    padding-bottom: 0.5rem;
-    position: sticky;
-    top: 0.5rem;
-    background-color: white;
-    z-index: 20;
-    box-shadow: 0px -6px 0px 6px white;
-
-    .el-checkbox.is-disabled {
-      display: none;
-    }
-
-    .el-cascader-node__label {
-      padding-left: 0;
-      padding-right: 0;
-    }
-
-    // hide show all for connection filters
-    + .el-cascader-node {
-      display: none;
-    }
-  }
-
-  &.hide {
-    display: none;
-  }
-}
-
 .filter-help-popover,
 .cascade-tags-popover {
   font-family: 'Asap', sans-serif;

package/src/components/SideBar.vue

@@ -50,12 +50,11 @@
                 :envVars="envVars"
                 :connectivityEntry="connectivityEntry"
                 :availableAnatomyFacets="availableAnatomyFacets"
-                :connectivityFilterOptions="filterOptions"
                 @filter-visibility="$emit('filter-visibility', $event)"
+                :connectivityFilterOptions="filterOptions"
                 :showVisibilityFilter="showVisibilityFilter"
                 @search-changed="searchChanged(tab.id, $event)"
                 @hover-changed="hoverChanged(tab.id, $event)"
-                @connectivity-explorer-reset="onConnectivityExplorerReset"
                 @show-connectivity="showConnectivity"
                 @show-reference-connectivities="onShowReferenceConnectivities"
                 @connectivity-hovered="onConnectivityHovered"
@@ -216,12 +215,6 @@ export default {
         this.activeAnnotationData = data;
       }
     },
-    /**
-     * This event is emitted after clicking reset button in connectivity explorer
-     */
-    onConnectivityExplorerReset: function () {
-      this.$emit('connectivity-explorer-reset');
-    },
     /**
      * This event is emitted when the show connectivity button is clicked.
      * @arg featureIds

package/src/services/flatmapKnowledge.js

@@ -0,0 +1,94 @@
+async function getReferenceConnectivitiesFromStorage(resource) {
+  const flatmapKnowledgeRaw = sessionStorage.getItem('flatmap-knowledge');
+
+  if (flatmapKnowledgeRaw) {
+    const flatmapKnowledge = JSON.parse(flatmapKnowledgeRaw);
+    const dataWithRefs = flatmapKnowledge.filter((x) => x.references && x.references.length);
+    const foundData = dataWithRefs.filter((x) => x.references.includes(resource));
+
+    if (foundData.length) {
+      const featureIds = foundData.map((x) => x.id);
+      return featureIds;
+    }
+  }
+  return [];
+}
+
+async function getReferenceConnectivitiesByAPI(mapImp, resource, flatmapQueries) {
+  const knowledgeSource = getKnowledgeSource(mapImp);
+  const sql = `select knowledge from knowledge
+    where source="${knowledgeSource}" and
+    knowledge like "%${resource}%" order by source desc`;
+  console.log(sql)
+  const response = await flatmapQueries.flatmapQuery(sql);
+  const mappedData = response.values.map((x) => x[0]);
+  const parsedData = mappedData.map((x) => JSON.parse(x));
+  const featureIds = parsedData.map((x) => x.id);
+  return featureIds;
+}
+
+function getKnowledgeSource(mapImp) {
+  let mapKnowledgeSource = '';
+  if (mapImp.provenance?.connectivity) {
+    const sckanProvenance = mapImp.provenance.connectivity;
+    if ('knowledge-source' in sckanProvenance) {
+      mapKnowledgeSource = sckanProvenance['knowledge-source'];
+    } else if ('npo' in sckanProvenance) {
+      mapKnowledgeSource = `${sckanProvenance.npo.release}-npo`;
+    }
+  }
+
+  return mapKnowledgeSource;
+}
+
+function loadAndStoreKnowledge(mapImp, flatmapQueries) {
+  const knowledgeSource = getKnowledgeSource(mapImp);
+  const sql = `select knowledge from knowledge
+    where source="${knowledgeSource}"
+    order by source desc`;
+  const flatmapKnowledge = sessionStorage.getItem('flatmap-knowledge');
+
+  if (!flatmapKnowledge) {
+    flatmapQueries.flatmapQuery(sql).then((response) => {
+      const mappedData = response.values.map(x => x[0]);
+      const parsedData = mappedData.map(x => JSON.parse(x));
+      sessionStorage.setItem('flatmap-knowledge', JSON.stringify(parsedData));
+      updateFlatmapKnowledgeCache();
+    });
+  }
+}
+
+function updateFlatmapKnowledgeCache() {
+  const CACHE_LIFETIME = 24 * 60 * 60 * 1000; // One day
+  const now = new Date();
+  const expiry = now.getTime() + CACHE_LIFETIME;
+
+  sessionStorage.setItem('flatmap-knowledge-expiry', expiry);
+}
+
+function removeFlatmapKnowledgeCache() {
+  const keys = [
+    'flatmap-knowledge',
+    'flatmap-knowledge-expiry',
+  ];
+  keys.forEach((key) => {
+    sessionStorage.removeItem(key);
+  });
+}
+
+function refreshFlatmapKnowledgeCache() {
+  const expiry = sessionStorage.getItem('flatmap-knowledge-expiry');
+  const now = new Date();
+
+  if (now.getTime() > expiry) {
+    removeFlatmapKnowledgeCache();
+  }
+}
+
+export {
+  getReferenceConnectivitiesFromStorage,
+  getReferenceConnectivitiesByAPI,
+  loadAndStoreKnowledge,
+  getKnowledgeSource,
+  refreshFlatmapKnowledgeCache,
+}