Skip to content

Commit

Permalink
wip: Update IBD browser frontend files for demo
Browse files Browse the repository at this point in the history
  • Loading branch information
@rileyhgrant
rileyhgrant committed Feb 5, 2024
1 parent a2f627a commit 8c9023b
Show file tree
Hide file tree
Showing 5 changed files with 112 additions and 142 deletions.
186 changes: 83 additions & 103 deletions src/browsers/ibd/IBDBrowser.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,9 +34,9 @@ const IBDBrowser = () => (
]}
geneResultsPageHeading="IBD: gene burden results"
// TODO:
geneResultAnalysisGroupOptions={['EPI', 'DEE', 'GGE', 'NAFE']}
defaultGeneResultAnalysisGroup="EPI"
defaultGeneResultSortKey="ptv_pval"
geneResultAnalysisGroupOptions={['cd', 'ibd', 'uc']}
defaultGeneResultAnalysisGroup="ibd"
defaultGeneResultSortKey="todo"
geneResultColumns={[
{
key: 'n_cases',
Expand All @@ -50,114 +50,94 @@ const IBDBrowser = () => (
minWidth: 90,
render: renderCount,
},
// TODO: add more below
{
key: 'ptv_case_count',
heading: 'PTV Case Count',
minWidth: 65,
key: 'lof_missense_0_001_P',
heading: 'lof missense P',
minWidth: 110,
render: renderCount,
},
{
key: 'ptv_control_count',
heading: 'PTV Control Count',
minWidth: 65,
key: 'lof_missense_0_001_BETA',
heading: 'lof missense beta',
minWidth: 110,
render: renderCount,
},
{
key: 'ptv_pval',
heading: 'PTV p\u2011val',
minWidth: 85,
},
{
key: 'ptv_OR',
heading: 'PTV odds ratio',
minWidth: 85,
render: renderOddsRatio,
},
{
key: 'damaging_missense_case_count',
heading: 'Damaging Missense Case Count',
minWidth: 85,
render: renderCount,
},
{
key: 'damaging_missense_control_count',
heading: 'Damaging Missense Control Count',
minWidth: 85,
render: renderCount,
},
{
key: 'damaging_missense_pval',
heading: 'Damaging Missense p\u2011val',
minWidth: 85,
},
{
key: 'damaging_missense_OR',
heading: 'Damaging Missense odds ratio',
minWidth: 85,
render: renderOddsRatio,
},
// TODO: add more above
]}
// TODO:
defaultVariantAnalysisGroup="EPI"
variantAnalysisGroupOptions={['EPI', 'DEE', 'GGE', 'NAFE']}
variantResultColumns={[
{
key: 'group_result.estimate',
heading: 'Estimate',
minWidth: 80,
},
{
key: 'group_result.chi_sq_stat',
heading: 'χ²',
minWidth: 65,
},
{
key: 'group_result.p_value',
heading: 'P\u2011Value',
minWidth: 65,
},
{
key: 'group_result.in_analysis',
heading: 'In Analysis',
minWidth: 85,
tooltip: 'Was this variant used in gene burden analysis.',
render: (value) => (value ? 'yes' : ''),
renderForCSV: (value) => (value ? 'yes' : ''),
showOnDetails: false,
},
]}
variantConsequences={[
{
term: 'damaging_missense',
label: 'Damaging Missense',
category: 'missense',
},
{
term: 'non_coding',
label: 'Non-coding',
category: 'other',
},
{
term: 'other_missense',
label: 'Other Missense',
category: 'missense',
},
{
term: 'pLoF',
label: 'Protein-truncating',
category: 'lof',
},
{
term: 'synonymous',
label: 'Synonymous',
category: 'synonymous',
},
{
term: 'NA',
label: '',
category: 'other',
},
]}
defaultVariantAnalysisGroup="ibd-control"
variantAnalysisGroupOptions={['cd-control', 'ibd-control', 'uc-control']}
variantResultColumns={
[
{
key: 'group_result.p',
heading: 'P\u2011Value',
minWidth: 65,
},
]
// [
// {
// key: 'group_result.estimate',
// heading: 'Estimate',
// minWidth: 80,
// },
// {
// key: 'group_result.chi_sq_stat',
// heading: 'χ²',
// minWidth: 65,
// },
// {
// key: 'group_result.p_value',
// heading: 'P\u2011Value',
// minWidth: 65,
// },
// {
// key: 'group_result.in_analysis',
// heading: 'In Analysis',
// minWidth: 85,
// tooltip: 'Was this variant used in gene burden analysis.',
// render: (value) => (value ? 'yes' : ''),
// renderForCSV: (value) => (value ? 'yes' : ''),
// showOnDetails: false,
// },
// ]
}
variantConsequences={
[{ term: 'missense_variant', label: 'Missense variant', category: 'missense' }]
// [
// {
// term: 'damaging_missense',
// label: 'Damaging Missense',
// category: 'missense',
// },
// {
// term: 'non_coding',
// label: 'Non-coding',
// category: 'other',
// },
// {
// term: 'other_missense',
// label: 'Other Missense',
// category: 'missense',
// },
// {
// term: 'pLoF',
// label: 'Protein-truncating',
// category: 'lof',
// },
// {
// term: 'synonymous',
// label: 'Synonymous',
// category: 'synonymous',
// },
// {
// term: 'NA',
// label: '',
// category: 'other',
// },
// ]
}
variantCustomFilter={{
component: IBDVariantFilter,
defaultFilter: {
Expand Down
31 changes: 17 additions & 14 deletions src/browsers/ibd/IBDGeneResults.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,13 +24,15 @@ const renderOddsRatio = (value) => {
}

const renderPVal = (pval) => {
if (pval === null) {
return '-'
}
if (pval === 0) {
return '2.2e-16'
}
return pval.toPrecision(3)
console.log(pval)
// if (pval === null) {
// return '-'
// }
// if (pval === 0) {
// return '2.2e-16'
// }
// return pval.toPrecision(3)
return 1
}

const IBDGeneResult = ({ result }) => (
Expand All @@ -48,14 +50,15 @@ const IBDGeneResult = ({ result }) => (
<tbody>
<tr>
<th scope="row">Protein-truncating</th>
<td>{result.ptv_case_count === null ? '-' : result.ptv_case_count}</td>
<td>{result.ptv_control_count === null ? '-' : result.ptv_control_count}</td>
<td>{renderPVal(result.ptv_pval)}</td>
<td>{renderOddsRatio(result.ptv_OR)}</td>
{/* <td>{result.ptv_case_count === null ? '-' : result.ptv_case_count}</td> */}
{/* <td>{result.ptv_control_count === null ? '-' : result.ptv_control_count}</td> */}
{/* <td>{renderPVal(result.ptv_pval)}</td> */}
{/* <td>{renderPVal(result)}</td> */}
{/* <td>{renderOddsRatio(result.ptv_OR)}</td> */}
</tr>
<tr>
<th scope="row">Damaging Missense</th>
<td>
{/* <td>
{result.damaging_missense_case_count === null
? '-'
: result.damaging_missense_case_count}
Expand All @@ -66,7 +69,7 @@ const IBDGeneResult = ({ result }) => (
: result.damaging_missense_control_count}
</td>
<td>{renderPVal(result.damaging_missense_pval)}</td>
<td>{renderOddsRatio(result.damaging_missense_OR)}</td>
<td>{renderOddsRatio(result.damaging_missense_OR)}</td> */}
</tr>
</tbody>
</Table>
Expand Down Expand Up @@ -123,7 +126,7 @@ const IBDGeneResults = ({ results }) => (
/>
</h2>
<Tabs
tabs={['EPI', 'DEE', 'GGE', 'NAFE'].map((group) => ({
tabs={['cd', 'ibd', 'uc'].map((group) => ({
id: group,
label: group,
render: () =>
Expand Down
32 changes: 7 additions & 25 deletions src/browsers/ibd/IBDHomePage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,9 @@ import { ExternalLink, Page, PageHeading } from '@gnomad/ui'
import DocumentTitle from '../base/DocumentTitle'
import Link from '../base/Link'
import Searchbox from '../base/Searchbox'
import StyledContent from '../base/StyledContent'

import homePageContent from './content/homepage.md'

const HomePageHeading = styled(PageHeading)`
margin: 3em 0 1em;
Expand All @@ -24,37 +27,16 @@ const HomePageWrapper = styled(Page)`
const IBDHomePage = () => (
<HomePageWrapper>
<DocumentTitle title="IBD Browser" />
<HomePageHeading>Lorem ipsum dolor sit amet</HomePageHeading>
<HomePageHeading>
IBD: Inflammatory Bowel Disease exome meta-analysis consortium
</HomePageHeading>

<Searchbox width="100%" />
<p style={{ marginTop: '0.25em' }}>
Or <Link to="/results">view all results</Link>
</p>

<p>
Lorem <ExternalLink href="https://google.com">ipsum dolor</ExternalLink> sit amet, consectetur
adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<StyledContent dangerouslySetInnerHTML={{ __html: homePageContent.html }} />
</HomePageWrapper>
)

Expand Down
Empty file added src/browsers/ibd/content/about.md
View file
Empty file.
5 changes: 5 additions & 0 deletions src/browsers/ibd/content/homepage.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
Examples - Gene name: [TODO:](/gene/ENSG00000099381), Ensembl gene ID: [ENSG00000055130](/gene/ENSG00000055130)

The IBD Sequencing Consortium is a global collaboration dedicated to aggregating, generating, and analyzing high-throughput sequencing data of inflammatory bowel disease patients to improve our understanding of disease architecture and advance gene discovery. The consortium was formed in 2014 with a commitment of data sharing, diversity and inclusivity - our hope is that the findings form theis study and others like it will provide a foundation for further investigation of disease mechanism and theraputic discovery. This browser is part of that overall effor to display and share these results with the wider scientific community. Partnering with the Broad Institute, the IBD Sequencing Consortium has sequenced more than XX patients as of 2024 from XX research cohorts across the world.

Analysis data last updated MONTH DD, YYYY

0 comments on commit 8c9023b

Please sign in to comment.