Merge pull request #1199 from alliance-genome/test

Release 6.0.0 to Production

.gitignore

@@ -46,3 +46,6 @@ Thumbs.db
 *.swp
 
 
+cdk-outputs.json
+cdk.context.json
+cdk.out

Makefile

@@ -23,6 +23,15 @@ test:
 run:
 	npm start
 
+stage-alb-deploy:
+	npx aws-cdk deploy stage-alb-stack
+
+test-alb-deploy:
+	npx aws-cdk deploy test-alb-stack
+
+prod-alb-deploy:
+	npx aws-cdk deploy prod-alb-stack
+
 uirun:
 	npm start
 

apps/main-app/src/components/OrthologPicker.js

@@ -4,7 +4,7 @@ import {
   STRINGENCY_HIGH,
   STRINGENCY_MED,
   STRINGNECY_LOW
-} from './orthology/constants';
+} from './homology/constants';
 import {
   DropdownMenu,
   DropdownToggle,

apps/main-app/src/components/dataTable/AnnotatedEntitiesPopupCuration.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import {
   DropdownMenu,
@@ -13,6 +13,16 @@ import ExternalLink from '../ExternalLink';
 import { Link } from 'react-router-dom';
 import { getResourceUrl } from "./getResourceUrl";
 import TypeCellCuration from './TypeCellCuration';
+import StrainBackground from './StrainBackground';
+import AssertedGenes from './AssertedGenes';
+import RelatedNotes from './RelatedNotes';
+import EvidenceCodesCellCuration from './evidenceCodesCellCuration';
+import ProviderCellCuration from './ProviderCellCuration';
+import GeneticSex from './GeneticSex';
+import AnnotationType from './AnnotationType';
+import AssociationCellCuration from './AssociationCellCuration';
+import GeneticModifiersCellCuration from './GeneticModifiersCellCuration';
+import { buildProviderWithUrl } from './utils';
 
 function renderLink(entity) {
   const url = getResourceUrl(entity.subject.curie, entity.subject.type, entity.subject.subtype)
@@ -32,7 +42,7 @@ function renderLink(entity) {
 }
 
 function AnnotatedEntitiesPopupCuration(props) {
-  const {children, entities} = props;
+  const {children, entities, mainRowCurie} = props;
 
   if (!entities || !entities.length) {
     return null;
@@ -56,30 +66,43 @@ function AnnotatedEntitiesPopupCuration(props) {
               <tr>
                 <th>Name</th>
                 <th>Type</th>
+                <th className={style.associationCell}>Association</th>
+                <th>Additional implicated genes</th>
                 <th>Experimental condition</th>
-                <th>Modifier</th>
+                <th></th>
+                <th>Genetic Modifiers</th>
+                <th>Strain Background</th>
+                <th>Genetic Sex</th>
+                <th className={style.relatedNotes}>Notes</th>
+                <th>Annotation type</th>
+                <th>Evidence Code</th>
+                <th>Source</th>
                 <th>References</th>
               </tr>
             </thead>
             <tbody>
               {
-                entities.map(entity => (
-                  <tr key={entity.subject.curie}>
-                    <td>{renderLink(entity)}</td>
-                    <td>
-                      <TypeCellCuration subject={entity.subject}/>
-                    </td>
-                    <td>
-                      <ExperimentalConditionCellCuration conditions={entity.conditionRelations} />
-                    </td>
-                    <td>
-                      <ExperimentalConditionCellCuration conditions={entity.conditionModifiers} />
-                    </td>
-                    <td>{entity.singleReference &&
-                      SingleReferenceCellCuration(entity.singleReference)
-                    }</td>
-                  </tr>
-                ))
+                entities.map(entity => {
+                  const provider = buildProviderWithUrl(entity);
+                  return (
+                    <tr key={entity.subject.curie}>
+                      <td>{renderLink(entity)}</td>
+                      <td><TypeCellCuration subject={entity.subject}/></td>
+                      <td><AssociationCellCuration association={entity.diseaseRelation?.name}/></td>
+                      <td><AssertedGenes assertedGenes={entity.assertedGenes} mainRowCurie={mainRowCurie}/></td>
+                      <td><ExperimentalConditionCellCuration conditions={entity.conditionRelations}/></td>
+                      <td><ExperimentalConditionCellCuration conditions={entity.conditionModifiers}/></td>
+                      <td><GeneticModifiersCellCuration relation={entity.diseaseGeneticModifierRelation} modifiers={entity.diseaseGeneticModifiers}/></td>
+                      <td><StrainBackground strainBackground={entity.sgdStrainBackground}/></td>
+                      <td><GeneticSex geneticSex={entity.geneticSex}/></td>
+                      <td><RelatedNotes className={style.relatedNotes} relatedNotes={entity.relatedNotes}/></td>
+                      <td><AnnotationType  annotationType={entity.annotationType}/></td>
+                      <td><EvidenceCodesCellCuration evidenceCodes={entity.evidenceCodes}/></td>
+                      <td><ProviderCellCuration provider={provider} /></td>
+                      <td><SingleReferenceCellCuration singleReference={entity.singleReference}/></td>
+                    </tr>
+                )
+              })
               }
             </tbody>
           </table>

apps/main-app/src/components/dataTable/AnnotationType.js

@@ -0,0 +1,9 @@
+
+function AnnotationType({annotationType}) {
+    if (annotationType) {
+        return <>{annotationType.name}</>;
+    }
+    return <></>;
+}
+
+export default AnnotationType;

apps/main-app/src/components/dataTable/AssertedGenes.js

@@ -0,0 +1,25 @@
+import CollapsibleList from '../collapsibleList/collapsibleList';
+import ExternalLink from '../ExternalLink';
+
+
+function makeAssertedGeneLink(curie, geneSymbol) {
+    if(curie) {
+      const symbol = <span dangerouslySetInnerHTML={{__html: geneSymbol}}/>;
+      return <ExternalLink href={`https://www.alliancegenome.org/gene/${curie}`}>{symbol}</ExternalLink>;
+    }
+    return null;
+}
+
+function AssertedGenes({assertedGenes, mainRowCurie}) {
+  const filteredAssertedGenes = assertedGenes?.filter(gene => gene.curie !== mainRowCurie);
+  if(assertedGenes && assertedGenes.length > 1) {
+    return (
+        <CollapsibleList collapsedSize={assertedGenes.length}>
+        {filteredAssertedGenes.map(gene => makeAssertedGeneLink(gene.curie, gene.geneSymbol.displayText))}
+        </CollapsibleList>
+    );
+  }
+  return <></>;
+}
+
+export default AssertedGenes;

apps/main-app/src/components/dataTable/AssociationCellCuration.js

@@ -0,0 +1,6 @@
+function AssociationCellCuration({ association }){
+  if(!association) return;
+  return association.replaceAll('_', ' ');
+}
+
+export default AssociationCellCuration;

apps/main-app/src/components/dataTable/DataTable.js

@@ -24,6 +24,7 @@ import DropdownCheckboxFilter from './DropdownCheckboxFilter';
 import HorizontalScroll from '../horizontalScroll';
 import { buildTableQueryString } from '../../lib/utils';
 import LoadingSpinner from '../loadingSpinner';
+import DropdownNoDataFilter from './DropdownNoDataFilter';
 
 const DataTable = ({
   className,
@@ -150,7 +151,12 @@ const DataTable = ({
             value={columnFilter}
           />
         );
-      } else {
+        //if filter is a checkbox dropdown, but there is are no distinctFieldValues then show DropdownNoDataFilter instead
+      } else if(column.filterType === "checkbox") {
+        column.filterRenderer = () => (
+          <DropdownNoDataFilter />
+        );
+      } else{
         column.filterRenderer = (onFilter, column) => (
           <DropdownTextFilter
             column={column}

apps/main-app/src/components/dataTable/DiseaseQualifiersColumn.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import CommaSeparatedList from '../commaSeparatedList';
+import EvidenceCodeCuration from './EvidenceCodeCuration';
+
+const DiseaseQualifiersColumn = ({qualifiers}) => {
+
+  if (!qualifiers || !qualifiers.length) {
+    return null;
+  }
+
+  return (
+    <CommaSeparatedList>
+      {qualifiers.map(qualifier => qualifier)}
+    </CommaSeparatedList>
+  );
+};
+
+DiseaseQualifiersColumn.propTypes = {
+  qualifiers: PropTypes.arrayOf(PropTypes.string),
+};
+
+export default DiseaseQualifiersColumn;

apps/main-app/src/components/dataTable/DropdownNoDataFilter.js

@@ -0,0 +1,7 @@
+import NoData from '../noData';
+
+const DropdownNoDataFilter = () => {
+  return <NoData>No Data to Filter</NoData>;
+};
+
+export default DropdownNoDataFilter;

apps/main-app/src/components/dataTable/EvidenceCodeCuration.js

@@ -28,7 +28,7 @@ const EvidenceCodeCuration = ({code}) => {
   }
 };
 
-EvidenceCodeCuration.PropTypes = {
+EvidenceCodeCuration.propTypes = {
   code: PropTypes.shape({
     curie: PropTypes.string,
     name: PropTypes.string,

apps/main-app/src/components/dataTable/GeneticModifiersCellCuration.js

@@ -0,0 +1,57 @@
+import React from 'react';
+import { CollapsibleList } from '../collapsibleList';
+import ExternalLink from '../ExternalLink';
+import { getResourceUrl } from './getResourceUrl';
+import { Link } from 'react-router-dom';
+
+
+function GeneticModifierLink(modifier) {
+    switch(modifier?.type) {
+        case 'Gene':
+            if (modifier.geneSymbol) {
+                return (
+                    <Link to={`/gene/${modifier.curie}`} target='_blank'>
+                        <span dangerouslySetInnerHTML={{__html: modifier.geneSymbol.displayText}}/>
+                    </Link>);
+            }
+            break;
+        case 'Allele':
+            if (modifier.alleleSymbol) {
+                return (
+                    <Link to={`/allele/${modifier.curie}`}  target='_blank'>
+                        <span dangerouslySetInnerHTML={{__html: modifier.alleleSymbol.displayText}}/>
+                    </Link>);
+            }
+            break;
+        case 'AffectedGenomicModel':
+            let url = getResourceUrl(modifier.curie, modifier.type, modifier.subtype);
+            if (url && modifier.name) {                
+                return ( 
+                    <ExternalLink href={url}>
+                        <span dangerouslySetInnerHTML={{__html: modifier.name}}/>
+                    </ExternalLink>);
+            }
+            break;
+        default:
+            return <></>;
+    }
+    return <></>;
+}
+
+function GeneticModifiersCellCuration ({relation, modifiers}) {
+    if(relation && modifiers?.length > 0){
+        return (<dl>
+            <React.Fragment>
+                <dt>{relation.name?.replace(/_/, ' ')}:</dt>
+                <dd>
+                    <CollapsibleList collapsedSize={modifiers.length}>
+                        {modifiers.map(GeneticModifierLink)}
+                    </CollapsibleList>
+                </dd>
+            </React.Fragment>
+        </dl>);
+    }
+    return <></>;
+};
+
+export default GeneticModifiersCellCuration;

apps/main-app/src/components/dataTable/GeneticSex.js

@@ -0,0 +1,8 @@
+
+function GeneticSex({geneticSex}) {
+ if(geneticSex) 
+    return <>{geneticSex.name}</>;
+ return <></>;
+}
+
+export default GeneticSex;

apps/main-app/src/components/dataTable/NoteCell.js

@@ -0,0 +1,7 @@
+
+function NoteCell(note) {
+  const prefix = note.noteType.name === "disease_note" ? "Note:" : "Summary:";
+  return note && (<div> <b>{prefix}</b> {note.freeText} </div>);
+}
+
+export default NoteCell;

apps/main-app/src/components/dataTable/ProviderCellCuration.js

@@ -0,0 +1,26 @@
+import ExternalLink from "../ExternalLink";
+
+function ProviderCellCuration({ provider }) {
+    if(!provider) return null;
+
+    const { dataProvider, secondaryDataProvider } = provider;
+
+    return (
+        <span>
+            <ExternalLink href={dataProvider.url} key={dataProvider.id} title={dataProvider.abbreviation}>
+                {dataProvider.abbreviation}
+            </ExternalLink>
+            {
+                secondaryDataProvider &&
+                <>
+                    <i> via </i>
+                    <ExternalLink href={secondaryDataProvider.url} key={secondaryDataProvider.id} title={secondaryDataProvider.abbreviation}>
+                        {secondaryDataProvider.abbreviation}
+                    </ExternalLink>
+                </>
+            }
+        </span>
+    )
+}
+
+export default ProviderCellCuration;

apps/main-app/src/components/dataTable/ProvidersCellCuration.js

@@ -1,36 +1,17 @@
 import CommaSeparatedList from '../commaSeparatedList';
-
-const removeDuplicates = (providers) => {
-  const newArray = providers.map((provider) => [provider.dataProvider.abbreviation, provider]);
-  const newMap = new Map(newArray);
-  const iterator = newMap.values();
-  const uniqueProviders = [...iterator];
-
-  return uniqueProviders;
-}
+import ProviderCellCuration from './ProviderCellCuration';
+import { removeDuplicates } from './utils';
 
 const ProvidersCellCuration = ({ providers }) => {
-  const uniqueProviders = removeDuplicates(providers);
+  if(!providers) return null;
+
+  const uniqueProviders = removeDuplicates(providers, (provider) => provider.dataProvider.abbreviation);
 
   return (
     <CommaSeparatedList listItemClassName='d-block'>
       {
-        uniqueProviders.map(provider => {
-          const { dataProvider, secondaryDataProvider } = provider;
-
-          return (
-              <span>
-                {dataProvider.abbreviation}
-                {
-                  secondaryDataProvider &&
-                    <>
-                      <i> via </i>
-                      {secondaryDataProvider.abbreviation}
-                    </>
-                }
-              </span>
-          )
-
+        uniqueProviders?.map(provider => {
+          return <ProviderCellCuration provider={provider} />
         })
       }
     </CommaSeparatedList>