chore: update findable-ui to latest v19.0.0 (#4319) (#4320)

Author: frano-m

app/viewModelBuilders/catalog/anvil-catalog/common/viewModelBuilders.ts

@@ -99,6 +99,10 @@ export const buildConsortiumDetailViewStudiesTable = (
     gridTemplateColumns: "auto 1fr 1fr 1fr 1fr 1fr 1fr auto",
     items: studies,
     noResultsTitle: "No Studies",
+    tableOptions: {
+      getRowId: (originalRow) =>
+        (originalRow as AnVILCatalogConsortiumStudy).studyName,
+    },
   };
 };
 
@@ -117,6 +121,10 @@ export const buildConsortiumDetailViewWorkspacesTable = (
     gridTemplateColumns: "auto 1fr 1fr 1fr 1fr 1fr auto",
     items: workspaces,
     noResultsTitle: "No Workspaces",
+    tableOptions: {
+      getRowId: (originalRow) =>
+        (originalRow as AnVILCatalogWorkspace).workspaceName,
+    },
   };
 };
 
@@ -315,6 +323,10 @@ export const buildStudyDetailViewWorkspacesTable = (
     gridTemplateColumns: "auto 1fr 1fr 1fr 1fr 1fr auto",
     items: workspaces,
     noResultsTitle: "No Workspaces",
+    tableOptions: {
+      getRowId: (originalRow) =>
+        (originalRow as AnVILCatalogWorkspace).workspaceName,
+    },
   };
 };
 
@@ -658,7 +670,7 @@ function getStudyAPIKeyValue(dbGapId: string): ReactElement {
 /**
  * Returns the KeyValuePair value for the specified AnVIL entity.
  * @param studyAccession - Study identifier with version.
- * @returns the KeyValuePair value for study dbGap Id as a ReactElement.
+ * @returns the KeyValuePair value for study dbGapId as a ReactElement.
  */
 function getStudyDbGapIdKeyValue(studyAccession: string): ReactElement {
   return C.Link({

package-lock.json

@@ -35,7 +35,7 @@
     "check-system-status:anvil-cmg": "esrun e2e/anvil/anvil-check-system-status.ts"
   },
   "dependencies": {
-    "@databiosphere/findable-ui": "17.0.0",
+    "@databiosphere/findable-ui": "19.0.0",
     "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",
     "@mdx-js/loader": "^3.0.1",

package.json

@@ -70,7 +70,7 @@ export const datasetsEntityConfig: EntityConfig<DatasetsResponse> = {
           component: C.StatusBadge,
           viewBuilder: V.buildDatasetAccess,
         } as ComponentConfig<typeof C.StatusBadge>,
-        disableSorting: true,
+        enableSorting: false,
         header: ANVIL_CMG_CATEGORY_LABEL.DATASET_ACCESSIBLE,
         id: ANVIL_CMG_CATEGORY_KEY.DATASET_ACCESSIBLE,
         width: "max-content",

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

@@ -16,13 +16,13 @@ import {
 import { listHero } from "../listView/listHero";
 import { subTitleHero } from "../listView/subTitleHero";
 
-export const downloadColumn: ColumnConfig = {
+export const downloadColumn: ColumnConfig<FilesResponse> = {
   componentConfig: {
     component: C.AzulFileDownload,
     viewBuilder: V.buildFileDownload,
   } as ComponentConfig<typeof C.AzulFileDownload>,
   disableHiding: true,
-  disableSorting: true,
+  enableSorting: false,
   header: ANVIL_CMG_CATEGORY_LABEL.AZUL_FILE_DOWNLOAD,
   id: ANVIL_CMG_CATEGORY_KEY.AZUL_FILE_DOWNLOAD,
   width: { max: "auto", min: "76px" },
@@ -77,7 +77,7 @@ export const filesEntityConfig: EntityConfig<FilesResponse> = {
           component: C.CopyCell,
           viewBuilder: V.buildDRSURI,
         } as ComponentConfig<typeof C.CopyCell>,
-        disableSorting: true,
+        enableSorting: false,
         header: ANVIL_CMG_CATEGORY_LABEL.DRS_URI,
         id: ANVIL_CMG_CATEGORY_KEY.DRS_URI,
         width: { max: "1fr", min: "120px" },

site-config/anvil-cmg/dev/index/filesEntityConfig.ts

@@ -0,0 +1,31 @@
+import {
+  ColumnConfig,
+  ComponentConfig,
+} from "@databiosphere/findable-ui/lib/config/entities";
+import { FilesResponse } from "../../../../../app/apis/azul/anvil-cmg/common/responses";
+import { ProjectsResponse } from "../../../../../app/apis/azul/hca-dcp/common/responses";
+import { PickSome } from "../../../../../app/common/types";
+import * as C from "../../../../../app/components";
+import * as V from "../../../../../app/viewModelBuilders/azul/hca-dcp/common/viewModelBuilders";
+import {
+  HCA_DCP_CATEGORY_KEY,
+  HCA_DCP_CATEGORY_LABEL,
+} from "../../../category";
+
+export const COLUMN: PickSome<
+  Record<
+    keyof typeof HCA_DCP_CATEGORY_KEY,
+    ColumnConfig<FilesResponse | ProjectsResponse>
+  >,
+  "DATA_USE_RESTRICTION"
+> = {
+  DATA_USE_RESTRICTION: {
+    componentConfig: {
+      component: C.BasicCell,
+      viewBuilder: V.buildDataUseRestriction,
+    } as ComponentConfig<typeof C.BasicCell, FilesResponse | ProjectsResponse>,
+    header: HCA_DCP_CATEGORY_LABEL.DATA_USE_RESTRICTION,
+    id: HCA_DCP_CATEGORY_KEY.DATA_USE_RESTRICTION,
+    width: { max: "1fr", min: "124px" },
+  },
+};

site-config/hca-dcp/cc-ma-dev/index/common/column.ts

@@ -4,7 +4,7 @@ import {
 } from "@databiosphere/findable-ui/lib/config/entities";
 import * as C from "../../../../app/components";
 import * as V from "../../../../app/viewModelBuilders/azul/hca-dcp/common/viewModelBuilders";
-import { COLUMN } from "./common/constants";
+import { COLUMN } from "./common/column";
 
 /**
  * Returns the entity config for managed access files.

site-config/hca-dcp/cc-ma-dev/index/filesEntityConfig.ts

@@ -12,26 +12,17 @@ import {
 } from "../../../category";
 
 export const COLUMN: PickSome<
-  Record<keyof typeof HCA_DCP_CATEGORY_KEY, ColumnConfig>,
-  "ACCESSIBLE" | "DATA_USE_RESTRICTION"
+  Record<keyof typeof HCA_DCP_CATEGORY_KEY, ColumnConfig<ProjectsResponse>>,
+  "ACCESSIBLE"
 > = {
   ACCESSIBLE: {
     componentConfig: {
       component: C.StatusBadge,
       viewBuilder: V.buildProjectAccess,
     } as ComponentConfig<typeof C.StatusBadge, ProjectsResponse>,
-    disableSorting: true,
+    enableSorting: false,
     header: HCA_DCP_CATEGORY_LABEL.ACCESSIBLE,
     id: HCA_DCP_CATEGORY_KEY.ACCESSIBLE,
     width: "auto",
   },
-  DATA_USE_RESTRICTION: {
-    componentConfig: {
-      component: C.BasicCell,
-      viewBuilder: V.buildDataUseRestriction,
-    } as ComponentConfig<typeof C.BasicCell, ProjectsResponse>,
-    header: HCA_DCP_CATEGORY_LABEL.DATA_USE_RESTRICTION,
-    id: HCA_DCP_CATEGORY_KEY.DATA_USE_RESTRICTION,
-    width: { max: "1fr", min: "124px" },
-  },
 };

site-config/hca-dcp/cc-ma-dev/index/common/constants.ts renamed to site-config/hca-dcp/cc-ma-dev/index/projects/column.ts

@@ -6,8 +6,9 @@ import { getMAProjectDetailTabs } from "../detail/project/mainColumn";
 import { getMAProjectDetailTop } from "../detail/project/top";
 import { listHero } from "../listView/projectsListHero";
 import { CATEGORY_GROUPS } from "./common/category";
-import { COLUMN } from "./common/constants";
+import { COLUMN } from "./common/column";
 import { getMAFilesEntityConfig } from "./filesEntityConfig";
+import { COLUMN as PROJECTS_COLUMN } from "./projects/column";
 
 /**
  * Returns managed access category group config.
@@ -59,7 +60,7 @@ export function getMAProjectsEntityConfig(
   // Clone columns.
   const cloneColumns = [...cloneList.columns];
   // Add accessible column.
-  cloneColumns.splice(1, 0, COLUMN.ACCESSIBLE); // Accessible column.
+  cloneColumns.splice(1, 0, PROJECTS_COLUMN.ACCESSIBLE); // Accessible column.
   // Add data use restriction column.
   cloneColumns.splice(2, 0, COLUMN.DATA_USE_RESTRICTION); // Data use restriction column.
   cloneList.columns = cloneColumns;

site-config/hca-dcp/cc-ma-dev/index/projectsEntityConfig.ts

@@ -32,7 +32,7 @@ export const filesEntityConfig: EntityConfig<FilesResponse> = {
           viewBuilder: V.buildFileDownload,
         } as ComponentConfig<typeof C.AzulFileDownload, FilesResponse>,
         disableHiding: true,
-        disableSorting: true,
+        enableSorting: false,
         header: HCA_DCP_CATEGORY_LABEL.AZUL_FILE_DOWNLOAD,
         id: HCA_DCP_CATEGORY_KEY.AZUL_FILE_DOWNLOAD,
         width: { max: "auto", min: "76px" },