Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update develop to model_3 #173

Merged
merged 4 commits into from
Aug 21, 2024
Merged

Update develop to model_3 #173

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
cfcf4b7
Model v3 (#168)
CourtneyGosselin Aug 14, 2024
37c5822
Fixup: ages in the summary page aren't in order of age
OrdiNeu Aug 19, 2024
7d22cb9
Timeline is missing the preview along the bottom
OrdiNeu Aug 19, 2024
8fa144e
Merge pull request #172 from CanDIG/bugfix/fix-summary-age-at-diagnosis
OrdiNeu Aug 19, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/store/api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export function fetchFederationStat(endpoint) {
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
method: 'GET',
path: `v2/discovery/overview${endpoint}`,
path: `v3/discovery/overview${endpoint}`,
payload: {},
service: 'katsu'
})
Expand Down
2 changes: 1 addition & 1 deletion src/ui-component/ingest/ClinicalIngest.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ function ClinicalIngest({ setTab, fileUpload, clinicalData }) {

useEffect(() => {
function fetchPrograms() {
return fetchFederation('v2/discovery/donors/', 'katsu')
return fetchFederation('v3/discovery/donors/', 'katsu')
.then((result) => {
result.forEach((site) => {
const programs = site.results.discovery_donor;
Expand Down
6 changes: 3 additions & 3 deletions src/views/clinicalGenomic/search/SearchHandler.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useEffect, useState, useRef } from 'react';

Check warning on line 1 in src/views/clinicalGenomic/search/SearchHandler.js

View workflow job for this annotation

GitHub Actions / ESLint

src/views/clinicalGenomic/search/SearchHandler.js#L1 

'useState' is defined but never used. Allowed unused vars must match /^_/u (no-unused-vars)
import PropTypes from 'prop-types';

import { trackPromise } from 'react-promise-tracker';
Expand All @@ -22,15 +22,15 @@
useEffect(() => {
setLoading(true);
lastPromise = trackPromise(
fetchFederation('v2/discovery/sidebar_list', 'katsu')
fetchFederation('v3/discovery/sidebar_list', 'katsu')
.then((data) => {
writer((old) => ({ ...old, sidebar: data }));
})
.then(() => fetchFederationStat('/patients_per_cohort'))
.then((data) => {
writer((old) => ({ ...old, federation: data }));
})
.then(() => fetchFederation('v2/authorized/programs', 'katsu'))
.then(() => fetchFederation('v3/authorized/programs', 'katsu'))
.then((data) => {
writer((old) => ({ ...old, programs: data }));
})
Expand Down Expand Up @@ -165,7 +165,7 @@
}
setLoading(true);

const url = `v2/authorized/donor_with_clinical_data/program/${reader.cohort}/donor/${reader.donorID}`;
const url = `v3/authorized/donor_with_clinical_data/program/${reader.cohort}/donor/${reader.donorID}`;
trackPromise(
fetchFederation(url, 'katsu')
.then((data) => {
Expand Down
2 changes: 1 addition & 1 deletion src/views/clinicalGenomic/useClinicalPatientData.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ function useClinicalPatientData(patientId, programId, location, forceSelection)
try {
// Construct the API URL based on the provided parameters
if (programId && patientId) {
const url = `v2/authorized/donor_with_clinical_data/program/${programId}/donor/${patientId}`;
const url = `v3/authorized/donor_with_clinical_data/program/${programId}/donor/${patientId}`;

const result = await fetchFederation(url, 'katsu');
// Extract patientData from the fetched result or use an empty object
Expand Down
2 changes: 1 addition & 1 deletion src/views/clinicalGenomic/widgets/clinicalData.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,7 @@ function ClinicalView() {
<Typography pb={1} variant="h4">
Clinical Data
</Typography>
<div style={{ height: 510, width: '100%' }}>
<div style={{ height: 680, width: '100%' }}>
<DataGrid
rows={rows}
columns={columns}
Expand Down
50 changes: 11 additions & 39 deletions src/views/clinicalGenomic/widgets/sidebar.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -417,9 +417,7 @@ function Sidebar() {
const [selectedCohorts, setSelectedCohorts] = useState({});
const [selectedTreatment, setSelectedTreatment] = useState({});
const [selectedPrimarySite, setSelectedPrimarySite] = useState({});
const [selectedChemotherapy, setSelectedChemotherapy] = useState({});
const [selectedImmunotherapy, setSelectedImmunotherapy] = useState({});
const [selectedHormoneTherapy, setSelectedHormoneTherapy] = useState({});
const [selectedSystemicTherapy, setSelectedSystemicTherapy] = useState({});

// On our first load, remove all query parameters
useEffect(() => {
Expand Down Expand Up @@ -449,9 +447,7 @@ function Sidebar() {
// Clinical
setSelectedTreatment({});
setSelectedPrimarySite({});
setSelectedChemotherapy({});
setSelectedImmunotherapy({});
setSelectedHormoneTherapy({});
setSelectedSystemicTherapy({});

// Set context writer to include only nodes and cohorts
writerContext({
Expand Down Expand Up @@ -481,9 +477,7 @@ function Sidebar() {
const authorizedCohorts = readerContext?.programs?.flatMap((loc) => loc?.results?.items.map((cohort) => cohort.program_id)) || [];
const treatmentTypes = ExtractSidebarElements('treatment_types');
const tumourPrimarySites = ExtractSidebarElements('tumour_primary_sites');
const chemotherapyDrugNames = ExtractSidebarElements('chemotherapy_drug_names');
const immunotherapyDrugNames = ExtractSidebarElements('immunotherapy_drug_names');
const hormoneTherapyDrugNames = ExtractSidebarElements('hormone_therapy_drug_names');
const systemicTherapyDrugNames = ExtractSidebarElements('drug_names');
const chromosomes = [];
const genes = readerContext?.genes;

Expand Down Expand Up @@ -551,7 +545,7 @@ function Sidebar() {
options={treatmentTypes}
onWrite={writerContext}
groupName="treatment"
useAutoComplete={treatmentTypes.length >= 10}
useAutoComplete={treatmentTypes.length >= 5}
hide={hideClinical}
checked={selectedTreatment}
setChecked={setSelectedTreatment}
Expand All @@ -562,43 +556,21 @@ function Sidebar() {
options={tumourPrimarySites}
onWrite={writerContext}
groupName="primary_site"
useAutoComplete={tumourPrimarySites.length >= 10}
useAutoComplete={tumourPrimarySites.length >= 5}
hide={hideClinical}
checked={selectedPrimarySite}
setChecked={setSelectedPrimarySite}
/>
</SidebarGroup>
<SidebarGroup name="Chemotherapy" hide={hideClinical}>
<SidebarGroup name="Systemic Therapy Drug Names" hide={hideClinical}>
<StyledCheckboxList
options={chemotherapyDrugNames}
options={systemicTherapyDrugNames}
onWrite={writerContext}
groupName="chemotherapy"
useAutoComplete={chemotherapyDrugNames.length >= 10}
groupName="drug_name"
useAutoComplete={systemicTherapyDrugNames.length >= 5}
hide={hideClinical}
checked={selectedChemotherapy}
setChecked={setSelectedChemotherapy}
/>
</SidebarGroup>
<SidebarGroup name="Immunotherapy" hide={hideClinical}>
<StyledCheckboxList
options={immunotherapyDrugNames}
onWrite={writerContext}
groupName="immunotherapy"
useAutoComplete={immunotherapyDrugNames.length >= 10}
hide={hideClinical}
checked={selectedImmunotherapy}
setChecked={setSelectedImmunotherapy}
/>
</SidebarGroup>
<SidebarGroup name="Hormone Therapy" hide={hideClinical}>
<StyledCheckboxList
options={hormoneTherapyDrugNames}
onWrite={writerContext}
groupName="hormone_therapy"
useAutoComplete={hormoneTherapyDrugNames.length >= 10}
hide={hideClinical}
checked={selectedHormoneTherapy}
setChecked={setSelectedHormoneTherapy}
checked={selectedSystemicTherapy}
setChecked={setSelectedSystemicTherapy}
/>
</SidebarGroup>
</Root>
Expand Down
102 changes: 75 additions & 27 deletions src/views/clinicalGenomic/widgets/timeline.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,12 +16,12 @@ const formatHeader = (dateResolution) =>
const value = Math.floor(this.value);

if (dateResolution === 'Month') {
const monthsSinceStart = value % 12;
return `${monthsSinceStart} Month(s)`;
const monthsSinceStart = (value % 12) + 1;
return `${monthsSinceStart}M`;
}
if (dateResolution === 'Year') {
const yearsSinceStart = Math.floor(value / 12);
return `${yearsSinceStart} Year(s) Old`;
return `${yearsSinceStart}Y`;
}
return `Age Unknown`;
};
Expand Down Expand Up @@ -65,14 +65,15 @@ function Timeline({ data, onEventClick }) {
const [isTreatmentsCollapsed, setIsTreatmentsCollapsed] = useState(false);
const theme = useTheme();
useEffect(() => {
const birthDate = data?.date_of_birth?.month_interval ?? 0;
let dob = data?.date_of_birth?.month_interval ?? 0;
dob += data?.date_of_birth?.day_interval ? (data.date_of_birth.day_interval % 32) / 32 : 0;

const formatDate = (date) => {
if (date?.month_interval !== undefined) {
if (date?.day_interval) {
return date.month_interval + date.day_interval / 32 - birthDate;
return date.month_interval + (date.day_interval % 32) / 32 - dob;
}
return date.month_interval - birthDate;
return date.month_interval - dob;
}
return '';
};
Expand All @@ -85,7 +86,8 @@ function Timeline({ data, onEventClick }) {
y,
name,
color: colour,
customGroupId: name
customGroupId: name,
showInNavigator: true
}
]
: [];
Expand All @@ -97,26 +99,69 @@ function Timeline({ data, onEventClick }) {
y,
name: `${namePrefix}${item?.[id]}`,
color: colour,
customGroupId: name
customGroupId: name,
showInNavigator: true
}))
: [];

const generateSeriesDataBiomarker = (data, namePrefix, y, colour, date, name) =>
const generateSeriesDataBiomarker = (data, namePrefix, y, colour, date, name, fullData) =>
Array.isArray(data)
? data.map((item) => {
const id =
item?.submitter_treatment_id ||
item?.submitter_primary_diagnosis_id ||
item?.submitter_follow_up_id ||
item?.submitter_specimen_id;
return {
x: formatDate(item?.[date]),
y,
name: `${namePrefix}${typeof id !== 'undefined' ? id : 'No Linked Event'}`,
color: colour,
customGroupId: name
};
})
? data
.map((item) => {
// Determine the biomarker linked ID
const id =
item?.submitter_treatment_id ||
item?.submitter_primary_diagnosis_id ||
item?.submitter_follow_up_id ||
item?.submitter_specimen_id;

const biomarkerDate = item?.[date];

// Determine the linked object date if biomarkerDate is not available
let linkedObjectDate;
if (biomarkerDate === null) {
linkedObjectDate = fullData.primary_diagnoses.find(
(diagnosis) => diagnosis.submitter_primary_diagnosis_id === item.submitter_primary_diagnosis_id
)?.date_of_diagnosis;
}

// Determine the biomarker name
let dateLabel = '';

if (!id) {
if (biomarkerDate || linkedObjectDate) {
const dateObject = biomarkerDate || linkedObjectDate;
if (dateObject.day_interval) {
const ageInDays = dateObject.day_interval;
const years = Math.floor(ageInDays / 365);
const remainingDays = ageInDays % 365;
const months = Math.floor(remainingDays / 30);
const days = remainingDays % 30;

dateLabel = `${years}y ${months}m ${days}d`;
} else if (dateObject.month_interval) {
const ageInMonths = dateObject.month_interval;
const years = Math.floor(ageInMonths / 12);
const remainingMonths = ageInMonths % 12;
dateLabel = `${years}y ${remainingMonths}m`;
}
}
}

const biomarkerName = `${namePrefix}${id || ''} Biomarker ${id ? '' : `${dateLabel} since diagnosis`}`;
// Return the series data pointy
return biomarkerDate
? {
x: formatDate(biomarkerDate),
y,
name: biomarkerName,
color: colour,
customGroupId: name,
showInNavigator: true
}
: null;
})
.filter((item) => item !== null)
: [];

const generateSeriesDataSpecimen = (data, path, namePrefix, y, colour, date, name, id) =>
Expand All @@ -127,7 +172,8 @@ function Timeline({ data, onEventClick }) {
y,
name: `${namePrefix}${subItem?.[id]}`,
color: colour,
customGroupId: name
customGroupId: name,
showInNavigator: true
}))
: []
) || [];
Expand All @@ -143,14 +189,14 @@ function Timeline({ data, onEventClick }) {
y,
name: `${namePrefix}${subItem2?.[id]}`,
color: colour,
customGroupId: name
customGroupId: name,
showInNavigator: true
}))
: []
)
: []
) || [];

const dob = data?.date_of_birth?.month_interval;
const dateOfBirthSeries = generateSeriesDataSingle(data?.date_of_birth, 'Date of Birth', 0, theme.palette.primary.light, dob);
const dateOfDeathSeries = generateSeriesDataSingle(data?.date_of_death, 'Age at Death', 0, theme.palette.primary.main, dob);
const dateAliveAfterLostToFollowupSeries = generateSeriesDataSingle(
Expand Down Expand Up @@ -193,7 +239,8 @@ function Timeline({ data, onEventClick }) {
2,
theme.palette.secondary.dark,
'test_date',
'biomarkers'
'biomarkers',
data
);
const followupSeries1 = generateSeriesDataSpecimen(
data?.primary_diagnoses,
Expand Down Expand Up @@ -530,6 +577,7 @@ function Timeline({ data, onEventClick }) {
}
},
cursor: 'pointer',
showInNavigator: true,
events: {
click(event) {
const seriesID = event.point.series.userOptions.data[0].customGroupId;
Expand Down
1 change: 1 addition & 0 deletions src/views/summary/summary.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -239,6 +239,7 @@ function Summary() {
dataVis=""
height="400px; auto"
loading={diagnosisAgeCount === undefined}
orderAlphabetically
chartType="bar"
dropDown={false}
/>
Expand Down
Loading