@databiosphere/findable-ui 34.1.0 → 35.0.2

package/lib/components/common/Banner/components/BannerPrimary/bannerPrimary.js

@@ -0,0 +1,5 @@
+import React from "react";
+import { Alert } from "./bannerPrimary.styles";
+export const BannerPrimary = ({ children, className, ...props /* Spread props to allow for Mui AlertProps specific prop overrides. */ }) => {
+    return (React.createElement(Alert, { className: className, color: "primary", elevation: 0, icon: false, variant: "standard", ...props }, children));
+};

package/lib/components/common/Banner/components/BannerPrimary/bannerPrimary.styles.d.ts

@@ -0,0 +1,3 @@
+export declare const Alert: import("@emotion/styled").StyledComponent<import("@mui/material").AlertProps & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;

package/lib/components/common/Banner/components/BannerPrimary/bannerPrimary.styles.js

@@ -0,0 +1,19 @@
+import styled from "@emotion/styled";
+import { Alert as MAlert } from "@mui/material";
+import { primaryMain, white } from "../../../../../styles/common/mixins/colors";
+import { textBodySmall400 } from "../../../../../styles/common/mixins/fonts";
+export const Alert = styled(MAlert) `
+  border-radius: 0;
+  justify-content: center;
+  padding: 8px;
+
+  &.MuiAlert-standardPrimary {
+    background-color: ${primaryMain};
+    color: ${white};
+  }
+
+  .MuiAlert-message {
+    ${textBodySmall400};
+    text-align: center;
+  }
+`;

package/lib/components/common/Banner/components/DismissibleBanner/dismissibleBanner.d.ts

@@ -0,0 +1,10 @@
+import { AlertProps as MAlertProps } from "@mui/material";
+import { ElementType, ReactNode } from "react";
+export interface CookieBannerProps extends MAlertProps {
+    Alert?: ElementType;
+    children: ReactNode;
+    className?: string;
+    onDismiss?: () => void;
+    open: boolean;
+}
+export declare const DismissibleBanner: ({ Alert, className, children, onDismiss, open, ...props }: CookieBannerProps) => JSX.Element;

package/lib/components/common/Banner/components/DismissibleBanner/dismissibleBanner.js

@@ -0,0 +1,16 @@
+import { Fade, Alert as MAlert, } from "@mui/material";
+import React, { useEffect, useState } from "react";
+export const DismissibleBanner = ({ Alert = MAlert /* Requires forwardRef to be used as a child of Fade. */, className, children, onDismiss, open, ...props /* Spread props to allow for Mui AlertProps specific prop overrides. */ }) => {
+    const [isIn, setIsIn] = useState(false);
+    // Callback fired when the component requests to be closed.
+    const onClose = () => {
+        onDismiss?.();
+        setIsIn(false);
+    };
+    // Sets the open state.
+    useEffect(() => {
+        setIsIn(open);
+    }, [open]);
+    return (React.createElement(Fade, { in: isIn, unmountOnExit: true },
+        React.createElement(Alert, { className: className, onClose: onClose, ...props }, children)));
+};

package/lib/components/common/Banner/components/SessionTimeout/sessionTimeout.styles.d.ts

@@ -0,0 +1,3 @@
+export declare const Banner: import("@emotion/styled").StyledComponent<import("../BannerPrimary/bannerPrimary").BannerPrimaryProps & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;

package/lib/components/common/Banner/components/SessionTimeout/sessionTimeout.styles.js

@@ -0,0 +1,21 @@
+import styled from "@emotion/styled";
+import { mediaDesktopUp } from "../../../../../styles/common/mixins/breakpoints";
+import { BannerPrimary } from "../BannerPrimary/bannerPrimary";
+export const Banner = styled(BannerPrimary) `
+  gap: 12px;
+  padding: 8px 12px;
+
+  ${mediaDesktopUp} {
+    padding: 8px 16px;
+  }
+
+  .MuiAlert-message {
+    align-self: center;
+    flex: 1;
+  }
+
+  .MuiAlert-action {
+    margin: -8px;
+    padding: 0;
+  }
+`;

package/lib/components/common/Button/components/LoginButton/loginButton.d.ts

@@ -0,0 +1,3 @@
+import { ButtonProps } from "../../button";
+export type LoginButtonProps = Exclude<ButtonProps, "StartIcon">;
+export declare const LoginButton: ({ children, ...props }: LoginButtonProps) => JSX.Element;

package/lib/components/common/Button/components/LoginButton/loginButton.js

@@ -0,0 +1,6 @@
+import React from "react";
+import { LoginButton as Button, LoginButtonText } from "./loginButton.styles";
+export const LoginButton = ({ children, ...props }) => {
+    return (React.createElement(Button, { fullWidth: true, ...props },
+        React.createElement(LoginButtonText, null, children)));
+};

package/lib/components/common/Button/components/LoginButton/loginButton.styles.d.ts

@@ -0,0 +1,7 @@
+export declare const LoginButton: import("@emotion/styled").StyledComponent<Omit<import("../../button").ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+export declare const LoginButtonText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/lib/components/common/Button/components/LoginButton/loginButton.styles.js

@@ -0,0 +1,11 @@
+import styled from "@emotion/styled";
+import { ButtonSecondary } from "../ButtonSecondary/buttonSecondary";
+export const LoginButton = styled(ButtonSecondary) `
+  .MuiButton-endIcon {
+    margin-right: -6px;
+  }
+`;
+export const LoginButtonText = styled.span `
+  flex: 1;
+  text-align: left;
+`;

package/lib/components/common/IconButton/components/LoadingIconButton/loadingIconButton.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+/**
+ * Mock "loading" icon button - a placeholder element styled like a primary icon button without the use of a button element.
+ */
+export declare const LoadingIconButton: () => JSX.Element;

package/lib/components/common/IconButton/components/LoadingIconButton/loadingIconButton.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { LoadingIcon } from "../../../CustomIcon/components/LoadingIcon/loadingIcon";
+import { MockIconButtonPrimary } from "../../iconButton.styles";
+/**
+ * Mock "loading" icon button - a placeholder element styled like a primary icon button without the use of a button element.
+ */
+export const LoadingIconButton = () => {
+    return (React.createElement(MockIconButtonPrimary, null,
+        React.createElement(LoadingIcon, { fontSize: "small" })));
+};

package/lib/components/common/IconButton/components/LoadingIconButton/loadingIconButton.stories.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0fc72a6d").R, unknown>;
+export default _default;
+export declare const LoadingIconButtonStory: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0fc72a6d").R, unknown>;

package/lib/components/common/IconButton/components/LoadingIconButton/loadingIconButton.stories.js

@@ -0,0 +1,9 @@
+import React from "react";
+import { LoadingIconButton } from "./loadingIconButton";
+export default {
+    component: LoadingIconButton,
+    title: "Components/Common/IconButton/Download",
+};
+const LoadingIconButtonTemplate = () => React.createElement(LoadingIconButton, null);
+export const LoadingIconButtonStory = LoadingIconButtonTemplate.bind({});
+LoadingIconButtonStory.args = {};

package/lib/hooks/stateSyncManager/hook.d.ts

@@ -0,0 +1,19 @@
+import { UseStateSyncManagerProps } from "./types";
+/**
+ * Synchronizes state (e.g. explore state, data dictionary state) with browser URL query parameters.
+ *
+ * Keeps state and URL in sync by:
+ * - Updating URL when state changes (push/replace).
+ * - Updating state when URL changes (navigation).
+ * - Handling browser history events (back/forward buttons).
+ *
+ * Internal components:
+ * 1. Pop-State Manager - Manages browser navigation events.
+ * 2. Meta-Command Handler - Processes URL update commands from state.
+ * 3. State-URL Sync - Coordinates bidirectional synchronization.
+ *
+ * Required setup:
+ * - Action creators for state/URL operations.
+ * - State containing command flags, URL parameters, and sync configuration.
+ */
+export declare const useStateSyncManager: <Action>({ actions: actionCreators, dispatch, state, }: UseStateSyncManagerProps<Action>) => void;

package/lib/hooks/stateSyncManager/hook.js

@@ -0,0 +1,35 @@
+import { useState } from "react";
+import { useBeforePopState } from "./hooks/UseBeforePopState/hook";
+import { useMetaCommands } from "./hooks/UseMetaCommands/hook";
+import { useStateSync } from "./hooks/UseStateSync/hook";
+/**
+ * Synchronizes state (e.g. explore state, data dictionary state) with browser URL query parameters.
+ *
+ * Keeps state and URL in sync by:
+ * - Updating URL when state changes (push/replace).
+ * - Updating state when URL changes (navigation).
+ * - Handling browser history events (back/forward buttons).
+ *
+ * Internal components:
+ * 1. Pop-State Manager - Manages browser navigation events.
+ * 2. Meta-Command Handler - Processes URL update commands from state.
+ * 3. State-URL Sync - Coordinates bidirectional synchronization.
+ *
+ * Required setup:
+ * - Action creators for state/URL operations.
+ * - State containing command flags, URL parameters, and sync configuration.
+ */
+export const useStateSyncManager = ({ actions: actionCreators, dispatch, state, }) => {
+    /**
+     * Store action creators in state to maintain referential stability across renders.
+     * This prevents unnecessary re-renders in hooks that depend on these actions
+     * and ensures effect dependencies remain stable.
+     */
+    const [actions] = useState(() => actionCreators);
+    // Register pop state related side effects.
+    useBeforePopState();
+    // Set up Meta-commands related side effects.
+    useMetaCommands({ actions, dispatch, state });
+    // Dispatch state <-> URL sync side effects.
+    useStateSync({ actions, dispatch, state });
+};

package/lib/hooks/stateSyncManager/hooks/UseBeforePopState/hook.d.ts

@@ -0,0 +1 @@
+export declare const useBeforePopState: () => void;

package/lib/hooks/stateSyncManager/hooks/UseBeforePopState/hook.js

@@ -0,0 +1,21 @@
+import Router from "next/router";
+import { useCallback } from "react";
+import { useOnPopState } from "../../../../services/beforePopState/useOnPopState";
+export const useBeforePopState = () => {
+    // Callback to handle beforePopState.
+    const onBeforePopState = useCallback((state) => {
+        const basePath = Router.basePath ?? "";
+        // Use regex to remove the base path from the beginning of the URL.
+        const as = basePath
+            ? state.as.replace(new RegExp(`^${basePath}`), "") || "/"
+            : state.as;
+        // Force a full route transition to ensure page props are refreshed.
+        Router.replace(as, undefined, {
+            ...state.options,
+            shallow: false,
+        });
+        return false;
+    }, []);
+    // Pop state related side effects.
+    useOnPopState(onBeforePopState);
+};

package/lib/hooks/stateSyncManager/hooks/UseMetaCommands/hook.d.ts

@@ -0,0 +1,2 @@
+import { UseStateSyncManagerProps } from "../../types";
+export declare const useMetaCommands: <Action>({ actions, dispatch, state, }: UseStateSyncManagerProps<Action>) => void;

package/lib/hooks/stateSyncManager/hooks/UseMetaCommands/hook.js

@@ -0,0 +1,23 @@
+import Router, { useRouter } from "next/router";
+import { useEffect } from "react";
+import { META_COMMAND } from "./types";
+export const useMetaCommands = ({ actions, dispatch, state, }) => {
+    const { isReady } = useRouter();
+    useEffect(() => {
+        if (!isReady)
+            return;
+        const { command, query } = state;
+        switch (command) {
+            case META_COMMAND.STATE_TO_URL_PUSH:
+                Router.push({ query }, undefined, { shallow: true });
+                dispatch(actions.clearMeta());
+                break;
+            case META_COMMAND.STATE_TO_URL_REPLACE:
+                Router.replace({ query }, undefined, { shallow: true });
+                dispatch(actions.clearMeta());
+                break;
+            default:
+                break;
+        }
+    }, [actions, dispatch, isReady, state]);
+};

package/lib/hooks/stateSyncManager/hooks/UseMetaCommands/types.d.ts

@@ -0,0 +1,4 @@
+export declare enum META_COMMAND {
+    STATE_TO_URL_PUSH = "STATE_TO_URL_PUSH",
+    STATE_TO_URL_REPLACE = "STATE_TO_URL_REPLACE"
+}

package/lib/hooks/stateSyncManager/hooks/UseStateSync/hook.d.ts

@@ -0,0 +1,2 @@
+import { UseStateSyncManagerProps } from "../../types";
+export declare const useStateSync: <Action>({ actions, dispatch, state, }: UseStateSyncManagerProps<Action>) => void;

package/lib/hooks/stateSyncManager/hooks/UseStateSync/hook.js

@@ -0,0 +1,40 @@
+import { useRouter } from "next/router";
+import { useEffect } from "react";
+import { ROUTER_METHOD } from "../../../../providers/exploreState/actions/stateToUrl/types";
+import { useWasPop } from "../../../../providers/services/wasPop/hook";
+import { hasParams, isSynced, wasPop } from "./utils";
+export const useStateSync = ({ actions, dispatch, state, }) => {
+    const { basePath, isReady, pathname, query } = useRouter();
+    const { onClearPopRef, popRef } = useWasPop();
+    // Extract the query from the state.
+    const stateQuery = state.query;
+    // Extract the param keys from the state.
+    const paramKeys = state.paramKeys;
+    // Dispatch action to sync state <-> URL.
+    useEffect(() => {
+        // Do nothing if the router is not ready.
+        if (!isReady)
+            return;
+        // Do nothing; URL and state are in sync.
+        if (isSynced(stateQuery, query)) {
+            onClearPopRef();
+            return;
+        }
+        // Dispatch action sync URL >> state.
+        if (wasPop(basePath, pathname, popRef.current)) {
+            // When the user navigates with the back/forward buttons.
+            dispatch(actions.urlToState({ query }));
+            onClearPopRef();
+            return;
+        }
+        // Dispatch action sync URL >> state.
+        if (hasParams(query, paramKeys)) {
+            // When the URL has parameters.
+            dispatch(actions.urlToState({ query }));
+            return;
+        }
+        // Otherwise, dispatch action sync URL << state.
+        dispatch(actions.stateToUrl({ method: ROUTER_METHOD.REPLACE }));
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- deliberate omission of `state.query`, `state.paramKeys`, `actions` and `dispatch` from dependencies, hook is only expected to run when the Next.js router changes.
+    }, [basePath, isReady, pathname, query]);
+};

package/lib/hooks/stateSyncManager/hooks/UseStateSync/utils.d.ts

@@ -0,0 +1,30 @@
+import { NextRouter } from "next/router";
+import { NextHistoryState } from "../../../../services/beforePopState/types";
+/**
+ * Returns true if the query object has any of the specified keys.
+ * @param query - Query object.
+ * @param paramKeys - Array of parameter keys to check.
+ * @returns True if the query object has any of the specified keys.
+ */
+export declare function hasParams(query: NextRouter["query"], paramKeys: string[]): boolean;
+/**
+ * Returns true if the two query objects are equal.
+ * @param queryA - Query object.
+ * @param queryB - Query object.
+ * @returns True if the two query objects are equal.
+ */
+export declare function isSynced(queryA: NextRouter["query"], queryB: NextRouter["query"]): boolean;
+/**
+ * Returns a sorted string representation of a query object.
+ * @param query - Query object.
+ * @returns Sorted string representation of the query object.
+ */
+export declare function stringifyQuery(query: NextRouter["query"]): string;
+/**
+ * Returns true if the URL was navigated to using the back/forward buttons.
+ * @param basePath - Base path.
+ * @param pathname - Pathname.
+ * @param nextHistoryState - Next history state.
+ * @returns True if the URL was navigated to using the back/forward buttons.
+ */
+export declare function wasPop(basePath: string | undefined, pathname: string, nextHistoryState: NextHistoryState | undefined): boolean;

package/lib/hooks/stateSyncManager/hooks/UseStateSync/utils.js

@@ -0,0 +1,41 @@
+/**
+ * Returns true if the query object has any of the specified keys.
+ * @param query - Query object.
+ * @param paramKeys - Array of parameter keys to check.
+ * @returns True if the query object has any of the specified keys.
+ */
+export function hasParams(query, paramKeys) {
+    return paramKeys.some((key) => query[key] !== undefined);
+}
+/**
+ * Returns true if the two query objects are equal.
+ * @param queryA - Query object.
+ * @param queryB - Query object.
+ * @returns True if the two query objects are equal.
+ */
+export function isSynced(queryA, queryB) {
+    return stringifyQuery(queryA) === stringifyQuery(queryB);
+}
+/**
+ * Returns a sorted string representation of a query object.
+ * @param query - Query object.
+ * @returns Sorted string representation of the query object.
+ */
+export function stringifyQuery(query) {
+    return JSON.stringify(Object.keys(query)
+        .sort()
+        .reduce((acc, key) => ({ ...acc, [key]: query[key] }), {}));
+}
+/**
+ * Returns true if the URL was navigated to using the back/forward buttons.
+ * @param basePath - Base path.
+ * @param pathname - Pathname.
+ * @param nextHistoryState - Next history state.
+ * @returns True if the URL was navigated to using the back/forward buttons.
+ */
+export function wasPop(basePath = "", pathname, nextHistoryState) {
+    if (!nextHistoryState)
+        return false;
+    const [path] = nextHistoryState.url.split("?");
+    return path === `${basePath}${pathname}`;
+}

package/lib/hooks/stateSyncManager/types.d.ts

@@ -0,0 +1,26 @@
+import { NextRouter } from "next/router";
+import { Dispatch } from "react";
+import { ROUTER_METHOD } from "../../providers/exploreState/actions/stateToUrl/types";
+import { META_COMMAND } from "./hooks/UseMetaCommands/types";
+export type ActionCreator<P, DispatchType> = [P] extends [void] ? () => DispatchType : (payload: P) => DispatchType;
+export interface StateToUrlPayload {
+    method: ROUTER_METHOD;
+}
+export interface UrlToStatePayload {
+    query: NextRouter["query"];
+}
+export interface StateSyncManagerActions<Action> {
+    clearMeta: ActionCreator<void, Action>;
+    stateToUrl: ActionCreator<StateToUrlPayload, Action>;
+    urlToState: ActionCreator<UrlToStatePayload, Action>;
+}
+export interface StateSyncManagerContext {
+    command: META_COMMAND | undefined;
+    paramKeys: string[];
+    query: NextRouter["query"];
+}
+export interface UseStateSyncManagerProps<Action> {
+    actions: StateSyncManagerActions<Action>;
+    dispatch: Dispatch<Action>;
+    state: StateSyncManagerContext;
+}

package/lib/hooks/stateSyncManager/types.js

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useAuthentication/common/constants.d.ts

@@ -0,0 +1,4 @@
+import { LoginResponse, LoginStatus } from "./entities";
+export declare const LOGIN_STATUS_FAILED: LoginStatus<LoginResponse>;
+export declare const LOGIN_STATUS_NOT_STARTED: LoginStatus<LoginResponse>;
+export declare const LOGIN_STATUS_NOT_SUPPORTED: LoginStatus<LoginResponse>;

package/lib/hooks/useAuthentication/common/constants.js

@@ -0,0 +1,19 @@
+import { REQUEST_STATUS } from "./entities";
+export const LOGIN_STATUS_FAILED = {
+    isSuccess: false,
+    isSupported: true,
+    requestStatus: REQUEST_STATUS.FAILED,
+    response: undefined,
+};
+export const LOGIN_STATUS_NOT_STARTED = {
+    isSuccess: false,
+    isSupported: true,
+    requestStatus: REQUEST_STATUS.NOT_STARTED,
+    response: undefined,
+};
+export const LOGIN_STATUS_NOT_SUPPORTED = {
+    isSuccess: false,
+    isSupported: false,
+    requestStatus: REQUEST_STATUS.NOT_STARTED,
+    response: undefined,
+};

package/lib/hooks/useAuthentication/common/entities.d.ts

@@ -0,0 +1,25 @@
+import { GoogleResponse } from "../useFetchGoogleProfile";
+import { TerraNIHResponse } from "../useFetchTerraNIHProfile";
+import { TerraResponse } from "../useFetchTerraProfile";
+import { TerraTermsOfServiceResponse } from "../useFetchTerraTermsOfService";
+export declare enum AUTHENTICATION_STATUS {
+    COMPLETED = "COMPLETED",
+    INCOMPLETE = "INCOMPLETE"
+}
+export type LoginResponse = GoogleResponse | TerraResponse | TerraNIHResponse | TerraTermsOfServiceResponse;
+export interface LoginResponseError {
+    message: string;
+    source: string;
+    statusCode: number;
+}
+export interface LoginStatus<T> {
+    isSuccess: boolean;
+    isSupported: boolean;
+    requestStatus: REQUEST_STATUS;
+    response: T | undefined;
+}
+export declare enum REQUEST_STATUS {
+    COMPLETED = "COMPLETED",
+    FAILED = "FAILED",
+    NOT_STARTED = "NOT_STARTED"
+}

package/lib/hooks/useAuthentication/common/entities.js

@@ -0,0 +1,11 @@
+export var AUTHENTICATION_STATUS;
+(function (AUTHENTICATION_STATUS) {
+    AUTHENTICATION_STATUS["COMPLETED"] = "COMPLETED";
+    AUTHENTICATION_STATUS["INCOMPLETE"] = "INCOMPLETE";
+})(AUTHENTICATION_STATUS || (AUTHENTICATION_STATUS = {}));
+export var REQUEST_STATUS;
+(function (REQUEST_STATUS) {
+    REQUEST_STATUS["COMPLETED"] = "COMPLETED";
+    REQUEST_STATUS["FAILED"] = "FAILED";
+    REQUEST_STATUS["NOT_STARTED"] = "NOT_STARTED";
+})(REQUEST_STATUS || (REQUEST_STATUS = {}));

package/lib/hooks/useAuthentication/common/utils.d.ts

@@ -0,0 +1,15 @@
+import { LoginResponse, LoginStatus } from "./entities";
+/**
+ * Returns the options for an authentication request.
+ * @param token - Token.
+ * @returns request options.
+ */
+export declare function getAuthenticationRequestOptions(token: string): RequestInit;
+/**
+ * Returns login status.
+ * An undefined endpoint will return a not supported login status,
+ * otherwise a not started login status is returned.
+ * @param endpoint - Endpoint.
+ * @returns initial login status.
+ */
+export declare function initLoginStatus(endpoint?: string): LoginStatus<LoginResponse>;

package/lib/hooks/useAuthentication/common/utils.js

@@ -0,0 +1,25 @@
+import { LOGIN_STATUS_NOT_STARTED, LOGIN_STATUS_NOT_SUPPORTED, } from "./constants";
+/**
+ * Returns the options for an authentication request.
+ * @param token - Token.
+ * @returns request options.
+ */
+export function getAuthenticationRequestOptions(token) {
+    const headers = new Headers();
+    headers.append("authorization", "Bearer " + token);
+    return { headers };
+}
+/**
+ * Returns login status.
+ * An undefined endpoint will return a not supported login status,
+ * otherwise a not started login status is returned.
+ * @param endpoint - Endpoint.
+ * @returns initial login status.
+ */
+export function initLoginStatus(endpoint) {
+    if (!endpoint) {
+        // Endpoint not supported.
+        return LOGIN_STATUS_NOT_SUPPORTED;
+    }
+    return LOGIN_STATUS_NOT_STARTED;
+}

package/lib/hooks/useAuthentication/useAuthentication.d.ts

@@ -0,0 +1,6 @@
+import { AuthContextProps } from "../../providers/authentication";
+/**
+ * Returns authentication context.
+ * @returns authentication context.
+ */
+export declare const useAuthentication: () => AuthContextProps;

package/lib/hooks/useAuthentication/useAuthentication.js

@@ -0,0 +1,9 @@
+import { useContext } from "react";
+import { AuthContext } from "../../providers/authentication";
+/**
+ * Returns authentication context.
+ * @returns authentication context.
+ */
+export const useAuthentication = () => {
+    return useContext(AuthContext);
+};

package/lib/hooks/useAuthentication/useAuthenticationComplete.d.ts

@@ -0,0 +1,6 @@
+import { AUTHENTICATION_STATUS } from "./common/entities";
+/**
+ * Handles the completion of the authentication process.
+ * @param authenticationStatus - Authentication status.
+ */
+export declare const useAuthenticationComplete: (authenticationStatus: AUTHENTICATION_STATUS) => void;

package/lib/hooks/useAuthentication/useAuthenticationComplete.js

@@ -0,0 +1,55 @@
+import Router, { useRouter } from "next/router";
+import { useEffect, useMemo, useRef } from "react";
+import { escapeRegExp } from "../../common/utils";
+import { ROUTE_LOGIN } from "../../providers/authentication";
+import { INACTIVITY_PARAM } from "../useSessionTimeout";
+import { AUTHENTICATION_STATUS } from "./common/entities";
+/**
+ * Handles the completion of the authentication process.
+ * @param authenticationStatus - Authentication status.
+ */
+export const useAuthenticationComplete = (authenticationStatus) => {
+    const { asPath } = useRouter();
+    const routeHistoryRef = useRef(initRouteHistory(asPath));
+    // Maintain a history of routes that have been visited prior to authentication.
+    routeHistoryRef.current = useMemo(() => updateRouteHistory(routeHistoryRef.current, asPath), [asPath]);
+    // Redirect to the previous route after authentication is completed.
+    useEffect(() => {
+        if (authenticationStatus === AUTHENTICATION_STATUS.COMPLETED) {
+            Router.push(routeHistoryRef.current);
+        }
+    }, [authenticationStatus]);
+};
+/**
+ * Initializes route history with the current path.
+ * Returns base path if current path is the login route.
+ * @param path - current browser path.
+ * @returns path to be used as the initial route history.
+ */
+function initRouteHistory(path) {
+    return path === ROUTE_LOGIN ? "/" : removeInactivityTimeoutQueryParam(path);
+}
+/**
+ * Removes the inactivity timeout query parameter from the path.
+ * the inactivity timeout parameter is used to indicate that the session has timed out; remove the parameter to
+ * clear the session timeout banner after the user logs in again.
+ * @param path - Path.
+ * @returns path without the inactivity timeout query parameter.
+ */
+function removeInactivityTimeoutQueryParam(path) {
+    const regex = new RegExp(`\\?${escapeRegExp(INACTIVITY_PARAM)}(?:$|[=&].*)`);
+    return path.replace(regex, "");
+}
+/**
+ * Updates route history with the current path, unless the current path is the LoginView page.
+ * @param prevPath - route history path.
+ * @param path - current browser path.
+ * @returns updated path to be used as the route history.
+ */
+function updateRouteHistory(prevPath, path) {
+    let currentPath = prevPath;
+    if (path !== ROUTE_LOGIN) {
+        currentPath = path;
+    }
+    return removeInactivityTimeoutQueryParam(currentPath);
+}

package/lib/hooks/useAuthentication/useAuthenticationForm.d.ts

@@ -0,0 +1,20 @@
+export interface OnboardingStatus {
+    active: boolean;
+    completed: boolean;
+}
+export declare enum ONBOARDING_STEP {
+    NIH_ACCOUNT = 3,
+    TERRA_ACCOUNT = 1,
+    TERRA_TOS = 2
+}
+interface UseAuthenticationForm {
+    isComplete: boolean;
+    isReady: boolean;
+    onboardingStatusByStep: Map<ONBOARDING_STEP, OnboardingStatus>;
+}
+/**
+ * Handles authentication form onboarding.
+ * @returns onboarding steps and corresponding status.
+ */
+export declare const useAuthenticationForm: () => UseAuthenticationForm;
+export {};