More phenotypes (#786)

* Getting the phenotypes

* Searching new traits

* building map of new phenotypes

* need to use async/await for this

* Setting phenotype based on params

* autofills correct trait group

src/views/PIGEAN/Phenotype/Template.vue

@@ -34,19 +34,19 @@
                         v-if="!!$parent.phenotypeSearchKey"
                         class="page-phenotypes-list"
                     >
-                        <template v-for="item in $parent.phenotypesInSession">
+                        <template v-for="item in $store.state.pigeanAllPhenotypes.data">
                             <li
                                 v-if="
                                     !!$parent.ifPhenotypeInSearch(
-                                        item.description
+                                        item.phenotype_name
                                     )
                                 "
-                                :key="item.name"
+                                :key="item.phenotype"
                             >
                                 <a
                                     href="javascript:;"
                                     @click="$parent.setSelectedPhenotype(item)"
-                                    v-html="item.description"
+                                    v-html="item.phenotype_name"
                                 ></a>
                             </li>
                         </template>

src/views/PIGEAN/Phenotype/main.js

@@ -47,6 +47,7 @@ new Vue({
     data() {
         return {
             plotColors: plotUtils.plotColors(),
+            pigeanPhenotypeMap: "",
             phewasPlotLabel: "",
             phenotypeSearchKey: null,
             newPhenotypeSearchKey: null,
@@ -337,18 +338,6 @@ new Vue({
     },
 
     watch: {
-        "$store.state.bioPortal.phenotypeMap": function (phenotypeMap) {
-            let name = keyParams.phenotype;
-            let phenotype = phenotypeMap[name];
-
-            if (phenotype) {
-                this.$store.state.selectedPhenotype = phenotype;
-                keyParams.set({ phenotype: phenotype.name });
-            }
-            //Initial query. Should only happen once.
-            this.$store.dispatch("queryPhenotype");
-        },
-
         "$store.state.phenotype": function (phenotype) {
             keyParams.set({ phenotype: phenotype.name });
             uiUtils.hideElement("phenotypeSearchHolder");
@@ -358,23 +347,26 @@ new Vue({
         },
     },
 
-    created() {
+    async created() {
         this.$store.dispatch("bioPortal/getDiseaseSystems");
         this.$store.dispatch("bioPortal/getDiseaseGroups");
         this.$store.dispatch("bioPortal/getPhenotypes");
         this.$store.dispatch("bioPortal/getDatasets");
+        await this.$store.dispatch("getPigeanPhenotypes");
+        this.pigeanPhenotypeMap = this.mapPhenotypes();
+        this.lookupInPigeanMap();
     },
     methods: {
         ...uiUtils,
         ...sessionUtils,
         getToolTipPosition(ELEMENT) {
-            console.log(ELEMENT);
             uiUtils.getToolTipPosition(ELEMENT);
         },
         setSelectedPhenotype(PHENOTYPE) {
-            this.newPhenotypeSearchKey = PHENOTYPE.description;
+            let oldStylePhenotype = this.toOldStyle(PHENOTYPE);
+            this.newPhenotypeSearchKey = oldStylePhenotype.description;
             this.phenotypeSearchKey = null;
-            this.$store.dispatch("selectedPhenotype", PHENOTYPE);
+            this.$store.dispatch("selectedPhenotype", oldStylePhenotype);
         },
         ifPhenotypeInSearch(DESCRIPTION) {
             let searchKeys = this.phenotypeSearchKey.split(" ");
@@ -419,6 +411,34 @@ new Vue({
             });
             return data;
         },
+        mapPhenotypes(){
+            let phenotypeMap = {};
+            let phenotypes = this.$store.state.pigeanAllPhenotypes.data
+            phenotypes.forEach(item => {
+                phenotypeMap[item.phenotype] = item;
+            });
+            return phenotypeMap;
+        },
+        toOldStyle(newStylePhenotype){
+            let oldStyle = structuredClone(newStylePhenotype);
+            oldStyle.description = newStylePhenotype.phenotype_name;
+            oldStyle.name = newStylePhenotype.phenotype;
+            oldStyle.group = newStylePhenotype.display_group;
+            return oldStyle;
+        },
+        lookupInPigeanMap(){
+            let name = keyParams.phenotype;
+            let newPhenotype = this.pigeanPhenotypeMap[name];
+            let phenotype = this.toOldStyle(newPhenotype);
+            if (phenotype) {
+                this.$store.state.selectedPhenotype = phenotype;
+                keyParams.set({ phenotype: phenotype.name });
+                this.$store.state.traitGroupToQuery = phenotype.trait_group;
+                keyParams.set({ traitGroup: phenotype.trait_group });
+            }
+            //Initial query. Should only happen once.
+            this.$store.dispatch("queryPhenotype");
+        }
     },
 
     render(createElement) {

src/views/PIGEAN/Phenotype/store.js

@@ -18,6 +18,7 @@ export default new Vuex.Store({
         pigeanFactor: bioIndex("pigean-factor"),
         pigeanPheWAS: bioIndex("pigean-phewas"),
         pigeanTopPhewas: bioIndex("pigean-top-phewas"),
+        pigeanAllPhenotypes: bioIndex("pigean-phenotypes"),
     },
     state: {
         // phenotypes needs to be an array so colors don't change!
@@ -29,7 +30,7 @@ export default new Vuex.Store({
         manhattanPlotAvailable: false,
         genesetSize: keyParams.genesetSize || bioIndexUtils.DEFAULT_GENESET_SIZE,
         genesetSizeToQuery: null,
-        traitGroup: keyParams.traitGroup || bioIndexUtils.DEFAULT_TRAIT_GROUP,
+        traitGroup: keyParams.traitGroup,
         traitGroupToQuery: null,
     },
     mutations: {
@@ -46,6 +47,8 @@ export default new Vuex.Store({
         setSelectedPhenotype(state, PHENOTYPE) {
             state.selectedPhenotype = PHENOTYPE;
             keyParams.set({ phenotype: PHENOTYPE.name });
+            state.traitGroupToQuery = PHENOTYPE.trait_group;
+            keyParams.set({ traitGroup: PHENOTYPE.trait_group});
         },
         setTraitGroup(state, traitGroup){
             state.traitGroup = traitGroup || state.traitGroup;
@@ -61,7 +64,6 @@ export default new Vuex.Store({
     },
     actions: {
         onPhenotypeChange(context, phenotype) {
-            console.log(phenotype);
             context.state.selectedPhenotype = phenotype;
             keyParams.set({ phenotype: phenotype.name });
         },
@@ -87,8 +89,10 @@ export default new Vuex.Store({
             context.commit("setDiseaseInSession", DISEASE);
         },
         selectedPhenotype(context, PHENOTYPE) {
-            console.log("onState", PHENOTYPE);
             context.commit("setSelectedPhenotype", PHENOTYPE);
         },
+        async getPigeanPhenotypes(context) {
+            await context.dispatch("pigeanAllPhenotypes/query", {q:1});
+        },
     },
 });