feat: add request file manifest to anvil explorer dataset page (#4093) (

#4094)

* feat: add request file manifest to anvil explorer dataset page (#4093)

* feat: added alert to download manifest (#4093)

---------

Co-authored-by: Fran McDade <franmcdade@Frans-MacBook-Pro.local>

explorer/app/components/Export/components/AnVILExplorer/components/ManifestDownload/components/ManifestDownloadEntity/manifestDownloadEntity.tsx

@@ -0,0 +1,19 @@
+import { MANIFEST_DOWNLOAD_FORMAT } from "@databiosphere/findable-ui/lib/apis/azul/common/entities";
+import { FileManifestDownload } from "@databiosphere/findable-ui/lib/components/Export/components/ManifestDownload/components/ManifestDownloadEntity/components/FileManifestDownload/fileManifestDownload";
+import { ManifestDownloadEntityProps } from "@databiosphere/findable-ui/lib/components/Export/components/ManifestDownload/components/ManifestDownloadEntity/manifestDownloadEntity";
+import { useRequestFileManifest } from "@databiosphere/findable-ui/lib/hooks/useFileManifest/useRequestFileManifest";
+import React from "react";
+
+export const ManifestDownloadEntity = ({
+  filters,
+}: Omit<
+  ManifestDownloadEntityProps,
+  "fileManifestType" | "metadataFilters"
+>): JSX.Element => {
+  useRequestFileManifest(MANIFEST_DOWNLOAD_FORMAT.COMPACT, filters, undefined);
+  return (
+    <>
+      <FileManifestDownload filters={filters} />
+    </>
+  );
+};

explorer/app/components/index.tsx

@@ -89,6 +89,7 @@ export { FileLocationCopy } from "./Detail/components/GeneratedMatricesTables/co
 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 { ManifestDownloadEntity as AnVILManifestDownloadEntity } from "./Export/components/AnVILExplorer/components/ManifestDownload/components/ManifestDownloadEntity/manifestDownloadEntity";
 export { ConsentCodesCell } from "./Index/components/ConsentCodesCell/consentCodesCell";
 export { CopyCell } from "./Index/components/CopyCell/copyCell";
 export { ANVILBranding } from "./Layout/components/Footer/components/Branding/components/ANVILBranding/anvilBranding";

explorer/app/viewModelBuilders/azul/anvil-cmg/common/viewModelBuilders.ts

@@ -751,6 +751,42 @@ export const buildManifestDownload = (
   };
 };
 
+/*
+ * Build props for ManifestDownloadEntity component.
+ * @param datasetsResponse - Response model return from datasets API.
+ * @returns model to be used as props for the ManifestDownloadEntity component.
+ */
+export const buildManifestDownloadEntity = (
+  datasetsResponse: DatasetsResponse
+): React.ComponentProps<typeof C.AnVILManifestDownloadEntity> => {
+  return {
+    filters: getExportEntityFilters(datasetsResponse),
+  };
+};
+
+/**
+ * Build props for entity related download manifest warning FluidAlert component.
+ * @param _ - Unused.
+ * @param viewContext - View context.
+ * @returns model to be used as props for the FluidAlert component.
+ */
+export const buildManifestDownloadEntityWarning = (
+  _: DatasetsResponse,
+  viewContext: ViewContext
+): React.ComponentProps<typeof C.FluidAlert> => {
+  const {
+    authState: { isAuthenticated },
+  } = viewContext;
+  const title = isAuthenticated
+    ? "To download this dataset manifest, please request access."
+    : "To download this dataset manifest, please sign in and, if necessary, request access.";
+  return {
+    severity: "warning",
+    title,
+    variant: "banner",
+  };
+};
+
 /**
  * Build props for organism type cell component from the given donors response.
  * @param response - Response model return from index/donors API endpoint.

explorer/site-config/anvil-cmg/dev/detail/dataset/exportMainColumn.ts

@@ -1,8 +1,8 @@
 import { ComponentConfig } from "@databiosphere/findable-ui/lib/config/entities";
 import { DatasetsResponse } from "../../../../../app/apis/azul/anvil-cmg/common/responses";
 import * as C from "../../../../../app/components";
-import * as MDX from "../../../../../app/components/common/MDXContent/anvil-cmg";
 import * as V from "../../../../../app/viewModelBuilders/azul/anvil-cmg/common/viewModelBuilders";
+import { sideColumn } from "../../export/exportSideColumn";
 
 export const mainColumn: ComponentConfig[] = [
   {
@@ -35,37 +35,7 @@ export const mainColumn: ComponentConfig[] = [
         component: C.BackPageContentMainColumn,
       } as ComponentConfig<typeof C.BackPageContentMainColumn>,
       /* sideColumn */
-      {
-        children: [
-          {
-            children: [
-              {
-                component: C.ExportCurrentQuery,
-                viewBuilder: V.buildExportCurrentQuery,
-              } as ComponentConfig<typeof C.ExportCurrentQuery>,
-              {
-                component: C.ExportSelectedDataSummary,
-                viewBuilder: V.buildExportSelectedDataSummary,
-              } as ComponentConfig<typeof C.ExportSelectedDataSummary>,
-            ],
-            component: C.ExportSummary,
-          } as ComponentConfig<typeof C.ExportSummary>,
-          {
-            children: [
-              {
-                children: [
-                  {
-                    component: MDX.DataReleasePolicy,
-                  } as ComponentConfig<typeof MDX.DataReleasePolicy>,
-                ],
-                component: MDX.Section,
-              } as ComponentConfig<typeof MDX.Section>,
-            ],
-            component: C.FluidPaper,
-          } as ComponentConfig<typeof C.FluidPaper>,
-        ],
-        component: C.BackPageContentSideColumn,
-      } as ComponentConfig<typeof C.BackPageContentSideColumn>,
+      ...sideColumn,
     ],
     component: C.ConditionalComponent,
     viewBuilder: V.renderExportEntity,

explorer/site-config/anvil-cmg/dev/detail/dataset/metadataMainColumn.ts

@@ -0,0 +1,46 @@
+import { ComponentConfig } from "@databiosphere/findable-ui/lib/config/entities";
+import { DatasetsResponse } from "../../../../../app/apis/azul/anvil-cmg/common/responses";
+import * as C from "../../../../../app/components";
+import * as V from "../../../../../app/viewModelBuilders/azul/anvil-cmg/common/viewModelBuilders";
+import { sideColumn } from "../../export/exportSideColumn";
+
+export const mainColumn: ComponentConfig[] = [
+  {
+    /* Dataset is not accessible; render warning */
+    children: [
+      {
+        children: [
+          {
+            component: C.FluidAlert,
+            viewBuilder: V.buildManifestDownloadEntityWarning,
+          } as ComponentConfig<typeof C.FluidAlert, DatasetsResponse>,
+        ],
+        component: C.BackPageContentSingleColumn,
+      } as ComponentConfig<typeof C.BackPageContentSingleColumn>,
+    ],
+    component: C.ConditionalComponent,
+    viewBuilder: V.renderExportEntityWarning,
+  } as ComponentConfig<typeof C.ConditionalComponent, DatasetsResponse>,
+  {
+    /* Dataset is accessible; render export entity */
+    children: [
+      /* mainColumn */
+      {
+        children: [
+          {
+            component: C.AnVILManifestDownloadEntity,
+            viewBuilder: V.buildManifestDownloadEntity,
+          } as ComponentConfig<
+            typeof C.AnVILManifestDownloadEntity,
+            DatasetsResponse
+          >,
+        ],
+        component: C.BackPageContentMainColumn,
+      } as ComponentConfig<typeof C.BackPageContentMainColumn>,
+      /* sideColumn */
+      ...sideColumn,
+    ],
+    component: C.ConditionalComponent,
+    viewBuilder: V.renderExportEntity,
+  } as ComponentConfig<typeof C.ConditionalComponent, DatasetsResponse>,
+];

explorer/site-config/anvil-cmg/dev/index/datasetsEntityConfig.ts

@@ -15,6 +15,7 @@ import {
   ANVIL_CMG_CATEGORY_LABEL,
 } from "../../category";
 import { mainColumn as exportMainColumn } from "../detail/dataset/exportMainColumn";
+import { mainColumn as metadataMainColumn } from "../detail/dataset/metadataMainColumn";
 import { mainColumn } from "../detail/dataset/overviewMainColumn";
 import { sideColumn } from "../detail/dataset/overviewSideColumn";
 import { top } from "../detail/dataset/top";
@@ -36,6 +37,11 @@ export const datasetsEntityConfig: EntityConfig<DatasetsResponse> = {
         route: "",
         sideColumn: sideColumn,
       },
+      {
+        label: "Metadata",
+        mainColumn: metadataMainColumn,
+        route: "project-metadata",
+      },
       {
         label: "Export",
         mainColumn: exportMainColumn,