Skip to content

Commit

Permalink
Show treatments from the same evidence in separate rows (#1129)
Browse files Browse the repository at this point in the history
  • Loading branch information
@zhx828
zhx828 authored Jun 21, 2024
1 parent f722789 commit 8c31d28
Show file tree
Hide file tree
Showing 9 changed files with 285 additions and 173 deletions.
Binary file modified ...enshot-test/__baseline_snapshots__/Actionable Genes Page without Login-snap.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...seline_snapshots__/Alteration Page with Cancer Type - Solid with Login-snap.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...ine_snapshots__/Alteration Page with Cancer Type - Solid without Login-snap.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified screenshot-test/__baseline_snapshots__/HGVSg Page without Login-snap.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
115 changes: 64 additions & 51 deletions src/main/webapp/app/pages/actionableGenesPage/ActionableGenesPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import {
Alteration,
Evidence,
TumorType,
Treatment as EvidenceTreatment,
} from 'app/shared/api/generated/OncoKbPrivateAPI';
import Select from 'react-select';
import _ from 'lodash';
Expand All @@ -25,7 +26,7 @@ import {
getDefaultColumnDefinition,
getDrugNameFromTreatment,
getPageTitle,
getTreatmentNameFromEvidence,
getTreatmentNameByPriority,
isFdaLevel,
levelOfEvidence2Level,
OncoKBLevelIcon,
Expand Down Expand Up @@ -70,10 +71,12 @@ type Treatment = {
fdaLevel: string;
hugoSymbol: string;
alterations: Alteration[];
alterationsName: string;
cancerTypes: TumorType[];
excludedCancerTypes: TumorType[];
relevantCancerTypes: TumorType[];
treatments: {}[];
cancerTypesName: string;
treatment: EvidenceTreatment | undefined;
uniqueDrugs: string[];
drugs: string;
};
Expand Down Expand Up @@ -258,29 +261,52 @@ export default class ActionableGenesPage extends React.Component<
alteration.referenceGenomes.includes(this.refGenome)
);
if (matchedAlterations.length > 0) {
treatments.push({
level: levelOfEvidence2Level(item.levelOfEvidence, true),
fdaLevel: levelOfEvidence2Level(item.fdaLevel, true),
hugoSymbol: item.gene.hugoSymbol || 'NA',
alterations: _.sortBy(matchedAlterations, 'name'),
cancerTypes: item.cancerTypes,
excludedCancerTypes: item.excludedCancerTypes,
relevantCancerTypes: item.relevantCancerTypes,
treatments: item.treatments,
uniqueDrugs: _.uniq(
_.reduce(
item.treatments,
(acc, treatment) => {
const result: string[] = treatment.drugs.map(drug =>
getDrugNameFromTreatment(drug)
);
return acc.concat(result);
},
[] as string[]
)
),
drugs: getTreatmentNameFromEvidence(item),
});
const level = levelOfEvidence2Level(item.levelOfEvidence, true);
const fdaLevel = levelOfEvidence2Level(item.fdaLevel, true);
const sortedAlts = _.sortBy(matchedAlterations, 'name');
const sortedAltsName = sortedAlts
.map(alteration => alteration.name)
.sort()
.join(', ');
const cancerTypesName = getCancerTypesNameFromOncoTreeType(
item.cancerTypes,
item.excludedCancerTypes
);
if (item.treatments.length > 0) {
item.treatments.forEach(treatment => {
treatments.push({
level,
fdaLevel,
hugoSymbol: item.gene.hugoSymbol || 'NA',
alterations: sortedAlts,
alterationsName: sortedAltsName,
cancerTypes: item.cancerTypes,
excludedCancerTypes: item.excludedCancerTypes,
relevantCancerTypes: item.relevantCancerTypes,
cancerTypesName,
treatment,
uniqueDrugs: _.uniq(
treatment.drugs.map(drug => getDrugNameFromTreatment(drug))
),
drugs: getTreatmentNameByPriority(treatment),
});
});
} else {
treatments.push({
level,
fdaLevel,
hugoSymbol: item.gene.hugoSymbol || 'NA',
alterations: sortedAlts,
alterationsName: sortedAltsName,
cancerTypes: item.cancerTypes,
excludedCancerTypes: item.excludedCancerTypes,
relevantCancerTypes: item.relevantCancerTypes,
cancerTypesName,
treatment: undefined,
uniqueDrugs: [],
drugs: '',
});
}
}
});
return treatments;
Expand Down Expand Up @@ -343,7 +369,11 @@ export default class ActionableGenesPage extends React.Component<
_.forEach(this.evidencesByLevel.result, (content, levelOfEvidence) => {
treatments = treatments.concat(this.getTreatments(content));
});
return treatments;
return _.uniqBy(
treatments,
treatment =>
`${treatment.level}-${treatment.hugoSymbol}-${treatment.alterationsName}-${treatment.cancerTypesName}-${treatment.drugs}`
);
}

@computed
Expand All @@ -357,7 +387,11 @@ export default class ActionableGenesPage extends React.Component<
level: treatment.fdaLevel,
} as Treatment);
});
return treatments;
return _.uniqBy(
treatments,
treatment =>
`${treatment.level}-${treatment.hugoSymbol}-${treatment.alterationsName}-${treatment.cancerTypesName}`
);
}

@computed
Expand Down Expand Up @@ -571,14 +605,8 @@ export default class ActionableGenesPage extends React.Component<
.map(treatment => ({
level: treatment.level,
hugoSymbol: treatment.hugoSymbol,
alterations: treatment.alterations
.map(alteration => alteration.name)
.sort()
.join(', '),
tumorType: getCancerTypesNameFromOncoTreeType(
treatment.cancerTypes,
treatment.excludedCancerTypes
),
alterations: treatment.alterationsName,
tumorType: treatment.cancerTypesName,
drugs: treatment.drugs,
}))
.sort((treatmentA, treatmentB) => {
Expand Down Expand Up @@ -744,22 +772,7 @@ export default class ActionableGenesPage extends React.Component<
...getDefaultColumnDefinition(TABLE_COLUMN_KEY.EVIDENCE_CANCER_TYPE),
Header: <span>Cancer Types</span>,
minWidth: 300,
accessor: 'cancerTypes',
sortMethod(a: TumorType[], b: TumorType[]) {
return getCancerTypesNameFromOncoTreeType(a).localeCompare(
getCancerTypesNameFromOncoTreeType(b)
);
},
Cell(props: { original: Treatment }) {
return (
<span>
{getCancerTypesNameFromOncoTreeType(
props.original.cancerTypes,
props.original.excludedCancerTypes
)}
</span>
);
},
accessor: 'cancerTypesName',
},
];
if (this.drugRelatedLevelSelected) {
Expand Down
174 changes: 122 additions & 52 deletions src/main/webapp/app/pages/annotationPage/AnnotationPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ import {
getCancerTypeNameFromOncoTreeType,
getCancerTypesName,
getCategoricalAlterationDescription,
getTreatmentNameByPriority,
getTreatmentNameFromEvidence,
isCategoricalAlteration,
isPositionalAlteration,
Expand Down Expand Up @@ -123,7 +124,7 @@ export default class AnnotationPage extends React.Component<
}

getImplications(evidences: Evidence[]) {
return evidences.map(evidence => {
return evidences.reduce((acc, evidence) => {
const level = levelOfEvidence2Level(evidence.levelOfEvidence);
const fdaLevel = levelOfEvidence2Level(evidence.fdaLevel);
const alterations = _.chain(evidence.alterations)
Expand All @@ -133,65 +134,134 @@ export default class AnnotationPage extends React.Component<
)
)
.value();
const alterationsName = alterations
.map(alteration => alteration.name)
.join(', ');
const cancerTypes = evidence.cancerTypes.map(cancerType =>
getCancerTypeNameFromOncoTreeType(cancerType)
);
const excludedCancerTypes = evidence.excludedCancerTypes.map(ct =>
getCancerTypeNameFromOncoTreeType(ct)
);
return {
level,
fdaLevel,
drugDescription: evidence.description,
alterations: alterations.map(alteration => alteration.name).join(', '),
alterationsView: (
<WithSeparator separator={', '}>
{alterations.map(alteration =>
alteration.consequence ? (
<AlterationPageLink
key={alteration.name}
hugoSymbol={this.props.store.hugoSymbol}
alteration={{
alteration: alteration.alteration,
name: alteration.name,
}}
alterationRefGenomes={
alteration.referenceGenomes as REFERENCE_GENOME[]
}
/>
) : (
<span>{alteration.name}</span>
)
)}
</WithSeparator>
),
drugs: getTreatmentNameFromEvidence(evidence),
cancerTypes: getCancerTypesName(cancerTypes, excludedCancerTypes),
cancerTypesView: (
<>
const cancerTypesName = getCancerTypesName(
cancerTypes,
excludedCancerTypes
);
if (evidence.treatments.length > 0) {
evidence.treatments.forEach(treatment => {
acc.push({
level,
fdaLevel,
drugDescription: evidence.description,
alterations: alterationsName,
alterationsView: (
<WithSeparator separator={', '}>
{alterations.map(alteration =>
alteration.consequence ? (
<AlterationPageLink
key={alteration.name}
hugoSymbol={this.props.store.hugoSymbol}
alteration={{
alteration: alteration.alteration,
name: alteration.name,
}}
alterationRefGenomes={
alteration.referenceGenomes as REFERENCE_GENOME[]
}
/>
) : (
<span>{alteration.name}</span>
)
)}
</WithSeparator>
),
drugs: getTreatmentNameByPriority(treatment),
cancerTypes: cancerTypesName,
cancerTypesView: (
<>
<WithSeparator separator={', '}>
{cancerTypes.map(cancerType => (
<AlterationPageLink
key={`${this.props.store.alterationName}-${cancerType}`}
hugoSymbol={this.props.store.hugoSymbol}
alteration={this.props.store.alterationName}
alterationRefGenomes={[
this.props.store.referenceGenomeQuery,
]}
cancerType={cancerType}
>
{cancerType}
</AlterationPageLink>
))}
</WithSeparator>
{excludedCancerTypes.length > 0 ? (
<span> (excluding {excludedCancerTypes.join(', ')})</span>
) : (
<></>
)}
</>
),
citations: articles2Citations(evidence.articles),
} as TherapeuticImplication);
});
} else {
acc.push({
level,
fdaLevel,
drugDescription: evidence.description,
alterations: alterationsName,
alterationsView: (
<WithSeparator separator={', '}>
{cancerTypes.map(cancerType => (
<AlterationPageLink
key={`${this.props.store.alterationName}-${cancerType}`}
hugoSymbol={this.props.store.hugoSymbol}
alteration={this.props.store.alterationName}
alterationRefGenomes={[this.props.store.referenceGenomeQuery]}
cancerType={cancerType}
>
{cancerType}
</AlterationPageLink>
))}
{alterations.map(alteration =>
alteration.consequence ? (
<AlterationPageLink
key={alteration.name}
hugoSymbol={this.props.store.hugoSymbol}
alteration={{
alteration: alteration.alteration,
name: alteration.name,
}}
alterationRefGenomes={
alteration.referenceGenomes as REFERENCE_GENOME[]
}
/>
) : (
<span>{alteration.name}</span>
)
)}
</WithSeparator>
{excludedCancerTypes.length > 0 ? (
<span> (excluding {excludedCancerTypes.join(', ')})</span>
) : (
<></>
)}
</>
),
citations: articles2Citations(evidence.articles),
} as TherapeuticImplication;
});
),
drugs: '',
cancerTypes: cancerTypesName,
cancerTypesView: (
<>
<WithSeparator separator={', '}>
{cancerTypes.map(cancerType => (
<AlterationPageLink
key={`${this.props.store.alterationName}-${cancerType}`}
hugoSymbol={this.props.store.hugoSymbol}
alteration={this.props.store.alterationName}
alterationRefGenomes={[
this.props.store.referenceGenomeQuery,
]}
cancerType={cancerType}
>
{cancerType}
</AlterationPageLink>
))}
</WithSeparator>
{excludedCancerTypes.length > 0 ? (
<span> (excluding {excludedCancerTypes.join(', ')})</span>
) : (
<></>
)}
</>
),
citations: articles2Citations(evidence.articles),
} as TherapeuticImplication);
}
return acc;
}, [] as TherapeuticImplication[]);
}

getEvidenceByEvidenceTypes(
Expand Down
12 changes: 8 additions & 4 deletions src/main/webapp/app/pages/annotationPage/Utils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,12 +37,16 @@ export const sortTherapeuticImplications = (
implications: TherapeuticImplication[],
desc = true
) => {
return implications.sort(
(a, b) =>
return implications.sort((a, b) => {
let compareScore =
(LEVEL_PRIORITY.indexOf(a.level as LEVELS) -
LEVEL_PRIORITY.indexOf(b.level as LEVELS)) *
(desc ? -1 : 1)
);
(desc ? -1 : 1);
if (compareScore === 0) {
compareScore = a.drugs.localeCompare(b.drugs);
}
return compareScore;
});
};

export enum SummaryKey {
Expand Down
Loading

0 comments on commit 8c31d28

Please sign in to comment.