@databiosphere/findable-ui 17.0.0 → 19.0.0

package/src/providers/exploreState/utils.ts

@@ -1,4 +1,3 @@
-import { ColumnSort } from "@tanstack/react-table";
 import {
   CategoryKey,
   CategoryValueKey,
@@ -109,20 +108,24 @@ export function getEntityStateSavedFilter(
 }
 
 /**
- * Returns entity state "saved filter" sorting for the given category value key.
+ * Retrieves a specified property from the "saved filter" for the given category value key.
+ * This function fetches a property (e.g., "sorting" or "grouping") from the saved filter
+ * associated with a given `selectedValue`.
  * @param state - Explore state.
  * @param selectedValue - Key of category value that has been de/selected.
  * @param selected - True if value is selected, false if de-selected.
- * @returns sorting.
+ * @param propertyName - The name of the property to retrieve from the saved filter. Should be one of the predefined keys: "sorting" or "grouping".
+ * @returns value of the specified property from the saved filter, or undefined if `selected` is false.
  */
-export function getEntityStateSavedSorting(
+export function getEntityStateSavedProperty<K extends "sorting" | "grouping">(
   state: ExploreState,
   selectedValue: CategoryValueKey,
-  selected: boolean
-): ColumnSort[] | undefined {
+  selected: boolean,
+  propertyName: K
+): EntityStateSavedFilter[K] | undefined {
   if (!selected) return;
   const savedFilter = getEntityStateSavedFilter(state, selectedValue);
-  return savedFilter?.sorting;
+  return savedFilter?.[propertyName];
 }
 
 /**

package/src/providers/exploreState.tsx

@@ -19,6 +19,8 @@ import {
 } from "../hooks/useCategoryFilter";
 import { useConfig } from "../hooks/useConfig";
 import { useURLFilterParams } from "../hooks/useURLFilterParams";
+import { updateGroupingAction } from "./exploreState/actions/updateGrouping/action";
+import { UpdateGroupingAction } from "./exploreState/actions/updateGrouping/types";
 import {
   EntityPageStateMapper,
   EntityStateByCategoryGroupConfigKey,
@@ -49,7 +51,7 @@ import {
   closeRowPreview,
   getEntityCategoryGroupConfigKey,
   getEntityState,
-  getEntityStateSavedSorting,
+  getEntityStateSavedProperty,
   getFilterCount,
   patchEntityListItems,
   resetPage,
@@ -226,6 +228,7 @@ export enum ExploreActionKind {
   UpdateEntityFilters = "UPDATE_ENTITY_FILTERS",
   UpdateEntityViewAccess = "UPDATE_ENTITY_VIEW_ACCESS",
   UpdateFilter = "UPDATE_FILTER",
+  UpdateGrouping = "UPDATE_GROUPING",
   UpdateRowPreview = "UPDATE_ROW_PREVIEW",
   UpdateRowSelection = "UPDATE_ROW_SELECTION",
   UpdateSorting = "UPDATE_SORTING",
@@ -247,6 +250,7 @@ export type ExploreAction =
   | UpdateEntityFiltersAction
   | UpdateEntityViewAccessAction
   | UpdateFilterAction
+  | UpdateGroupingAction
   | UpdateRowPreviewAction
   | UpdateRowSelectionAction
   | UpdateSortingAction;
@@ -403,11 +407,19 @@ function exploreReducer(
         payload.selectedValue,
         payload.selected
       );
-      const savedSorting = getEntityStateSavedSorting(
+      const savedGrouping = getEntityStateSavedProperty(
         state,
         payload.selectedValue,
-        payload.selected
+        payload.selected,
+        "grouping"
+      );
+      const savedSorting = getEntityStateSavedProperty(
+        state,
+        payload.selectedValue,
+        payload.selected,
+        "sorting"
       );
+      const grouping = savedGrouping || []; // Reset grouping to default if saved grouping is not available.
       const sorting = savedSorting || []; // Reset sorting to default if saved sorting is not available.
       updateEntityStateByCategoryGroupConfigKey(state, {
         filterState,
@@ -417,7 +429,7 @@ function exploreReducer(
         ...state,
         entityPageState: updateEntityPageStateWithCommonCategoryGroupConfigKey(
           state,
-          { rowPreview, rowSelection, sorting }
+          { grouping, rowPreview, rowSelection, sorting }
         ),
         filterCount: getFilterCount(filterState),
         filterState,
@@ -592,7 +604,12 @@ function exploreReducer(
      * - closes row preview, without updating the entity page state row preview.
      */
     case ExploreActionKind.UpdateEntityFilters: {
-      const { entityListType, filters: filterState, sorting } = payload;
+      const {
+        entityListType,
+        filters: filterState,
+        grouping = [],
+        sorting = [],
+      } = payload;
       const categoryGroupConfigKey = getEntityCategoryGroupConfigKey(
         entityListType,
         state.entityPageState
@@ -614,7 +631,7 @@ function exploreReducer(
         ...state,
         entityPageState: updateEntityPageStateWithCommonCategoryGroupConfigKey(
           state,
-          { rowPreview, rowSelection, sorting },
+          { grouping, rowPreview, rowSelection, sorting },
           categoryGroupConfigKey
         ),
         rowPreview: closeRowPreview(state.rowPreview),
@@ -658,6 +675,12 @@ function exploreReducer(
         rowPreview,
       };
     }
+    /**
+     * Update grouping
+     **/
+    case ExploreActionKind.UpdateGrouping: {
+      return updateGroupingAction(state, payload);
+    }
     /**
      * Update row preview
      */

package/src/providers/fileManifestState.tsx

@@ -262,7 +262,7 @@ function fileManifestReducer(
       const filters = buildNextFilterState(
         state.filters,
         payload.categoryKey,
-        getFilterParameterValue(payload.selectedValue) as unknown as string, // TODO CategoryValueKey may be boolean or null.
+        getFilterParameterValue(payload.selectedValue),
         payload.selected
       );
       // Get file summary filters.
@@ -322,9 +322,7 @@ function buildNextFileSummaryFilterState(
  * @returns all terms for the given category.
  */
 function getFileFacetTerms(fileFacet: FileFacet): SelectedFilterValue {
-  return fileFacet.terms.map(
-    (term) => getFilterParameterValue(term.name) as unknown as string // TODO CategoryValueKey may be boolean or null.
-  );
+  return fileFacet.terms.map((term) => getFilterParameterValue(term.name));
 }
 
 /**

package/src/viewModelBuilders/common/utils.ts

@@ -19,27 +19,27 @@ export function mapCategoryKeyLabel(
 }
 
 /**
- * Sanitizes a string for display i.e. any empty, null or undefined value is sanitized to "Unspecified".
- * @param str - String to sanitize.
+ * Sanitizes a value to a string for display i.e. any empty, null or undefined value is sanitized to "Unspecified".
+ * @param value - Value to sanitize.
  * @returns the string or sanitized string value.
  */
-export function sanitizeString(str: string): string {
-  if (str === "" || str === null || str === undefined) {
+export function sanitizeString(value: unknown): string {
+  if (value === "" || value === null || value === undefined) {
     return "Unspecified";
   } else {
-    return str;
+    return String(value);
   }
 }
 
 /**
- * Sanitizes a string array for display i.e. any string element within the string array that is an empty, null or
+ * Sanitizes array elements to strings for display i.e. any element within the string array that is an empty, null or
  * undefined value is sanitized to "Unspecified".
- * @param strArray - String array to sanitize.
+ * @param array - Array to sanitize.
  * @returns the string array, sanitized.
  */
-export function sanitizeStringArray(strArray: string[]): string[] {
-  if (!strArray || strArray.length === 0) {
+export function sanitizeStringArray(array: unknown[]): string[] {
+  if (!array || array.length === 0) {
     return ["Unspecified"];
   }
-  return strArray.map(sanitizeString);
+  return array.map(sanitizeString);
 }

package/src/views/ExploreView/exploreView.tsx

@@ -114,7 +114,7 @@ export const ExploreView = (props: ExploreViewProps): JSX.Element => {
     if (selected) {
       track(EVENT_NAME.FILTER_SELECTED, {
         [EVENT_PARAM.FILTER_NAME]: categoryKey,
-        [EVENT_PARAM.FILTER_VALUE]: selectedCategoryValue,
+        [EVENT_PARAM.FILTER_VALUE]: String(selectedCategoryValue),
       });
     }
   };
@@ -248,7 +248,7 @@ function renderList(
 ): JSX.Element {
   const { listItems, loading, tabValue } = exploreState;
   const { getId: getRowId, list, listView } = entityConfig;
-  const { columns: columnsConfig, defaultSort, tableOptions } = list;
+  const { columns: columnsConfig } = list;
 
   if (!exploreState || !tabValue) {
     return <></>; //TODO: return the loading UI component
@@ -263,12 +263,10 @@ function renderList(
   return (
     <TableCreator
       columns={columnsConfig}
-      defaultSort={defaultSort}
       getRowId={getRowId}
       items={listItems ?? []}
       listView={listView}
       loading={loading}
-      tableOptions={tableOptions}
     />
   );
 }

package/types/data-explorer-ui.d.ts

@@ -269,7 +269,6 @@ declare module "@tanstack/react-table" {
   interface ColumnMeta<TData extends RowData, TValue> {
     align?: TableCellProps["align"];
     columnPinned?: boolean;
-    enableSortingInteraction?: boolean; // Flag to enable sorting interaction UI (e.g. sort icon) button; defaults to true.
     header?: string;
     width?: GridTrackSize;
   }
@@ -277,6 +276,14 @@ declare module "@tanstack/react-table" {
   interface InitialTableState extends CustomFeatureInitialTableState {}
   // eslint-disable-next-line @typescript-eslint/no-empty-interface, @typescript-eslint/no-unused-vars -- empty interface is needed for extending, TData is an unused variable.
   interface Row<TData extends RowData> extends CustomFeatureRow {}
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- TData is an unused variables.
+  interface SortingOptions<TData extends RowData> {
+    /**
+     * When false, sorting can still be applied programmatically (e.g., `getSortedRowModel`),
+     * but user interactions or showing sort icons are disabled.
+     */
+    enableSortingInteraction?: boolean;
+  }
   // eslint-disable-next-line @typescript-eslint/no-empty-interface -- empty interface is needed for extending.
   interface Table<TData extends RowData> extends CustomFeatureInstance<TData> {}
   // eslint-disable-next-line @typescript-eslint/no-empty-interface, @typescript-eslint/no-unused-vars -- empty interface is needed for extending, TData is an unused variable.

package/lib/components/TableCreator/common/entities.d.ts

@@ -1,5 +0,0 @@
-import { ColumnMeta } from "@tanstack/react-table";
-import { ColumnConfig } from "../../../config/entities";
-export interface BaseColumnConfig<T, TValue> extends ColumnConfig<T> {
-    meta?: ColumnMeta<T, TValue>;
-}

package/src/components/TableCreator/common/entities.ts

@@ -1,6 +0,0 @@
-import { ColumnMeta } from "@tanstack/react-table";
-import { ColumnConfig } from "../../../config/entities";
-
-export interface BaseColumnConfig<T, TValue> extends ColumnConfig<T> {
-  meta?: ColumnMeta<T, TValue>;
-}