Skip to main content

useAuth

Overview​

The useAuth hook provides functionality for managing user authentication status and retrieving user authentication data.

Functionality​

  • Retrieves authentication data from local storage, including user token and user information.
  • Verifies authentication token's validity through API call.
  • Returns authenticated user data

Usage​

import { useAuth } from 'path/to/useAuth';

const Component = () => {
  const { data: authData, isLoading, isError } = useAuth();

  if (isLoading) {
    return <LoadingSpinner />;
  }

  if (isError) {
    return <ErrorScreen />;
  }

  return <AuthenticatedComponent user={authData.user} />;
};

Additional Details​

  • It queries verify function from @lunchbox/api to verify the authentication token's validity.
  • Authentication data is retrieved from local storage using the AUTH_STORAGE_KEY constant.
  • The hook returns authenticated user data, excluding token, to maintain security.
  • retryOnMount, retry, and refetchOnWindowFocus are configured to control the hook's behavior.
  • staleTime option is set to Infinity to ensure that the authentication data remains valid throughout the user session.