From 599f6ec7409e9c0db0ead97f1200a974ebba7bbb Mon Sep 17 00:00:00 2001 From: jpfisher72 Date: Thu, 25 Apr 2024 11:07:43 -0400 Subject: [PATCH] Modify SNP Page --- immuscreen/src/app/gene/page.tsx | 4 +- immuscreen/src/app/snp/page.tsx | 260 +++++++++++++++++-------------- 2 files changed, 142 insertions(+), 122 deletions(-) diff --git a/immuscreen/src/app/gene/page.tsx b/immuscreen/src/app/gene/page.tsx index 2bfc43d..2e0d17e 100644 --- a/immuscreen/src/app/gene/page.tsx +++ b/immuscreen/src/app/gene/page.tsx @@ -126,7 +126,7 @@ const Gene = () =>{ } ]} - tableTitle={`GTEX eQTLs have been identified for ${searchParams.get('gene')}:`} + tableTitle={`GTEX whole-blood eQTLs for ${searchParams.get('gene')}:`} rows={data?.icreeQTLQuery || []} @@ -158,7 +158,7 @@ const Gene = () =>{ } ]} - tableTitle={`Yazar.Powell eQTLs have been identified for ${searchParams.get('gene')}:`} + tableTitle={`Yazar.Powell eQTLs for ${searchParams.get('gene')}:`} rows={(yazarData.icreeQTLQuery) || []} sortColumn={3} diff --git a/immuscreen/src/app/snp/page.tsx b/immuscreen/src/app/snp/page.tsx index eb1704a..7eb0709 100644 --- a/immuscreen/src/app/snp/page.tsx +++ b/immuscreen/src/app/snp/page.tsx @@ -1,7 +1,7 @@ "use client" -import React, { useState } from "react" +import React, { useMemo, useState } from "react" import { DataTable } from "@weng-lab/psychscreen-ui-components" -import { Tabs, Typography } from "@mui/material" +import { CircularProgress, Tabs, Typography } from "@mui/material" import { client } from "../../common/utils" import Grid2 from "@mui/material/Unstable_Grid2/Grid2" import { ReadonlyURLSearchParams, useSearchParams, usePathname } from "next/navigation" @@ -12,6 +12,7 @@ import { SnpAutoComplete } from "../../common/components/mainsearch/SnpAutocompl import { StyledTab } from "../../common/utils" import { ICRES_QUERY, EBI_ASSO_QUERY } from "../icres/queries" import { getCellDisplayName } from "../celllineage/utils" +import { ActiveCellTypesList } from "../icres/utils" const EQTL_QUERY = gql` query iCREeQTLQuery($study: String!, $rsid: String) { @@ -71,7 +72,7 @@ const Snp = () => { client, }) - const { loading: loadingSNP, data: dataSNP } = useQuery(SNP_Query, { + const { loading: loadingSNP, data: dataSNP, error: errorSNP } = useQuery(SNP_Query, { variables: { snpids: [snp] }, @@ -81,12 +82,65 @@ const Snp = () => { const { loading: loadingOverlapICRE, data: dataOverlapICRE } = useQuery(ICRES_QUERY, { variables: { - coordinates: { chromosome: dataSNP?.snpQuery[0].coordinates.chromosome, start: dataSNP?.snpQuery[0].coordinates.start - 2000, end: dataSNP?.snpQuery[0].coordinates.start + 2000 } + coordinates: { chromosome: dataSNP?.snpQuery[0].coordinates.chromosome, start: dataSNP?.snpQuery[0].coordinates.end - 2000, end: dataSNP?.snpQuery[0].coordinates.end + 2000 } }, skip: loadingSNP || !dataSNP, client, }) + const NearbyICREs = () => useMemo(() => { + return ( + Math.abs(row.coordinates.start - dataSNP?.snpQuery[0].coordinates.end), + FunctionalRender: (row) => { + return ( + loadingSNP ? + : errorSNP ? Error fetching SNP location + : {Math.abs(row.coordinates.start - dataSNP?.snpQuery[0].coordinates.end)} + ) + } + }, + { + header: "Accession", + value: (row) => row.accession, + }, + { + header: "rDHS", + value: (row) => row.rdhs, + }, + { + header: "Chromosome", + value: (row) => row.coordinates.chromosome, + }, + { + header: "Start", + value: (row) => row.coordinates.start, + }, + { + header: "End", + value: (row) => row.coordinates.end, + }, + { + header: "Class", + value: (row) => row.group, + }, + { + header: "Cell Type Specific Activity", + value: (row) => row.celltypes.length, + FunctionalRender: (row) => + }, + ]} + tableTitle={`iCREs within 2kbp of ${snp}`} + rows={dataOverlapICRE?.iCREQuery || []} + itemsPerPage={10} + sortDescending + /> + ) + }, [dataOverlapICRE, dataSNP, loadingSNP, errorSNP]) + return !snp ? (
@@ -104,124 +158,90 @@ const Snp = () => { {snp && SNP Details: {snp}{dataSNP && " - " + dataSNP.snpQuery[0].coordinates.chromosome + ":" + dataSNP.snpQuery[0].coordinates.end}} - - + + - - row.accession, - }, - { - header: "rDHS", - value: (row) => row.rdhs, - }, - { - header: "Chromosome", - value: (row) => row.coordinates.chromosome, - }, - { - header: "Start", - value: (row) => row.coordinates.start, - }, - { - header: "End", - value: (row) => row.coordinates.end, - }, - { - header: "Class", - value: (row) => row.group, - }, - { - header: "Cell Type Specific Activity", - value: (row) => [... new Set(row.celltypes.map(x => getCellDisplayName(x, true)))].join(', '), - }, - ]} - tableTitle={`iCREs within 2kbp of ${snp}:`} - rows={dataOverlapICRE?.iCREQuery || []} - itemsPerPage={10} - sortColumn={3} - /> - - - row.geneid || "", - }, - { - header: "P-Value", - value: (row) => row.pvalue && row.pvalue.toExponential(2) || 0, - }, - { - header: "Q-Value", - value: (row) => row.qvalue && row.qvalue.toExponential(2) || 0, - }, - { - header: "Celltype", - value: (row) => row.celltype || "", - } - ]} - tableTitle={`Yazar.Powell eQTLs identified for ${searchParams.get('rsid')}:`} - rows={data?.icreeQTLQuery || []} - itemsPerPage={10} - /> - - - row.chromosome, - }, - { - header: "Position", - value: (row) => row.position, - }, - { - header: "Strongest snp risk allele", - value: (row) => row.strongest_snp_risk_allele, - }, - { - header: "Risk Allele Frequency", - value: (row) => row.risk_allele_frequency, - - }, - { - header: "P-Value", - value: (row) => row.p_value && row.p_value.toExponential(2) || 0, - }, - { - header: "Study", - value: (row) => row.study, - }, - { - header: "Region", - value: (row) => row.region, - }, - { - header: "Immu screen trait", - value: (row) => row.immu_screen_trait - }, - { - header: "mapped_trait", - value: (row) => row.mapped_trait - }, - { - header: "Pubmed Id", - value: (row) => row.pubmedid - } - ]} - tableTitle={`Trait Associations for ${snp}:`} - rows={ebidata?.ebiAssociationsQuery || []} - sortColumn={3} - itemsPerPage={10} - /> - + {value === 0 && + + + + } + {value === 1 && + <> + row.geneid || "", + }, + { + header: "P-Value", + value: (row) => row.pvalue && row.pvalue.toExponential(2) || 0, + }, + { + header: "Q-Value", + value: (row) => row.qvalue && row.qvalue.toExponential(2) || 0, + }, + { + header: "Celltype", + value: (row) => row.celltype || "", + } + ]} + tableTitle={`Yazar.Powell eQTLs for ${searchParams.get('rsid')}`} + rows={data?.icreeQTLQuery || []} + itemsPerPage={10} /> + + + row.chromosome, + }, + { + header: "Position", + value: (row) => row.position, + }, + { + header: "Strongest snp risk allele", + value: (row) => row.strongest_snp_risk_allele, + }, + { + header: "Risk Allele Frequency", + value: (row) => row.risk_allele_frequency, + }, + { + header: "P-Value", + value: (row) => row.p_value && row.p_value.toExponential(2) || 0, + }, + { + header: "Study", + value: (row) => row.study, + }, + { + header: "Region", + value: (row) => row.region, + }, + { + header: "Immu screen trait", + value: (row) => row.immu_screen_trait + }, + { + header: "mapped_trait", + value: (row) => row.mapped_trait + }, + { + header: "Pubmed Id", + value: (row) => row.pubmedid + } + ]} + tableTitle={`Trait Associations for ${snp}:`} + rows={ebidata?.ebiAssociationsQuery || []} + sortColumn={3} + itemsPerPage={10} /> + + }
)