From 3b80b35ec5041593e76ba317d77baaee01577b23 Mon Sep 17 00:00:00 2001 From: Graham McNeill Date: Fri, 26 Apr 2024 11:39:57 +0100 Subject: [PATCH 1/3] add variant page --- apps/platform/public/data/variant-data.json | 404 ++++++++++++++++++ apps/platform/src/App.tsx | 6 +- .../src/pages/VariantPage/VariantPage.jsx | 35 ++ apps/platform/src/pages/VariantPage/index.js | 1 + .../src/pages/VariantsPage/VariantsPage.jsx | 337 --------------- .../pages/VariantsPage/VariantsWrapper.jsx | 22 - apps/platform/src/pages/VariantsPage/index.js | 1 - 7 files changed, 443 insertions(+), 363 deletions(-) create mode 100644 apps/platform/public/data/variant-data.json create mode 100644 apps/platform/src/pages/VariantPage/VariantPage.jsx create mode 100644 apps/platform/src/pages/VariantPage/index.js delete mode 100644 apps/platform/src/pages/VariantsPage/VariantsPage.jsx delete mode 100644 apps/platform/src/pages/VariantsPage/VariantsWrapper.jsx delete mode 100644 apps/platform/src/pages/VariantsPage/index.js diff --git a/apps/platform/public/data/variant-data.json b/apps/platform/public/data/variant-data.json new file mode 100644 index 000000000..95433f564 --- /dev/null +++ b/apps/platform/public/data/variant-data.json @@ -0,0 +1,404 @@ +[ + { + "variantId": "X_27135701_T_C", + "chromosome": "X", + "position": 27135701, + "chromosomeB37": "X", + "positionB37": 27153818, + "referenceAllele": "T", + "alternateAllele": "C", + "rsIds": [ + "rs899125696" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0.00006494560805325539 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "intron_variant", + "transcriptConsequences": [] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 0.585, + "raw": -0.172629 + }, + "pangolinLargestDs": 0.01, + "phylop": -0.246 + } + }, + { + "variantId": "X_27135703_G_A", + "chromosome": "X", + "position": 27135703, + "chromosomeB37": "X", + "positionB37": 27153820, + "referenceAllele": "G", + "alternateAllele": "A", + "rsIds": [ + "rs12557104" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0.0002838489923360772 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "intron_variant", + "transcriptConsequences": [] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 3.252, + "raw": 0.211212 + }, + "pangolinLargestDs": 0, + "phylop": 1.16 + } + }, + { + "variantId": "X_27135703_G_T", + "chromosome": "X", + "position": 27135703, + "chromosomeB37": "X", + "positionB37": 27153820, + "referenceAllele": "G", + "alternateAllele": "T", + "rsIds": [ + "rs12557104" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0.0025361729800032515 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0.0944471269917914 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0.028758542141230067 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.00033998828929225774 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0.021897810218978103 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "intron_variant", + "transcriptConsequences": [] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 2.706, + "raw": 0.162359 + }, + "pangolinLargestDs": 0, + "phylop": 1.16 + } + }, + { + "variantId": "X_27135724_C_T", + "chromosome": "X", + "position": 27135724, + "chromosomeB37": "X", + "positionB37": 27153841, + "referenceAllele": "C", + "alternateAllele": "T", + "rsIds": [ + "rs1456640551" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.00003774724445115507 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "intron_variant", + "transcriptConsequences": [] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 5.415, + "raw": 0.398941 + }, + "pangolinLargestDs": 0, + "phylop": -1.401 + } + }, + { + "variantId": "X_27135725_CCT_C", + "chromosome": "X", + "position": 27135725, + "chromosomeB37": "X", + "positionB37": 27153842, + "referenceAllele": "CCT", + "alternateAllele": "C", + "rsIds": [ + "rs1293174774" + ], + "alleleType": "del", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.000056716135740618206 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "intron_variant", + "transcriptConsequences": [] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 2.503, + "raw": 0.142979 + }, + "pangolinLargestDs": 0.01, + "phylop": 0.982 + } + }, + { + "variantId": "X_27135733_T_C", + "chromosome": "X", + "position": 27135733, + "chromosomeB37": "X", + "positionB37": 27153850, + "referenceAllele": "T", + "alternateAllele": "C", + "rsIds": [ + "rs1925383031" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0.00003248124208269724 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "intron_variant", + "transcriptConsequences": [] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 7.241, + "raw": 0.57226 + }, + "pangolinLargestDs": 0, + "phylop": 0.15 + } + } +] \ No newline at end of file diff --git a/apps/platform/src/App.tsx b/apps/platform/src/App.tsx index 37ef94ca5..6cd456b73 100644 --- a/apps/platform/src/App.tsx +++ b/apps/platform/src/App.tsx @@ -13,7 +13,7 @@ import DownloadsPage from "./pages/DownloadsPage"; import DrugPage from "./pages/DrugPage"; import TargetPage from "./pages/TargetPage"; import EvidencePage from "./pages/EvidencePage"; -import VariantsPage from "./pages/VariantsPage"; +import VariantPage from "./pages/VariantPage"; import APIPage from "./pages/APIPage"; import NotFoundPage from "./pages/NotFoundPage"; import ProjectsPage from "./pages/ProjectsPage"; @@ -53,8 +53,8 @@ function App() { - - + + diff --git a/apps/platform/src/pages/VariantPage/VariantPage.jsx b/apps/platform/src/pages/VariantPage/VariantPage.jsx new file mode 100644 index 000000000..b36cb6614 --- /dev/null +++ b/apps/platform/src/pages/VariantPage/VariantPage.jsx @@ -0,0 +1,35 @@ + +import { useState, useEffect } from "react"; +import { useLocation, useParams } from "react-router-dom"; + +// import { LoadingBackdrop, BasePage, ScrollToTop } from "ui"; + +// import Header from "./Header"; +import NotFoundPage from "../NotFoundPage"; + +// const Profile = lazy(() => import("./Profile")); + +function VariantPage() { + // const location = useLocation(); + const { varId } = useParams(); + const [data, setData] = useState('waiting'); + + // for now, fetch local json data and pick out correct variant + useEffect(() => { + fetch('../data/variant-data.json') + .then(response => response.json()) + .then(allData => setData(allData.find(v => v.variantId === varId))); + }, []); + + if (!data) { + return ; + } else if (data === 'waiting') { + return Waiting; + } + + return ( + JSON.stringify(data) + ); +} + +export default VariantPage; \ No newline at end of file diff --git a/apps/platform/src/pages/VariantPage/index.js b/apps/platform/src/pages/VariantPage/index.js new file mode 100644 index 000000000..88b3b52cc --- /dev/null +++ b/apps/platform/src/pages/VariantPage/index.js @@ -0,0 +1 @@ +export { default } from "./VariantPage"; diff --git a/apps/platform/src/pages/VariantsPage/VariantsPage.jsx b/apps/platform/src/pages/VariantsPage/VariantsPage.jsx deleted file mode 100644 index 4980c6e7d..000000000 --- a/apps/platform/src/pages/VariantsPage/VariantsPage.jsx +++ /dev/null @@ -1,337 +0,0 @@ -import { Typography } from "@mui/material"; -import { Link, DataTable } from "ui"; -import { naLabel } from "../../constants"; - -const accessionUrl = "http://www.ontobee.org/ontology/SO?iri=http://purl.obolibrary.org/obo/"; -const variantData = [ - { - term: "transcript ablation", - definition: "A feature ablation whereby the deleted region includes a transcript feature.", - code: "SO_0001893", - score: 1, - }, - { - term: "curator inference", - definition: "A sequence variant which is manually curated.", - score: 1, - }, - { - term: "trinucleotide repeat expansion", - definition: - "A short tandem repeat expansion with an increase in a sequence of three nucleotide units repeated in tandem compared to a reference sequence.", - code: "SO_0002165", - score: 1, - }, - { - term: "short tandem repeat expansion", - definition: - "A short tandem repeat variant containing more repeat units than the reference sequence.", - code: "SO_0002162", - score: 1, - }, - { - term: "frameshift variant", - definition: - "A sequence variant which causes a disruption of the translational reading frame, because the number of nucleotides inserted or deleted is not a multiple of three.", - code: "SO_0001589", - score: 0.95, - }, - { - term: "stop gained", - definition: - "A sequence variant whereby at least one base of a codon is changed, resulting in a premature stop codon, leading to a shortened transcript.", - code: "SO_0001587", - score: 0.95, - }, - { - term: "splice region variant", - definition: - "A sequence variant in which a change has occurred within the region of the splice site, either within 1-3 bases of the exon or 3-8 bases of the intron.", - code: "SO_0001630", - score: 0.95, - }, - { - term: "splice acceptor variant", - definition: "A splice variant that changes the 2 base region at the 3' end of an intron.", - code: "SO_0001574", - score: 0.95, - }, - { - term: "splice donor variant", - definition: "A splice variant that changes the 2 base pair region at the 5' end of an intron.", - code: "SO_0001575", - score: 0.95, - }, - { - term: "coding sequence variant", - definition: "A sequence variant that changes the coding sequence.", - code: "SO_0001580", - score: 0.95, - }, - { - term: "start lost", - definition: "A codon variant that changes at least one base of the canonical start codon..", - code: "SO_0002012", - score: 0.95, - }, - { - term: "incomplete terminal codon variant", - definition: - "A sequence variant where at least one base of the final codon of an incompletely annotated transcript is changed..", - code: "SO_0001626", - score: 0.9, - }, - { - term: "stop lost", - definition: - "A sequence variant where at least one base of the terminator codon (stop) is changed, resulting in an elongated transcript.", - code: "SO_0001578", - score: 0.9, - }, - { - term: "protein altering variant", - definition: - "A sequence_variant which is predicted to change the protein encoded in the coding sequence.", - code: "SO_0001818", - score: 0.7, - }, - { - term: "missense variant", - definition: - "A sequence variant that changes one or more bases, resulting in a different amino acid sequence but where the length is preserved.", - code: "SO_0001583", - score: 0.7, - }, - { - term: "initiator codon variant", - definition: - "A codon variant that changes at least one base of the first codon of a transcript.", - code: "SO_0001582", - score: 0.7, - }, - { - term: "inframe deletion", - definition: "An inframe non synonymous variant that deletes bases from the coding sequence.", - code: "SO_0001822", - score: 0.7, - }, - { - term: "inframe insertion", - definition: "An inframe non synonymous variant that inserts bases into in the coding sequence.", - code: "SO_0001821", - score: 0.7, - }, - { - term: "non coding transcript exon variant", - definition: - "A sequence variant that changes non-coding exon sequence in a non-coding transcript.", - code: "SO_0001619", - score: 0.65, - }, - { - term: "NMD transcript variant", - definition: "A variant in a transcript that is the target of NMD.", - code: "SO_0001621", - score: 0.65, - }, - { - term: "intron variant", - definition: "A transcript variant occurring within an intron.", - code: "SO_0001627", - score: 0.65, - }, - { - term: "mature miRNA variant", - definition: "A transcript variant located with the sequence of the mature miRNA.", - code: "SO_0001620", - score: 0.65, - }, - { - term: "3 prime UTR variant", - definition: "A UTR variant of the 3' UTR.", - code: "SO_0001624", - score: 0.65, - }, - { - term: "5 prime UTR variant", - definition: "A UTR variant of the 5' UTR.", - code: "SO_0001623", - score: 0.65, - }, - { - term: "non_coding_transcript_exon_variant", - definition: "A UTR variant of the 5' UTR.", - code: "SO_0001792", - score: 0.65, - }, - { - term: "synonymous variant", - definition: "A sequence variant where there is no resulting change to the encoded amino acid.", - code: "SO_0001819", - score: 0.65, - }, - { - term: "stop retained variant", - definition: - "A sequence variant where at least one base in the terminator codon is changed, but the terminator remains.", - code: "SO_0001567", - score: 0.65, - }, - { - term: "regulatory region variant", - definition: "A sequence variant located within a regulatory region.", - code: "SO_0001566", - score: 0.6, - }, - { - term: "upstream gene variant", - definition: "A sequence variant located 5' of a gene.", - code: "SO_0001631", - score: 0.6, - }, - { - term: "downstream gene variant", - definition: "A sequence variant located 3' of a gene.", - code: "SO_0001632", - score: 0.6, - }, - { - term: "TF binding site variant", - definition: "A sequence variant located within a transcription factor binding site.", - code: "SO_0001782", - score: 0.6, - }, - { - term: "transcript amplification", - definition: "A feature amplification of a region containing a transcript.", - code: "SO_0001889", - score: 0.6, - }, - { - term: "regulatory region amplification", - definition: "A feature amplification of a region containing a regulatory region.", - code: "SO_0001891", - score: 0.6, - }, - { - term: "TFBS amplification", - definition: - "A feature amplification of a region containing a transcription factor binding site.", - code: "SO_0001892", - score: 0.6, - }, - { - term: "regulatory region ablation", - definition: "A feature ablation whereby the deleted region includes a regulatory region.", - code: "SO_0001894", - score: 0.6, - }, - { - term: "TFBS ablation", - definition: - "A feature ablation whereby the deleted region includes a transcription factor binding site.", - code: "SO_0001895", - score: 0.6, - }, - { - term: "feature truncation", - definition: - "A sequence variant that causes the reduction of a genomic feature, with regard to the reference sequence.", - code: "SO_0001906", - score: 0.6, - }, - { - term: "feature elongation", - definition: - "A sequence variant that causes the extension of a genomic feature, with regard to the reference sequence.", - code: "SO_0001907", - score: 0.6, - }, - { - term: "Regulatory nearest gene five prime end", - definition: "Regulatory nearest gene 5' end.", - score: 0.5, - }, - { - term: "Nearest gene five prime end", - definition: "Nearest gene counting from the 5' end.", - score: 0.5, - }, - { - term: "sequence variant", - definition: - "A sequence variant is a non exact copy of a sequence feature or genome exhibiting one or more sequence alteration.", - code: "SO_0001060", - score: 0.5, - }, - { - term: "conservative inframe deletion", - definition: - "An inframe decrease in cds length that deletes one or more entire codons from the coding sequence but does not change any remaining codons.", - code: "SO_0001825", - score: 0.5, - }, -]; - -const columns = [ - { - id: "term", - label: "SO term", - width: "24%", - }, - { - id: "definition", - label: "Definitions", - width: "50%", - }, - { - id: "code", - label: "SO accession", - renderCell: row => - row.code ? ( - - {row.code} - - ) : ( - naLabel - ), - width: "13%", - }, - { - id: "score", - label: <>Functional consequence score, - width: "13%", - }, -]; - -function VariantsPage() { - return ( - <> - - Variant definitions - - - We predict the consequence of variants (germline or somatic) on genes associated with - diseases based on the evidence for the Genetic associations and Somatic mutation data types. - This effect is defined by consequence terms from the Sequence Ontology (SO) project. - - - The SO consequence terms, their descriptions and accession IDs are shown in the table below. - The terms are shown in decreasing order of severity (from more severe to less severe) based - on the functional score in Koscielny et al (Supplementary Table 2). - - - - - ); -} - -export default VariantsPage; diff --git a/apps/platform/src/pages/VariantsPage/VariantsWrapper.jsx b/apps/platform/src/pages/VariantsPage/VariantsWrapper.jsx deleted file mode 100644 index 53bdce148..000000000 --- a/apps/platform/src/pages/VariantsPage/VariantsWrapper.jsx +++ /dev/null @@ -1,22 +0,0 @@ -import { Suspense, lazy } from "react"; -import { useLocation } from "react-router-dom"; -import { LoadingBackdrop, BasePage } from "ui"; - -const VariantsPage = lazy(() => import("./VariantsPage")); - -function VariantsWrapper() { - const location = useLocation(); - return ( - - }> - - - - ); -} - -export default VariantsWrapper; diff --git a/apps/platform/src/pages/VariantsPage/index.js b/apps/platform/src/pages/VariantsPage/index.js deleted file mode 100644 index c78ebc0f2..000000000 --- a/apps/platform/src/pages/VariantsPage/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from "./VariantsWrapper"; From 37a731f52e1198d5d9f6f01395d2fba07ef786ec Mon Sep 17 00:00:00 2001 From: Graham McNeill Date: Fri, 26 Apr 2024 16:17:07 +0100 Subject: [PATCH 2/3] add header to variant page --- .../platform/src/pages/VariantPage/Header.jsx | 44 +++++++++++++++++++ .../src/pages/VariantPage/VariantPage.jsx | 26 +++++++++-- 2 files changed, 66 insertions(+), 4 deletions(-) create mode 100644 apps/platform/src/pages/VariantPage/Header.jsx diff --git a/apps/platform/src/pages/VariantPage/Header.jsx b/apps/platform/src/pages/VariantPage/Header.jsx new file mode 100644 index 000000000..ee942a389 --- /dev/null +++ b/apps/platform/src/pages/VariantPage/Header.jsx @@ -0,0 +1,44 @@ +import { faMapPin } from "@fortawesome/free-solid-svg-icons"; + +import { Header as HeaderBase, ExternalLink } from "ui"; + +function Header({ + loading, + varId, + rsIds, + chromosomeB37, + positionB37, + referenceAllele, + alternateAllele, + }) { + const rsId = rsIds[0]; + const gnomadId = `${ + chromosomeB37}-${ + positionB37}-${ + referenceAllele}-${ + alternateAllele}`; + + return ( + + + + + } + /> + ); +} + +export default Header; \ No newline at end of file diff --git a/apps/platform/src/pages/VariantPage/VariantPage.jsx b/apps/platform/src/pages/VariantPage/VariantPage.jsx index b36cb6614..b51b1fcbe 100644 --- a/apps/platform/src/pages/VariantPage/VariantPage.jsx +++ b/apps/platform/src/pages/VariantPage/VariantPage.jsx @@ -2,9 +2,9 @@ import { useState, useEffect } from "react"; import { useLocation, useParams } from "react-router-dom"; -// import { LoadingBackdrop, BasePage, ScrollToTop } from "ui"; +import { BasePage } from "ui"; -// import Header from "./Header"; +import Header from "./Header"; import NotFoundPage from "../NotFoundPage"; // const Profile = lazy(() => import("./Profile")); @@ -13,8 +13,12 @@ function VariantPage() { // const location = useLocation(); const { varId } = useParams(); const [data, setData] = useState('waiting'); + - // for now, fetch local json data and pick out correct variant + // temp: loading is set by useQuery, set to false for now + const loading = false; + + // temp: data will come from gql, fetch local json file for now useEffect(() => { fetch('../data/variant-data.json') .then(response => response.json()) @@ -28,7 +32,21 @@ function VariantPage() { } return ( - JSON.stringify(data) + +
+ ); } From b54681a79aaba1f67bd2aadf01ceec30f7309d7a Mon Sep 17 00:00:00 2001 From: Graham McNeill Date: Tue, 7 May 2024 10:57:00 +0100 Subject: [PATCH 3/3] switch to typescript --- ...{variant-data.json => variant-data-1.json} | 0 apps/platform/public/data/variant-data-2.json | 792 ++++++++++++++++++ .../VariantPage/{Header.jsx => Header.tsx} | 29 +- .../{VariantPage.jsx => VariantPage.tsx} | 31 +- apps/platform/src/pages/VariantPage/index.js | 3 +- apps/platform/src/pages/VariantPage/types.ts | 39 + 6 files changed, 862 insertions(+), 32 deletions(-) rename apps/platform/public/data/{variant-data.json => variant-data-1.json} (100%) create mode 100644 apps/platform/public/data/variant-data-2.json rename apps/platform/src/pages/VariantPage/{Header.jsx => Header.tsx} (64%) rename apps/platform/src/pages/VariantPage/{VariantPage.jsx => VariantPage.tsx} (56%) create mode 100644 apps/platform/src/pages/VariantPage/types.ts diff --git a/apps/platform/public/data/variant-data.json b/apps/platform/public/data/variant-data-1.json similarity index 100% rename from apps/platform/public/data/variant-data.json rename to apps/platform/public/data/variant-data-1.json diff --git a/apps/platform/public/data/variant-data-2.json b/apps/platform/public/data/variant-data-2.json new file mode 100644 index 000000000..abffd37ff --- /dev/null +++ b/apps/platform/public/data/variant-data-2.json @@ -0,0 +1,792 @@ +[ + { + "variantId": "20_31257670_C_T", + "chromosome": "20", + "position": 31257670, + "chromosomeB37": "20", + "positionB37": 29845473, + "referenceAllele": "C", + "alternateAllele": "T", + "rsIds": [ + "rs191451885" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0.00021659607239122065 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0.0001961297071129707 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.00002940311673037342 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0.0002077274615704196 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "P/S", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 3.639, + "raw": 0.24446 + }, + "revelMax": 0.02, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": 1.393, + "siftMax": 0.21, + "polyphenMax": 0.026 + } + }, + { + "variantId": "20_31257685_C_A", + "chromosome": "20", + "position": 31257685, + "chromosomeB37": "20", + "positionB37": 29845488, + "referenceAllele": "C", + "alternateAllele": "A", + "rsIds": [ + "rs946177627" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.000014698965192850424 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "P/T", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 0.18, + "raw": -0.413358 + }, + "revelMax": 0.033, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": -0.815, + "siftMax": 1, + "polyphenMax": 0.026 + } + }, + { + "variantId": "20_31257685_C_G", + "chromosome": "20", + "position": 31257685, + "chromosomeB37": "20", + "positionB37": 29845488, + "referenceAllele": "C", + "alternateAllele": "G", + "rsIds": [ + "rs946177627" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0.00004825789016504198 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "P/A", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 0.715, + "raw": -0.130967 + }, + "revelMax": 0.032, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": -0.815, + "siftMax": 0.46, + "polyphenMax": 0.098 + } + }, + { + "variantId": "20_31257688_C_G", + "chromosome": "20", + "position": 31257688, + "chromosomeB37": "20", + "positionB37": 29845491, + "referenceAllele": "C", + "alternateAllele": "G", + "rsIds": [ + "rs1253802045" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.00001470112610625974 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "L/V", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 0.623, + "raw": -0.159595 + }, + "revelMax": 0.053, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0.01, + "phylop": -0.049, + "siftMax": 0.05, + "polyphenMax": 0.224 + } + }, + { + "variantId": "20_31257701_T_G", + "chromosome": "20", + "position": 31257701, + "chromosomeB37": "20", + "positionB37": 29845504, + "referenceAllele": "T", + "alternateAllele": "G", + "rsIds": [ + "rs1197497818" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0.00009416195856873823 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "I/S", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 10.76, + "raw": 0.929881 + }, + "revelMax": 0.011, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": 0.103, + "siftMax": 0.22, + "polyphenMax": 0.076 + } + }, + { + "variantId": "20_31257719_C_A", + "chromosome": "20", + "position": 31257719, + "chromosomeB37": "20", + "positionB37": 29845522, + "referenceAllele": "C", + "alternateAllele": "A", + "rsIds": [ + "rs769167828" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.000014700261664657632 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "A/D", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 19.9, + "raw": 2.084135 + }, + "revelMax": 0.165, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": 0.949, + "siftMax": 0.02, + "polyphenMax": 0.948 + } + }, + { + "variantId": "20_31257722_T_C", + "chromosome": "20", + "position": 31257722, + "chromosomeB37": "20", + "positionB37": 29845525, + "referenceAllele": "T", + "alternateAllele": "C", + "rsIds": [ + "rs374301214" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0.00018839487565938207 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.00001470112610625974 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "L/S", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 23.6, + "raw": 3.066376 + }, + "revelMax": 0.144, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": 3.355, + "siftMax": 0, + "polyphenMax": 0.646 + } + }, + { + "variantId": "20_31257727_G_T", + "chromosome": "20", + "position": 31257727, + "chromosomeB37": "20", + "positionB37": 29845530, + "referenceAllele": "G", + "alternateAllele": "T", + "rsIds": [ + "rs767578245" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0.000014703287655119684 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0.00020738282870178348 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "V/F", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 23.1, + "raw": 2.849272 + }, + "revelMax": 0.134, + "spliceaiDsMax": 0.01, + "pangolinLargestDs": 0, + "phylop": 1.58, + "siftMax": 0.01, + "polyphenMax": 0.98 + } + }, + { + "variantId": "20_31257731_T_C", + "chromosome": "20", + "position": 31257731, + "chromosomeB37": "20", + "positionB37": 29845534, + "referenceAllele": "T", + "alternateAllele": "C", + "rsIds": [ + "rs760827610" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0.000024127780726728754 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "L/P", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 23.2, + "raw": 2.887348 + }, + "revelMax": 0.182, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": 1.325, + "siftMax": 0.01, + "polyphenMax": 0.973 + } + }, + { + "variantId": "20_31257736_G_A", + "chromosome": "20", + "position": 31257736, + "chromosomeB37": "20", + "positionB37": 29845539, + "referenceAllele": "G", + "alternateAllele": "A", + "rsIds": [ + "rs754890194" + ], + "alleleType": "snv", + "alleleFrequencies": [ + { + "populationName": "afr_adj", + "alleleFrequency": 0.00007241479192816453 + }, + { + "populationName": "ami_adj", + "alleleFrequency": 0 + }, + { + "populationName": "amr_adj", + "alleleFrequency": 0 + }, + { + "populationName": "asj_adj", + "alleleFrequency": 0 + }, + { + "populationName": "eas_adj", + "alleleFrequency": 0 + }, + { + "populationName": "fin_adj", + "alleleFrequency": 0 + }, + { + "populationName": "mid_adj", + "alleleFrequency": 0 + }, + { + "populationName": "nfe_adj", + "alleleFrequency": 0 + }, + { + "populationName": "remaining_adj", + "alleleFrequency": 0 + }, + { + "populationName": "sas_adj", + "alleleFrequency": 0 + } + ], + "vep": { + "mostSevereConsequence": "missense_variant", + "transcriptConsequences": [ + { + "aminoAcids": "V/I", + "consequenceTerms": [ + "missense_variant" + ], + "geneId": "ENSG00000215547" + } + ] + }, + "inSilicoPredictors": { + "cadd": { + "phred": 11.31, + "raw": 0.974809 + }, + "revelMax": 0.05, + "spliceaiDsMax": 0, + "pangolinLargestDs": 0, + "phylop": 0.631, + "siftMax": 0.3, + "polyphenMax": 0.328 + } + } +] \ No newline at end of file diff --git a/apps/platform/src/pages/VariantPage/Header.jsx b/apps/platform/src/pages/VariantPage/Header.tsx similarity index 64% rename from apps/platform/src/pages/VariantPage/Header.jsx rename to apps/platform/src/pages/VariantPage/Header.tsx index ee942a389..9cabe1cde 100644 --- a/apps/platform/src/pages/VariantPage/Header.jsx +++ b/apps/platform/src/pages/VariantPage/Header.tsx @@ -1,27 +1,32 @@ import { faMapPin } from "@fortawesome/free-solid-svg-icons"; - import { Header as HeaderBase, ExternalLink } from "ui"; +import { MetadataType } from "./types"; + +type HeaderProps = { + loading: boolean; + metadata: MetadataType; +} -function Header({ - loading, - varId, +function Header({ loading, metadata }: HeaderProps) { + const { + variantId, rsIds, - chromosomeB37, - positionB37, + chromosome, + position, referenceAllele, alternateAllele, - }) { + } = metadata; const rsId = rsIds[0]; const gnomadId = `${ - chromosomeB37}-${ - positionB37}-${ + chromosome}-${ + position}-${ referenceAllele}-${ alternateAllele}`; return ( @@ -31,8 +36,8 @@ function Header({ id={rsId} /> diff --git a/apps/platform/src/pages/VariantPage/VariantPage.jsx b/apps/platform/src/pages/VariantPage/VariantPage.tsx similarity index 56% rename from apps/platform/src/pages/VariantPage/VariantPage.jsx rename to apps/platform/src/pages/VariantPage/VariantPage.tsx index b51b1fcbe..bb26f5183 100644 --- a/apps/platform/src/pages/VariantPage/VariantPage.jsx +++ b/apps/platform/src/pages/VariantPage/VariantPage.tsx @@ -1,33 +1,34 @@ import { useState, useEffect } from "react"; import { useLocation, useParams } from "react-router-dom"; - import { BasePage } from "ui"; - import Header from "./Header"; import NotFoundPage from "../NotFoundPage"; +import { MetadataType } from "./types"; // const Profile = lazy(() => import("./Profile")); function VariantPage() { - // const location = useLocation(); - const { varId } = useParams(); - const [data, setData] = useState('waiting'); - + const location = useLocation(); + const { varId } = useParams() as { varId: string }; + const [metadata, setMetadata] = + useState('waiting'); // temp: loading is set by useQuery, set to false for now const loading = false; // temp: data will come from gql, fetch local json file for now useEffect(() => { - fetch('../data/variant-data.json') + fetch('../data/variant-data-2.json') .then(response => response.json()) - .then(allData => setData(allData.find(v => v.variantId === varId))); + .then((allData: MetadataType[]) => + setMetadata(allData.find(v => v.variantId === varId))); }, []); - if (!data) { + // temp: revisit this (use same as other pages) once using gql to get data + if (!metadata) { return ; - } else if (data === 'waiting') { + } else if (metadata === 'waiting') { return Waiting; } @@ -37,15 +38,7 @@ function VariantPage() { description={`Annotation information for ${varId}`} location={location} > -
+
); } diff --git a/apps/platform/src/pages/VariantPage/index.js b/apps/platform/src/pages/VariantPage/index.js index 88b3b52cc..8c8d16086 100644 --- a/apps/platform/src/pages/VariantPage/index.js +++ b/apps/platform/src/pages/VariantPage/index.js @@ -1 +1,2 @@ -export { default } from "./VariantPage"; +// export { default } from "./VariantPage"; +export {default} from "./VariantPage" diff --git a/apps/platform/src/pages/VariantPage/types.ts b/apps/platform/src/pages/VariantPage/types.ts new file mode 100644 index 000000000..d398d0782 --- /dev/null +++ b/apps/platform/src/pages/VariantPage/types.ts @@ -0,0 +1,39 @@ +type AlleleFrequencyType = { + populationName: string; + alleleFrequency: number; +}; + +type VepType = { + mostSevereConsequence: string; + transcriptConsequences: { + aminoAcids: string; + consequenceTerms: string[]; + geneId: string; + }[]; +}; + +export type MetadataType = { + variantId: string, + chromosome: string, + position: number; + chromosomeB37?: string, + positionB37?: number; + referenceAllele: string, + alternateAllele: string, + rsIds: string[]; + alleleType: string; + alleleFrequencies: AlleleFrequencyType[]; + vep: VepType; + inSilicoPredictors: { + cadd?: { + phred: number; + raw: number; + }; + revelMax?: number; + spliceaiDsMax?: number; + pangolinLargestDs?: number; + phylop?: number; + siftMax?: number; + polyphenMax?: number; + }; +}; \ No newline at end of file