@databiosphere/findable-ui 19.0.0 → 21.0.0

package/src/hooks/useEntityList.ts

@@ -13,8 +13,8 @@ import { EntityMapper } from "../config/entities";
 import { getEntityConfig } from "../config/utils";
 import { ExploreActionKind } from "../providers/exploreState";
 import { DEFAULT_PAGINATION_STATE } from "../providers/exploreState/initializer/constants";
+import { useToken } from "./authentication/token/useToken";
 import { useAsync } from "./useAsync";
-import { useAuthentication } from "./useAuthentication/useAuthentication";
 import { useConfig } from "./useConfig";
 import { useEntityService } from "./useEntityService";
 import { EXPLORE_MODE, ExploreMode, useExploreMode } from "./useExploreMode";
@@ -31,7 +31,7 @@ export const useEntityList = (
   staticResponse: AzulEntitiesStaticResponse
 ): void => {
   const { data: staticData, entityListType } = staticResponse;
-  const { token } = useAuthentication();
+  const { token } = useToken();
   const { config } = useConfig();
   const { apiPath } = getEntityConfig(config.entities, entityListType);
   const exploreMode = useExploreMode();

package/src/hooks/useFetchEntity.tsx

@@ -2,8 +2,8 @@ import { useRouter } from "next/router";
 import { useEffect, useMemo } from "react";
 import { PARAMS_INDEX_UUID } from "../common/constants";
 import { EntityDetailViewProps } from "../views/EntityDetailView/entityDetailView";
+import { useToken } from "./authentication/token/useToken";
 import { useAsync } from "./useAsync";
-import { useAuthentication } from "./useAuthentication/useAuthentication";
 import { useEntityService } from "./useEntityService";
 import { EXPLORE_MODE, useExploreMode } from "./useExploreMode";
 import { useExploreState } from "./useExploreState";
@@ -23,7 +23,7 @@ export const useFetchEntity = <T,>(
   detailViewProps?: EntityDetailViewProps
 ): UseEntityDetailResponse<T> => {
   const { data: staticData, entityListType } = detailViewProps || {};
-  const { token } = useAuthentication();
+  const { token } = useToken();
   const exploreMode = useExploreMode();
   const { exploreState } = useExploreState();
   const { catalogState } = exploreState;
@@ -37,7 +37,7 @@ export const useFetchEntity = <T,>(
     () =>
       isFetchRequired(
         exploreMode !== EXPLORE_MODE.CS_FETCH_CS_FILTERING,
-        Boolean(token),
+        Boolean(token), // TODO(cc), note a fetch is required if the token is true, but is unable to re-fetch on logout when token is undefined! Page is required to reload!
         Boolean(catalogState),
         Boolean(entityResponse)
       ),

package/src/hooks/useFileManifest/useFetchFilesFacets.ts

@@ -6,8 +6,8 @@ import {
 import { Filters } from "../../common/entities";
 import { fetchEntitiesFromURL } from "../../entity/common/service";
 import { fetchQueryParams, SearchParams } from "../../utils/fetchQueryParams";
+import { useToken } from "../authentication/token/useToken";
 import { useAsync } from "../useAsync";
-import { useAuthentication } from "../useAuthentication/useAuthentication";
 import { useFetchRequestURL } from "../useFetchRequestURL";
 import { FetchFilesFacets } from "./common/entities";
 import { bindEntitySearchResultsResponse } from "./common/utils";
@@ -26,8 +26,7 @@ export const useFetchFilesFacets = (
   searchParams: SearchParams | undefined,
   isEnabled: boolean
 ): FetchFilesFacets => {
-  // Grab token from authentication.
-  const { token } = useAuthentication();
+  const { token } = useToken();
   // Build request params.
   const requestParams = fetchQueryParams(filters, catalog, searchParams);
   // Build request URL.

package/src/hooks/useFileManifest/useFetchSummary.ts

@@ -6,8 +6,8 @@ import {
 import { Filters } from "../../common/entities";
 import { fetchSummaryFromURL } from "../../entity/api/service";
 import { fetchQueryParams } from "../../utils/fetchQueryParams";
+import { useToken } from "../authentication/token/useToken";
 import { useAsync } from "../useAsync";
-import { useAuthentication } from "../useAuthentication/useAuthentication";
 import { useFetchRequestURL } from "../useFetchRequestURL";
 import { FetchFileSummary } from "./common/entities";
 
@@ -23,8 +23,7 @@ export const useFetchSummary = (
   catalog: string,
   isEnabled: boolean
 ): FetchFileSummary => {
-  // Grab token from authentication.
-  const { token } = useAuthentication();
+  const { token } = useToken();
   // Build request params.
   const requestParams = fetchQueryParams(filters, catalog, undefined);
   // Build request URL.

package/src/hooks/useRequestFileLocation.ts

@@ -4,9 +4,9 @@ import {
   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";
-import { useAuthentication } from "./useAuthentication/useAuthentication";
 
 export interface FileLocation {
   commandLine?: { [key: string]: string };
@@ -123,8 +123,7 @@ export const useRequestFileLocation = (
   url?: string,
   method?: Method
 ): UseRequestFileLocationResult => {
-  // Grab token from authentication.
-  const { token } = useAuthentication();
+  const { token } = useToken();
   const {
     data,
     isIdle,

package/src/hooks/useRouteHistory.ts

@@ -0,0 +1,65 @@
+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;
+}

package/src/hooks/useRouteRoot.ts

@@ -0,0 +1,11 @@
+import { useRouter } from "next/router";
+import { useMemo } from "react";
+import { useConfig } from "./useConfig";
+
+export function useRouteRoot(): string {
+  const {
+    config: { redirectRootToPath: path },
+  } = useConfig();
+  const { basePath } = useRouter();
+  return useMemo(() => `${basePath}${path}`, [basePath, path]);
+}

package/src/hooks/useSummary.ts

@@ -1,7 +1,7 @@
 import { useEffect } from "react";
 import { AzulSummaryResponse } from "../apis/azul/common/entities";
+import { useToken } from "./authentication/token/useToken";
 import { useAsync } from "./useAsync";
-import { useAuthentication } from "./useAuthentication/useAuthentication";
 import { useConfig } from "./useConfig";
 import { useEntityService } from "./useEntityService";
 import { useExploreState } from "./useExploreState";
@@ -16,7 +16,7 @@ interface UseSummaryResponse {
  * @returns an object with the loaded data and a flag indicating is the data is loading
  */
 export const useSummary = (): UseSummaryResponse => {
-  const { token } = useAuthentication();
+  const { token } = useToken();
   const { config } = useConfig();
   const { exploreState } = useExploreState();
   const { filterState } = exploreState;
@@ -39,7 +39,7 @@ export const useSummary = (): UseSummaryResponse => {
     return { isLoading: false }; //TODO: return a summary placeholder
   }
 
-  // Return the fetch status and summary data once fetch is complete..
+  // Return the fetch status and summary data once fetch is complete.
   return {
     isLoading: apiIsLoading,
     response,

package/src/providers/authentication/auth/actions.ts

@@ -0,0 +1,17 @@
+import { AuthState, UpdateAuthStatePayload } from "./types";
+
+/**
+ * Update auth state.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns state.
+ */
+export function updateAuthState(
+  state: AuthState,
+  payload: UpdateAuthStatePayload
+): AuthState {
+  return {
+    ...state,
+    ...payload,
+  };
+}

package/src/providers/authentication/auth/constants.ts

@@ -0,0 +1,6 @@
+import { AUTH_STATUS, AuthState } from "./types";
+
+export const DEFAULT_AUTH_STATE: AuthState = {
+  isAuthenticated: false,
+  status: AUTH_STATUS.PENDING,
+};

package/src/providers/authentication/auth/context.ts

@@ -0,0 +1,9 @@
+import { createContext } from "react";
+import { DEFAULT_AUTH_STATE } from "./constants";
+import { AuthContextProps } from "./types";
+
+export const AuthContext = createContext<AuthContextProps>({
+  authDispatch: null,
+  authState: DEFAULT_AUTH_STATE,
+  service: undefined,
+});

package/src/providers/authentication/auth/dispatch.ts

@@ -0,0 +1,58 @@
+import {
+  AUTH_STATUS,
+  AuthActionKind,
+  RequestAuthAction,
+  ResetStateAction,
+  UpdateAuthStateAction,
+  UpdateAuthStatePayload,
+} from "./types";
+
+/**
+ * Auth is complete.
+ * @param payload - Payload.
+ * @returns Action.
+ */
+export function authComplete(
+  payload: UpdateAuthStatePayload
+): UpdateAuthStateAction {
+  return {
+    payload: { ...payload, status: AUTH_STATUS.SETTLED },
+    type: AuthActionKind.UpdateAuthState,
+  };
+}
+
+/**
+ * Request auth action.
+ * @returns Action.
+ */
+export function requestAuth(): RequestAuthAction {
+  return {
+    payload: undefined,
+    type: AuthActionKind.RequestAuth,
+  };
+}
+
+/**
+ * Reset state action.
+ * @returns state.
+ */
+export function resetState(): ResetStateAction {
+  return {
+    payload: undefined,
+    type: AuthActionKind.ResetState,
+  };
+}
+
+/**
+ * Update auth state action.
+ * @param payload - Payload.
+ * @returns Action.
+ */
+export function updateAuthState(
+  payload: UpdateAuthStatePayload
+): UpdateAuthStateAction {
+  return {
+    payload,
+    type: AuthActionKind.UpdateAuthState,
+  };
+}

package/src/providers/authentication/auth/hook.ts

@@ -0,0 +1,11 @@
+import { useContext } from "react";
+import { AuthContext } from "./context";
+import { AuthContextProps } from "./types";
+
+/**
+ * Auth hook.
+ * @returns auth context.
+ */
+export const useAuth = (): AuthContextProps => {
+  return useContext<AuthContextProps>(AuthContext);
+};

package/src/providers/authentication/auth/reducer.ts

@@ -0,0 +1,25 @@
+import { updateAuthState } from "./actions";
+import { AUTH_STATUS, AuthAction, AuthActionKind, AuthState } from "./types";
+
+/**
+ * Auth reducer.
+ * @param state - State.
+ * @param action - Action.
+ * @returns state.
+ */
+export function authReducer(state: AuthState, action: AuthAction): AuthState {
+  const { payload, type } = action;
+  switch (type) {
+    case AuthActionKind.RequestAuth: {
+      return { ...state, status: AUTH_STATUS.PENDING };
+    }
+    case AuthActionKind.ResetState: {
+      return { ...state, ...state.initialState };
+    }
+    case AuthActionKind.UpdateAuthState: {
+      return updateAuthState(state, payload);
+    }
+    default:
+      return state;
+  }
+}

package/src/providers/authentication/auth/types.ts

@@ -0,0 +1,63 @@
+import { Dispatch } from "react";
+import { ProviderId } from "../common/types";
+
+export type AuthAction =
+  | RequestAuthAction
+  | ResetStateAction
+  | UpdateAuthStateAction;
+
+export enum AuthActionKind {
+  RequestAuth = "REQUEST_AUTH",
+  ResetState = "RESET_STATE",
+  UpdateAuthState = "UPDATE_AUTH_STATE",
+}
+
+export interface AuthContextProps {
+  authDispatch: Dispatch<AuthAction> | null;
+  authState: AuthState;
+  service: Service | undefined;
+}
+
+export interface AuthState {
+  initialState?: AuthState;
+  isAuthenticated: boolean;
+  status: AUTH_STATUS;
+}
+
+export type RequestAuthAction = {
+  payload: RequestAuthPayload;
+  type: AuthActionKind.RequestAuth;
+};
+
+export type RequestAuthPayload = undefined;
+
+export type ResetStateAction = {
+  payload: ResetStatePayload;
+  type: AuthActionKind.ResetState;
+};
+
+export type ResetStatePayload = undefined;
+
+export interface Service {
+  [key: string]: unknown;
+  requestLogin: (providerId: ProviderId) => void;
+  requestLogout: (options?: {
+    callbackUrl?: string;
+    redirect?: boolean;
+  }) => void;
+}
+
+export enum AUTH_STATUS {
+  PENDING = "PENDING",
+  SETTLED = "SETTLED",
+}
+
+export interface UpdateAuthStateAction {
+  payload: UpdateAuthStatePayload;
+  type: AuthActionKind.UpdateAuthState;
+}
+
+export interface UpdateAuthStatePayload {
+  isAuthenticated?: boolean;
+  status?: AUTH_STATUS;
+}

package/src/providers/authentication/authentication/actions.ts

@@ -0,0 +1,17 @@
+import { AuthenticationState, UpdateAuthenticationPayload } from "./types";
+
+/**
+ * Update authentication action.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns state.
+ */
+export function updateAuthenticationAction(
+  state: AuthenticationState,
+  payload: UpdateAuthenticationPayload
+): AuthenticationState {
+  return {
+    ...state,
+    ...payload,
+  };
+}

package/src/providers/authentication/authentication/constants.ts

@@ -0,0 +1,6 @@
+import { AUTHENTICATION_STATUS, AuthenticationState } from "./types";
+
+export const DEFAULT_AUTHENTICATION_STATE: AuthenticationState = {
+  profile: undefined,
+  status: AUTHENTICATION_STATUS.PENDING,
+};

package/src/providers/authentication/authentication/context.ts

@@ -0,0 +1,8 @@
+import { createContext } from "react";
+import { DEFAULT_AUTHENTICATION_STATE } from "./constants";
+import { AuthenticationContextProps } from "./types";
+
+export const AuthenticationContext = createContext<AuthenticationContextProps>({
+  authenticationDispatch: null,
+  authenticationState: DEFAULT_AUTHENTICATION_STATE,
+});

package/src/providers/authentication/authentication/dispatch.ts

@@ -0,0 +1,55 @@
+import {
+  AUTHENTICATION_STATUS,
+  AuthenticationActionKind,
+  RequestAuthenticationAction,
+  ResetStateAction,
+  UpdateAuthenticationAction,
+  UpdateAuthenticationPayload,
+} from "./types";
+
+/**
+ * Authentication is complete.
+ * @returns Action.
+ */
+export function authenticationComplete(): UpdateAuthenticationAction {
+  return {
+    payload: { status: AUTHENTICATION_STATUS.SETTLED },
+    type: AuthenticationActionKind.UpdateAuthentication,
+  };
+}
+
+/**
+ * Request authentication action.
+ * @returns Action.
+ */
+export function requestAuthentication(): RequestAuthenticationAction {
+  return {
+    payload: undefined,
+    type: AuthenticationActionKind.RequestAuthentication,
+  };
+}
+
+/**
+ * Reset authentication action.
+ * @returns Action.
+ */
+export function resetState(): ResetStateAction {
+  return {
+    payload: undefined,
+    type: AuthenticationActionKind.ResetState,
+  };
+}
+
+/**
+ * Update authentication action.
+ * @param payload - Payload.
+ * @returns Action.
+ */
+export function updateAuthentication(
+  payload: UpdateAuthenticationPayload
+): UpdateAuthenticationAction {
+  return {
+    payload,
+    type: AuthenticationActionKind.UpdateAuthentication,
+  };
+}

package/src/providers/authentication/authentication/hook.ts

@@ -0,0 +1,11 @@
+import { useContext } from "react";
+import { AuthenticationContext } from "./context";
+import { AuthenticationContextProps } from "./types";
+
+/**
+ * Authentication hook.
+ * @returns authentication context.
+ */
+export const useAuthentication = (): AuthenticationContextProps => {
+  return useContext(AuthenticationContext);
+};

package/src/providers/authentication/authentication/reducer.ts

@@ -0,0 +1,34 @@
+import { updateAuthenticationAction } from "./actions";
+import {
+  AUTHENTICATION_STATUS,
+  AuthenticationAction,
+  AuthenticationActionKind,
+  AuthenticationState,
+} from "./types";
+
+/**
+ * Authentication reducer.
+ * Reducer for user profile and status.
+ * @param state - State.
+ * @param action - Action.
+ * @returns state.
+ */
+export function authenticationReducer(
+  state: AuthenticationState,
+  action: AuthenticationAction
+): AuthenticationState {
+  const { payload, type } = action;
+  switch (type) {
+    case AuthenticationActionKind.RequestAuthentication: {
+      return { ...state, status: AUTHENTICATION_STATUS.PENDING };
+    }
+    case AuthenticationActionKind.ResetState: {
+      return { ...state, ...state.initialState };
+    }
+    case AuthenticationActionKind.UpdateAuthentication: {
+      return updateAuthenticationAction(state, payload);
+    }
+    default:
+      return state;
+  }
+}

package/src/providers/authentication/authentication/types.ts

@@ -0,0 +1,64 @@
+import { Dispatch } from "react";
+
+export enum AUTHENTICATION_STATUS {
+  PENDING = "PENDING",
+  SETTLED = "SETTLED",
+}
+
+export type AuthenticationAction =
+  | RequestAuthenticationAction
+  | ResetStateAction
+  | UpdateAuthenticationAction;
+
+export enum AuthenticationActionKind {
+  RequestAuthentication = "REQUEST_AUTHENTICATION",
+  ResetState = "RESET_STATE",
+  UpdateAuthentication = "UPDATE_AUTHENTICATION",
+}
+
+export interface AuthenticationContextProps {
+  authenticationDispatch: Dispatch<AuthenticationAction> | null;
+  authenticationState: AuthenticationState;
+}
+
+export interface AuthenticationState {
+  initialState?: AuthenticationState;
+  profile: Profile<UserProfile>;
+  status: AUTHENTICATION_STATUS;
+}
+
+export interface BaseProfile {
+  id?: string;
+  name: string;
+}
+
+export type Profile<P extends BaseProfile> = P | undefined;
+
+export type RequestAuthenticationAction = {
+  payload: RequestAuthenticationPayload;
+  type: AuthenticationActionKind.RequestAuthentication;
+};
+
+export type RequestAuthenticationPayload = undefined;
+
+export type ResetStateAction = {
+  payload: ResetStatePayload;
+  type: AuthenticationActionKind.ResetState;
+};
+
+export type ResetStatePayload = undefined;
+
+export type UpdateAuthenticationAction = {
+  payload: UpdateAuthenticationPayload;
+  type: AuthenticationActionKind.UpdateAuthentication;
+};
+
+export interface UpdateAuthenticationPayload {
+  profile?: Profile<UserProfile>;
+  status?: AUTHENTICATION_STATUS;
+}
+
+export interface UserProfile extends BaseProfile {
+  email: string;
+  image?: string;
+}

package/src/providers/authentication/authentication/utils.ts

@@ -0,0 +1,25 @@
+/**
+ * Fetches data from given endpoint and options.
+ * @param endpoint - Endpoint.
+ * @param options - Request options.
+ * @param callback - Callback.
+ * @param callback.onError - Error callback.
+ * @param callback.onSuccess - Success callback.
+ */
+export function fetchProfile<R, E>(
+  endpoint: string,
+  options?: RequestInit,
+  callback?: {
+    onError: (error: E) => void;
+    onSuccess: (response: R) => void;
+  }
+): void {
+  fetch(endpoint, options)
+    .then((response) => response.json())
+    .then((r: R) => {
+      callback?.onSuccess(r);
+    })
+    .catch((e: E) => {
+      callback?.onError(e);
+    });
+}

package/src/providers/authentication/common/types.ts

@@ -0,0 +1 @@
+export type ProviderId = string;

package/src/providers/authentication/common/utils.ts

@@ -0,0 +1,11 @@
+/**
+ * Reducer state initializer.
+ * @param initialState - Initial state.
+ * @returns initial reducer state.
+ */
+export function initializer<S>(initialState: S): S {
+  return {
+    ...initialState,
+    initialState,
+  };
+}

package/src/providers/authentication/credentials/actions.ts

@@ -0,0 +1,17 @@
+import { CredentialsState, UpdateCredentialsPayload } from "./types";
+
+/**
+ * Update credentials action.
+ * @param state - State.
+ * @param payload - Payload.
+ * @returns state.
+ */
+export function updateCredentialsAction(
+  state: CredentialsState,
+  payload: UpdateCredentialsPayload
+): CredentialsState {
+  return {
+    ...state,
+    credentials: payload,
+  };
+}