From 6b5314a23230c6aeb7dc6e95acbfbed09f6ce90c Mon Sep 17 00:00:00 2001 From: Austen Money Date: Mon, 28 Oct 2024 17:02:43 -0400 Subject: [PATCH] Austenem/CAT-959 Update epic labels (#3580) * update labels * update helper panel * update pipeline labels * update changelog and tests * check string, not array --- CHANGELOG-update-epic-labels.md | 2 ++ .../ProcessedData/HelperPanel/HelperPanel.tsx | 4 ++- .../ProcessedData/ProcessedData.tsx | 6 ++--- .../ProcessedDatasetAccordion.tsx | 2 +- .../detailPage/ProcessedData/hooks.spec.ts | 18 ++++++------- .../detailPage/ProcessedData/hooks.ts | 26 +++++++++---------- context/app/static/js/pages/Dataset/hooks.ts | 6 +++-- 7 files changed, 35 insertions(+), 29 deletions(-) create mode 100644 CHANGELOG-update-epic-labels.md diff --git a/CHANGELOG-update-epic-labels.md b/CHANGELOG-update-epic-labels.md new file mode 100644 index 0000000000..00d48e3bea --- /dev/null +++ b/CHANGELOG-update-epic-labels.md @@ -0,0 +1,2 @@ +- Use assay_display_name instead of pipeline when labelling EPIC dataset sections. +- Update language in processed dataset sections from "pipeline" to "analysis". \ No newline at end of file diff --git a/context/app/static/js/components/detailPage/ProcessedData/HelperPanel/HelperPanel.tsx b/context/app/static/js/components/detailPage/ProcessedData/HelperPanel/HelperPanel.tsx index cd39143716..437e3fc044 100644 --- a/context/app/static/js/components/detailPage/ProcessedData/HelperPanel/HelperPanel.tsx +++ b/context/app/static/js/components/detailPage/ProcessedData/HelperPanel/HelperPanel.tsx @@ -80,7 +80,9 @@ function HelperPanelBody() { {currentDataset.description} )} - {currentDataset.pipeline} + + {currentDataset.pipeline ?? currentDataset.assay_display_name[0]} + {currentDataset.group_name} {date && formatDate(date, 'yyyy-MM-dd')} diff --git a/context/app/static/js/components/detailPage/ProcessedData/ProcessedData.tsx b/context/app/static/js/components/detailPage/ProcessedData/ProcessedData.tsx index c4851cc524..6e93ddfeb3 100644 --- a/context/app/static/js/components/detailPage/ProcessedData/ProcessedData.tsx +++ b/context/app/static/js/components/detailPage/ProcessedData/ProcessedData.tsx @@ -6,14 +6,14 @@ import { sectionIconMap } from 'js/shared-styles/icons/sectionIconMap'; import ProcessedDataset from './ProcessedDataset'; import { SectionDescription } from './ProcessedDataset/SectionDescription'; import HelperPanel from './HelperPanel'; -import { usePipelineCountsInfo, useSortedSearchHits } from './hooks'; +import { useAnalysesCountInfo, useSortedSearchHits } from './hooks'; import CollapsibleDetailPageSection from '../DetailPageSection/CollapsibleDetailPageSection'; function ProcessedDataSection() { const processedDatasets = useProcessedDatasets(); const sortedSearchHits = useSortedSearchHits(processedDatasets.searchHits); - const { pipelinesText, pipelineCountsText } = usePipelineCountsInfo( + const { analysesText, analysesCountText } = useAnalysesCountInfo( processedDatasets.searchHits.map((dataset) => dataset._source), ); @@ -25,7 +25,7 @@ function ProcessedDataSection() { icon={sectionIconMap['processed-data']} > {pipelineCountsText}} + addendum={{analysesCountText}} > This section lists analyses generated based on this dataset. These analyses are represented as processed datasets and are either generated by HuBMAP using uniform processing pipelines or by an external processing diff --git a/context/app/static/js/components/detailPage/ProcessedData/ProcessedDataset/ProcessedDatasetAccordion.tsx b/context/app/static/js/components/detailPage/ProcessedData/ProcessedDataset/ProcessedDatasetAccordion.tsx index 1aca1e21de..c34ecfe8b2 100644 --- a/context/app/static/js/components/detailPage/ProcessedData/ProcessedDataset/ProcessedDatasetAccordion.tsx +++ b/context/app/static/js/components/detailPage/ProcessedData/ProcessedDataset/ProcessedDatasetAccordion.tsx @@ -76,7 +76,7 @@ export function ProcessedDatasetAccordion({ children }: PropsWithChildren) { }> {isLoading ? iconPlaceholder : visualizationIcon} - {sectionDataset.pipeline} + {sectionDataset.pipeline ?? sectionDataset.assay_display_name[0]} diff --git a/context/app/static/js/components/detailPage/ProcessedData/hooks.spec.ts b/context/app/static/js/components/detailPage/ProcessedData/hooks.spec.ts index d934986388..cf3dc21d78 100644 --- a/context/app/static/js/components/detailPage/ProcessedData/hooks.spec.ts +++ b/context/app/static/js/components/detailPage/ProcessedData/hooks.spec.ts @@ -1,13 +1,13 @@ import { CreationAction } from 'js/components/types'; import { renderHook } from 'test-utils/functions'; -import { useSortedSearchHits, createdByCentralProcess, datasetIsPublished, usePipelineCountsInfo } from './hooks'; +import { useSortedSearchHits, createdByCentralProcess, datasetIsPublished, useAnalysesCountInfo } from './hooks'; const testDatasets: { _id: string; _index: string; _score: number; _source: { - assay_display_name: string[]; + assay_display_name: string; created_timestamp: number; creation_action: CreationAction; entity_type: string; @@ -24,7 +24,7 @@ const testDatasets: { _index: 'hm_prod_consortium_portal', _score: 1, _source: { - assay_display_name: ['CODEX [Cytokit + SPRM]'], + assay_display_name: 'CODEX [Cytokit + SPRM]', created_timestamp: 1688952984040, creation_action: 'Central Process', entity_type: 'Dataset', @@ -41,7 +41,7 @@ const testDatasets: { _index: 'hm_prod_consortium_portal', _score: 1, _source: { - assay_display_name: ['CODEX [Cytokit + SPRM]'], + assay_display_name: 'CODEX [Cytokit + SPRM]', created_timestamp: 1689198074733, creation_action: 'Central Process', entity_type: 'Dataset', @@ -58,7 +58,7 @@ const testDatasets: { _index: 'hm_prod_consortium_portal', _score: 1, _source: { - assay_display_name: ['External (Segmentation Mask)'], + assay_display_name: 'External (Segmentation Mask)', created_timestamp: 1689198074733, creation_action: 'External Process', entity_type: 'Dataset', @@ -94,8 +94,8 @@ it('checks if dataset is published', () => { expect(datasetIsPublished(testDatasets[2]._source)).toBe(true); }); -it('counts pipelines and their occurrences', () => { - const { pipelinesText, pipelineCountsText } = usePipelineCountsInfo(testDatasets.map((dataset) => dataset._source)); - expect(pipelinesText).toBe('Pipelines (2)'); - expect(pipelineCountsText).toBe('Cytokit + SPRM (2) and Segmentation Mask'); +it('counts analyses and their occurrences', () => { + const { analysesText, analysesCountText } = useAnalysesCountInfo(testDatasets.map((dataset) => dataset._source)); + expect(analysesText).toBe('Analyses (2)'); + expect(analysesCountText).toBe('Cytokit + SPRM (2) and Segmentation Mask'); }); diff --git a/context/app/static/js/components/detailPage/ProcessedData/hooks.ts b/context/app/static/js/components/detailPage/ProcessedData/hooks.ts index 17a20ac091..3d2564da98 100644 --- a/context/app/static/js/components/detailPage/ProcessedData/hooks.ts +++ b/context/app/static/js/components/detailPage/ProcessedData/hooks.ts @@ -40,26 +40,26 @@ export function useSortedSearchHits(datasets: ReturnType[]) { - const pipelines = datasets.map((dataset) => dataset.pipeline); - const pipelineCounts = pipelines.reduce( - (acc, pipeline) => { - acc[pipeline] = (acc[pipeline] || 0) + 1; +export function useAnalysesCountInfo(datasets: Pick[]) { + const analyses = datasets.map((dataset) => dataset.pipeline ?? dataset.assay_display_name); + const analysesCount = analyses.reduce( + (acc, analysis) => { + acc[analysis] = (acc[analysis] || 0) + 1; return acc; }, {} as Record, ); - const pipelinesText = `Pipelines (${Object.keys(pipelineCounts).length})`; - const pipelineCountsText = generateCommaList( - Object.entries(pipelineCounts).map(([pipeline, count]) => (count > 1 ? `${pipeline} (${count})` : pipeline)), + const analysesText = `Analyses (${Object.keys(analysesCount).length})`; + const analysesCountText = generateCommaList( + Object.entries(analysesCount).map(([analysis, count]) => (count > 1 ? `${analysis} (${count})` : analysis)), ); return { - pipelinesText, - pipelineCountsText, + analysesText, + analysesCountText, }; } diff --git a/context/app/static/js/pages/Dataset/hooks.ts b/context/app/static/js/pages/Dataset/hooks.ts index 0b2f937158..44c2530f2c 100644 --- a/context/app/static/js/pages/Dataset/hooks.ts +++ b/context/app/static/js/pages/Dataset/hooks.ts @@ -135,7 +135,8 @@ function getProcessedDatasetSection({ hit: Required>; conf?: VitessceConf; }) { - const { pipeline, hubmap_id, files, metadata, visualization, creation_action, contributors } = hit._source; + const { pipeline, assay_display_name, hubmap_id, files, metadata, visualization, creation_action, contributors } = + hit._source; const shouldDisplaySection = { summary: true, @@ -146,10 +147,11 @@ function getProcessedDatasetSection({ }; const sectionsToDisplay = Object.entries(shouldDisplaySection).filter(([_k, v]) => v === true); + const sectionTitle = pipeline ?? assay_display_name[0] ?? hubmap_id; return { // TODO: Improve the lookup for descendants to exclude anything with a missing pipeline name - ...getSectionFromString(pipeline ?? hubmap_id, datasetSectionId(hit._source, 'section')), + ...getSectionFromString(sectionTitle, datasetSectionId(hit._source, 'section')), items: sectionsToDisplay.map(([s]) => ({ ...getSectionFromString(s, datasetSectionId(hit._source, s)), hash: datasetSectionId(hit._source, s),