Skip to content

Commit ed33d6b

Browse files
phildarnowsky-broadphildarnowsky-broad
committed
Add constraint metrics table for mitochondrial genes
1 parent 99c951f commit ed33d6b

File tree

5 files changed

+2334
-137
lines changed

5 files changed

+2334
-137
lines changed

‎browser/src/ConstraintTable/ConstraintTable.spec.tsx

+70-2
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,10 @@ import { BrowserRouter } from 'react-router-dom'
1111
import ConstraintTable from './ConstraintTable'
1212
import { ExacConstraint } from './ExacConstraintTable'
1313
import { GnomadConstraint } from './GnomadConstraintTable'
14+
import {
15+
ProteinMitochondrialGeneConstraint,
16+
RNAMitochondrialGeneConstraint,
17+
} from '../GenePage/GenePage'
1418

1519
const exacConstraintFactory = Factory.define<ExacConstraint>(() => ({
1620
exp_lof: 0.123,
@@ -42,6 +46,34 @@ const gnomadConstraintFactory = Factory.define<GnomadConstraint>(() => ({
4246
oe_syn_upper: 0.95,
4347
}))
4448

49+
const proteinMitochondrialConstraintFactory = Factory.define<ProteinMitochondrialGeneConstraint>(
50+
() => ({
51+
exp_lof: 0.123,
52+
exp_syn: 0.234,
53+
exp_mis: 0.345,
54+
oe_lof: 0.789,
55+
oe_lof_lower: 0.6,
56+
oe_lof_upper: 0.9,
57+
oe_mis: 0.891,
58+
oe_mis_lower: 0.8,
59+
oe_mis_upper: 0.99,
60+
oe_syn: 0.912,
61+
oe_syn_lower: 0.8,
62+
oe_syn_upper: 0.95,
63+
obs_lof: 0.111,
64+
obs_syn: 0.222,
65+
obs_mis: 0.333,
66+
})
67+
)
68+
69+
const rnaMitochondrialConstraintFactory = Factory.define<RNAMitochondrialGeneConstraint>(() => ({
70+
observed: 0.11,
71+
expected: 0.22,
72+
oe: 0.33,
73+
oe_lower: 0.31,
74+
oe_upper: 0.35,
75+
}))
76+
4577
forAllDatasets('ConstraintTable with "%s" dataset selected', (datasetId) => {
4678
describe('with a minimal gene', () => {
4779
test('has no unexpected changes', () => {
@@ -65,20 +97,56 @@ forAllDatasets('ConstraintTable with "%s" dataset selected', (datasetId) => {
6597
})
6698
})
6799

68-
describe('with a mitochondrial gene', () => {
100+
describe('with a mitochondrial protein gene', () => {
101+
test('has no unexpected changes', () => {
102+
const constraint = proteinMitochondrialConstraintFactory.build()
103+
const tree = renderer.create(
104+
<BrowserRouter>
105+
<ConstraintTable
106+
datasetId={datasetId}
107+
geneOrTranscript={geneFactory.build({
108+
chrom: 'M',
109+
mitochondrial_constraint: constraint,
110+
})}
111+
/>
112+
</BrowserRouter>
113+
)
114+
expect(tree).toMatchSnapshot()
115+
})
116+
})
117+
118+
describe('with a mitochondrial RNA gene', () => {
69119
test('has no unexpected changes', () => {
120+
const constraint = rnaMitochondrialConstraintFactory.build()
70121
const tree = renderer.create(
71122
<BrowserRouter>
72123
<ConstraintTable
73124
datasetId={datasetId}
74-
geneOrTranscript={geneFactory.build({ chrom: 'M' })}
125+
geneOrTranscript={geneFactory.build({
126+
chrom: 'M',
127+
mitochondrial_constraint: constraint,
128+
})}
75129
/>
76130
</BrowserRouter>
77131
)
78132
expect(tree).toMatchSnapshot()
79133
})
80134
})
81135

136+
describe('with a mitochondrial gene missing constraint data', () => {
137+
const tree = renderer.create(
138+
<BrowserRouter>
139+
<ConstraintTable
140+
datasetId={datasetId}
141+
geneOrTranscript={geneFactory.build({
142+
chrom: 'M',
143+
})}
144+
/>
145+
</BrowserRouter>
146+
)
147+
expect(tree).toMatchSnapshot()
148+
})
149+
82150
describe('with a mitochondrial transcript', () => {
83151
test('has no unexpected changes', () => {
84152
const tree = renderer.create(

‎browser/src/ConstraintTable/ConstraintTable.tsx

+8-9
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import Link from '../Link'
88

99
import ExacConstraintTable from './ExacConstraintTable'
1010
import GnomadConstraintTable from './GnomadConstraintTable'
11+
import MitochondrialConstraintTable from './MitochondrialConstraintTable'
1112

1213
type Props = {
1314
datasetId: DatasetId
@@ -65,18 +66,16 @@ const ConstraintTable = ({ datasetId, geneOrTranscript }: Props) => {
6566
const { transcriptId, transcriptVersion, transcriptDescription } =
6667
transcriptDetails(geneOrTranscript)
6768

68-
const gnomadConstraint = geneOrTranscript.gnomad_constraint
69-
const exacConstraint = geneOrTranscript.exac_constraint
70-
7169
if (geneOrTranscript.chrom === 'M') {
72-
return (
73-
<p>
74-
Constraint is not available for mitochondrial{' '}
75-
{isGene(geneOrTranscript) ? 'genes' : 'transcripts'}
76-
</p>
77-
)
70+
if (isGene(geneOrTranscript)) {
71+
return <MitochondrialConstraintTable constraint={geneOrTranscript.mitochondrial_constraint} />
72+
}
73+
return <p>Constraint is not available for mitochondrial transcripts</p>
7874
}
7975

76+
const gnomadConstraint = geneOrTranscript.gnomad_constraint
77+
const exacConstraint = geneOrTranscript.exac_constraint
78+
8079
if (datasetId === 'exac') {
8180
if (!exacConstraint) {
8281
return (

‎browser/src/ConstraintTable/MitochondrialConstraintTable.tsx

+136
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
import React from 'react'
2+
import {
3+
MitochondrialGeneConstraint,
4+
ProteinMitochondrialGeneConstraint,
5+
RNAMitochondrialGeneConstraint,
6+
} from '../GenePage/GenePage'
7+
import { BaseTable } from '@gnomad/ui'
8+
9+
const isProteinMitochondrialGeneConstraint = (
10+
constraint: MitochondrialGeneConstraint
11+
): constraint is ProteinMitochondrialGeneConstraint =>
12+
Object.prototype.hasOwnProperty.call(constraint, 'exp_lof')
13+
14+
const ConstraintRow = ({
15+
category,
16+
expected,
17+
observed,
18+
oe,
19+
oeLower,
20+
oeUpper,
21+
}: {
22+
category: string
23+
expected: number
24+
observed: number
25+
oe: number
26+
oeLower: number
27+
oeUpper: number
28+
}) => (
29+
<tr>
30+
<th scope="row">{category}</th>
31+
<td>{expected.toFixed(1)}</td>
32+
<td>{observed.toFixed(1)}</td>
33+
<td>
34+
{oe.toFixed(2)} ({oeLower.toFixed(2)}-{oeUpper.toFixed(2)})
35+
</td>
36+
</tr>
37+
)
38+
39+
const ProteinConstraintMetrics = ({
40+
constraint,
41+
}: {
42+
constraint: ProteinMitochondrialGeneConstraint
43+
}) => {
44+
const {
45+
exp_lof,
46+
exp_mis,
47+
exp_syn,
48+
obs_lof,
49+
obs_mis,
50+
obs_syn,
51+
oe_lof,
52+
oe_lof_lower,
53+
oe_lof_upper,
54+
oe_mis,
55+
oe_mis_lower,
56+
oe_mis_upper,
57+
oe_syn,
58+
oe_syn_lower,
59+
oe_syn_upper,
60+
} = constraint
61+
return (
62+
<tbody>
63+
<ConstraintRow
64+
category="Synonymous"
65+
expected={exp_syn}
66+
observed={obs_syn}
67+
oe={oe_syn}
68+
oeLower={oe_syn_lower}
69+
oeUpper={oe_syn_upper}
70+
/>
71+
<ConstraintRow
72+
category="Missense"
73+
expected={exp_mis}
74+
observed={obs_mis}
75+
oe={oe_mis}
76+
oeLower={oe_mis_lower}
77+
oeUpper={oe_mis_upper}
78+
/>
79+
<ConstraintRow
80+
category="pLoF"
81+
expected={exp_lof}
82+
observed={obs_lof}
83+
oe={oe_lof}
84+
oeLower={oe_lof_lower}
85+
oeUpper={oe_lof_upper}
86+
/>
87+
</tbody>
88+
)
89+
}
90+
91+
const RNAConstraintMetrics = ({ constraint }: { constraint: RNAMitochondrialGeneConstraint }) => {
92+
const { expected, observed, oe, oe_lower, oe_upper } = constraint
93+
return (
94+
<tbody>
95+
<ConstraintRow
96+
category="RNA variant"
97+
expected={expected}
98+
observed={observed}
99+
oe={oe}
100+
oeLower={oe_lower}
101+
oeUpper={oe_upper}
102+
/>
103+
</tbody>
104+
)
105+
}
106+
107+
const MitochondrialConstraintTable = ({
108+
constraint,
109+
}: {
110+
constraint: MitochondrialGeneConstraint | null
111+
}) => {
112+
if (constraint === null) {
113+
return <p>Constraint is not available on this gene</p>
114+
}
115+
116+
return (
117+
// @ts-expect-error
118+
<BaseTable>
119+
<thead>
120+
<tr>
121+
<th scope="col">Category</th>
122+
<th scope="col">Expected SNVs</th>
123+
<th scope="col">Observed SNVs</th>
124+
<th scope="col">Observed/Expected</th>
125+
</tr>
126+
</thead>
127+
{isProteinMitochondrialGeneConstraint(constraint) ? (
128+
<ProteinConstraintMetrics constraint={constraint} />
129+
) : (
130+
<RNAConstraintMetrics constraint={constraint} />
131+
)}
132+
</BaseTable>
133+
)
134+
}
135+
136+
export default MitochondrialConstraintTable

0 commit comments

Comments
 (0)