Render trait display names everywhere

.vscode/launch.json

@@ -322,6 +322,28 @@
                 "SITE_BASE_URL": "https://localhost:8080"
             }
         },
+        {
+            "name": "Run POPULATE_PHENOTYPES_DATASTORE",
+            "type": "python",
+            "request": "launch",
+            "program": "${workspaceFolder}/src/modules/db_operations/main.py",
+            "console": "integratedTerminal",
+            "python": "${workspaceFolder}/src/modules/db_operations/venv/bin/python",
+            "justMyCode": true,
+            "envFile": "${workspaceFolder}/src/modules/db_operations/.env",
+            "env": {
+                "DATABASE_OPERATION": "POPULATE_PHENOTYPES_DATASTORE",
+                "USE_MEMOIZATION": "1",
+                // "MODULE_DB_OPERATIONS_CONNECTION_TYPE": "localhost",
+                // "MODULE_DB_OPERATIONS_CONNECTION_TYPE": "memory",
+                "MODULE_DB_OPERATIONS_CONNECTION_TYPE": "file",
+                "MODULE_DB_OPERATIONS_CONNECTION_FILE": "${workspaceFolder}/temp/local.db",
+                "MODULE_DB_TIMEOUT": "300",
+                "CAENDR_USE_SSL": "1",
+                "SENTRY_URL": "",
+                "SITE_BASE_URL": "https://localhost:8080",
+            },
+        },
         {
             "name": "DB_OP TEST_ECHO",
             "type": "python",
@@ -348,6 +370,24 @@
                 "SITE_BASE_URL": "https://localhost:8080",
             }
         },
+        {
+            "name": "DbOp: Recompute Phenotype Report Cached Names",
+            "type": "python",
+            "request": "launch",
+            "program": "${workspaceFolder}/src/modules/db_operations/main.py",
+            "console": "integratedTerminal",
+            "python": "${workspaceFolder}/src/modules/db_operations/venv/bin/python",
+            "justMyCode": true,
+            "envFile": "${workspaceFolder}/src/modules/db_operations/.env",
+            "env": {
+                "DATABASE_OPERATION": "RECOMPUTE_PHENOTYPE_REPORT_CACHED_NAMES",
+                "RELOAD_FILES": "false",
+                "MODULE_DB_TIMEOUT": "300",
+                "CAENDR_USE_SSL": "1",
+                "SENTRY_URL": "",
+                "SITE_BASE_URL": "https://localhost:8080",
+            }
+        },
         {
             "name": "Test Indel Finder",
             "type": "python",

src/modules/db_operations/operations.py

@@ -2,7 +2,7 @@
 from caendr.services.cloud.postgresql import health_database_status
 from caendr.services.logger import logger
 
-from caendr.models.datastore import Species
+from caendr.models.datastore import Species, PhenotypeReport
 from caendr.models.sql import DbOp, WormbaseGene, WormbaseGeneSummary, Strain, StrainAnnotatedVariant, PhenotypeDatabase, PhenotypeMetadata
 from caendr.services.sql.db import backup_external_db
 from caendr.services.sql.etl import ETLManager
@@ -49,6 +49,9 @@ def execute_operation(app, db, db_op: DbOp, species=None, reload_files=True):
     logger.info("Using MOCK DATA")
     drop_and_populate_all_tables(app, db, species)
 
+  elif db_op == DbOp.RECOMPUTE_PHENOTYPE_REPORT_CACHED_NAMES:
+    PhenotypeReport.recompute_cached_display_names()
+
 
 
 def drop_and_populate_strains(app, db, species, reload_files=True):

src/modules/db_operations/seed_trait_files.py

@@ -61,9 +61,12 @@ def populate_andersenlab_trait_files():
         'species':           get_field_from_record(record, 'Species', nullable=False),
 
         # About trait
-        'description_short': get_field_from_record(record, 'Short_Description'),
-        'description_long':  get_field_from_record(record, 'Long_Description'),
-        'units':             get_field_from_record(record, 'Units'),
+        'trait_name_display_1': get_field_from_record(record, 'Trait_Name_Display1'),
+        'trait_name_display_2': get_field_from_record(record, 'Trait_Name_Display2'),
+        'trait_name_display_3': get_field_from_record(record, 'Trait_Name_Display3'),
+        'description_short':    get_field_from_record(record, 'Short_Description'),
+        'description_long':     get_field_from_record(record, 'Long_Description'),
+        'units':                get_field_from_record(record, 'Units'),
 
         # Tag list (categories)
         'tags': list(filter(

src/modules/site-v2/base/static/js/plot.js

@@ -204,7 +204,7 @@ function render_scatterplot_histograms(container_selector, data, config={}) {
         .attr('x', margin.left + (width / 2))
         .attr('y', height + margin.top + hist_height + 36)
         .attr('text-anchor', 'middle')
-        .text(config['x_label'])
+        .html(config['x_label'])
     }
 
     // Add label for y-axis, if one is provided
@@ -216,7 +216,7 @@ function render_scatterplot_histograms(container_selector, data, config={}) {
         .attr('y', 0)
         .attr('dy', '.75em')
         .attr('text-anchor', 'middle')
-        .text(config['y_label'])
+        .html(config['y_label'])
 
       }
 
@@ -349,7 +349,7 @@ function render_histogram(container_selector, data, config={}) {
       .attr('x', margin.left + (width / 2))
       .attr('y', height + margin.top + 36)
       .attr('text-anchor', 'middle')
-      .text(config['x_label'])
+      .html(config['x_label'])
   }
 
   // Add the histogram
@@ -501,7 +501,7 @@ function render_ranked_barplot(container_selector, data, config={}) {
       .attr('y', 0)
       .attr('dy', '.75em')
       .attr('text-anchor', 'middle')
-      .text(config['y_label'])
+      .html(config['y_label'])
     }
     //Render tooltips
     setTooltips();

src/modules/site-v2/base/views/tools/genetic_mapping.py

@@ -33,24 +33,6 @@
 
 
 
-def results_columns():
-  return [
-    {
-      'title': 'Description',
-      'class': 'label',
-      'field': 'label',
-      'width': 0.6,
-      'link_to_data': True,
-    },
-    {
-      'title': 'Trait',
-      'class': 'trait',
-      'field': 'trait',
-      'width': 0.4,
-    },
-  ]
-
-
 @genetic_mapping_bp.route('', methods=['GET'])
 @jwt_required()
 def genetic_mapping():
@@ -162,7 +144,6 @@ def list_results():
     # Table info
     'species_list': Species.all(),
     'items': list_reports(NemascanReport, None if show_all else user, filter_errs),
-    'columns': results_columns(),
 
     'JobStatus': JobStatus,
   })

src/modules/site-v2/base/views/tools/heritability_calculator.py

@@ -51,23 +51,6 @@
 )
 
 
-def results_columns():
-  return [
-    {
-      'title': 'Description',
-      'class': 'label',
-      'field': 'label',
-      'width': 0.6,
-      'link_to_data': True,
-    },
-    {
-      'title': 'Trait',
-      'class': 'trait',
-      'field': 'trait',
-      'width': 0.4,
-    },
-  ]
-
 
 @heritability_calculator_bp.route('')
 @jwt_required()
@@ -136,7 +119,6 @@ def list_results():
     # Table info
     'species_list': Species.all(),
     'items': list_reports(HeritabilityReport, None if show_all else user, filter_errs),
-    'columns': results_columns(),
 
     'JobStatus': JobStatus,
   })

src/modules/site-v2/base/views/tools/pairwise_indel_finder.py

@@ -32,30 +32,6 @@
 
 
 
-def results_columns():
-  return [
-    {
-      'title': 'Site',
-      'class': 'site',
-      'field': 'site',
-      'width': 0.5,
-      'link_to_data': True,
-      'data_order': lambda e: e['site'],
-    },
-    {
-      'title': 'Strain 1',
-      'class': 's1',
-      'field': 'strain_1',
-      'width': 0.25,
-    },
-    {
-      'title': 'Strain 2',
-      'class': 's2',
-      'field': 'strain_2',
-      'width': 0.25,
-    },
-  ]
-
 def try_get_sv_strains(species):
   try:
     return get_sv_strains(species)
@@ -185,7 +161,6 @@ def list_results():
     # Table info
     'species_list': Species.all(),
     'items': list_reports(IndelPrimerReport, None if show_all else user, filter_errs),
-    'columns': results_columns(),
 
     'JobStatus': JobStatus,
   })

src/modules/site-v2/base/views/tools/phenotype_database.py

@@ -44,31 +44,6 @@ def check_bp_enabled():
 
 
 
-def results_columns():
-  return [
-    {
-      'title': 'Description',
-      'class': 'label',
-      'field': 'label',
-      'width': 0.2,
-      'link_to_data': True,
-    },
-    {
-      'title': 'Trait 1',
-      'class': 's1',
-      'field': 'trait_1_name',
-      'width': 0.4,
-    },
-    {
-      'title': 'Trait 2',
-      'class': 's2',
-      'field': 'trait_2_name',
-      'width': 0.4,
-    },
-  ]
-
-
-
 #
 # Main Endpoint
 #
@@ -253,7 +228,7 @@ def submit():
   # Read & clean fields from JSON data
   data = {
     field: bleach.clean(request.json.get(field))
-      for field in {'label', 'species', 'trait_1', 'trait_1_dataset'}
+      for field in {'species', 'trait_1', 'trait_1_dataset'}
   }
 
   # Read & clean values for trait 2, if given
@@ -312,7 +287,6 @@ def list_results():
     # Table info
     'species_list': Species.all(),
     'items': list_reports(PhenotypeReport, user = None if show_all else user, filter_errs=filter_errs),
-    'columns': results_columns(),
 
     'JobStatus': JobStatus,
   })

src/modules/site-v2/templates/_includes/macros.html

@@ -167,8 +167,3 @@
   <em>Unable to retrieve files.</em>
 {%- endif %}
 {%- endmacro %}
-
-
-{%- macro label_string_units(name, units=null) %}
-{%- if units -%} "{{ name }} ({{ units }})" {%- else -%} "{{ name }}" {%- endif -%}
-{%- endmacro %}

src/modules/site-v2/templates/_includes/phenotype-database-table.html

@@ -104,7 +104,13 @@
 <div class="offcanvas offcanvas-end offcanvasPhenotype" tabindex="-1" id="offcanvas1"
     aria-labelledby="offcanvas1Label">
     <div class="offcanvas-header">
-        <h1 class="h5" id="offcanvas1Label"></h5>
+        <div>
+            <h1 class="h5">
+                <span id="offcanvas1-header-1" class="d-block mb-1"></span>
+                <span id="offcanvas1-header-2" class="d-block text-dark fw-normal"></span>
+                <span class="d-block text-dark fw-normal"><em id="offcanvas1-header-3"></em></span>
+            </h1>
+        </div>
         <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
     </div>
     <div class="offcanvas-body p-4">
@@ -114,7 +120,8 @@ <h1 class="h5" id="offcanvas1Label"></h5>
 
 {% block script %}
 <script>
-    {% include '_scripts/utils.js' %} {#/* defines: flash_message */#}
+    {% include '_scripts/utils.js' %}       {#/* defines: flash_message */#}
+    {% include '_scripts/trait_utils.js' %} {#/* defines: traitNameHTML, queryTraitByName */#}
 
     $(document).ready(function() {
 
@@ -168,7 +175,7 @@ <h1 class="h5" id="offcanvas1Label"></h5>
                         const trait_name = row.trait_name_caendr;
                         const url = '{{ analyze_link | safe }}'.replace("TRAIT_NAME", trait_name).replace("TRAIT_SET", 'zhang');
                         return `
-                            <div id="trait-data-${row.trait_name_caendr}" class="ps-3 pt-0" data-description="${row.description_short || row.description_long}" data-species="${row.species_name}">
+                            <div id="trait-data-${row.trait_name_caendr}" class="ps-3 pt-0">
                                 <a href='${url}'><i class="bi bi-arrow-right-circle-fill" aria-hidden="true"></i>Analyze</a>
                             </div>`
                     },
@@ -185,17 +192,11 @@ <h1 class="h5" id="offcanvas1Label"></h5>
 
         // Fetch data for a trait and fill out side bar for non-bulk traits
         $(document).on('click','#traitDetails', function() {
-            const data = {csrf_token: $('#csrf_token').val(), trait_name: $(this).data('value')}
-            $.ajax({
-                type: "POST",
-                url: "{{ url_for('phenotype_database.get_traits_json') }}",
-                data: JSON.stringify(data),
-                contentType: "application/json",
-                dataType: "json",
-                success: function(response) {
+            queryTraitByName($(this).data('value'), $('#csrf_token').val())
+                .then((response) => {
                     fillOutModal(response)
-                },
-                error: function(error){
+                })
+                .fail((error) => {
                     console.error(error)
                     $('#offcanvas1 .btn-close').click()
                     $('html').animate({
@@ -204,9 +205,8 @@ <h1 class="h5" id="offcanvas1Label"></h5>
                     if (error.responseJSON && error.responseJSON.message) {
                         $('.alert').remove()
                         flash_message(error.responseJSON.message)
-                    }      
-                }
-            })
+                    }
+                })
         })
 
 
@@ -321,16 +321,14 @@ <h1 class="h5" id="offcanvas1Label"></h5>
                                     class="bi bi-chevron-right" aria-hidden="true"></i><em>${speciesName}</em></a>
                         </td>
                         <td id="accordionHeading-${i+1}">
-                            <strong>${arr[i].trait_name_display_1 || arr[i].trait_name_caendr}</strong>
-                            <p class="mb-0">${arr[i].trait_name_display_1 ? arr[i].trait_name_display_2 : ''}</p>
-                            <em>${arr[i].trait_name_display_1 ? arr[i].trait_name_display_3 : ''}</em>
+                            ${traitNameHTML( arr[i].trait_name_display_1, arr[i].trait_name_display_2, arr[i].trait_name_display_3 )}
                         </td>
-                        <td>${arr[i].description_short}.</td>
+                        <td>${arr[i].description_short ? (arr[i].description_short + '.') : ''}</td>
                         <td>${arr[i].source_lab}</td>
                         <td>${createdOn}</td>
-                        <td class="d-flex flex-column" id="tags">${tagsHTML}</td>
+                        <td class="d-flex-row flex-column" id="tags">${tagsHTML}</td>
                         <td class="optionsToolbar">
-                            <div class="ps-3 pt-0" id="trait-data-${arr[i].trait_name_caendr}" data-description="${arr[i].description_short || arr[i].description_long}" data-species="${arr[i].species_name}"><a href='${url}'><i class="bi bi-arrow-right-circle-fill"
+                            <div class="ps-3 pt-0" id="trait-data-${arr[i].trait_name_caendr}"><a href='${url}'><i class="bi bi-arrow-right-circle-fill"
                                         aria-hidden="true"></i>Analyze</a></div>
                         </td>
                     </tr>
@@ -422,7 +420,9 @@ <h3 class="h5 text-dark">Full Description</h3>
     }
 
     function fillOutModal(trait) {
-        $('#offcanvas1Label').text(trait.trait_name_caendr)
+        $('#offcanvas1-header-1').text(trait.trait_name_display_1)
+        $('#offcanvas1-header-2').text(trait.trait_name_display_2)
+        $('#offcanvas1-header-3').text(trait.trait_name_display_3)
         manageVal(trait.capture_date, '#captureDate', true)
         manageVal(trait.created_on, '#createdOn', true)
         manageVal(trait.modified_on, '#modifiedOn', true)