Skip to content

Commit

Permalink
update mutation count in selectors when filtering by search box
Browse files Browse the repository at this point in the history
  • Loading branch information
@leexgh
leexgh committed Apr 28, 2021
1 parent 82f1685 commit b8d1072
Show file tree
Hide file tree
Showing 2 changed files with 124 additions and 117 deletions.
222 changes: 114 additions & 108 deletions packages/react-mutation-mapper/src/component/mutationMapper/GeneSummary.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,119 @@ export type GeneSummaryProps = {
loadingIndicator?: JSX.Element;
};

const GeneSummaryInfo: React.FunctionComponent<GeneSummaryProps> = ({
uniprotId,
showDropDown,
canonicalTranscript,
compactStyle,
activeTranscript,
transcriptsByTranscriptId,
transcriptSummaryUrlTemplate,
}) => {
const canonicalTranscriptId =
canonicalTranscript.result && canonicalTranscript.result.transcriptId;
const transcript =
activeTranscript && activeTranscript === canonicalTranscriptId
? (canonicalTranscript.result as EnsemblTranscript)
: transcriptsByTranscriptId[activeTranscript!];
const refseqMrnaId = transcript && transcript.refseqMrnaId;
const ccdsId = transcript && transcript.ccdsId;

const refSeq = refseqMrnaId ? (
<a href={getNCBIlink(`/nuccore/${refseqMrnaId}`)} target="_blank">
{refseqMrnaId}
</a>
) : (
'-'
);
const ensembl = showDropDown
? activeTranscript && (
<a
href={getUrl(transcriptSummaryUrlTemplate!, {
transcriptId: activeTranscript,
})}
target="_blank"
>
{activeTranscript}
</a>
)
: canonicalTranscriptId && (
// down't show drop down, only the canonical transcript
<a
href={getUrl(transcriptSummaryUrlTemplate!, {
transcriptId: canonicalTranscriptId,
})}
target="_blank"
>
{canonicalTranscriptId}
</a>
);
const ccds = ccdsId ? (
<a
href={getNCBIlink({
pathname: '/CCDS/CcdsBrowse.cgi',
query: {
REQUEST: 'CCDS',
DATA: ccdsId,
},
})}
target="_blank"
>
{ccdsId}
</a>
) : (
'-'
);

const uniprot = uniprotId ? (
<a href={`http://www.uniprot.org/uniprot/${uniprotId}`} target="_blank">
{uniprotId}
</a>
) : (
'-'
);

const compactGeneSummaryInfo = (
<div>
<span data-test="compactGeneSummaryRefSeq">{refSeq}</span>
{` | `}
{ensembl}
<br />
<span data-test="compactGeneSummaryCCDS">{ccds}</span>
{` | `}
<span data-test="compactGeneSummaryUniProt">{uniprot}</span>
</div>
);

const geneSummaryInfo = (
<div>
<div>
<span data-test="GeneSummaryRefSeq">
{'RefSeq: '}
{refSeq}
</span>
</div>
<div>
<span>Ensembl: </span>
{ensembl}
</div>
<div>
<span data-test="GeneSummaryCCDS">
{'CCDS: '}
{ccds}
</span>
</div>
<div>
<span data-test="GeneSummaryUniProt">
{'UniProt: '}
{uniprot}
</span>
</div>
</div>
);
return compactStyle ? compactGeneSummaryInfo : geneSummaryInfo;
};

@observer
export default class GeneSummary extends React.Component<GeneSummaryProps, {}> {
public static defaultProps: Partial<GeneSummaryProps> = {
Expand All @@ -42,7 +155,6 @@ export default class GeneSummary extends React.Component<GeneSummaryProps, {}> {
public render() {
const {
hugoGeneSymbol,
uniprotId,
showDropDown,
showOnlyAnnotatedTranscriptsInDropdown,
canonicalTranscript,
Expand All @@ -56,110 +168,6 @@ export default class GeneSummary extends React.Component<GeneSummaryProps, {}> {
loadingIndicator,
} = this.props;

const canonicalTranscriptId =
canonicalTranscript.result &&
canonicalTranscript.result.transcriptId;
const transcript =
activeTranscript && activeTranscript === canonicalTranscriptId
? (canonicalTranscript.result as EnsemblTranscript)
: transcriptsByTranscriptId[activeTranscript!];
const refseqMrnaId = transcript && transcript.refseqMrnaId;
const ccdsId = transcript && transcript.ccdsId;

const refSeq = refseqMrnaId ? (
<a href={getNCBIlink(`/nuccore/${refseqMrnaId}`)} target="_blank">
{refseqMrnaId}
</a>
) : (
'-'
);
const ensembl = showDropDown
? activeTranscript && (
<a
href={getUrl(this.props.transcriptSummaryUrlTemplate!, {
transcriptId: activeTranscript,
})}
target="_blank"
>
{activeTranscript}
</a>
)
: canonicalTranscriptId && (
// down't show drop down, only the canonical transcript
<a
href={getUrl(this.props.transcriptSummaryUrlTemplate!, {
transcriptId: canonicalTranscriptId,
})}
target="_blank"
>
{canonicalTranscriptId}
</a>
);
const ccds = ccdsId ? (
<a
href={getNCBIlink({
pathname: '/CCDS/CcdsBrowse.cgi',
query: {
REQUEST: 'CCDS',
DATA: ccdsId,
},
})}
target="_blank"
>
{ccdsId}
</a>
) : (
'-'
);

const uniprot = uniprotId ? (
<a
href={`http://www.uniprot.org/uniprot/${uniprotId}`}
target="_blank"
>
{uniprotId}
</a>
) : (
'-'
);

const geneSummaryInfo = (
<div>
<div>
<span data-test="GeneSummaryRefSeq">
{'RefSeq: '}
{refSeq}
</span>
</div>
<div>
<span>Ensembl: </span>
{ensembl}
</div>
<div>
<span data-test="GeneSummaryCCDS">
{'CCDS: '}
{ccds}
</span>
</div>
<div>
<span data-test="GeneSummaryUniProt">
{'UniProt: '}
{uniprot}
</span>
</div>
</div>
);
const compactGeneSummaryInfo = (
<div>
<span data-test="compactGeneSummaryRefSeq">{refSeq}</span>
{` | `}
{ensembl}
<br />
<span data-test="compactGeneSummaryCCDS">{ccds}</span>
{` | `}
<span data-test="compactGeneSummaryUniProt">{uniprot}</span>
</div>
);
return (
<div
className={
Expand All @@ -186,9 +194,7 @@ export default class GeneSummary extends React.Component<GeneSummaryProps, {}> {
onChange={onTranscriptChange}
loadingIndicator={loadingIndicator}
/>
{this.props.compactStyle
? compactGeneSummaryInfo
: geneSummaryInfo}
<GeneSummaryInfo {...this.props} />
</div>
);
}
Expand Down
19 changes: 10 additions & 9 deletions src/shared/components/mutationMapper/MutationMapper.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -389,16 +389,8 @@ export default class MutationMapper<
return _.keyBy(groupedData, d => d.group);
}

protected getMutationsGroupedByProteinImpactType?: () => {
[type: string]: { group: string; data: any[] };
};

@computed
protected get mutationsGroupedByProteinImpactType() {
if (this.getMutationsGroupedByProteinImpactType) {
return this.getMutationsGroupedByProteinImpactType();
}

// there are two types of filters (with putative driver, without putative driver)
const filtersWithoutProteinImpactTypeFilter = this.store.dataStore.dataFilters.filter(
f =>
Expand All @@ -408,11 +400,20 @@ export default class MutationMapper<

// apply filters excluding the protein impact type filters
// this prevents number of unchecked protein impact types from being counted as zero
const sortedFilteredData = applyDataFilters(
let sortedFilteredData = applyDataFilters(
this.store.dataStore.allData,
filtersWithoutProteinImpactTypeFilter,
this.store.dataStore.applyFilter
);

// also apply lazy mobx table search filter
sortedFilteredData = sortedFilteredData.filter(m =>
(this.store
.dataStore as MutationMapperDataStore).applyLazyMobXTableFilter(
m
)
);

return this.groupDataByProteinImpactType(sortedFilteredData);
}

Expand Down

0 comments on commit b8d1072

Please sign in to comment.