gramene-search 1.3.0 → 1.4.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gramene-search",
-  "version": "1.3.0",
+  "version": "1.4.1",
   "description": "search wrapper for gramene",
   "source": "src/index.js",
   "main": "dist/index.js",

package/src/bundles/api.js

@@ -226,6 +226,24 @@ curatedGenes.reactCuratedGenes = createSelector(
   }
 );
 
+const grameneGermplasm = createAsyncResourceBundle( {
+  name: 'grameneGermplasm',
+  actionBaseType: 'GRAMENE_GERMPLASM',
+  persist: true,
+  getPromise: ({store}) => {
+    return fetch(`${store.selectGrameneAPI()}/germplasm?rows=-1`)
+      .then(res => res.json())
+      .then(res => _.groupBy(res, 'ens_id'))
+  }
+});
+grameneGermplasm.reactGrameneGermplasm = createSelector(
+  'selectGrameneGermplasmShouldUpdate',
+  (shouldUpdate) => {
+    if (shouldUpdate) {
+      return { actionCreator: 'doFetchGrameneGermplasm' }
+    }
+  }
+);
 //
 // const grameneExpressionAssays = createAsyncResourceBundle( {
 //   name: 'grameneExpressionAssays',
@@ -515,4 +533,4 @@ const grameneOrthologs = {
 // });
 
 
-export default [grameneSuggestions, grameneSearch, grameneMaps, grameneTaxonomy, grameneTaxDist, grameneOrthologs, curatedGenes, grameneGeneAttribs, expressionSamples, expressionStudies];
+export default [grameneSuggestions, grameneSearch, grameneMaps, grameneTaxonomy, grameneTaxDist, grameneOrthologs, curatedGenes, grameneGermplasm, grameneGeneAttribs, expressionSamples, expressionStudies];

package/src/components/results/GeneList.js

@@ -139,6 +139,12 @@ class Gene extends React.Component {
     super(props);
     this.state = {
       details: [
+        {
+          id: 'VEP',
+          label: 'Germplasm',
+          popup: 'Germplasm with protein truncating variants (PTVs)',
+          available: false
+        },
         {
           id: 'sequences',
           label: 'Sequences',
@@ -175,12 +181,6 @@ class Gene extends React.Component {
           popup: 'Curated Publications',
           available: false
         },
-        // {
-        //   id: 'VEP',
-        //   label: 'Germplasm (PTV)',
-        //   popup: 'Germplasm with protein truncating variants',
-        //   available: false
-        // },
         {
           id: 'xrefs',
           label: 'Xrefs',

package/src/components/results/details/VEP.css

@@ -0,0 +1,9 @@
+.button-like-link {
+    display: inline-block;
+    padding: 0;
+    background-color: #fff0;
+    color: #007bff;
+    text-decoration: underline;
+    border: none;
+    cursor: pointer;
+}

package/src/components/results/details/VEP.js

@@ -1,31 +1,98 @@
-import React, { useState, useEffect } from 'react';
+import React, {useState, useEffect, useMemo} from 'react';
 import {connect} from "redux-bundler-react";
-import {Tabs, Tab, Form, Container, Row, Col, ToggleButton, ButtonGroup } from 'react-bootstrap';
-import * as console from "console";
+import {Button} from 'react-bootstrap';
+import { AgGridReact } from "ag-grid-react";
+import "ag-grid-community/styles/ag-grid.css";
+import "ag-grid-community/styles/ag-theme-quartz.css";
+import "./VEP.css";
+import {suggestionToFilters} from "../../utils";
 
+const metaRenderer = params => {
+  if (params.value.field === "germplasm") { // link to grin or SorgMutDB
+    if (params.value.germplasm_dbid) {
+      return <a target="_blank" href={`https://npgsweb.ars-grin.gov/gringlobal/accessiondetail.aspx?id=${params.value.germplasm_dbid}`}>{params.value.pub_id}</a>;
+    }
+    return (
+      <form id={params.value.pub_id} action="https://www.depts.ttu.edu/igcast/sorbmutdb.php" method="post" target="_blank">
+        <input type="hidden" name="search" value={params.value.gene_id.replace('SORBI_3','Sobic.')} />
+        <input type="hidden" name="submit" value="Search" />
+        <button type="submit" className="button-like-link">SorbMutDB</button>
+      </form>
+    );
+  }
+  if (params.value.field === "search") { // search filter
+    const currentURL = new URL(window.location.href);
+    currentURL.search = '';
+    currentURL.searchParams.set('category', 'Germplasm');
+    currentURL.searchParams.set('fq_field',`VEP__merged__${study_info[params.value.pop_id].type}__attr_ss`);
+    currentURL.searchParams.set('fq_value',params.value.ens_id);
+    currentURL.searchParams.set('name', params.value.ens_id);
+
+    return <Button size='sm' href={currentURL.toString()}>Search</Button>
+  }
+  return params.value.label
+}
+const sortByLabel = (valueA, valueB, nodeA, nodeB, isDescending) => {
+  if (valueA.label === valueB.label) return 0;
+  return (valueA.label > valueB.label) ? 1 : -1;
+}
 
+const study_info = {
+  '1' : {label: 'Purdue EMS', type: 'EMS'},
+  '2' : {label: 'USDA Lubbock EMS', type: 'EMS'},
+  '3' : {label: 'Lozano', type: 'NAT'},
+  '4' : {label: 'USDA Lubbock EMS', type: 'EMS'},
+  '5' : {label: 'Boatwright SAP', type: 'NAT'}
+};
 const Detail = props => {
   const gene = props.geneDocs[props.searchResult.id];
-  if (props.grameneConsequences && props.grameneConsequences[gene._id]) {
+  if (props.grameneConsequences && props.grameneConsequences[gene._id] && props.grameneGermplasm) {
+    const germplasmLUT = props.grameneGermplasm;
     const vep_obj = props.grameneConsequences[gene._id];
-    let table = [];
+    let accessionTable = [];
+    let tableFields = [
+      { field: 'Order Germplasm', cellRenderer: metaRenderer, comparator: sortByLabel},
+      { field: 'Synonyms', cellRenderer: metaRenderer, comparator: sortByLabel},
+      { field: 'Study/Population', cellRenderer: metaRenderer, comparator: sortByLabel},
+      { field: 'VEP consequence', cellRenderer: metaRenderer, comparator: sortByLabel},
+      { field: 'Allele Status', cellRenderer: metaRenderer, comparator: sortByLabel},
+      { field: 'All LOF Genes', cellRenderer: metaRenderer, comparator: sortByLabel}
+    ];
     Object.entries(vep_obj).forEach(([key,accessions]) => {
       const parts = key.split("__");
       if (parts[0] === "VEP") {
         if (parts[1] !== "merged") {
-          accessions.forEach(accession => {
-            table.push({
-              "study/pop": parts[3],
-              "consequence": parts[1],
-              "homo/het": parts[2],
-              "acc_id": accession,
-              "search": "button to search for genes with PTV in this accession"
-            })
+          accessions.forEach(ens_id => {
+            const germplasm = germplasmLUT[ens_id][0];
+            const accInfo = {
+              'Study/Population': {label: study_info[parts[3]].label},
+              'VEP consequence': {label: parts[1].replaceAll("_"," ")},
+              'Allele Status': {label: parts[2] === "het" ? "heterozygous" : "homozygous"},
+              'Order Germplasm': {field: 'germplasm', gene_id: props.searchResult.id, label: germplasm.pub_id, ...germplasm},
+              'All LOF Genes': {field: 'search', label: germplasm.ens_id, ...germplasm},
+              'Synonyms': {label: germplasm.ens_id}
+            };
+            accessionTable.push(accInfo);
           });
         }
       }
     });
-    return <pre>{JSON.stringify(table,null,2)}</pre>
+    // const [rowData, setRowData] = useState(accessionTable);
+    // const [colDefs, setColDefs] = useState(tableFields);
+    const defaultColDef = useMemo(() => {
+      return {
+        filter: true
+      }
+    }, []);
+    return <div>
+      <h5>Predicted loss-of-function alleles were detected in these germplasm.</h5>
+      <div >Explore other variants within this gene in the <a target="_blank"
+         href={`${props.configuration.ensemblURL}/${gene.system_name}/Gene/Variation_Gene/Image?db=core;g=${props.searchResult.id}`}>
+        Variant image</a> page on the Ensembl site.</div>
+      <div className="ag-theme-quartz" style={{height: `${44 * (accessionTable.length + 2)}px`}}>
+        <AgGridReact rowData={accessionTable} columnDefs={tableFields} defaultColDef={defaultColDef}/>
+      </div>
+    </div>
   } else {
     props.doRequestVEP(gene._id);
     return <pre>loading</pre>;
@@ -35,6 +102,7 @@ const Detail = props => {
 export default connect(
   'selectConfiguration',
   'selectGrameneConsequences',
+  'selectGrameneGermplasm',
   'doRequestVEP',
   Detail
 );

package/src/demo.js

@@ -116,7 +116,7 @@ const panSites = [
     url: 'https://www.sorghumbase.org',
     ensemblURL: 'https://ensembl-dev.sorghumbase.org',
     ensemblSite: 'https://ensembl-dev.sorghumbase.org',
-    ensemblRest: 'https://data.gramene.org/pansite-ensembl',
+    ensemblRest: 'https://data.gramene.org/pansite-ensembl-87',
     grameneData: 'https://data.sorghumbase.org/sorghum_v7',
     ga: 'G-L5KXDCCZ16',
     targetTaxonId: 4558003,