feat: add consent code descriptions to ncpi catalog (anvilproject/anv…

…il-portal#2665) (#3354)

feat: add consent code descriptions to ncpi catalog (anvil#2665)

explorer/app/apis/catalog/ncpi-catalog-dug/common/utils.ts

@@ -26,6 +26,7 @@ export function DugStudyInputMapper(dugStudy: DugStudy): DugCatalogStudy {
 function sanitizeStudy(dugStudy: DugStudy): DugCatalogStudy {
   return {
     consentCode: sanitizeStringArray(dugStudy.consentCodes),
+    consentLongName: sanitizeStringArray(dugStudy.consentLongNames),
     dataType: sanitizeStringArray(dugStudy.dataTypes),
     dbGapId: dugStudy.dbGapId,
     focus: sanitizeString(dugStudy.focus),

explorer/app/apis/catalog/ncpi-catalog/common/entities.ts

@@ -6,6 +6,7 @@ export interface PlatformStudy {
 }
 
 export interface NCPIStudy extends DbGapStudy {
+  consentLongNames: string[];
   platforms: string[];
 }
 
@@ -15,6 +16,7 @@ export type NCPICatalogEntity = NCPICatalogPlatform | NCPICatalogStudy;
 
 export interface NCPICatalogPlatform {
   consentCode: string[];
+  consentLongName: string[];
   dataType: string[];
   dbGapId: string[];
   focus: string[];
@@ -27,6 +29,7 @@ export interface NCPICatalogPlatform {
 
 export interface NCPICatalogStudy {
   consentCode: string[];
+  consentLongName: string[];
   dataType: string[];
   dbGapId: string;
   focus: string;

explorer/app/apis/catalog/ncpi-catalog/common/utils.ts

@@ -7,6 +7,7 @@ import { NCPICatalogPlatform, NCPICatalogStudy, NCPIStudy } from "./entities";
 export function NCPIStudyInputMapper(ncpiStudy: NCPIStudy): NCPICatalogStudy {
   const ncpiCatalogStudy: NCPICatalogStudy = {
     consentCode: sanitizeStringArray(ncpiStudy.consentCodes),
+    consentLongName: sanitizeStringArray(ncpiStudy.consentLongNames),
     dataType: sanitizeStringArray(ncpiStudy.dataTypes),
     dbGapId: ncpiStudy.dbGapId,
     focus: sanitizeString(ncpiStudy.focus),
@@ -25,6 +26,7 @@ export function NCPIPlatformInputMapper(
 ): NCPICatalogPlatform {
   const ncpiCatalogPlatform: NCPICatalogPlatform = {
     consentCode: sanitizeStringArray(ncpiPlatform.consentCode),
+    consentLongName: sanitizeStringArray(ncpiPlatform.consentLongName),
     dataType: sanitizeStringArray(ncpiPlatform.dataType),
     dbGapId: sanitizeStringArray(ncpiPlatform.dbGapId),
     focus: sanitizeStringArray(ncpiPlatform.focus),

explorer/app/components/Detail/components/ConsentTooltip/consentTooltip.tsx

@@ -0,0 +1,18 @@
+import { Tooltip } from "@mui/material";
+
+interface ConsentTooltipProps {
+  consentCode: string;
+  consentLongName: string;
+}
+
+export const ConsentTooltip = ({
+  consentCode,
+  consentLongName,
+}: ConsentTooltipProps): JSX.Element => {
+  if (/^unspecified$|^error/i.test(consentLongName)) consentLongName = "";
+  return (
+    <Tooltip arrow={true} placement="top" title={consentLongName}>
+      <span>{consentCode}</span>
+    </Tooltip>
+  );
+};

explorer/app/components/Index/components/ConsentCodesCell/consentCodesCell.tsx

@@ -0,0 +1,22 @@
+import { ConsentTooltip, NTagCell } from "app/components";
+
+interface ConsentCodesCellProps {
+  consentCode: string[];
+  consentLongName: string[];
+  label: string;
+}
+
+export const ConsentCodesCell = ({
+  consentCode,
+  consentLongName,
+  label,
+}: ConsentCodesCellProps): JSX.Element => {
+  return consentCode.length === 1 ? (
+    <ConsentTooltip
+      consentCode={consentCode[0]}
+      consentLongName={consentLongName[0]}
+    />
+  ) : (
+    <NTagCell label={label} values={consentCode} />
+  );
+};

explorer/app/components/index.tsx

@@ -41,9 +41,11 @@ export { Publications } from "@clevercanary/data-explorer-ui/lib/components/Proj
 export { SupplementaryLinks } from "@clevercanary/data-explorer-ui/lib/components/Project/components/SupplementaryLinks/supplementaryLinks";
 export { TitledText } from "@clevercanary/data-explorer-ui/lib/components/Project/components/TitledText/titledText";
 export { MdxMarkdown } from "./common/MDXMarkdown/mdxMarkdown";
+export { ConsentTooltip } from "./Detail/components/ConsentTooltip/consentTooltip";
 export { ConsortiumOverview } from "./Detail/components/Consortium/ConsortiumOverview/consortiumOverview";
 export { FileLocationArchivePreview } from "./Detail/components/GeneratedMatricesTables/components/FileLocationArchivePreview/fileLocationArchivePreview";
 export { FileLocationCopy } from "./Detail/components/GeneratedMatricesTables/components/FileLocationCopy/fileLocationCopy";
 export { FileLocationDownload } from "./Detail/components/GeneratedMatricesTables/components/FileLocationDownload/fileLocationDownload";
 export { FileNameCell } from "./Detail/components/GeneratedMatricesTables/components/FileNameCell/fileNameCell";
 export { GeneratedMatricesTables } from "./Detail/components/GeneratedMatricesTables/generatedMatricesTables";
+export { ConsentCodesCell } from "./Index/components/ConsentCodesCell/consentCodesCell";

explorer/app/viewModelBuilders/catalog/ncpi-catalog/common/viewModelBuilders.ts

@@ -23,10 +23,11 @@ import { getPluralizedMetadataLabel } from "../../../../components/Index/common/
  */
 export const buildConsentCodes = (
   ncpiCatalogEntry: NCPICatalogEntity
-): React.ComponentProps<typeof C.NTagCell> => {
+): React.ComponentProps<typeof C.ConsentCodesCell> => {
   return {
+    consentCode: ncpiCatalogEntry.consentCode,
+    consentLongName: ncpiCatalogEntry.consentLongName,
     label: getPluralizedMetadataLabel(METADATA_KEY.CONSENT_CODE),
-    values: ncpiCatalogEntry.consentCode,
   };
 };
 
@@ -239,10 +240,25 @@ export const buildStudyHero = (
 export const buildStudySummary = (
   ncpiCatalogStudy: NCPICatalogStudy
 ): React.ComponentProps<typeof C.Details> => {
-  const { consentCode, dataType, focus, participantCount, studyDesign } =
-    ncpiCatalogStudy;
+  const {
+    consentCode,
+    consentLongName,
+    dataType,
+    focus,
+    participantCount,
+    studyDesign,
+  } = ncpiCatalogStudy;
   const keyValuePairs = new Map<Key, Value>();
-  keyValuePairs.set("Consent Codes", stringifyValues(consentCode));
+  keyValuePairs.set(
+    "Consent Codes",
+    consentCode.map((code, i) => [
+      i ? ", " : "",
+      C.ConsentTooltip({
+        consentCode: code,
+        consentLongName: consentLongName[i],
+      }),
+    ])
+  );
   keyValuePairs.set("Focus / Diseases", focus);
   keyValuePairs.set("Study Design", stringifyValues(studyDesign));
   keyValuePairs.set("Data Types", stringifyValues(dataType));

explorer/files/ncpi-catalog/build-plaftorms.ts

@@ -50,6 +50,10 @@ function buildNCPICatalogPlatform(
     ncpiCatalogPlatform.consentCode,
     ncpiStudy.consentCodes
   );
+  const consentLongName = accumulateValues(
+    ncpiCatalogPlatform.consentLongName,
+    ncpiStudy.consentLongNames
+  );
   const dataType = accumulateValues(
     ncpiCatalogPlatform.dataType,
     ncpiStudy.dataTypes
@@ -74,6 +78,7 @@ function buildNCPICatalogPlatform(
   );
   return {
     consentCode,
+    consentLongName,
     dataType,
     dbGapId,
     focus,

explorer/files/ncpi-catalog/build-platform-studies.ts

@@ -3,6 +3,7 @@ import {
   NCPIStudy,
   PlatformStudy,
 } from "../../app/apis/catalog/ncpi-catalog/common/entities";
+import { generateConsentDescriptions } from "../common/consent-codes";
 import { getStudy } from "../common/dbGaP";
 
 /**
@@ -34,8 +35,17 @@ export async function buildNCPIPlatformStudies(
       continue;
     }
 
+    const consentLongNames = [];
+
+    for (const code of study.consentCodes) {
+      consentLongNames.push(
+        (await generateConsentDescriptions(code)).consentLongName
+      );
+    }
+
     const ncpiStudy = {
       ...study,
+      consentLongNames,
       platforms: [stub.platform],
     };
 

explorer/site-config/ncpi-catalog/dev/index/platformsEntityConfig.ts

@@ -86,9 +86,9 @@ export const platformsEntityConfig: EntityConfig<NCPICatalogPlatform> = {
       },
       {
         componentConfig: {
-          component: Components.NTagCell,
+          component: Components.ConsentCodesCell,
           viewBuilder: ViewBuilder.buildConsentCodes,
-        } as ComponentConfig<typeof Components.NTagCell>,
+        } as ComponentConfig<typeof Components.ConsentCodesCell>,
         header: NCPI_CATALOG_CATEGORY_LABEL.CONSENT_CODE,
         id: NCPI_CATALOG_CATEGORY_KEY.CONSENT_CODE,
         width: { max: "1.6fr", min: "160px" },

explorer/site-config/ncpi-catalog/dev/index/studiesEntityConfig.ts

@@ -96,9 +96,9 @@ export const studiesEntityConfig: EntityConfig<NCPICatalogStudy> = {
       },
       {
         componentConfig: {
-          component: Components.NTagCell,
+          component: Components.ConsentCodesCell,
           viewBuilder: ViewBuilder.buildConsentCodes,
-        } as ComponentConfig<typeof Components.NTagCell>,
+        } as ComponentConfig<typeof Components.ConsentCodesCell>,
         header: NCPI_CATALOG_CATEGORY_LABEL.CONSENT_CODE,
         id: NCPI_CATALOG_CATEGORY_KEY.CONSENT_CODE,
         width: { max: "1.6fr", min: "160px" },