@databiosphere/findable-ui 50.7.0 → 50.8.0

package/src/hooks/useHtmlStyle/constants.ts

@@ -1,5 +0,0 @@
-import { CSSPropHyphen } from "./types";
-
-export const PROPERTY: Record<string, CSSPropHyphen> = {
-  SCROLL_PADDING_TOP: "scroll-padding-top",
-};

package/src/hooks/useHtmlStyle/hook.ts

@@ -1,23 +0,0 @@
-import { useLayoutEffect } from "react";
-import { CSSPropHyphen } from "./types";
-
-export const useHtmlStyle = (
-  property: CSSPropHyphen,
-  value: string | null,
-): void => {
-  useLayoutEffect(() => {
-    // Get the HTML element.
-    const el = document.documentElement;
-
-    // Get the previous value.
-    const previousValue = el.style.getPropertyValue(property);
-
-    if (value !== null) el.style.setProperty(property, value);
-
-    return (): void => {
-      // Restore or remove property value on the HTML element.
-      if (previousValue) el.style.setProperty(property, previousValue);
-      else el.style.removeProperty(property);
-    };
-  }, [property, value]);
-};

package/src/hooks/useHtmlStyle/types.ts

@@ -1,3 +0,0 @@
-import type * as CSS from "csstype";
-
-export type CSSPropHyphen = keyof CSS.PropertiesHyphen;

package/src/hooks/useLocalStorage/common/utils.ts

@@ -1,19 +0,0 @@
-/**
- * Return the value for the specified key.
- * @param key - Key.
- * @returns value.
- */
-export function getLocalStorage(key: string): string | null {
-  if (typeof window === "undefined") return null;
-  return window?.localStorage?.getItem(key) ?? null;
-}
-
-/**
- * Set the value for the specified key.
- * @param key - Key.
- * @param value - Value.
- */
-export function setLocalStorage(key: string, value: string): void {
-  if (typeof window === "undefined") return;
-  window?.localStorage?.setItem(key, value);
-}

package/src/hooks/useLocalStorage/useLocalStorage.ts

@@ -1,17 +0,0 @@
-import { useEffect, useState } from "react";
-import { getLocalStorage } from "./common/utils";
-
-/**
- * Determine local storage value.
- * @param key - Local storage key.
- * @returns local storage value.
- */
-export function useLocalStorage(key: string): string | null | undefined {
-  const [value, setValue] = useState<string | null>();
-
-  useEffect(() => {
-    setValue(getLocalStorage(key));
-  }, [key]);
-
-  return value;
-}

package/src/hooks/useLocation.ts

@@ -1,25 +0,0 @@
-import { isSSR } from "../utils/ssr";
-
-interface Result {
-  href: string;
-  pathname: string;
-  search: URLSearchParams;
-}
-
-/**
- * Hook used to get the url properties from the location object
- * Most of the time you can get the same result with useRouter(). This hook has a single use case:
- *  - When you need to get the url properties ready on the first render, before ReactDOM.hydrate
- * @returns an object containing url's pathname and search params
- */
-export const useLocation = (): Result | null => {
-  if (isSSR()) {
-    return null;
-  }
-  const { href, pathname, search } = window.location;
-  return {
-    href,
-    pathname,
-    search: new URLSearchParams(search),
-  };
-};

package/src/hooks/useRequestFileLocation.ts

@@ -1,154 +0,0 @@
-import { MutableRefObject, useCallback, useEffect, useRef } from "react";
-import {
-  FILE_LOCATION_PENDING,
-  FILE_LOCATION_SUCCESSFULLY,
-} from "../apis/azul/common/constants";
-import { FileLocationResponse } from "../apis/azul/common/entities";
-import { useToken } from "./authentication/token/useToken";
-import { METHOD } from "./types";
-import { useAsync } from "./useAsync";
-
-export interface FileLocation {
-  commandLine?: { [key: string]: string };
-  location: string;
-  retryAfter?: number;
-  status: number;
-}
-
-export interface UseRequestFileLocationResult {
-  data: FileLocation | undefined;
-  isIdle: boolean;
-  isLoading: boolean;
-  isSuccess: boolean;
-  run: () => void;
-}
-
-export type Method = METHOD;
-
-type ResolveFn = (file: FileLocation | PromiseLike<FileLocation>) => void;
-type RejectFn = (reason: FileLocation) => void;
-
-/**
- * Returns fetch request options.
- * @param accessToken - Access token.
- * @param method - Method to be used by the request
- * @returns fetch request options.
- */
-function createFetchOptions(
-  accessToken: string | undefined,
-  method: Method,
-): RequestInit {
-  return {
-    headers: accessToken ? { Authorization: "Bearer " + accessToken } : {},
-    method,
-  };
-}
-
-/**
- * Function to make a get request and map the result to camelCase
- * @param url - url for the get request
- * @param accessToken - Access token.
- * @param method - Method to be used by the request
- * @returns @see FileLocation
- */
-export const getFileLocation = async (
-  url: string,
-  accessToken: string | undefined,
-  method: Method,
-): Promise<FileLocation> => {
-  const options = createFetchOptions(accessToken, method);
-  const res = await fetch(url, options);
-  const jsonRes: FileLocationResponse = await res.json();
-  return {
-    commandLine: jsonRes.CommandLine,
-    location: jsonRes.Location,
-    retryAfter: jsonRes["Retry-After"],
-    status: jsonRes.Status,
-  };
-};
-
-/**
- * Function that will recursively keep making requests to get the file location until gets a 302 or an error.
- * @param url - url for the get request
- * @param accessToken - Access token.
- * @param resolve - function to resolve the running promise
- * @param reject - function to reject the running promise
- * @param active - Mutable object used to check if the page is still mounted and the requests should keep executing
- * @param retryAfter - timeout value
- * @param method - Method to be used by the request
- */
-const scheduleFileLocation = (
-  url: string,
-  accessToken: string | undefined,
-  resolve: ResolveFn,
-  reject: RejectFn,
-  active: MutableRefObject<boolean>,
-  retryAfter = 0,
-  method: Method = METHOD.GET,
-): void => {
-  setTimeout(() => {
-    getFileLocation(url, accessToken, method).then((result: FileLocation) => {
-      if (result.status === FILE_LOCATION_PENDING) {
-        if (!active.current) {
-          reject({
-            location: "",
-            status: 499, //Client Closed Request
-          });
-          return;
-        }
-        scheduleFileLocation(
-          result.location,
-          accessToken,
-          resolve,
-          reject,
-          active,
-          result.retryAfter,
-        );
-      } else if (result.status === FILE_LOCATION_SUCCESSFULLY) {
-        resolve(result);
-      } else {
-        reject(result);
-      }
-    });
-  }, retryAfter * 1000);
-};
-
-/**
- * Hook to get a file location using a retry-after approach
- * @param url - to be used on the get request
- * @param method - Method to be used by the request
- * @returns data object with the file location
- */
-export const useRequestFileLocation = (
-  url?: string,
-  method?: Method,
-): UseRequestFileLocationResult => {
-  const { token } = useToken();
-  const {
-    data,
-    isIdle,
-    isLoading,
-    isSuccess,
-    run: runAsync,
-  } = useAsync<FileLocation>();
-  const active = useRef<boolean>(true);
-
-  useEffect(() => {
-    active.current = true;
-    return (): void => {
-      active.current = false;
-    };
-  }, []);
-
-  const run = useCallback(() => {
-    if (url) {
-      runAsync(
-        new Promise<FileLocation>((resolve, reject) => {
-          scheduleFileLocation(url, token, resolve, reject, active, 0, method);
-        }),
-      );
-    }
-  }, [runAsync, token, url, method]);
-
-  return { data, isIdle, isLoading, isSuccess, run };
-};

package/src/hooks/useRequestManifest/constants.ts

@@ -1,6 +0,0 @@
-import { METHOD } from "../types";
-import { UseRequestManifest } from "./types";
-
-export const REQUEST_MANIFEST: UseRequestManifest = {
-  requestMethod: METHOD.PUT,
-};

package/src/hooks/useRequestManifest/types.ts

@@ -1,7 +0,0 @@
-import { Method } from "../useRequestFileLocation";
-
-export interface UseRequestManifest {
-  requestMethod: Method;
-  requestParams?: URLSearchParams;
-  requestUrl?: string;
-}

package/src/hooks/useRequestManifest/useRequestManifest.ts

@@ -1,49 +0,0 @@
-import { ManifestDownloadFormat } from "../../apis/azul/common/entities";
-import { FormFacet } from "../../components/Export/common/entities";
-import { useCatalog } from "../useCatalog";
-import { useConfig } from "../useConfig";
-import { useFileManifestState } from "../useFileManifestState";
-import { REQUEST_MANIFEST } from "./constants";
-import { UseRequestManifest } from "./types";
-import {
-  buildRequestFilters,
-  buildRequestManifest,
-  isCatalogReady,
-  isFileManifestFormatReady,
-  isFileManifestStateReady,
-  isFormSelectionReady,
-} from "./utils";
-
-/**
- * Returns file manifest request method, params and URL.
- * @param fileManifestFormat - File manifest format.
- * @param formFacet - Object containing form related facets.
- * @returns file manifest request method, params and URL.
- */
-export const useRequestManifest = (
-  fileManifestFormat: ManifestDownloadFormat | undefined,
-  formFacet: FormFacet,
-): UseRequestManifest => {
-  // Retrieve the endpoint URL from configured data source.
-  const config = useConfig();
-  const endpointUrl = config.config.dataSource.url;
-  // Determine catalog.
-  const catalog = useCatalog();
-  // Retrieve file manifest state.
-  const { fileManifestState } = useFileManifestState();
-  // Return file manifest request method etc. when conditions are met.
-  if (
-    isCatalogReady(catalog) &&
-    isFileManifestFormatReady(fileManifestFormat) &&
-    isFileManifestStateReady(fileManifestState) &&
-    isFormSelectionReady(formFacet)
-  ) {
-    return buildRequestManifest(
-      endpointUrl,
-      catalog as string, // Catalog is defined.
-      buildRequestFilters(fileManifestState, formFacet),
-      fileManifestFormat as ManifestDownloadFormat, // Manifest format is defined.
-    );
-  }
-  return REQUEST_MANIFEST;
-};

package/src/hooks/useRequestManifest/utils.ts

@@ -1,166 +0,0 @@
-import {
-  AZUL_PARAM,
-  MANIFEST_DOWNLOAD_FORMAT,
-  ManifestDownloadFormat,
-} from "../../apis/azul/common/entities";
-import { transformFilters } from "../../apis/azul/common/filterTransformer";
-import { Filters } from "../../common/entities";
-import { FormFacet } from "../../components/Export/common/entities";
-import { FileManifestState } from "../../providers/fileManifestState";
-import { FileFacet } from "../useFileManifest/common/entities";
-import { REQUEST_MANIFEST } from "./constants";
-import { UseRequestManifest } from "./types";
-
-/**
- * Determines whether all files are selected by comparing the file count to the summary file count.
- *
- * @param state - The file manifest state object.
- * @returns True if all files are selected; otherwise, false.
- */
-export function areAllFilesSelected(state: FileManifestState): boolean {
-  const { fileCount, summary } = state;
-
-  // Return false if file count or summary file count is undefined.
-  if (fileCount === undefined || summary?.fileCount === undefined) return false;
-
-  // Return true if file count equals summary file count.
-  return fileCount === summary.fileCount;
-}
-
-/**
- * Builds the filters object for a request URL based on the file manifest state and form facets.
- *
- * - If all files are selected, returns filters from state excluding fully selected form filters.
- * - If only some files are selected, returns the current filters from state.
- *
- * @param state - The file manifest state object.
- * @param formFacet - The form-related file facets.
- * @returns The filters to use for the request URL.
- */
-export function buildRequestFilters(
-  state: FileManifestState,
-  formFacet: FormFacet,
-): Filters {
-  // Return filters from state excluding form filters if all files are selected.
-  if (areAllFilesSelected(state)) {
-    return excludeFullySelectedFormFilters(state, formFacet);
-  }
-
-  // Return current filters from state.
-  return state.filters;
-}
-
-/**
- * Build up file manifest request params and URL query string for the given search results, catalog and format.
- * @param endpointUrl - Data URL.
- * @param catalog - Configured catalog.
- * @param filters - Selected filters.
- * @param manifestFormat - Manifest format.
- * @returns file manifest request params and URL query string.
- */
-export function buildRequestManifest(
-  endpointUrl: string,
-  catalog: string,
-  filters: Filters,
-  manifestFormat: ManifestDownloadFormat,
-): Required<UseRequestManifest> {
-  const requestParams = new URLSearchParams({
-    [AZUL_PARAM.CATALOG]: catalog,
-    [AZUL_PARAM.FILTERS]: transformFilters(filters),
-    format: manifestFormat,
-  });
-  const requestUrl = `${endpointUrl}fetch/manifest/files?${requestParams.toString()}`;
-  return {
-    ...REQUEST_MANIFEST,
-    requestParams,
-    requestUrl,
-  };
-}
-
-/**
- * Returns filters, without form related filters.
- * @param state - File manifest state.
- * @param formFacet - Form related file facets.
- * @returns filters.
- */
-export function excludeFullySelectedFormFilters(
-  state: FileManifestState,
-  formFacet: FormFacet,
-): Filters {
-  const filters: Filters = [];
-  const formFacetNames = getFormFacetNamesSet(formFacet);
-  for (const filter of state.filters) {
-    if (formFacetNames.has(filter.categoryKey)) continue;
-    filters.push(filter);
-  }
-  return filters;
-}
-
-/**
- * Returns a set of form facet names.
- * @param formFacet - Form related file facets.
- * @returns set of form facet names.
- */
-function getFormFacetNamesSet(formFacet: FormFacet): Set<string> {
-  return new Set(
-    Object.values(formFacet)
-      .filter(Boolean)
-      .map(({ name }: FileFacet) => name),
-  );
-}
-
-/**
- * Returns true if the catalog is defined.
- * The catalog is defined via the configuration and is required for the file manifest request.
- * @param catalog - Catalog.
- * @returns true if the catalog is defined.
- */
-export function isCatalogReady(catalog: string | undefined): boolean {
-  return typeof catalog === "string";
-}
-
-/**
- * Determines if the file manifest state is ready to be used in a request.
- *
- * The state is considered ready when:
- * - isEnabled is true
- * - fileCount is defined
- * - isLoading is false
- *
- * @param fileManifestState - File manifest state.
- * @returns true if the file manifest state is ready.
- */
-export function isFileManifestStateReady(
-  fileManifestState: FileManifestState,
-): boolean {
-  return (
-    fileManifestState.isEnabled &&
-    fileManifestState.fileCount !== undefined &&
-    !fileManifestState.isLoading
-  );
-}
-
-/**
- * Checks if the file manifest format is ready for use.
- * The file manifest format is considered ready if `fileManifestFormat` is defined.
- * @param fileManifestFormat - File manifest format.
- * @returns `true` if the `fileManifestFormat` is defined.
- */
-export function isFileManifestFormatReady(
-  fileManifestFormat: ManifestDownloadFormat | undefined,
-): boolean {
-  if (!fileManifestFormat) return false;
-  return Object.values(MANIFEST_DOWNLOAD_FORMAT).includes(fileManifestFormat);
-}
-
-/**
- * Checks if the form is ready to request a manifest.
- * A form is considered ready if all facets have the `selected` term set to `true`.
- * @param formFacet - Form related file facets.
- * @returns `true` if all facets in the form are selected.
- */
-export function isFormSelectionReady(formFacet: FormFacet): boolean {
-  const facets = Object.values(formFacet).filter(Boolean);
-  if (facets.length === 0) return false;
-  return facets.every(({ selected }: FileFacet) => selected);
-}

package/src/hooks/useResetableState.ts

@@ -1,18 +0,0 @@
-import { Dispatch, SetStateAction, useEffect, useState } from "react";
-
-/**
- * useState hook wrapper that will keep the state updated if the defaultValue changes
- * @param defaultState - param that determine the default and current state
- * @returns current state the setter function
- */
-export const useResetableState = <T>(
-  defaultState: T,
-): [T, Dispatch<SetStateAction<T>>] => {
-  const [state, setState] = useState<T>(defaultState);
-
-  useEffect(() => {
-    setState(defaultState);
-  }, [defaultState]);
-
-  return [state, setState];
-};

package/src/hooks/useResizeObserver.ts

@@ -1,114 +0,0 @@
-import { RefObject, useCallback, useEffect, useRef, useState } from "react";
-
-export type ElementRect = {
-  bottom: number;
-  height: number;
-  left: number;
-  right: number;
-  top: number;
-  width: number;
-  x: number;
-  y: number;
-};
-
-/**
- * Element resizing and repositioning observer.
- * @param ref - element to be observed for changes to its size or position.
- * @param onResizeFn - action to be performed when the observed element is resized or repositioned.
- * @param shouldObserve - boolean flag to determine if the observer should be active.
- * @returns Element size and position properties for the given element.
- */
-export function useResizeObserver(
-  ref: RefObject<HTMLElement | null>,
-  onResizeFn: (entries: ResizeObserverEntry[]) => Partial<ElementRect>,
-  shouldObserve: boolean = true,
-): Partial<ElementRect> | undefined {
-  const [elementRect, setElementRect] = useState<Partial<ElementRect>>();
-  const observerRef = useRef<ResizeObserver>(null);
-
-  // Observed element is resized or repositioned - set state elementRect with the element's new dimensions or position.
-  const onResize = useCallback(
-    (entries: ResizeObserverEntry[]) => {
-      if (entries && entries.length > 0) {
-        const nextElementRect = onResizeFn(entries);
-        setElementRect((elRect) => getNextElementRect(elRect, nextElementRect));
-      }
-    },
-    [onResizeFn],
-  );
-
-  // Creates a new ResizeObserver object which can be used to report changes to an "observed" element's dimensions or position.
-  useEffect(() => {
-    if (!ref.current) return;
-    if (!shouldObserve) return;
-    observerRef.current = new ResizeObserver(onResize);
-    const observer = observerRef.current;
-    const observedEl = ref.current;
-    observer.observe(observedEl);
-    return (): void => {
-      observer.unobserve(observedEl);
-    };
-  }, [onResize, ref, shouldObserve]);
-
-  return elementRect;
-}
-
-/**
- * Return's the observed element's border box size.
- * @param entries - Resize observer entries.
- * @returns observed element's border box size.
- */
-export function getBorderBoxSize(
-  entries: ResizeObserverEntry[],
-): Partial<ElementRect> {
-  const entry = entries[0]; // grab the first entry; observing a single element.
-  const borderBoxSize = entry.borderBoxSize[0];
-  return {
-    height: borderBoxSize.blockSize,
-    width: borderBoxSize.inlineSize,
-  };
-}
-
-/**
- * Return's the observed element's border box height.
- * @param entries - Resize observer entries.
- * @returns observed element's border box height.
- */
-export function getBorderBoxSizeHeight(
-  entries: ResizeObserverEntry[],
-): Partial<ElementRect> {
-  const { height } = getBorderBoxSize(entries);
-  return { height };
-}
-
-/**
- * Return's the observed element's size and position properties.
- * @param entries - Resize observer entries.
- * @returns the observed element's size and position properties.
- */
-export function getContentRect(entries: ResizeObserverEntry[]): ElementRect {
-  const entry = entries[0]; // grab the first entry; observing a single element
-  const contentRect = entry.contentRect.toJSON();
-  return {
-    ...contentRect,
-  };
-}
-
-/**
- * Return's the next observed element's size and position properties.
- * @param elementRect - Current observed element's rect properties.
- * @param nextElementRect - Next observed element's rect properties.
- * @returns the next observed element's size and position properties.
- */
-export function getNextElementRect(
-  elementRect: Partial<ElementRect> | undefined,
-  nextElementRect: Partial<ElementRect> | undefined,
-): Partial<ElementRect> | undefined {
-  if (!nextElementRect) return elementRect;
-  for (const [key, value] of Object.entries(nextElementRect)) {
-    if (elementRect?.[key as keyof ElementRect] !== value) {
-      return { ...elementRect, ...nextElementRect };
-    }
-  }
-  return elementRect;
-}

package/src/hooks/useRouteHistory.ts

@@ -1,65 +0,0 @@
-import Router, { useRouter } from "next/router";
-import { useCallback, useEffect, useRef } from "react";
-import { useRouteRoot } from "./useRouteRoot";
-
-const ROUTE_CHANGE_EVENT = "routeChangeComplete";
-const MAX_HISTORY_LENGTH = 4;
-
-export type TransformRouteFn = (routes: string[]) => string | undefined;
-
-export interface UseRouteHistory {
-  callbackUrl: (transformFn?: TransformRouteFn) => string;
-}
-
-export function useRouteHistory(
-  maxHistory = MAX_HISTORY_LENGTH,
-): UseRouteHistory {
-  const { asPath } = useRouter();
-  const rootPath = useRouteRoot();
-  const historyRef = useRef<string[]>([asPath]);
-
-  const onRouteChange = useCallback(
-    (route: string): void => {
-      if (route === historyRef.current[0]) return;
-      historyRef.current.unshift(route);
-      if (historyRef.current.length > maxHistory) {
-        historyRef.current.pop();
-      }
-    },
-    [maxHistory],
-  );
-
-  useEffect(() => {
-    Router.events.on(ROUTE_CHANGE_EVENT, onRouteChange);
-    return (): void => {
-      Router.events.off(ROUTE_CHANGE_EVENT, onRouteChange);
-    };
-  }, [onRouteChange]);
-
-  const callbackUrl = useCallback(
-    (transformFn?: TransformRouteFn): string =>
-      getCallbackUrl(historyRef.current, rootPath, transformFn),
-    [rootPath],
-  );
-
-  return { callbackUrl };
-}
-
-/**
- * Generates a callback URL based on the provided history and root path.
- * Returns the callback URL determined by the transform function or the second item in history and if neither condition is met, returns the root path.
- * @param history - Navigation history.
- * @param rootPath - The default root path to return if no other conditions are met.
- * @param [transformFn] - An optional function that transforms the history array to a specific route.
- * @returns {string} - The callback UR.
- */
-export function getCallbackUrl(
-  history: string[],
-  rootPath: string,
-  transformFn?: TransformRouteFn,
-): string {
-  if (transformFn) {
-    return transformFn(history) || rootPath;
-  }
-  return history[1] || rootPath;
-}