Skip to content

Commit

Permalink
add a separate publication tab to the explore page
Browse files Browse the repository at this point in the history
  • Loading branch information
@onursumer
onursumer committed Jan 15, 2025
1 parent a00a6e2 commit eb84c80
Show file tree
Hide file tree
Showing 5 changed files with 431 additions and 32 deletions.
19 changes: 18 additions & 1 deletion packages/data-portal-commons/src/lib/publicationHelpers.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -203,7 +203,24 @@ export function getPublicationTitle(
publicationSummary?: PublicationSummary,
publicationManifest?: PublicationManifest
): string | undefined {
return publicationSummary?.title || publicationManifest?.Title;
const title = publicationSummary?.title || publicationManifest?.Title;
// remove trailing dot (if any)
return title?.trim().replace(/\.$/, '');
}

export function getPublicationDate(
publicationSummary?: PublicationSummary,
publicationManifest?: PublicationManifest
) {
let date: string | undefined;

if (publicationSummary) {
date = publicationSummary.pubdate;
} else if (publicationManifest) {
date = publicationManifest.YearofPublication?.toString();
}

return date;
}

export function getPublicationSupportingLinks(
Expand Down
42 changes: 36 additions & 6 deletions packages/data-portal-explore/src/components/Explore.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ import {
HTANToGenericAttributeMap,
LoadDataResult,
PublicationManifest,
PublicationSummary,
} from '@htan/data-portal-commons';
import { AttributeNames } from '@htan/data-portal-utils';
import {
Expand All @@ -53,7 +54,8 @@ export interface IExploreState {
filters: { [key: string]: string[] };
schemaDataById?: { [schemaDataId: string]: DataSchemaData };
atlases: Atlas[];
publicationsByUid: { [uid: string]: PublicationManifest };
publicationManifestByUid: { [uid: string]: PublicationManifest };
publicationSummaryByPubMedID?: { [pubMedId: string]: PublicationSummary };
atlasData?: any;
}

Expand Down Expand Up @@ -84,7 +86,8 @@ export class Explore extends React.Component<IExploreProps, IExploreState> {
files: [],
filters: {},
atlases: [],
publicationsByUid: {},
publicationManifestByUid: {},
publicationSummaryByPubMedID: {},
schemaDataById: {},
};

Expand Down Expand Up @@ -162,7 +165,9 @@ export class Explore extends React.Component<IExploreProps, IExploreState> {
this.setState({
files: fillInEntities(data),
atlases: data.atlases,
publicationsByUid: data.publicationManifestByUid,
publicationManifestByUid: data.publicationManifestByUid,
publicationSummaryByPubMedID:
data.publicationSummaryByPubMedID,
});
});

Expand All @@ -188,6 +193,11 @@ export class Explore extends React.Component<IExploreProps, IExploreState> {
);
}

@computed
get samples() {
return getFilteredSamples(this.state.files, this.cases, false);
}

@computed
get filteredSamples() {
return getFilteredSamples(
Expand All @@ -206,6 +216,11 @@ export class Explore extends React.Component<IExploreProps, IExploreState> {
);
}

@computed
get cases() {
return getFilteredCases(this.state.files, {}, true);
}

@computed
get filteredCases() {
return getFilteredCases(
Expand All @@ -224,6 +239,15 @@ export class Explore extends React.Component<IExploreProps, IExploreState> {
);
}

@computed get filteredPublications() {
return _(this.filteredCases)
.flatMap((c) => c.publicationIds)
.compact()
.uniq()
.map((id) => this.state.publicationManifestByUid[id])
.value();
}

@computed get atlasMap() {
return _.keyBy(this.state.atlases, (a) => a.htan_id);
}
Expand Down Expand Up @@ -349,8 +373,8 @@ export class Explore extends React.Component<IExploreProps, IExploreState> {
selectedSynapseAtlases={this.selectedAtlases}
allSynapseAtlases={this.allAtlases}
onSelectAtlas={this.onSelectAtlas}
samples={this.filteredSamples}
cases={this.filteredCases}
samples={this.samples}
cases={this.cases}
filteredCasesByNonAtlasFilters={
this.filteredCasesByNonAtlasFilters
}
Expand All @@ -369,7 +393,13 @@ export class Explore extends React.Component<IExploreProps, IExploreState> {
toggleShowAllCases={this.toggleShowAllCases}
cloudBaseUrl={this.props.cloudBaseUrl}
getAtlasMetaData={this.props.getAtlasMetaData}
publicationsByUid={this.state.publicationsByUid}
publicationManifestByUid={
this.state.publicationManifestByUid
}
publicationSummaryByPubMedID={
this.state.publicationSummaryByPubMedID
}
filteredPublications={this.filteredPublications}
genericAttributeMap={HTANToGenericAttributeMap} // TODO needs to be configurable, different mappings for each portal
/>
</div>
Expand Down
85 changes: 60 additions & 25 deletions packages/data-portal-explore/src/components/ExploreTabs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
Entity,
getNormalizedOrgan,
PublicationManifest,
PublicationSummary,
} from '@htan/data-portal-commons';
import { DataSchemaData } from '@htan/data-portal-schema';

Expand All @@ -19,6 +20,7 @@ import { BiospecimenTable } from './BiospecimenTable';
import { CaseTable } from './CaseTable';
import { DEFAULT_EXPLORE_PLOT_OPTIONS, ExplorePlot } from './ExplorePlot';
import { FileTable } from './FileTable';
import { PublicationTable } from './PublicationTable';
import { ExploreTab } from '../lib/types';

import styles from './exploreTabs.module.scss';
Expand Down Expand Up @@ -53,7 +55,9 @@ interface IExploreTabsProps {

genericAttributeMap?: { [attr: string]: GenericAttributeNames };
getAtlasMetaData: () => AtlasMetaData;
publicationsByUid: { [uid: string]: PublicationManifest };
publicationManifestByUid: { [uid: string]: PublicationManifest };
publicationSummaryByPubMedID?: { [pubMedId: string]: PublicationSummary };
filteredPublications: PublicationManifest[];
}

const metricTypes = [
Expand Down Expand Up @@ -146,6 +150,18 @@ export const ExploreTabs: React.FunctionComponent<IExploreTabsProps> = observer(
Atlases
</a>
</li>
<li className="nav-item">
<a
onClick={() => setTab(ExploreTab.PUBLICATION)}
className={`nav-link ${
activeTab === ExploreTab.PUBLICATION
? 'active'
: ''
}`}
>
Publications
</a>
</li>
<li className="nav-item">
<a
onClick={() => setTab(ExploreTab.CASES)}
Expand Down Expand Up @@ -182,23 +198,19 @@ export const ExploreTabs: React.FunctionComponent<IExploreTabsProps> = observer(
Files
</a>
</li>
{
<li className="nav-item">
<a
onClick={() => setTab(ExploreTab.PLOTS)}
className={`nav-link ${
activeTab === ExploreTab.PLOTS
? 'active'
: ''
}`}
>
Plots{' '}
<span style={{ color: 'orange' }}>
Beta!
</span>
</a>
</li>
}
<li className="nav-item">
<a
onClick={() => setTab(ExploreTab.PLOTS)}
className={`nav-link ${
activeTab === ExploreTab.PLOTS
? 'active'
: ''
}`}
>
Plots{' '}
<span style={{ color: 'orange' }}>Beta!</span>
</a>
</li>
</ul>
</div>

Expand All @@ -213,8 +225,8 @@ export const ExploreTabs: React.FunctionComponent<IExploreTabsProps> = observer(
groupsByPropertyFiltered={
props.groupsByPropertyFiltered
}
patientCount={props.cases.length}
publicationsByUid={props.publicationsByUid}
patientCount={props.filteredCases.length}
publicationsByUid={props.publicationManifestByUid}
/>
</div>
)}
Expand All @@ -235,10 +247,10 @@ export const ExploreTabs: React.FunctionComponent<IExploreTabsProps> = observer(
</label>*/}
<BiospecimenTable
synapseAtlases={props.filteredSynapseAtlases}
samples={props.samples}
samples={props.filteredSamples}
schemaDataById={props.schemaDataById}
genericAttributeMap={props.genericAttributeMap}
publicationsByUid={props.publicationsByUid}
publicationsByUid={props.publicationManifestByUid}
/>
</div>
)}
Expand All @@ -259,10 +271,31 @@ export const ExploreTabs: React.FunctionComponent<IExploreTabsProps> = observer(
</label>*/}
<CaseTable
synapseAtlases={props.filteredSynapseAtlases}
cases={props.cases}
cases={props.filteredCases}
schemaDataById={props.schemaDataById}
genericAttributeMap={props.genericAttributeMap}
publicationsByUid={props.publicationsByUid}
publicationsByUid={props.publicationManifestByUid}
/>
</div>
)}

{activeTab === ExploreTab.PUBLICATION && (
<div
className={`tab-content publications ${
activeTab !== ExploreTab.PUBLICATION ? 'd-none' : ''
}`}
>
<PublicationTable
publications={props.filteredPublications}
publicationSummaryByPubMedID={
props.publicationSummaryByPubMedID
}
participants={props.cases}
filteredParticipants={props.filteredCases}
biospecimens={props.samples}
filteredBiospecimens={props.filteredSamples}
files={props.files}
filteredFiles={props.filteredFiles}
/>
</div>
)}
Expand All @@ -275,7 +308,9 @@ export const ExploreTabs: React.FunctionComponent<IExploreTabsProps> = observer(
>
<AtlasTable
setTab={setTab}
publications={_.values(props.publicationsByUid)}
publications={_.values(
props.publicationManifestByUid
)}
getAtlasMetaData={props.getAtlasMetaData}
synapseAtlasData={props.allSynapseAtlases}
selectedAtlases={props.selectedSynapseAtlases}
Expand Down
Loading

0 comments on commit eb84c80

Please sign in to comment.