use generateCommaList

hubmapconsortium · Oct 8, 2024 · 596c998 · 596c998
1 parent c981781
commit 596c998
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/context/app/static/js/components/detailPage/ProcessedData/hooks.spec.ts b/context/app/static/js/components/detailPage/ProcessedData/hooks.spec.ts
@@ -97,5 +97,5 @@ it('checks if dataset is published', () => {
 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), Segmentation Mask');
+  expect(pipelineCountsText).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
@@ -1,5 +1,6 @@
 import { useMemo } from 'react';
 import { ProcessedDatasetInfo, useProcessedDatasets } from 'js/pages/Dataset/hooks';
+import { generateCommaList } from 'js/helpers/functions';
 
 export function createdByCentralProcess(dataset: Pick<ProcessedDatasetInfo, 'creation_action'>) {
   return dataset.creation_action === 'Central Process';
@@ -53,9 +54,9 @@ export function usePipelineCountsInfo(datasets: Pick<ProcessedDatasetInfo, 'pipe
     {} as Record<string, number>,
   );
   const pipelinesText = `Pipelines (${Object.keys(pipelineCounts).length})`;
-  const pipelineCountsText = Object.entries(pipelineCounts)
-    .map(([pipeline, count]) => (count > 1 ? `${pipeline} (${count})` : pipeline))
-    .join(', ');
+  const pipelineCountsText = generateCommaList(
+    Object.entries(pipelineCounts).map(([pipeline, count]) => (count > 1 ? `${pipeline} (${count})` : pipeline)),
+  );
 
   return {
     pipelinesText,