{/* Axis Break */}
@@ -261,10 +270,10 @@ export const AtacBarPlot: React.FC<{ plottitle?: string, byct?: boolean, study:
-
- label}>
+
+
{(labels) => (
-
+
{labels.map((label, i) => {
return (
+
{label.text}
@@ -286,15 +295,13 @@ export const AtacBarPlot: React.FC<{ plottitle?: string, byct?: boolean, study:
)}
+ {/* Why is the styling being done like this, not readable. Why is there also styling above in CellTypeLegends? */}
-
- );
+
+
{title}
+ {children}
+
+
-
-
- )
-}
+ // const linearScale = scaleLinear({
+ // domain: [minValue, maxValue],
+ // range: ["#ffcd00", "#ff0000"],
+ // });
+ let uniqcelltypes = [...new Set([...props.data].sort((a, b) => {
+ if (!experimentInfo[a.name]?.order) console.log(a.name) //some experiments returned in gene expression umap are not in experiment list?
+ return experimentInfo[a.name]?.order - experimentInfo[b.name]?.order
+ }).map(c => getCellDisplayName(c.celltype as any)))]
+ let ordinalColorScale = uniqcelltypes && scaleOrdinal({
+ domain: uniqcelltypes,
+ //Duplicates?
+ range: uniqcelltypes.map((c) => getCellColor(c as CellName)),
+ })
+ const legendGlyphSize = 15;
+ return (
+
+
+
+ {"\u25EF unstimulated, \u25B3 stimulated "}
+
+ {point.stimulation === 'S' ?
+ handleHover(event, point)}
+ onMouseLeave={(event) => handleLeaveHover(event, point)}
+ fill={(props.colorScheme === 'geneexp' || props.colorScheme === 'ZScore') ? point.value > 1.64 ? 'red' : 'yellow' : getCellColor(point.celltype)}
+ stroke={tooltipData && tooltipData.celltype === point.celltype ? 'black' : ''}
+ /> :
+ handleHover(event, point)}
+ onMouseLeave={(event) => handleLeaveHover(event, point)}
+ //fill= {`${linearScale(point.value)}`}
+ fill={(props.colorScheme === 'geneexp' || props.colorScheme === 'ZScore') ? point.value > 1.64 ? 'red' : 'yellow' : getCellColor(point.celltype)}
+ stroke={tooltipData && tooltipData.celltype === point.celltype ? 'black' : ''}
+ />
+ }
+ )
+ })}
+
+
+ {tooltipOpen && tooltipData && (
+
+
+
Celltype: {getCellDisplayName(tooltipData.celltype as CellQueryValue, true)}
+
+
Name: {tooltipData.name}
+
+
Class {tooltipData.class}
+
+
Value {tooltipData.value.toFixed(2)}
+
+ )}
+
+ {(props.colorScheme === 'geneexp' || props.colorScheme === 'ZScore') ?
+ //
+ // (+d).toFixed(2)}
+ // >
+ // {(labels) =>
+ // labels.sort((a, b) => b.index - a.index).map((label, i) => (
+ // {
+ // //if (events) alert(`clicked: ${JSON.stringify(label)}`);
+ // }}
+ // >
+ //
+ //
+ //
+ // {label.text}
+ //
+ //
+ // ))
+ // }
+ //
+ //
+ <>
+ :
+
+
+ {(labels) => (
+
+ {labels.map((label, i) => {
+ return (
+
+
+
+
+
+ {label.text}
+
+
+
+ )
+ })}
+
+
+ }
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/immuscreen/src/common/consts.ts b/immuscreen/src/common/consts.ts
index 09d9c80..6896044 100644
--- a/immuscreen/src/common/consts.ts
+++ b/immuscreen/src/common/consts.ts
@@ -1,8 +1,4 @@
-/**
- * @todo the cell info in this file and in celllineage/utils.ts need to be combined
- */
-
-import { CellDisplayName, CellName, CellTypeStaticInfo } from "../app/celllineage/types"
+import { CellName, CellTypeStaticInfo } from "../app/celllineage/types"
export const cellTypeStaticInfo: { [key in CellName]: CellTypeStaticInfo } = {
Monocytes: {
@@ -417,15 +413,15 @@ export const cellTypeStaticInfo: { [key in CellName]: CellTypeStaticInfo } = {
},
Ery: {
id: "Ery",
- displayName: "Erythrocyte",
- unstimImagePath: '/cellTypes/Erythrocyte.png',
+ displayName: "Erythroblast",
+ unstimImagePath: '/cellTypes/Erythroblast.png',
stimulable: false,
queryValues: {
unstimulated: { Corces: "Ery" }
},
unstimCount: 56267,
color: "#684fda",
- treeDisplayName: "Erythrocyte"
+ treeDisplayName: "Erythroblast"
},
GMP: {
id: "GMP",
@@ -557,14 +553,14 @@ export const experimentInfo: { [key: string]: {order: number, description: strin
'6792-MEP-SRX1427809': { order: 29, description: 'Megakaryocyte Erythroid Progenitor in donor 6792', displayName: 'Megakaryocyte Erythroid Progenitor', group: 'Progenitors', study: 'Corces et al', pmid: '27526324' },
'7256-MEP-SRX1427863': { order: 30, description: 'Megakaryocyte Erythroid Progenitor in donor 7256', displayName: 'Megakaryocyte Erythroid Progenitor', group: 'Progenitors', study: 'Corces et al', pmid: '27526324' },
'7256-MEP-SRX1427864': { order: 31, description: 'Megakaryocyte Erythroid Progenitor in donor 7256', displayName: 'Megakaryocyte Erythroid Progenitor', group: 'Progenitors', study: 'Corces et al', pmid: '27526324' },
- '2596-Ery-SRX1427825': { order: 32, description: 'Erythrocyte in donor 2596', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
- '2596-Ery-SRX1427826': { order: 33, description: 'Erythrocyte in donor 2596', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
- '2596-Ery-SRX1427827': { order: 34, description: 'Erythrocyte in donor 2596', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
- '5483-Ery-SRX1427846': { order: 35, description: 'Erythrocyte in donor 5483', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
- '5483-Ery-SRX1427847': { order: 36, description: 'Erythrocyte in donor 5483', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
- '5483-Ery-SRX1427848': { order: 37, description: 'Erythrocyte in donor 5483', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
- '6926-Ery-SRX1427852': { order: 38, description: 'Erythrocyte in donor 6926', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
- '6926-Ery-SRX1427853': { order: 39, description: 'Erythrocyte in donor 6926', displayName: 'Erythrocyte', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '2596-Ery-SRX1427825': { order: 32, description: 'Erythroblast in donor 2596', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '2596-Ery-SRX1427826': { order: 33, description: 'Erythroblast in donor 2596', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '2596-Ery-SRX1427827': { order: 34, description: 'Erythroblast in donor 2596', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '5483-Ery-SRX1427846': { order: 35, description: 'Erythroblast in donor 5483', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '5483-Ery-SRX1427847': { order: 36, description: 'Erythroblast in donor 5483', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '5483-Ery-SRX1427848': { order: 37, description: 'Erythroblast in donor 5483', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '6926-Ery-SRX1427852': { order: 38, description: 'Erythroblast in donor 6926', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
+ '6926-Ery-SRX1427853': { order: 39, description: 'Erythroblast in donor 6926', displayName: 'Erythroblast', group: 'Myeloid', study: 'Corces et al', pmid: '27526324' },
'2596-GMP-SRX1427828': { order: 40, description: 'Granulocyte-Monocyte Progenitors in donor 2596', displayName: 'Granulocyte-Monocyte Progenitors', group: 'Progenitors', study: 'Corces et al', pmid: '27526324' },
'4983-GMP-SRX1427794': { order: 41, description: 'Granulocyte-Monocyte Progenitors in donor 4983', displayName: 'Granulocyte-Monocyte Progenitors', group: 'Progenitors', study: 'Corces et al', pmid: '27526324' },
'4983-GMP-SRX1427795': { order: 42, description: 'Granulocyte-Monocyte Progenitors in donor 4983', displayName: 'Granulocyte-Monocyte Progenitors', group: 'Progenitors', study: 'Corces et al', pmid: '27526324' },
diff --git a/immuscreen/src/common/gbview/bulkAtacSelector.tsx b/immuscreen/src/common/gbview/bulkAtacSelector.tsx
new file mode 100644
index 0000000..6075db0
--- /dev/null
+++ b/immuscreen/src/common/gbview/bulkAtacSelector.tsx
@@ -0,0 +1,87 @@
+import { ChangeEvent, useEffect, useMemo, useState } from "react";
+import { CellQueryValue, CellTypeStaticInfo } from "../../app/celllineage/types";
+import { extractQueryValues, getCellDisplayName } from "../../app/celllineage/utils";
+import { cellTypeStaticInfo } from "../consts";
+import { Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions, Button, FormGroup, FormControlLabel, Checkbox } from "@mui/material";
+
+type ModalProps = {
+ open: boolean
+ onAccept: (cells: CellQueryValue[]) => void;
+ onCancel: () => void;
+ selected: CellQueryValue[];
+}
+
+const BulkAtacModal: React.FC
= (props: ModalProps) => {
+ const currentlySelected = useMemo(() => {
+ const x = {}
+ Object.values(cellTypeStaticInfo).forEach((cellInfo: CellTypeStaticInfo) => {
+ const queryVals = extractQueryValues(cellInfo, "B")
+ queryVals.forEach(queryVal => {
+ x[queryVal] = !!props.selected.find(x => x === queryVal)
+ })
+ })
+ return x as { [key in CellQueryValue]: boolean }
+ }, [cellTypeStaticInfo, props.selected])
+
+ const [selectedCells, setSelectedCells] = useState<{ [key in CellQueryValue]: boolean }>(currentlySelected)
+
+ //Set back state of selectedCells before closing
+ const handleCancel = () => {
+ setSelectedCells(currentlySelected)
+ props.onCancel()
+ };
+
+ const handleChange = (event: React.ChangeEvent) => {
+ setSelectedCells({
+ ...selectedCells,
+ [event.target.name]: event.target.checked,
+ });
+ };
+
+ const handleAccept = () => {
+ props.onAccept([...Object.entries(selectedCells).filter(x => x[1]).map(x => x[0] as CellQueryValue)])
+ props.onCancel()
+ }
+
+ const handleDeselectAll = () => {
+ setSelectedCells(
+ Object.fromEntries(
+ Object.entries(selectedCells).map(x => [x[0], false])
+ ) as { [key in CellQueryValue]: boolean }
+ )
+ }
+
+ return (
+
+ Select Bulk ATAC tracks
+
+
+ Select tracks you wish to display:
+
+
+ {
+ Object.entries(selectedCells).map(([queryVal, selected]: [CellQueryValue, boolean], i) =>
+
+
+
+ x === false)}>Deselect All
+ Cancel
+ Accept
+
+
+ )
+};
+
+export default BulkAtacModal
\ No newline at end of file
diff --git a/immuscreen/src/common/gbview/bulkatacmodal.tsx b/immuscreen/src/common/gbview/bulkatacmodal.tsx
deleted file mode 100644
index 1fb191a..0000000
--- a/immuscreen/src/common/gbview/bulkatacmodal.tsx
+++ /dev/null
@@ -1,327 +0,0 @@
-import React, { useCallback, useState } from "react";
-import { Modal, Accordion, Box } from "@mui/material";
-import { Typography, Button } from "@weng-lab/psychscreen-ui-components";
-import {
- AccordionDetails,
- AccordionSummary,
- Checkbox,
- FormControlLabel,
- FormGroup,
- Grid,
- Paper
-} from "@mui/material";
-import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
-import ExpandLessIcon from "@mui/icons-material/ExpandLess";
-
-type BulkAtacTrackModalTrackModalProps = {
- open?: boolean;
- onAccept?: (tracks: [string, string][]) => void;
- onCancel?: () => void;
- initialSelection: [string, string][];
-};
-
-const style = {
- position: "absolute" as "absolute",
- top: "25%",
- left: "50%",
- transform: "translate(-50%, -15%)",
- width: "50%",
- bgcolor: "background.paper",
- backgroundColor: "#ffffff",
- border: "2px solid #000",
- p: 4,
- padding: "2em",
- borderRadius: "20px",
-};
-
-const TRACKS = {
-
- "Bulk Atac Tracks": [
- [
- "Bulk B Stimulated",
- "https://downloads.wenglab.org/Bulk_B-S.bigWig",
- ],
- [
- "Bulk B Untimulated",
- "https://downloads.wenglab.org/Bulk_B-U.bigWig",
- ],
- [
- "CD8pos T Stimulated",
- "https://downloads.wenglab.org/CD8pos_T-S.bigWig",
- ],
- [
- "CD8pos T Unstimulated",
- "https://downloads.wenglab.org/CD8pos_T-U.bigWig",
- ],
- [
- "Central memory CD8pos T Stimulated",
- "https://downloads.wenglab.org/Central_memory_CD8pos_T-S.bigWig"
- ],
- [
- "Central memory CD8pos T Unstimulated",
- "https://downloads.wenglab.org/Central_memory_CD8pos_T-U.bigWig"
- ],[
- "Effector CD4pos T Stimulated",
- "https://downloads.wenglab.org/Effector_CD4pos_T-S.bigWig"
- ],
- [
- "Effector CD4pos T Unstimulated",
- "https://downloads.wenglab.org/Effector_CD4pos_T-U.bigWig"
- ],
- [
- "Effector memory CD8pos T Stimulated",
- "https://downloads.wenglab.org/Effector_memory_CD8pos_T-S.bigWig"
- ],
- [
- "Effector memory CD8pos T Unstimulated",
- "https://downloads.wenglab.org/Effector_memory_CD8pos_T-U.bigWig"
- ],
- [
- "Follicular T Helper Stimulated",
- "https://downloads.wenglab.org/Follicular_T_Helper-S.bigWig"
- ],
- [
- "Follicular T Helper Unstimulated",
- "https://downloads.wenglab.org/Follicular_T_Helper-U.bigWig"
- ],
- [
- "Gamma delta T Stimulated",
- "https://downloads.wenglab.org/Gamma_delta_T-S.bigWig"
- ],
- [
- "Gamma delta T Unstimulated",
- "https://downloads.wenglab.org/Gamma_delta_T-U.bigWig"
- ],
- [
- "Immature NK Unstimulated",
- "https://downloads.wenglab.org/Immature_NK-U.bigWig"
- ],
- [
- "Mature NK Unstimulated",
- "https://downloads.wenglab.org/Mature_NK-U.bigWig"
- ],
- [
- "Mem B Stimulated",
- "https://downloads.wenglab.org/Mem_B-S.bigWig"
- ],
- [
- "Mem B Unstimulated",
- "https://downloads.wenglab.org/Mem_B-U.bigWig"
- ],
- [
- "Memory Teffs Stimulated",
- "https://downloads.wenglab.org/Memory_Teffs-S.bigWig"
- ],
- [
- "Memory Teffs Unstimulated",
- "https://downloads.wenglab.org/Memory_Teffs-U.bigWig"
- ],
- [
- "Memory Tregs Stimulated",
- "https://downloads.wenglab.org/Memory_Tregs-S.bigWig"
- ],
- [
- "Memory Tregs Unstimulated",
- "https://downloads.wenglab.org/Memory_Tregs-U.bigWig"
-
- ],
- [
- "Monocytes Unstimulated",
- "https://downloads.wenglab.org/Monocytes-U.bigWig"
- ],
- [
- "Myeloid DCs Unstimulated",
- "https://downloads.wenglab.org/Myeloid_DCs-U.bigWig"
- ],
- [
- "Naive B Stimulated",
- "https://downloads.wenglab.org/Naive_B-S.bigWig"
- ],
- [
- "Naive B Unstimulated",
- "https://downloads.wenglab.org/Naive_B-U.bigWig"
- ],
- [
- "Naive CD8 T Stimulated",
- "https://downloads.wenglab.org/Naive_CD8_T-S.bigWig"
- ],
- [
- "Naive CD8 T Unstimulated",
-
- "https://downloads.wenglab.org/Naive_CD8_T-U.bigWig"
- ],
- [
- "Naive Teffs Stimulated",
- "https://downloads.wenglab.org/Naive_Teffs-S.bigWig"
- ],
- [
- "Naive Teffs Unstimulated",
- "https://downloads.wenglab.org/Naive_Teffs-U.bigWig"
- ],
- [
- "Naive Tregs Stimulated",
- "https://downloads.wenglab.org/Naive_Tregs-S.bigWig"
- ],
- [
- "Naive Tregs Unstimulated",
- "https://downloads.wenglab.org/Naive_Tregs-U.bigWig"
- ],
- [
- "pDCs Unstimulated",
- "https://downloads.wenglab.org/pDCs-U.bigWig"
-
- ],
- [
- "Plasmablasts Unstimulated",
- "https://downloads.wenglab.org/Plasmablasts-U.bigWig"
- ],
- [
- "Regulatory T Stimulated",
- "https://downloads.wenglab.org/Regulatory_T-S.bigWig"
- ],
- [
- "Regulatory T Unstimulated",
- "https://downloads.wenglab.org/Regulatory_T-U.bigWig"
- ],
- [
- "Th17 precursors Stimulated",
- "https://downloads.wenglab.org/Th17_precursors-S.bigWig"
- ],
- [
- "Th17 precursors Unstimulated",
- "https://downloads.wenglab.org/Th17_precursors-U.bigWig"
- ],
- [
- "Th1 precursors Stimulated",
- "https://downloads.wenglab.org/Th1_precursors-S.bigWig"
- ],
- [
- "Th1 precursors Unstimulated",
- "https://downloads.wenglab.org/Th1_precursors-U.bigWig"
- ],
- [
- "Th2 precursors Stimulated",
- "https://downloads.wenglab.org/Th2_precursors-S.bigWig"
- ],
- [
- "Th2 precursors Unstimulated",
- "https://downloads.wenglab.org/Th2_precursors-U.bigWig"
- ]
- ]
-};
-
-const BulkAtacTrackModal: React.FC = (props) => {
- const [expanded, setExpanded] = useState(
- new Map(Object.keys(TRACKS).map((k) => [k, false]))
- );
- const [selectedTracks, setSelectedTracks] = useState(
- props.initialSelection.map((x) => x[0])
- );
- const toggleTrack = useCallback(
- (track: string[]) => {
- const selected = !!selectedTracks.find((x) => x === track[0])?.length;
- if (!selected) setSelectedTracks([...selectedTracks, track[0]]);
- else setSelectedTracks(selectedTracks.filter((x) => x !== track[0]));
- },
- [selectedTracks]
- );
- const expand = useCallback(
- (key: string) =>
- setExpanded(
- new Map(
- Object.keys(TRACKS).map((k) => [
- k,
- k === key ? !expanded.get(k) : !!expanded.get(k),
- ])
- )
- ),
- [expanded]
- );
-
- const onAccept = useCallback(
- () =>
- props.onAccept &&
- props.onAccept([
- ...TRACKS["Bulk Atac Tracks"].filter(
- (track) =>
- (selectedTracks.find((x) => x === track[0])?.length || 0) > 0
- )
-
- ] as [string, string][]),
- [selectedTracks, props]
- );
-
- return (
-
-
-
- Select Bulk Atac Tracks for Display
-
-
- expand("Bulk Atac Tracks")}
- expandIcon={!expanded ?
- Bulk Atac Tracks
-
-
-
-
-
-
- {TRACKS["Bulk Atac Tracks"].map((track) => (
- x === track[0])?.length ||
- 0) > 0
- }
- />
- }
- label={track[0]}
- onChange={() => toggleTrack(track)}
- />
- ))}
-
-
-
-
-
-
-
- OK
-
-
- {
- props.onCancel && props.onCancel();
- setSelectedTracks(props.initialSelection.map((x) => x[0]));
- }}
- >
- cancel
-
-
-
-
- );
-};
-export default BulkAtacTrackModal;
diff --git a/immuscreen/src/common/gbview/bulkatactracks.tsx b/immuscreen/src/common/gbview/bulkatactracks.tsx
index 8e53c29..2a05165 100644
--- a/immuscreen/src/common/gbview/bulkatactracks.tsx
+++ b/immuscreen/src/common/gbview/bulkatactracks.tsx
@@ -2,71 +2,12 @@ import { gql, useQuery } from "@apollo/client";
import { BigWigData, BigBedData, BigZoomData } from "bigwig-reader";
import React, { RefObject, useEffect, useMemo, useState } from "react";
import { DenseBigBed, EmptyTrack, FullBigWig } from "umms-gb";
-import { BigRequest, RequestError, } from "umms-gb/dist/components/tracks/trackset/types";
+import { RequestError, } from "umms-gb/dist/components/tracks/trackset/types";
import { ValuedPoint } from "umms-gb/dist/utils/types";
import { client } from "../utils"
-import BulkAtacTrackModal from "./bulkatacmodal";
-import { BulkAtacCelltypeTrack, CalderonCellTypesMetadata } from "./consts";
import { CellQueryValue } from "../../app/celllineage/types";
import { getCellColor, getCellDisplayName } from "../../app/celllineage/utils";
-
-export const DEFAULT_TRACKS = (
- assembly: string
-): Map =>
- new Map([
- [
- "adult bCREs",
- {
- url: "gs://gcp.wenglab.org/GTEx-psychscreen/tracks/data/adult_bCREs.bigBed",
- },
- ],
- [
- "PsychSCREEN aggregated NeuN+ ATAC-seq",
- {
- url: "gs://gcp.wenglab.org/GTEx-psychscreen/tracks/data/all-NeuN+-ATAC.bigWig",
- },
- ],
- [
- "PsychSCREEN aggregated NeuN- ATAC-seq",
- {
- url: "gs://gcp.wenglab.org/GTEx-psychscreen/tracks/data/all-NeuN--ATAC.bigWig",
- },
- ],
- [
- "PsychSCREEN aggregated non-sorted ATAC-seq",
- {
- url: "gs://gcp.wenglab.org/GTEx-psychscreen/tracks/data/all-mixed-ATAC.bigWig",
- },
- ],
- [
- "motifs",
- { url: "gs://gcp.wenglab.org/all-conserved-motifs.merged.bigBed" },
- ],
- ]);
-
-export const TRACK_ORDER = [
- "adult bCREs",
- "PsychSCREEN aggregated NeuN+ ATAC-seq",
- "PsychSCREEN aggregated NeuN- ATAC-seq",
- "PsychSCREEN aggregated non-sorted ATAC-seq",
- "motifs",
-];
-
-export const COLOR_MAP: Map = new Map([
- ["PsychSCREEN aggregated NeuN+ ATAC-seq", "#0d825d"],
- ["PsychSCREEN aggregated NeuN- ATAC-seq", "#164182"],
- ["PsychSCREEN aggregated non-sorted ATAC-seq", "#1c8099"],
-]);
-
-
-export const tracks = (assembly: string, pos: GenomicRange) =>
- TRACK_ORDER.map((x) => ({
- chr1: pos.chromosome!,
- start: pos.start,
- end: pos.end,
- ...DEFAULT_TRACKS(assembly).get(x)!,
- preRenderedWidth: 1400,
- }));
+import BulkAtacModal from "./bulkAtacSelector";
export const BIG_QUERY = gql`
query BigRequests($bigRequests: [BigRequest!]!) {
@@ -102,7 +43,6 @@ export type BigQueryResponse = {
};
type BulkAtacTrackProps = {
- //tracks: BigRequest[];
domain: GenomicRange;
onHeightChanged?: (i: number) => void;
cCREHighlight?: GenomicRange;
@@ -178,56 +118,60 @@ export const TitledTrack: React.FC<{
);
};
- const BulkAtacTracks: React.FC = (props: BulkAtacTrackProps) => {
+const BulkAtacTracks: React.FC = (props: BulkAtacTrackProps) => {
+ const [selectedCells, setSelectedCells] = useState(props.defaultcelltypes as CellQueryValue[] || [])
+
+ // tracks -> [track name, track URL, track color]
+ const tracks: [string, string, string][] = useMemo(() => {
+ const x: [string, string, string][] = selectedCells.map(cell => {
+ return (
+ [
+ getCellDisplayName(cell, true, true) + (["HSC", "CD34_Cord_Blood", "CD34_Bone_Marrow"].find(x => x === cell) ? ` (${cell})` : ''),
+ `https://downloads.wenglab.org/${cell}.bigWig`,
+ getCellColor(cell)
+ ]
+ )
+ }) || []
+ x.sort()
+ x.unshift(["All Immune Cells (Aggregate Signal)", "https://downloads.wenglab.org/all_immune.bigWig", "#000000"])
+ return x
+ }, [selectedCells])
+
- const bulkAtacColors: {[key:string]: string} = {}
-
- const defaultTracks: [string, string][] = props.defaultcelltypes?.map((cell: CellQueryValue) => {
- bulkAtacColors[getCellDisplayName(cell, true, true)] = getCellColor(cell)
- return [getCellDisplayName(cell, true, true), `https://downloads.wenglab.org/${cell}.bigWig`]
- }) || []
-
- defaultTracks.sort()
- defaultTracks.unshift(["All Immune Cells (Aggregate Signal)", "https://downloads.wenglab.org/all_immune.bigWig"])
+ const [settingsMousedOver, setSettingsMousedOver] = useState(false);
+ const [settingsModalShown, setSettingsModalShown] = useState(false);
- //Why is this this not working when you have a lot of tracks? Why did my changes matter?
- const [cTracks, setTracks] = useState<[string, string][]>(defaultTracks);
- const height = useMemo(() => cTracks.length * 80, [cTracks]);
+ const height = useMemo(() => tracks.length * 80, [tracks]);
const bigRequests = useMemo(
() =>
- cTracks.map((x) => ({
+ tracks.map((x) => ({
chr1: props.domain.chromosome!,
start: props.domain.start,
end: props.domain.end,
preRenderedWidth: 1400,
url: x[1],
})),
- [cTracks, props]
+ [tracks, props]
);
+
const { data, loading } = useQuery(BIG_QUERY, {
variables: { bigRequests },
client
});
+
useEffect(() => {
props.onHeightChanged && props.onHeightChanged(height);
}, [props.onHeightChanged, height, props]);
- const [settingsMousedOver, setSettingsMousedOver] = useState(false);
- const [settingsModalShown, setSettingsModalShown] = useState(false);
-
return loading || (data?.bigRequests.length || 0) < 1 ? (
setSettingsModalShown(false)}
- onAccept={(x) => {
- setTracks(x);
- setSettingsModalShown(false);
- }}
- initialSelection={cTracks}
+ onAccept={(cells: CellQueryValue[]) => setSelectedCells(cells)}
+ selected={selectedCells}
/>
@@ -284,7 +227,7 @@ export const TitledTrack: React.FC<{
textAnchor="middle"
fill="#194023"
>
- Bulk Atac Tracks
+ Bulk ATAC
);
diff --git a/immuscreen/src/common/gbview/chrombpnetatactracks.tsx b/immuscreen/src/common/gbview/chrombpnetatactracks.tsx
index ad402eb..94c1aa2 100644
--- a/immuscreen/src/common/gbview/chrombpnetatactracks.tsx
+++ b/immuscreen/src/common/gbview/chrombpnetatactracks.tsx
@@ -63,22 +63,15 @@ const ChromBPNetAtacTracks: React.FC = ({
defaultcelltypes
}) => {
- console.log(defaultcelltypes)
//Given a query value I want the corresponding list of studies
const r = defaultcelltypes && CalderonBigWigTracksMetadata.filter(c => defaultcelltypes.includes(c.celltype_name))
- console.log(r)
const chrombpnetColors: {[key:string]: string} = {}
-
- // const defaultTracks: [string, string][] = defaultcelltypes?.map((cell: CellQueryValue) => {
- // chrombpnetColors[getCellDisplayName(cell, true, true)] = getCellColor(cell)
- // return [getCellDisplayName(cell, true, true), `https://downloads.wenglab.org/${cell}.bigWig`]
- // }) || []
const defaultTracks: [string, string][] = []
- for (let cell of defaultcelltypes) {
+ if (defaultcelltypes) for (let cell of defaultcelltypes) {
//Currently this is slightly broken in that it includes all monocyte experiments when "Mono" is cell since Mono is substring of all Monocyte S and U experiments, need to fix
const experiments = Object.entries(experimentInfo).filter(([experiment, info]) => experiment.includes(cell))
experiments.forEach(exp => {
diff --git a/immuscreen/src/common/gbview/consts.ts b/immuscreen/src/common/gbview/consts.ts
index d7a95fe..178fc57 100644
--- a/immuscreen/src/common/gbview/consts.ts
+++ b/immuscreen/src/common/gbview/consts.ts
@@ -275,14 +275,14 @@ export const CalderonBigWigTracks = [
["6792-MEP-SRX1427809","Megakaryocyte Erythroid Progenitor","Megakaryocyte Erythroid Progenitor in donor 6792","Progenitors"],
["7256-MEP-SRX1427863","Megakaryocyte Erythroid Progenitor","Megakaryocyte Erythroid Progenitor in donor 7256","Progenitors"],
["7256-MEP-SRX1427864","Megakaryocyte Erythroid Progenitor","Megakaryocyte Erythroid Progenitor in donor 7256","Progenitors"],
-["2596-Ery-SRX1427825","Erythrocyte","Erythrocyte in donor 2596","Myeloid"],
-["2596-Ery-SRX1427826","Erythrocyte","Erythrocyte in donor 2596","Myeloid"],
-["2596-Ery-SRX1427827","Erythrocyte","Erythrocyte in donor 2596","Myeloid"],
-["5483-Ery-SRX1427846","Erythrocyte","Erythrocyte in donor 5483","Myeloid"],
-["5483-Ery-SRX1427847","Erythrocyte","Erythrocyte in donor 5483","Myeloid"],
-["5483-Ery-SRX1427848","Erythrocyte","Erythrocyte in donor 5483","Myeloid"],
-["6926-Ery-SRX1427852","Erythrocyte","Erythrocyte in donor 6926","Myeloid"],
-["6926-Ery-SRX1427853","Erythrocyte","Erythrocyte in donor 6926","Myeloid"],
+["2596-Ery-SRX1427825","Erythroblast","Erythroblast in donor 2596","Myeloid"],
+["2596-Ery-SRX1427826","Erythroblast","Erythroblast in donor 2596","Myeloid"],
+["2596-Ery-SRX1427827","Erythroblast","Erythroblast in donor 2596","Myeloid"],
+["5483-Ery-SRX1427846","Erythroblast","Erythroblast in donor 5483","Myeloid"],
+["5483-Ery-SRX1427847","Erythroblast","Erythroblast in donor 5483","Myeloid"],
+["5483-Ery-SRX1427848","Erythroblast","Erythroblast in donor 5483","Myeloid"],
+["6926-Ery-SRX1427852","Erythroblast","Erythroblast in donor 6926","Myeloid"],
+["6926-Ery-SRX1427853","Erythroblast","Erythroblast in donor 6926","Myeloid"],
["4983-LMPP-SRX1427791","Lymphocyte-Primed Multipotent Progenitor","Lymphocyte-Primed Multipotent Progenitor in donor 4983","Progenitors"],
["6792-LMPP-SRX1427803","Lymphocyte-Primed Multipotent Progenitor","Lymphocyte-Primed Multipotent Progenitor in donor 6792","Progenitors"],
["7256-LMPP-SRX1427858","Lymphocyte-Primed Multipotent Progenitor","Lymphocyte-Primed Multipotent Progenitor in donor 7256","Progenitors"],
diff --git a/immuscreen/src/common/gbview/defaulttracks.tsx b/immuscreen/src/common/gbview/defaulttracks.tsx
index 1018422..c38e8a9 100644
--- a/immuscreen/src/common/gbview/defaulttracks.tsx
+++ b/immuscreen/src/common/gbview/defaulttracks.tsx
@@ -6,6 +6,7 @@ import { DenseBigBed, EmptyTrack, FullBigWig } from "umms-gb"
import { client } from "../utils"
import { BIG_QUERY } from "./queries"
import { GenomicRange, BigQueryResponse, BigResponseData } from "./types"
+import { Tooltip } from "@mui/material"
type DefaultTracksProps = {
@@ -75,7 +76,17 @@ export const TitledTrack: React.FC<{
svgRef={svgRef}
onMouseOver={(x) => oncCREMousedOver && x.name && oncCREMousedOver(cCRECoordinateMap.get(x.name))}
onMouseOut={oncCREMousedOut}
-
+ tooltipContent={(rect) => {
+ return (
+
+
+
+ {rect.name}
+
+
+
+ )
+ }}
/>
) : (
= (props) => {
const [cTracks, setTracks] = useState<[string, string][]>(
[
- ["All iCREs", "https://downloads.wenglab.org/Calderon-Corces_activeCREs_iSCREEN.bigBed"],
+ ["All immune cCREs", "https://downloads.wenglab.org/Calderon-Corces_activeCREs_iSCREEN_withcolors.bigBed"],
]
)
const height = useMemo(() => cTracks.length * 80, [cTracks])
diff --git a/immuscreen/src/common/gbview/genomebrowserview.tsx b/immuscreen/src/common/gbview/genomebrowserview.tsx
index f7e3b19..c10d4c8 100644
--- a/immuscreen/src/common/gbview/genomebrowserview.tsx
+++ b/immuscreen/src/common/gbview/genomebrowserview.tsx
@@ -110,7 +110,6 @@ export const GenomeBrowserView: React.FC = (props: Genom
)
const l = useCallback((c) => ((c - coordinates.start) * 1400) / (coordinates.end - coordinates.start), [coordinates])
- console.log(svgRef.current?.clientHeight)
return (
<>
@@ -148,11 +147,11 @@ export const GenomeBrowserView: React.FC = (props: Genom
{props.accession && = 500000 ? true : false}
- />}
+ />
= (props: Genom
* @todo Need to make sure chrombpnet tracks also include Corces
*/
}
-