-
Notifications
You must be signed in to change notification settings - Fork 270
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
generate hgvsg by frontend function directly
- show ... for long hgvsg, show tooltip with whole hgvsg when hover
- Loading branch information
Showing
3 changed files
with
28 additions
and
90 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
105 changes: 25 additions & 80 deletions
105
src/shared/components/mutationTable/column/HgvsgColumnFormatter.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,122 +1,67 @@ | ||
| import * as React from 'react'; | ||
| import {Circle} from "better-react-spinkit"; | ||
| import 'rc-tooltip/assets/bootstrap_white.css'; | ||
| import {Mutation} from "shared/api/generated/CBioPortalAPI"; | ||
| import { | ||
| TableCellStatusIndicator, | ||
| TableCellStatus, | ||
| VariantAnnotation, | ||
| DefaultTooltip | ||
| } from "cbioportal-frontend-commons"; | ||
| import GenomeNexusCache, { GenomeNexusCacheDataType } from "shared/cache/GenomeNexusCache"; | ||
| import { Mutation } from "shared/api/generated/CBioPortalAPI"; | ||
| import { DefaultTooltip } from "cbioportal-frontend-commons"; | ||
| import { generateHgvsgByMutation } from 'shared/lib/MutationUtils'; | ||
| import { buildGenomeNexusHgvsgUrl } from 'shared/api/urls'; | ||
|
|
||
| import hgvsgStyles from "./hgvsg.module.scss"; | ||
|
|
||
| export default class HgvsgColumnFormatter { | ||
|
|
||
| public static renderFunction(data:Mutation[], | ||
| genomeNexusCache:GenomeNexusCache|undefined) { | ||
| const genomeNexusCacheData = HgvsgColumnFormatter.getGenomeNexusDataFromCache(data, genomeNexusCache); | ||
| return HgvsgColumnFormatter.getHgvsgDataViz(genomeNexusCacheData, data[0]); | ||
| public static renderFunction(data:Mutation[]) { | ||
| return HgvsgColumnFormatter.getHgvsgDataViz(data[0]); | ||
| } | ||
|
|
||
| private static getGenomeNexusDataFromCache(data:Mutation[], cache:GenomeNexusCache|undefined):GenomeNexusCacheDataType | null { | ||
| if (data.length === 0 || !cache) { | ||
| return null; | ||
| } | ||
| return cache.get(data[0]); | ||
| } | ||
|
|
||
| private static getHgvsgDataViz(genomeNexusCacheData:GenomeNexusCacheDataType|null, mutation:Mutation) { | ||
| let status:TableCellStatus | null = null; | ||
| let hgvsg:string | null = null; | ||
| if (genomeNexusCacheData === null) { | ||
| status = TableCellStatus.LOADING; | ||
| } else if (genomeNexusCacheData.status === "error") { | ||
| status = TableCellStatus.ERROR; | ||
| } else if (genomeNexusCacheData.status === "complete" && genomeNexusCacheData.data === null) { | ||
| // for the cases that genome nexus response can't match back due to data issue | ||
| // e.g. 17 7578456 7578481 GCGGACGCGGGTGCCGGGCGGGGGTG GCGGACGCGGGTGCCGGGCGGGGGTGT | ||
| // has hgvsg 17:g.7578456insT | ||
| // for these cases, build hgvsg by generateHgvsgByMutation function | ||
| hgvsg = generateHgvsgByMutation(mutation); | ||
| } else if (genomeNexusCacheData.data === null) { | ||
| status = TableCellStatus.NA; | ||
| } else { | ||
| hgvsg = HgvsgColumnFormatter.getData(genomeNexusCacheData.data, mutation); | ||
| } | ||
|
|
||
| // TODO: handle loading status in TableCellStatusIndicator | ||
| if (status !== null) { | ||
| // show loading circle | ||
| if (status === TableCellStatus.LOADING) { | ||
| return <Circle size={18} scaleEnd={0.5} scaleStart={0.2} color="#aaa" className="pull-left"/>; | ||
| } | ||
| else { | ||
| return <TableCellStatusIndicator status={status}/>; | ||
| } | ||
| } | ||
|
|
||
| private static getHgvsgDataViz(mutation:Mutation) { | ||
| let hgvsg = HgvsgColumnFormatter.getData(mutation); | ||
| if (!hgvsg) { | ||
| return <span></span>; | ||
| return <span />; | ||
| } | ||
| else { | ||
| let genomeNexusUrl = buildGenomeNexusHgvsgUrl(hgvsg); | ||
| return ( | ||
| <DefaultTooltip | ||
| placement="topLeft" | ||
| overlay={( | ||
| <span> | ||
| <div> | ||
| {hgvsg}<br /> | ||
| Click to see this variant on | ||
| <a | ||
| href={buildGenomeNexusHgvsgUrl(hgvsg)} | ||
| href={genomeNexusUrl} | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| > | ||
| Genome Nexus | ||
| <div className={hgvsgStyles["genome-nexus-logo"]}></div> | ||
| <div className={hgvsgStyles["genome-nexus-logo"]} /> | ||
| </a> | ||
| </span>)} | ||
| </div>)} | ||
| > | ||
| <span className={hgvsgStyles["hgvsg-data"]}> | ||
| <a href={buildGenomeNexusHgvsgUrl(hgvsg)} target="_blank" rel="noopener noreferrer"> | ||
| {hgvsg} | ||
| | ||
| <i className="fa fa-external-link" /> | ||
| <a | ||
| href={genomeNexusUrl} | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| > | ||
| {hgvsg} <i className="fa fa-external-link" /> | ||
| </a> | ||
| </span> | ||
| </DefaultTooltip> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| public static getData(genomeNexusData: VariantAnnotation | null, mutation: Mutation): string | null | ||
| public static getData(mutation: Mutation): string | null | ||
| { | ||
| if (genomeNexusData) { | ||
| // if have hgvsg, return hgvsg result | ||
| // if no hgvsg returned, compute by generateHgvsgByMutation function | ||
| return genomeNexusData.hgvsg ? genomeNexusData.hgvsg : generateHgvsgByMutation(mutation); | ||
| } | ||
| else { | ||
| return null; | ||
| } | ||
| return generateHgvsgByMutation(mutation); | ||
| } | ||
|
|
||
| public static download(data:Mutation[], genomeNexusCache:GenomeNexusCache): string | ||
| public static download(data:Mutation[]): string | ||
| { | ||
| const genomeNexusData = HgvsgColumnFormatter.getGenomeNexusDataFromCache(data, genomeNexusCache); | ||
| const hgvsg = genomeNexusData && HgvsgColumnFormatter.getData(genomeNexusData.data, data[0]); | ||
| const hgvsg = HgvsgColumnFormatter.getData(data[0]); | ||
| return hgvsg ? hgvsg : ""; | ||
| } | ||
|
|
||
| public static getSortValue(data:Mutation[], genomeNexusCache:GenomeNexusCache): string|null { | ||
| const genomeNexusCacheData = HgvsgColumnFormatter.getGenomeNexusDataFromCache(data, genomeNexusCache); | ||
| if (genomeNexusCacheData) { | ||
| return HgvsgColumnFormatter.getData(genomeNexusCacheData.data, data[0]); | ||
| } | ||
| else { | ||
| return null; | ||
| } | ||
| public static getSortValue(data:Mutation[]): string | null { | ||
| return HgvsgColumnFormatter.getData(data[0]); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters