wc: Fix map between query field id and filter id in new browser filte…

…rs #TASK-7216 #TASK-7100
opencb · Jan 15, 2025 · 7bf738e · 7bf738e
1 parent fa88895
commit 7bf738e
Showing 1 changed file with 47 additions and 7 deletions.
diff --git a/src/webcomponents/variant/variant-browser-horizontal-filter.js b/src/webcomponents/variant/variant-browser-horizontal-filter.js
@@ -91,6 +91,7 @@ export default class VariantBrowserHorizontalFilter extends LitElement {
         this.advancedFilters = [];
 
         // map filter id to filter field
+        // TO_REMOVE
         this.mapFilterIdToField = {
             "variant": "id",
             "region": "region",
@@ -119,6 +120,38 @@ export default class VariantBrowserHorizontalFilter extends LitElement {
             "diseasePanels": "panels", // TODO
             "clinical-annotation": "clinical", // TODO
         };
+
+        // map query field id to filter id
+        this.mapQueryFieldIdToFilterId = {
+            "id": "variant",
+            "region": "region",
+            "xref": "feature",
+            "biotype": "biotype",
+            "type": "type",
+            "study": "study",
+            "sample": "sample",
+            "cohortStatsAlt": "cohort",
+            "sampleData": "variant-file-sample-filter", // "file-quality" ??
+            "fileData": "variant-file-info-filter",
+            "populationFrequencyAlt": "populationFrequency",
+            "ct": "consequence-type",
+            "geneRoleInCancer": "role-in-cancer",
+            "proteinSubstitution": "proteinSubstitutionScore",
+            "annot-functional-score": "cadd",
+            "conservation": "conservation",
+            "go": "go",
+            "annot-hpo": "hpo",
+            "panel": "diseasePanels",
+            "panelFeatureType": "diseasePanels",
+            "panelModeOfInheritance": "diseasePanels",
+            "panelConfidence": "diseasePanels",
+            "panelRoleInCancer": "diseasePanels",
+            "panelIntersection": "diseasePanels",
+            "clinical": "clinical-annotation",
+            "clinicalSignificance": "clinical-annotation",
+            "clinicalConfirmedStatus": "clinical-annotation",
+            "traits": "fullTextSearch",
+        };
     }
 
     // connectedCallback() {
@@ -178,6 +211,10 @@ export default class VariantBrowserHorizontalFilter extends LitElement {
         super.update(changedProperties);
     }
 
+    updated() {
+        console.log(this.queryList);
+    }
+
     // opencgaSessionObserver() {
     //     if (this.opencgaSession.study) {
     //         // Render filter menu and add event and tooltips
@@ -329,6 +366,7 @@ export default class VariantBrowserHorizontalFilter extends LitElement {
      * @param {String|Object} value the new value of the property
      */
     onFilterChange(key, value) {
+        console.log(key, value);
         /* Some filters may return more than one parameter, in this case key and value are objects with all the keys and filters
              - key: an object mapping filter name with the one returned
              - value: and object with the filter
@@ -830,8 +868,9 @@ export default class VariantBrowserHorizontalFilter extends LitElement {
     }
 
     renderQuickFilters() {
-        return this.quickFiltersList.map((filter, index) => {
-            const fieldId = this.mapFilterIdToField[filter.id] || "";
+        return this.quickFiltersList.map((filter) => {
+            const fieldId = Object.keys(this.mapQueryFieldIdToFilterId)
+                .find(key => this.mapQueryFieldIdToFilterId[key] === filter.id);
             const field = this.queryList.find(query => query.name === fieldId);
 
             return html`
@@ -858,9 +897,9 @@ export default class VariantBrowserHorizontalFilter extends LitElement {
     renderAdvancedFilters() {
         return this.advancedFilters.map((section, index) => {
             const appliedFilters = section.filters.filter(filter => {
-                const fieldId = this.mapFilterIdToField[filter.id] || "";
-                const field = this.queryList.find(query => query.name === fieldId);
-                return !!field;
+                const fieldIds = Object.keys(this.mapQueryFieldIdToFilterId)
+                    .filter(key => this.mapQueryFieldIdToFilterId[key] === filter.id);
+                return !!this.queryList.some(query => fieldIds.includes(query.name));
             });
 
             return html`
@@ -947,8 +986,9 @@ export default class VariantBrowserHorizontalFilter extends LitElement {
     render() {
         const advancedFiltersCount = this.advancedFilters.reduce((count, section) => {
             const appliedFilters = section.filters.filter(filter => {
-                const fieldId = this.mapFilterIdToField[filter.id] || "";
-                return !!this.queryList.find(query => query.name === fieldId);
+                const fieldIds = Object.keys(this.mapQueryFieldIdToFilterId)
+                    .filter(key => this.mapQueryFieldIdToFilterId[key] === filter.id);
+                return this.queryList.some(query => fieldIds.includes(query.name));
             });
             return count + appliedFilters.length;
         }, 0);