Organism grounding tweaks

- Fixes dropdown mismatch
- Saves manual GGP subtype overrides
- Improves organism display
- Increases default grounding query size

Author: maxkfranz

src/client/components/element-info/entity-info.js

@@ -20,6 +20,7 @@ const MAX_FIXED_SYNONYMS = 5;
 const MAX_SYNONYMS_SHOWN = 10;
 
 let associationCache = new WeakMap();
+let chosenTypeCache = new WeakMap();
 let nameNotificationCache = new SingleValueCache();
 let assocNotificationCache = new SingleValueCache();
 
@@ -35,6 +36,8 @@ class EntityInfo extends DataComponent {
 
     let assocNotification = initCache( assocNotificationCache, el, new Notification({ active: true }) );
 
+    let chosenType = initCache( chosenTypeCache, el, null );
+
     this.debouncedUpdateMatches = _.debounce( (name, postStep = _.nop) => {
       this.updateMatches(name).then(postStep);
     }, defs.updateDelay );
@@ -53,6 +56,7 @@ class EntityInfo extends DataComponent {
     this.data = {
       element: el,
       name: el.name(),
+      chosenType,
       oldName: el.name(),
       matches: assoc.matches,
       gettingMoreMatches: false,
@@ -131,6 +135,14 @@ class EntityInfo extends DataComponent {
     let s = this.data;
     let el = s.element;
 
+    if( s.chosenType && match.type !== 'chemical' ){
+      match = Object.assign({}, match, {
+        type: s.chosenType
+      });
+
+      delete match.typeOfGene; // n.b. the model overrides via this field
+    }
+
     el.associate( match );
     el.complete();
 
@@ -398,11 +410,15 @@ class EntityInfo extends DataComponent {
               name: 'entity-info-subtype-radio',
               id: `entity-info-subtype-radio-${typeVal}`,
               value: typeVal,
-              defaultChecked: typeVal === m.type,
+              checked: typeVal === m.type,
               onChange: e => {
                 let newlySelectedType = e.target.value;
                 let newMatch = Object.assign({}, m, { type: newlySelectedType });
 
+                this.setData({ chosenType: newlySelectedType });
+
+                chosenTypeCache.set(s.element, newlySelectedType);
+
                 this.associate(newMatch);
               }
             }),
@@ -434,8 +450,6 @@ class EntityInfo extends DataComponent {
         let isOrgMatch = m => isPerfectNameMatch(m) && !isChemicalMatch(m);
         let orgMatches = s.matches.filter(isOrgMatch);
         let orgToMatches = new Map();
-        const selectedIndex = _.findIndex(orgMatches, match => match.id === m.id && match.namespace === m.namespace);
-        const selectedOrg = assoc ? assoc.organism : null;
 
         orgMatches.forEach(om => {
           let org = om.organism;
@@ -451,6 +465,11 @@ class EntityInfo extends DataComponent {
           arr.push(om);
         });
 
+        orgMatches = _.sortBy(orgMatches, m => m.organismName);
+
+        const selectedIndex = _.findIndex(orgMatches, match => match.id === m.id && match.namespace === m.namespace);
+        const selectedOrg = assoc ? assoc.organism : null;
+
         const getSelectDisplay = (om, includeName = false) => {
           // const matches = orgToMatches.get(om.organism) || [];
           // let count = matches.length;
@@ -463,7 +482,9 @@ class EntityInfo extends DataComponent {
         };
 
         const getDisamtDisplay = (om) => {
-          return `${om.name} : ` + om.synonyms.slice(0, 3).join(', ');
+          const sortedSyns = _.sortBy(om.synonyms, syn => stringDistanceMetric(syn, s.name));
+
+          return `${om.name} : ` + sortedSyns.slice(0, 3).join(', ');
         };
 
         organism = h('div.entity-info-section.entity-info-organism-refinement', [
@@ -503,14 +524,16 @@ class EntityInfo extends DataComponent {
           const needDisam = ambigGrs && ambigGrs.length > 1;
 
           if( needDisam ){
+            const selectedAmIndex = _.findIndex(ambigGrs, match => match.id === m.id && match.namespace === m.namespace);
+
             disambiguation = h('div.entity-info-section.entity-info-organism-refinement', [
               h('span.entity-info-title', 'Which' + (s.name ? ` ${s.name}` : '') + ''),
               h('select.entity-info-organism-dropdown', {
-                defaultValue: selectedIndex,
+                defaultValue: selectedAmIndex,
                 onChange: e => {
                   const val = e.target.value;
                   const index = parseInt(val);
-                  const om = orgMatches[index];
+                  const om = ambigGrs[index];
 
                   if( om ){
                     this.associate(om);

src/client/defs.js

@@ -3,7 +3,7 @@ export const editAnimationDuration = 600;
 export const editAnimationEasing = 'linear';
 export const editAnimationColor = 'rgba(255, 255, 0, 0.5)';
 export const editAnimationWhite = 'rgba(255, 255, 255, 0.5)';
-export const associationSearchLimit = 10;
+export const associationSearchLimit = 30;
 export const tippyTopZIndex = 10001;
 export const tippyDefaults = {
   theme: 'light',

src/styles/base.css

@@ -151,7 +151,7 @@ button.button-toggle {
 
 select {
   width: var(--defaultWidgetWidth);
-  padding-right: 1em;
+  padding-right: 2em;
   background-image: url('./image/fa-angle-down.svg');
   background-position: 100% 50%;
   background-position: calc(100% - 0.5em) 50%;