Austenem/Minor group updates (CAT-795, CAT-972, & CAT-982)

CHANGELOG-minor-group-updates.md

@@ -0,0 +1,3 @@
+- Label centrally processed dataset groups as HIVE in the helper panel.
+- Fix typo in publication collections summary.
+- Add group name to raw dataset summary section.

context/app/static/js/components/detailPage/ProcessedData/HelperPanel/HelperPanel.tsx

@@ -14,6 +14,7 @@ import { LineClampWithTooltip } from 'js/shared-styles/text';
 import { SecondaryBackgroundTooltip } from 'js/shared-styles/tooltips';
 
 import { formatDate } from 'date-fns/format';
+import ProcessedDataGroup from 'js/components/detailPage/ProcessedData/ProcessedDatasetGroup';
 import { HelperPanelPortal } from '../../DetailLayout/DetailLayout';
 import StatusIcon from '../../StatusIcon';
 import { getDateLabelAndValue, useCurrentDataset } from '../../utils';
@@ -68,22 +69,24 @@ function HelperPanelBody() {
     return null;
   }
   const [dateLabel, date] = getDateLabelAndValue(currentDataset);
+
+  const { title, description, pipeline, assay_display_name, creation_action, group_name } = currentDataset;
   return (
     <>
-      {currentDataset.title && (
+      {title && (
         <HelperPanelBodyItem label="Title" noWrap>
-          {currentDataset.title}
+          {title}
         </HelperPanelBodyItem>
       )}
-      {currentDataset.description && (
+      {description && (
         <HelperPanelBodyItem label="Description" noWrap>
-          {currentDataset.description}
+          {description}
         </HelperPanelBodyItem>
       )}
-      <HelperPanelBodyItem label="Analysis Type">
-        {currentDataset.pipeline ?? currentDataset.assay_display_name[0]}
+      <HelperPanelBodyItem label="Analysis Type">{pipeline ?? assay_display_name[0]}</HelperPanelBodyItem>
+      <HelperPanelBodyItem label="Group">
+        <ProcessedDataGroup creation_action={creation_action} group_name={group_name} />
       </HelperPanelBodyItem>
-      <HelperPanelBodyItem label="Group">{currentDataset.group_name}</HelperPanelBodyItem>
       <HelperPanelBodyItem label={dateLabel}>{date && formatDate(date, 'yyyy-MM-dd')}</HelperPanelBodyItem>
     </>
   );

context/app/static/js/components/detailPage/ProcessedData/ProcessedDataset/ProcessedDataset.tsx

@@ -26,7 +26,7 @@ import { getDateLabelAndValue } from 'js/components/detailPage/utils';
 import { useSelectedVersionStore } from 'js/components/detailPage/VersionSelect/SelectedVersionStore';
 import { useVersions } from 'js/components/detailPage/VersionSelect/hooks';
 import { useTrackEntityPageEvent } from 'js/components/detailPage/useTrackEntityPageEvent';
-import InfoTextTooltip from 'js/shared-styles/tooltips/InfoTextTooltip';
+import ProcessedDataGroup from 'js/components/detailPage/ProcessedData/ProcessedDatasetGroup';
 
 import { DatasetTitle } from './DatasetTitle';
 import { ProcessedDatasetAccordion } from './ProcessedDatasetAccordion';
@@ -74,18 +74,12 @@ function SummaryAccordion() {
   const { group_name, mapped_consortium, creation_action } = dataset;
   const [dateLabel, dateValue] = getDateLabelAndValue(dataset);
 
-  const isHiveProcessed = creation_action === 'Central Process';
-
   return (
     <Subsection title="Summary" icon={<SummarizeRounded />}>
       <Stack spacing={1}>
         <ProcessedDatasetDescription />
         <LabelledSectionText label="Group">
-          {isHiveProcessed ? (
-            <InfoTextTooltip tooltipTitle="HuBMAP Integration, Visualization & Engagement.">HIVE</InfoTextTooltip>
-          ) : (
-            group_name
-          )}
+          <ProcessedDataGroup creation_action={creation_action} group_name={group_name} />
         </LabelledSectionText>
         <LabelledSectionText label="Consortium">{mapped_consortium}</LabelledSectionText>
         <Contact />

context/app/static/js/components/detailPage/ProcessedData/ProcessedDatasetGroup.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import InfoTextTooltip from 'js/shared-styles/tooltips/InfoTextTooltip';
+import { ProcessedDatasetDetails } from 'js/components/detailPage/ProcessedData/ProcessedDataset/hooks';
+
+function ProcessedDataGroup({
+  creation_action,
+  group_name,
+}: Pick<ProcessedDatasetDetails, 'creation_action' | 'group_name'>) {
+  const isHiveProcessed = creation_action === 'Central Process';
+
+  return isHiveProcessed ? (
+    <InfoTextTooltip tooltipTitle="HuBMAP Integration, Visualization & Engagement.">HIVE</InfoTextTooltip>
+  ) : (
+    group_name
+  );
+}
+
+export default ProcessedDataGroup;

context/app/static/js/components/detailPage/summary/SummaryBody/SummaryBody.tsx

@@ -70,6 +70,22 @@ function DatasetConsortium() {
   return <LabelledSectionText label="Consortium">{mapped_consortium}</LabelledSectionText>;
 }
 
+function DatasetGroup() {
+  const { entity } = useFlaskDataContext();
+
+  if (!isDataset(entity)) {
+    return null;
+  }
+
+  const { group_name } = entity;
+
+  if (!group_name) {
+    return null;
+  }
+
+  return <LabelledSectionText label="Group">{group_name}</LabelledSectionText>;
+}
+
 function CollectionCitation() {
   const { entity } = useFlaskDataContext();
 
@@ -122,6 +138,7 @@ function SummaryBodyContent({
     <Stack component={SummaryPaper} direction={direction} spacing={1} {...stackProps}>
       <CollectionName />
       <SummaryDescription description={description} clamp={isEntityHeader} />
+      <DatasetGroup />
       <DatasetConsortium />
       <DatasetCitation />
       <CollectionCitation />

context/app/static/js/components/publications/PublicationCollections/PublicationCollections.tsx

@@ -19,7 +19,7 @@ function PublicationCollections({ collectionsData = [], isCollectionPublication
     <CollapsibleDetailPageSection id="data" title="Data">
       <StyledSectionPaper $isCollectionPublication={isCollectionPublication}>
         <LabelledSectionText label="Collections">
-          Datasets associated with this publication are included in the Collections listed below.
+          Datasets associated with this publication are included in the collections listed below.
         </LabelledSectionText>
       </StyledSectionPaper>
       <PanelList panelsProps={panelsProps} />