@databiosphere/findable-ui 35.1.0 → 36.0.0

package/src/hooks/useFileManifest/useFileManifestDownload.ts

@@ -1,4 +1,3 @@
-import { useEffect } from "react";
 import { MANIFEST_DOWNLOAD_FORMAT } from "../../apis/azul/common/entities";
 import { Filters } from "../../common/entities";
 import { BULK_DOWNLOAD_EXECUTION_ENVIRONMENT } from "../../components/Export/common/entities";
@@ -15,18 +14,15 @@ export interface ManifestDownload {
   isIdle: boolean;
   isLoading: boolean;
   manifestURL?: string;
+  requestManifest: () => void;
 }
 
 /**
  * Returns file manifest download url and file name.
  * @param filters - Filters.
- * @param disabled - Disabled.
  * @returns file manifest download url and file name.
  */
-export const useFileManifestDownload = (
-  filters: Filters,
-  disabled: boolean
-): ManifestDownload => {
+export const useFileManifestDownload = (filters: Filters): ManifestDownload => {
   // Retrieve the endpoint URL from configured data source.
   const config = useConfig();
   const endpointUrl = config.config.dataSource.url;
@@ -39,24 +35,21 @@ export const useFileManifestDownload = (
     filters,
     MANIFEST_DOWNLOAD_FORMAT.COMPACT
   );
-  const { data, isIdle, isLoading, run } = useRequestFileLocation(
-    requestUrl,
-    requestMethod
-  );
+  const {
+    data,
+    isIdle,
+    isLoading,
+    run: requestManifest,
+  } = useRequestFileLocation(requestUrl, requestMethod);
   const manifestURL = getManifestDownloadURL(data);
   const fileName = getManifestDownloadFileName(data);
 
-  // Requests file manifest.
-  useEffect(() => {
-    if (disabled) return;
-    run();
-  }, [disabled, requestUrl, run]);
-
   return {
     fileName,
     isIdle,
     isLoading,
     manifestURL,
+    requestManifest,
   };
 };
 

package/src/hooks/useFileManifest/useFileManifestSpreadsheet.ts

@@ -1,4 +1,4 @@
-import { useEffect, useMemo } from "react";
+import { useCallback, useEffect, useMemo } from "react";
 import {
   APIEndpoints,
   AzulEntitiesResponse,
@@ -9,24 +9,25 @@ import { fetchQueryParams } from "../../utils/fetchQueryParams";
 import { useAsync } from "../useAsync";
 import { useCatalog } from "../useCatalog";
 import { useFetchRequestURL } from "../useFetchRequestURL";
+import { useRequestFileLocation } from "../useRequestFileLocation";
 
 export interface ManifestSpreadsheet {
-  exists?: boolean;
-  fileFormat?: string;
   fileName?: string;
   fileUrl?: string;
+  isIdle?: boolean;
+  isLoading?: boolean;
+  requestManifest?: () => void;
+  spreadsheetUrl?: string;
 }
 
 /**
  * Returns file manifest spreadsheet.
  * @param filters - Filters.
- * @param disabled - Disabled.
  * @returns file manifest spreadsheet.
  */
 export const useFileManifestSpreadsheet = (
-  filters: Filters,
-  disabled: boolean
-): ManifestSpreadsheet | undefined => {
+  filters: Filters
+): Omit<ManifestSpreadsheet, "fileUrl"> => {
   // Determine catalog.
   const catalog = useCatalog() as string; // catalog should be defined.
   // Build request params.
@@ -34,20 +35,39 @@ export const useFileManifestSpreadsheet = (
   // Build request URL.
   const requestURL = useFetchRequestURL(APIEndpoints.FILES, requestParams);
   // Fetch files to determine if file exists.
-  const { data, run } = useAsync<AzulEntitiesResponse>();
+  const {
+    data: files,
+    isIdle,
+    isLoading: isFilesLoading,
+    run: requestFiles,
+  } = useAsync<AzulEntitiesResponse>();
+
   // Grab manifest spreadsheet.
-  const manifestSpreadsheet = useMemo(
-    () => getManifestSpreadsheet(data?.hits),
-    [data]
+  const { fileName, fileUrl } = useMemo(
+    () => getManifestSpreadsheet(files?.hits),
+    [files]
   );
 
+  // Fetch file manifest.
+  const { data, isLoading, run } = useRequestFileLocation(fileUrl);
+
   // Fetch response from files endpoint.
+  const requestManifest = useCallback(() => {
+    requestFiles(fetchEntitiesFromURL(requestURL, undefined));
+  }, [requestFiles, requestURL]);
+
+  // Fetch file manifest.
   useEffect(() => {
-    if (disabled) return;
-    run(fetchEntitiesFromURL(requestURL, undefined));
-  }, [disabled, requestURL, run]);
+    run();
+  }, [fileUrl, run]);
 
-  return manifestSpreadsheet;
+  return {
+    fileName,
+    isIdle,
+    isLoading: isFilesLoading || isLoading,
+    requestManifest,
+    spreadsheetUrl: data?.location,
+  };
 };
 
 /**
@@ -74,21 +94,16 @@ function buildFetchFileUrl(fileUrl?: string): string | undefined {
  */
 function getManifestSpreadsheet(
   files?: AzulEntitiesResponse["hits"]
-): ManifestSpreadsheet | undefined {
-  if (!files) {
-    return;
-  }
+): Pick<ManifestSpreadsheet, "fileName" | "fileUrl"> {
+  if (!files) return { fileName: undefined, fileUrl: undefined };
+
   // Handle case where file does not exist.
-  if (files.length === 0) {
-    return {
-      exists: false,
-    };
-  }
+  if (files.length === 0) return { fileName: undefined, fileUrl: undefined };
+
   // Project manifest spreadsheet exists.
   const file = files[0];
+
   return {
-    exists: true,
-    fileFormat: file.files[0]?.format,
     fileName: file.files[0]?.name,
     fileUrl: buildFetchFileUrl(file.files[0]?.url),
   };

package/src/providers/dataDictionary/context.ts

@@ -0,0 +1,6 @@
+import { createContext } from "react";
+import { DataDictionaryContextProps } from "./types";
+
+export const DataDictionaryContext = createContext<DataDictionaryContextProps>({
+  dictionary: "",
+});

package/src/providers/dataDictionary/hook.ts

@@ -0,0 +1,11 @@
+import { useContext } from "react";
+import { DataDictionaryContext } from "./context";
+import { DataDictionaryContextProps } from "./types";
+
+/**
+ * Returns data dictionary context.
+ * @returns data dictionary context.
+ */
+export const useDataDictionary = (): DataDictionaryContextProps => {
+  return useContext(DataDictionaryContext);
+};

package/src/providers/dataDictionary/types.ts

@@ -0,0 +1,6 @@
+export interface DataDictionaryContextProps {
+  // Dictionary key; used to identify the dictionary currently rendered.
+  // Propagates the dictionary key to child components via context without
+  // having to pass it explicitly with props.
+  dictionary: string;
+}

package/src/providers/dataDictionaryState/actions/clearMeta/action.ts

@@ -0,0 +1,18 @@
+import { DataDictionaryState } from "../../types";
+import { ClearMetaPayload } from "./types";
+
+/**
+ * Reducer function to handle the "clear meta" action.
+ * @param state - Data Dictionary State.
+ * @param payload - Payload.
+ * @returns data dictionary state.
+ */
+export function clearMetaAction(
+  state: DataDictionaryState,
+  payload: ClearMetaPayload
+): DataDictionaryState {
+  return {
+    ...state,
+    meta: payload,
+  };
+}

package/src/providers/dataDictionaryState/actions/clearMeta/dispatch.ts

@@ -0,0 +1,13 @@
+import { DataDictionaryActionKind } from "../types";
+import { ClearMetaAction } from "./types";
+
+/**
+ * Action creator for clearing meta in the state.
+ * @returns Action with payload and action type.
+ */
+export function clearMeta(): ClearMetaAction {
+  return {
+    payload: null,
+    type: DataDictionaryActionKind.ClearMeta,
+  };
+}

package/src/providers/dataDictionaryState/actions/clearMeta/types.ts

@@ -0,0 +1,8 @@
+import { DataDictionaryActionKind } from "../types";
+
+export type ClearMetaAction = {
+  payload: ClearMetaPayload;
+  type: DataDictionaryActionKind.ClearMeta;
+};
+
+export type ClearMetaPayload = null;

package/src/providers/dataDictionaryState/actions/stateToUrl/action.ts

@@ -0,0 +1,20 @@
+import { META_COMMAND } from "../../../../hooks/stateSyncManager/hooks/UseMetaCommands/types";
+import { DataDictionaryState } from "../../types";
+import { ROUTER_METHOD, StateToUrlPayload } from "./types";
+
+/**
+ * Reducer function to handle the "state >> URL sync" action.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns state.
+ */
+export function stateToUrlAction(
+  state: DataDictionaryState,
+  payload: StateToUrlPayload
+): DataDictionaryState {
+  const command =
+    payload.method === ROUTER_METHOD.PUSH
+      ? META_COMMAND.STATE_TO_URL_PUSH
+      : META_COMMAND.STATE_TO_URL_REPLACE;
+  return { ...state, meta: { command } };
+}

package/src/providers/dataDictionaryState/actions/stateToUrl/dispatch.ts

@@ -0,0 +1,14 @@
+import { DataDictionaryActionKind } from "../types";
+import { StateToUrlAction, StateToUrlPayload } from "./types";
+
+/**
+ * Action creator for state >> URL sync.
+ * @param payload - Payload.
+ * @returns Action with payload and action type.
+ */
+export function stateToUrl(payload: StateToUrlPayload): StateToUrlAction {
+  return {
+    payload,
+    type: DataDictionaryActionKind.StateToUrl,
+  };
+}

package/src/providers/dataDictionaryState/actions/stateToUrl/types.ts

@@ -0,0 +1,15 @@
+import { DataDictionaryActionKind } from "../types";
+
+export enum ROUTER_METHOD {
+  PUSH = "push",
+  REPLACE = "replace",
+}
+
+export type StateToUrlAction = {
+  payload: StateToUrlPayload;
+  type: DataDictionaryActionKind.StateToUrl;
+};
+
+export type StateToUrlPayload = {
+  method: ROUTER_METHOD;
+};

package/src/providers/dataDictionaryState/actions/types.ts

@@ -0,0 +1,20 @@
+import { ClearMetaAction } from "./clearMeta/types";
+import { StateToUrlAction } from "./stateToUrl/types";
+import { UpdateColumnFiltersAction } from "./updateColumnFilters/types";
+import { UpdateGlobalFilterAction } from "./updateGlobalFilter/types";
+import { UrlToStateAction } from "./urlToState/types";
+
+export type DataDictionaryAction =
+  | ClearMetaAction
+  | StateToUrlAction
+  | UpdateColumnFiltersAction
+  | UpdateGlobalFilterAction
+  | UrlToStateAction;
+
+export enum DataDictionaryActionKind {
+  ClearMeta = "CLEAR_META",
+  StateToUrl = "STATE_TO_URL",
+  UpdateColumnFilters = "UPDATE_COLUMN_FILTERS",
+  UpdateGlobalFilter = "UPDATE_GLOBAL_FILTER",
+  UrlToState = "URL_TO_STATE",
+}

package/src/providers/dataDictionaryState/actions/updateColumnFilters/action.ts

@@ -0,0 +1,24 @@
+import { META_COMMAND } from "../../../../hooks/stateSyncManager/hooks/UseMetaCommands/types";
+import { buildNextDictionaries } from "../../dictionaries/state";
+import { DataDictionaryState } from "../../types";
+import { UpdateColumnFiltersPayload } from "./types";
+import { buildNextColumnFilters } from "./utils";
+
+/**
+ * Reducer function to handle the "update column filters" action.
+ * @param state - Data dictionary state.
+ * @param payload - Payload.
+ * @returns data dictionary state.
+ */
+export function updateColumnFiltersAction(
+  state: DataDictionaryState,
+  payload: UpdateColumnFiltersPayload
+): DataDictionaryState {
+  return {
+    ...state,
+    dictionaries: buildNextDictionaries(state, payload.dictionary, {
+      columnFilters: buildNextColumnFilters(state, payload),
+    }),
+    meta: { command: META_COMMAND.STATE_TO_URL_PUSH },
+  };
+}

package/src/providers/dataDictionaryState/actions/updateColumnFilters/dispatch.ts

@@ -0,0 +1,16 @@
+import { DataDictionaryActionKind } from "../types";
+import { UpdateColumnFiltersAction, UpdateColumnFiltersPayload } from "./types";
+
+/**
+ * Action creator for updating column filters in the state.
+ * @param payload - Payload.
+ * @returns Action with payload and action type.
+ */
+export function updateColumnFilters(
+  payload: UpdateColumnFiltersPayload
+): UpdateColumnFiltersAction {
+  return {
+    payload,
+    type: DataDictionaryActionKind.UpdateColumnFilters,
+  };
+}

package/src/providers/dataDictionaryState/actions/updateColumnFilters/types.ts

@@ -0,0 +1,12 @@
+import { ColumnFiltersState, Updater } from "@tanstack/react-table";
+import { DataDictionaryActionKind } from "../types";
+
+export type UpdateColumnFiltersAction = {
+  payload: UpdateColumnFiltersPayload;
+  type: DataDictionaryActionKind.UpdateColumnFilters;
+};
+
+export interface UpdateColumnFiltersPayload {
+  dictionary: string;
+  updaterOrValue: Updater<ColumnFiltersState>;
+}

package/src/providers/dataDictionaryState/actions/updateColumnFilters/utils.ts

@@ -0,0 +1,41 @@
+import { ColumnFiltersState, functionalUpdate } from "@tanstack/react-table";
+import { DataDictionaryState } from "../../types";
+import { UpdateColumnFiltersPayload } from "./types";
+
+/**
+ * Builds the next column filters state for the current dictionary.
+ * Uses TanStack updater to update the column filters state.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns column filters state.
+ */
+export function buildNextColumnFilters(
+  state: DataDictionaryState,
+  payload: UpdateColumnFiltersPayload
+): ColumnFiltersState {
+  return functionalUpdate(
+    payload.updaterOrValue,
+    getOldColumnFilters(state, payload)
+  );
+}
+
+/**
+ * Retrieves the current "old" column filters state.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns old column filters state.
+ */
+function getOldColumnFilters(
+  state: DataDictionaryState,
+  payload: UpdateColumnFiltersPayload
+): ColumnFiltersState {
+  // Grab the dictionary.
+  const dictionary = state.dictionaries[payload.dictionary];
+
+  // If the dictionary is not found, return an empty array.
+  if (!dictionary) return [];
+
+  // Grab column filters from dictionary state.
+  const { columnFilters = [] } = dictionary.state;
+  return columnFilters;
+}

package/src/providers/dataDictionaryState/actions/updateGlobalFilter/action.ts

@@ -0,0 +1,25 @@
+import { buildNextDictionaries } from "../../dictionaries/state";
+import { DataDictionaryState } from "../../types";
+import { UpdateGlobalFilterPayload } from "./types";
+import { buildNextGlobalFilter, buildNextMeta } from "./utils";
+
+/**
+ * Reducer function to handle the "update global filter" action.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns state.
+ */
+export function updateGlobalFilterAction(
+  state: DataDictionaryState,
+  payload: UpdateGlobalFilterPayload
+): DataDictionaryState {
+  const globalFilter = buildNextGlobalFilter(payload);
+  const meta = buildNextMeta(state, payload, globalFilter);
+  return {
+    ...state,
+    dictionaries: buildNextDictionaries(state, payload.dictionary, {
+      globalFilter,
+    }),
+    meta,
+  };
+}

package/src/providers/dataDictionaryState/actions/updateGlobalFilter/dispatch.ts

@@ -0,0 +1,16 @@
+import { DataDictionaryActionKind } from "../types";
+import { UpdateGlobalFilterAction, UpdateGlobalFilterPayload } from "./types";
+
+/**
+ * Action creator for updating global filter in the state.
+ * @param payload - Payload.
+ * @returns Action with payload and action type.
+ */
+export function updateGlobalFilter(
+  payload: UpdateGlobalFilterPayload
+): UpdateGlobalFilterAction {
+  return {
+    payload,
+    type: DataDictionaryActionKind.UpdateGlobalFilter,
+  };
+}

package/src/providers/dataDictionaryState/actions/updateGlobalFilter/types.ts

@@ -0,0 +1,12 @@
+import { Updater } from "@tanstack/react-table";
+import { DataDictionaryActionKind } from "../types";
+
+export type UpdateGlobalFilterAction = {
+  payload: UpdateGlobalFilterPayload;
+  type: DataDictionaryActionKind.UpdateGlobalFilter;
+};
+
+export interface UpdateGlobalFilterPayload {
+  dictionary: string;
+  updaterOrValue: Updater<string | undefined>;
+}

package/src/providers/dataDictionaryState/actions/updateGlobalFilter/utils.ts

@@ -0,0 +1,50 @@
+import { functionalUpdate } from "@tanstack/react-table";
+import { META_COMMAND } from "../../../../hooks/stateSyncManager/hooks/UseMetaCommands/types";
+import { DataDictionaryState } from "../../types";
+import { UpdateGlobalFilterPayload } from "./types";
+
+/**
+ * Builds the next global filter state for the current dictionary.
+ * Uses TanStack updater to update the global filter state.
+ * @param payload - Payload.
+ * @returns global filter state.
+ */
+export function buildNextGlobalFilter(
+  payload: UpdateGlobalFilterPayload
+): string | undefined {
+  return functionalUpdate(payload.updaterOrValue, undefined) || undefined;
+}
+
+/**
+ * Builds the next meta state for the current dictionary.
+ * @param state - State.
+ * @param payload - Payload.
+ * @param nextGlobalFilter - Next global filter.
+ * @returns meta state.
+ */
+export function buildNextMeta(
+  state: DataDictionaryState,
+  payload: UpdateGlobalFilterPayload,
+  nextGlobalFilter: string | undefined
+): DataDictionaryState["meta"] {
+  const currentGlobalFilter = getCurrentGlobalFilter(state, payload);
+  // Use PUSH method with adding or removing the global filter.
+  if (currentGlobalFilter === undefined || nextGlobalFilter === undefined) {
+    return { command: META_COMMAND.STATE_TO_URL_PUSH };
+  }
+  // Use REPLACE method with edits to the global filter.
+  return { command: META_COMMAND.STATE_TO_URL_REPLACE };
+}
+
+/**
+ * Returns the current global filter for the current dictionary.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns global filter.
+ */
+function getCurrentGlobalFilter(
+  state: DataDictionaryState,
+  payload: UpdateGlobalFilterPayload
+): string | undefined {
+  return state.dictionaries[payload.dictionary].state.globalFilter;
+}

package/src/providers/dataDictionaryState/actions/urlToState/action.ts

@@ -0,0 +1,28 @@
+import { parseJsonQueryParam } from "../../../../utils/parseJsonQueryParam";
+import { DATA_DICTIONARY_URL_PARAMS } from "../../dictionaries/constants";
+import { buildNextDictionaries } from "../../dictionaries/state";
+import { DataDictionaryState } from "../../types";
+import { UrlToStatePayload } from "./types";
+
+/**
+ * Reducer function to handle the "URL >> state sync" action.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns state.
+ */
+export function urlToStateAction(
+  state: DataDictionaryState,
+  payload: UrlToStatePayload
+): DataDictionaryState {
+  if (typeof payload.query.dictionary !== "string") return state;
+  return {
+    ...state,
+    dictionaries: buildNextDictionaries(state, payload.query.dictionary, {
+      columnFilters: parseJsonQueryParam(
+        payload.query[DATA_DICTIONARY_URL_PARAMS.COLUMN_FILTERS],
+        []
+      ),
+      globalFilter: payload.query[DATA_DICTIONARY_URL_PARAMS.GLOBAL_FILTER],
+    }),
+  };
+}

package/src/providers/dataDictionaryState/actions/urlToState/dispatch.ts

@@ -0,0 +1,14 @@
+import { DataDictionaryActionKind } from "../types";
+import { UrlToStateAction, UrlToStatePayload } from "./types";
+
+/**
+ * Action creator for URL >> state sync.
+ * @param payload - Payload.
+ * @returns Action with payload and action type.
+ */
+export function urlToState(payload: UrlToStatePayload): UrlToStateAction {
+  return {
+    payload,
+    type: DataDictionaryActionKind.UrlToState,
+  };
+}

package/src/providers/dataDictionaryState/actions/urlToState/types.ts

@@ -0,0 +1,11 @@
+import { NextRouter } from "next/router";
+import { DataDictionaryActionKind } from "../types";
+
+export type UrlToStateAction = {
+  payload: UrlToStatePayload;
+  type: DataDictionaryActionKind.UrlToState;
+};
+
+export type UrlToStatePayload = {
+  query: NextRouter["query"];
+};

package/src/providers/dataDictionaryState/context.ts

@@ -0,0 +1,9 @@
+import { createContext } from "react";
+import { INITIAL_DATA_DICTIONARY_STATE } from "./initializer/constants";
+import { DataDictionaryStateContextProps } from "./types";
+
+export const DataDictionaryStateContext =
+  createContext<DataDictionaryStateContextProps>({
+    dataDictionaryDispatch: null,
+    dataDictionaryState: INITIAL_DATA_DICTIONARY_STATE,
+  });

package/src/providers/dataDictionaryState/dictionaries/constants.ts

@@ -0,0 +1,4 @@
+export const DATA_DICTIONARY_URL_PARAMS = {
+  COLUMN_FILTERS: "filter",
+  GLOBAL_FILTER: "search",
+} as const;

package/src/providers/dataDictionaryState/dictionaries/state.ts

@@ -0,0 +1,45 @@
+import { TableState } from "@tanstack/react-table";
+import { stateToUrlQuery } from "../../../utils/stateToUrlQuery";
+import { DataDictionaryState } from "../types";
+import { DictionariesContext } from "./types";
+import { extractDictionaryUrlState as extractUrlState } from "./utils";
+
+/**
+ * Builds the next dictionaries context.
+ * @param state - State.
+ * @param dictionaryKey - Dictionary key.
+ * @param nextDictionaryState - Next dictionary state.
+ * @returns Next dictionaries context.
+ */
+export function buildNextDictionaries(
+  state: DataDictionaryState,
+  dictionaryKey: string,
+  nextDictionaryState: Partial<TableState>
+): DictionariesContext {
+  // Clone the dictionaries.
+  const dictionaries: DictionariesContext = { ...state.dictionaries };
+
+  for (const [key, dictionary] of Object.entries(dictionaries)) {
+    // Clone the dictionary context.
+    const dictionaryContext = { ...dictionary };
+
+    // If the dictionary key is a match, update the dictionary context.
+    if (key === dictionaryKey) {
+      // Update the dictionary state.
+      dictionaryContext.state = { ...dictionary.state, ...nextDictionaryState };
+
+      // Grab param values from the updated dictionary state.
+      const { columnFilters, globalFilter } = dictionaryContext.state;
+
+      // Update the dictionary query.
+      dictionaryContext.query = stateToUrlQuery(
+        extractUrlState(key, { columnFilters, globalFilter })
+      );
+    }
+
+    // Update the dictionary context.
+    dictionaries[key] = dictionaryContext;
+  }
+
+  return dictionaries;
+}

package/src/providers/dataDictionaryState/dictionaries/types.ts

@@ -0,0 +1,11 @@
+import { TableState } from "@tanstack/react-table";
+import { NextRouter } from "next/router";
+
+export interface DictionariesContext {
+  [key: string]: DictionaryContext;
+}
+
+export interface DictionaryContext {
+  query: NextRouter["query"];
+  state: Partial<TableState>;
+}