Skip to content

Commit

Permalink
Update packages
Browse files Browse the repository at this point in the history
Hide civic
Fix reVUE to fit new genome nexus model
Update packages - set cheerio and parse5 version in resolutions, because the 'juice' dependency in cbioportal frontend commons causes some conficts, using older version of cheerio and parse5 is a temp fix.
  • Loading branch information
leexgh committed Jul 8, 2024
1 parent 5665125 commit 2db984c
Show file tree
Hide file tree
Showing 10 changed files with 470 additions and 237 deletions.
12 changes: 8 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,12 +21,12 @@
"@types/superagent": "^4.1.1",
"autobind-decorator": "^2.4.0",
"bootstrap": "^4.3.1",
"cbioportal-frontend-commons": "^0.5.51",
"cbioportal-utils": "^0.3.34",
"cbioportal-frontend-commons": "^0.5.67",
"cbioportal-utils": "^0.3.41",
"classnames": "^2.2.6",
"file-loader": "^4.3.0",
"font-awesome": "^4.7.0",
"genome-nexus-ts-api-client": "^1.1.28",
"genome-nexus-ts-api-client": "1.1.32",
"lodash": "^4.17.21",
"mobx": "^6.0.0",
"mobx-react": "^6.0.0",
Expand All @@ -42,7 +42,7 @@
"react-bootstrap": "^1.0.0-beta.6",
"react-dom": "^16.14.0",
"react-markdown": "^7.0.1",
"react-mutation-mapper": "^0.8.93",
"react-mutation-mapper": "^0.8.110",
"react-router-bootstrap": "^0.24.4",
"react-router-dom": "^4.3.1",
"react-scripts": "^3.4.4",
Expand Down Expand Up @@ -85,5 +85,9 @@
},
"devDependencies": {
"@types/react-scroll": "^1.5.4"
},
"resolutions": {
"cheerio": "1.0.0-rc.10",
"parse5-htmlparser2-tree-adapter": "^6.0.0"
}
}
2 changes: 1 addition & 1 deletion src/component/variantPage/BasicInfo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -437,7 +437,7 @@ export default class BasicInfo extends React.Component<IBasicInfoProps> {
>
{
annotationSummary.vues
.revisedVariantClassification
.revisedVariantClassificationStandard
}
</span>
</a>
Expand Down
32 changes: 16 additions & 16 deletions src/component/variantPage/ClinicalImplication.tsx
Original file line number Diff line number Diff line change
@@ -1,30 +1,30 @@
import _ from 'lodash';
// import _ from 'lodash';
import * as React from 'react';
import { observer } from 'mobx-react';

import { IndicatorQueryResp } from 'oncokb-ts-api-client';
import { ICivicVariantIndex, ICivicVariantSummary } from 'cbioportal-utils';
// import { ICivicVariantIndex, ICivicVariantSummary } from 'cbioportal-utils';

import OncoKb from './clinicalImplication/OncoKb';
import Civic from './clinicalImplication/Civic';
import Separator from '../Separator';
// import Civic from './clinicalImplication/Civic';
// import Separator from '../Separator';

interface IClinicalImplicationProps {
oncokb: IndicatorQueryResp | undefined;
civic?: ICivicVariantIndex;
// civic?: ICivicVariantIndex;
isCanonicalTranscriptSelected: boolean;
}

@observer
class ClinicalImplication extends React.Component<IClinicalImplicationProps> {
get civicVariant(): ICivicVariantSummary | undefined {
if (this.props.civic) {
// assuming the index only contains one variant
return _.values(_.values(this.props.civic)[0])[0];
} else {
return undefined;
}
}
// get civicVariant(): ICivicVariantSummary | undefined {
// if (this.props.civic) {
// // assuming the index only contains one variant
// return _.values(_.values(this.props.civic)[0])[0];
// } else {
// return undefined;
// }
// }

public render() {
return (
Expand All @@ -35,13 +35,13 @@ class ClinicalImplication extends React.Component<IClinicalImplicationProps> {
this.props.isCanonicalTranscriptSelected
}
/>
<Separator />
<Civic
{/* <Separator /> */}
{/* <Civic
civic={this.civicVariant}
isCanonicalTranscriptSelected={
this.props.isCanonicalTranscriptSelected
}
/>
/> */}
</>
);
}
Expand Down
2 changes: 1 addition & 1 deletion src/component/variantPage/FunctionalGroups.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ class FunctionalGroups extends React.Component<IFunctionalGroupsProps> {
<td>
<ClinicalImplication
oncokb={this.props.oncokb}
civic={this.props.civic}
// civic={this.props.civic}
isCanonicalTranscriptSelected={
this.props.isCanonicalTranscriptSelected
}
Expand Down
62 changes: 30 additions & 32 deletions src/component/variantPage/biologicalFunction/ReVUE.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,41 +12,39 @@ export const ReVUEContent: React.FunctionComponent<IReVUEProps> = (props) => {
return props.vue ? (
<div>
<div>
Predicted Effect by{` `}
{
<a
href="https://useast.ensembl.org/info/docs/tools/vep/index.html"
target="_blank"
rel="noopener noreferrer"
>
VEP
</a>
}
Predicted Effect by{' '}
<a
href="https://useast.ensembl.org/info/docs/tools/vep/index.html"
target="_blank"
rel="noopener noreferrer"
>
VEP
</a>
: <strong>{props.vue.defaultEffect}</strong>
</div>
<div>
Revised Protein Effect by{` `}
{
<a
href="https://cancerrevue.org"
target="_blank"
rel="noopener noreferrer"
>
reVUE
</a>
}
{` (`}
{
<a
href={`https://pubmed.ncbi.nlm.nih.gov/${props.vue.pubmedId}/`}
rel="noopener noreferrer"
target="_blank"
>
{props.vue.referenceText}
</a>
}
{`): `}
<strong>{props.vue.revisedProteinEffect}</strong>
Revised Protein Effect by{' '}
<a
href="https://cancerrevue.org"
target="_blank"
rel="noopener noreferrer"
>
reVUE
</a>{' '}
(
{props.vue.references.map((reference, index) => (
<React.Fragment key={reference.pubmedId}>
{index > 0 && ", "}
<a
href={`https://pubmed.ncbi.nlm.nih.gov/${reference.pubmedId}/`}
rel="noopener noreferrer"
target="_blank"
>
{reference.referenceText}
</a>
</React.Fragment>
))}
): <strong>{props.vue.revisedVariantClassificationStandard}</strong>
</div>
</div>
) : (
Expand Down
200 changes: 100 additions & 100 deletions src/component/variantPage/clinicalImplication/Civic.tsx
Original file line number Diff line number Diff line change
@@ -1,112 +1,112 @@
import { observer } from 'mobx-react';
// import { observer } from 'mobx-react';
import * as React from 'react';

import { ICivicEvidenceSummary, ICivicVariantSummary } from 'cbioportal-utils';
import { DefaultTooltip } from 'cbioportal-frontend-commons';
// import { ICivicEvidenceSummary, ICivicVariantSummary } from 'cbioportal-utils';
// import { DefaultTooltip } from 'cbioportal-frontend-commons';

import {
ClinicalSignificance,
Evidence,
EvidenceType,
} from '../../../util/EvidenceUtils';
import EvidenceSummary from './EvidenceSummary';
import functionalGroupsStyle from '../functionalGroups.module.scss';
// import {
// ClinicalSignificance,
// Evidence,
// EvidenceType,
// } from '../../../util/EvidenceUtils';
// import EvidenceSummary from './EvidenceSummary';
// import functionalGroupsStyle from '../functionalGroups.module.scss';

interface ICivicProps {
civic?: ICivicVariantSummary;
isCanonicalTranscriptSelected: boolean;
}
// interface ICivicProps {
// civic?: ICivicVariantSummary;
// isCanonicalTranscriptSelected: boolean;
// }

const DEFAULT_CIVIC_URL = 'https://civicdb.org/';
// const DEFAULT_CIVIC_URL = 'https://civicdb.org/';

function getEvidenceUrl(civic: ICivicVariantSummary, evidenceId: number) {
return `https://civicdb.org/events/genes/${civic.geneId}/summary/variants/${civic.id}/summary/evidence/${evidenceId}/summary#evidence`;
}
// function getEvidenceUrl(civic: ICivicVariantSummary, evidenceId: number) {
// return `https://civicdb.org/events/genes/${civic.geneId}/summary/variants/${civic.id}/summary/evidence/${evidenceId}/summary#evidence`;
// }

const CivicInfo: React.FunctionComponent<{
url: string;
isCanonicalTranscriptSelected: boolean;
}> = (props) => {
return (
<DefaultTooltip
placement="top"
overlay={
<div style={{ maxWidth: 350 }}>
<a
href={props.url}
target="_blank"
rel="noopener noreferrer"
>
CIViC
</a>{' '}
is a community-edited forum for discussion and
interpretation of peer-reviewed publications pertaining to
the clinical relevance of variants (or biomarker
alterations) in cancer.
</div>
}
>
<a href={props.url} target="_blank" rel="noopener noreferrer">
CIViC <i className="fas fa-external-link-alt" />
{!props.isCanonicalTranscriptSelected && `*`}
</a>
</DefaultTooltip>
);
};
// const CivicInfo: React.FunctionComponent<{
// url: string;
// isCanonicalTranscriptSelected: boolean;
// }> = (props) => {
// return (
// <DefaultTooltip
// placement="top"
// overlay={
// <div style={{ maxWidth: 350 }}>
// <a
// href={props.url}
// target="_blank"
// rel="noopener noreferrer"
// >
// CIViC
// </a>{' '}
// is a community-edited forum for discussion and
// interpretation of peer-reviewed publications pertaining to
// the clinical relevance of variants (or biomarker
// alterations) in cancer.
// </div>
// }
// >
// <a href={props.url} target="_blank" rel="noopener noreferrer">
// CIViC <i className="fas fa-external-link-alt" />
// {!props.isCanonicalTranscriptSelected && `*`}
// </a>
// </DefaultTooltip>
// );
// };

function civicEvidenceToEvidence(
civicEvidence: ICivicEvidenceSummary
): Evidence {
return {
...civicEvidence,
clinicalSignificance: civicEvidence.clinicalSignificance.includes(
ClinicalSignificance.Sensitivity
)
? ClinicalSignificance.Sensitivity
: civicEvidence.clinicalSignificance,
} as Evidence;
}
// function civicEvidenceToEvidence(
// civicEvidence: ICivicEvidenceSummary
// ): Evidence {
// return {
// ...civicEvidence,
// clinicalSignificance: civicEvidence.clinicalSignificance.includes(
// ClinicalSignificance.Sensitivity
// )
// ? ClinicalSignificance.Sensitivity
// : civicEvidence.clinicalSignificance,
// } as Evidence;
// }

@observer
export default class Civic extends React.Component<ICivicProps> {
get clinicalEvidences() {
return (
this.props.civic?.evidences
.map(civicEvidenceToEvidence)
.filter(
(e) =>
e.type === EvidenceType.Predictive ||
e.type === EvidenceType.Prognostic ||
e.type === EvidenceType.Diagnostic
) || []
);
}
// @observer
// export default class Civic extends React.Component<ICivicProps> {
// get clinicalEvidences() {
// return (
// this.props.civic?.evidences
// .map(civicEvidenceToEvidence)
// .filter(
// (e) =>
// e.type === EvidenceType.Predictive ||
// e.type === EvidenceType.Prognostic ||
// e.type === EvidenceType.Diagnostic
// ) || []
// );
// }

public render() {
const url = this.props.civic ? this.props.civic.url : DEFAULT_CIVIC_URL;
// public render() {
// const url = this.props.civic ? this.props.civic.url : DEFAULT_CIVIC_URL;

return (
<div className={functionalGroupsStyle['functional-group']}>
<div className={functionalGroupsStyle['data-source']}>
<CivicInfo
url={url}
isCanonicalTranscriptSelected={
this.props.isCanonicalTranscriptSelected
}
/>
</div>
<EvidenceSummary
url={url}
evidences={this.clinicalEvidences}
getEvidenceUrl={this.getEvidenceUrl}
/>
</div>
);
}
// return (
// <div className={functionalGroupsStyle['functional-group']}>
// <div className={functionalGroupsStyle['data-source']}>
// <CivicInfo
// url={url}
// isCanonicalTranscriptSelected={
// this.props.isCanonicalTranscriptSelected
// }
// />
// </div>
// <EvidenceSummary
// url={url}
// evidences={this.clinicalEvidences}
// getEvidenceUrl={this.getEvidenceUrl}
// />
// </div>
// );
// }

private getEvidenceUrl = (evidence: ICivicEvidenceSummary) => {
return this.props.civic
? getEvidenceUrl(this.props.civic, evidence.id)
: DEFAULT_CIVIC_URL;
};
}
// private getEvidenceUrl = (evidence: ICivicEvidenceSummary) => {
// return this.props.civic
// ? getEvidenceUrl(this.props.civic, evidence.id)
// : DEFAULT_CIVIC_URL;
// };
// }
Loading

0 comments on commit 2db984c

Please sign in to comment.