Skip to Content
HooksuseAsync

useAsync

Purpose

useAsync provides reusable behavior for common interaction patterns.

Import

import { useAsync } from "@tesseract-nexus/tesserix-ui"

API reference

import { useCallback, useEffect, useState } from "react" interface UseAsyncState<T> { /** * Loading state */ isLoading: boolean /** * Error if operation failed */ error: Error | null /** * Result data if operation succeeded */ data: T | null /** * Status of the async operation */ status: "idle" | "pending" | "success" | "error" } interface UseAsyncResult<T> extends UseAsyncState<T> { /** * Execute the async function */ execute: (...args: unknown[]) => Promise<T | null> /** * Reset the state */ reset: () => void } /** * Hook for managing async operations state * @param asyncFunction - Async function to execute * @param immediate - Whether to execute immediately on mount * @returns State and control functions for the async operation */ export function useAsync<T>( asyncFunction: (...args: unknown[]) => Promise<T>, immediate = false ): UseAsyncResult<T> { const [state, setState] = useState<UseAsyncState<T>>({ isLoading: false, error: null, data: null, status: "idle", }) const execute = useCallback( async (...args: unknown[]) => { setState({ isLoading: true, error: null, data: null, status: "pending", }) try { const response = await asyncFunction(...args) setState({ isLoading: false, error: null, data: response, status: "success", }) return response } catch (error) { setState({ isLoading: false, error: error instanceof Error ? error : new Error("Unknown error"), data: null, status: "error", }) return null } }, [asyncFunction] ) const reset = useCallback(() => { setState({ isLoading: false, error: null, data: null, status: "idle", }) }, []) useEffect(() => { if (immediate) { execute() } }, [execute, immediate]) return { ...state, execute, reset } }

Do / Don’t

Do

const stableCallback = useCallback(() => {}, [])

Don’t

const unstableCallback = () => {}

Token / Theming Mapping

  • Hooks do not directly map to visual tokens.
  • Apply tokenized classes in consuming components based on hook outputs.

Interaction Test Checklist

  1. Initial state assertions.
  2. Primary state transition assertions.
  3. Cleanup behavior assertions (events/timers/observers).
  4. Error and edge path assertions where applicable.
  5. Integration test in one real component flow.