Skip to main content

General Error Hooks Deep Dive

Archibald provides utility hooks for monitoring high-level application errors, such as network failures.

useNetworkError​

This hook monitors the status of the last HTTP request made by the application. It is primarily used to detect 404s or other API failures that should trigger a specific UI state (like a "Page Not Found" component).

warning

The hook currently hardcodes the last HTTP status to 200 internally, so it always returns false. See useNetworkError for details.

Key Parameters:​

  • errorCodes: An array of HTTP status codes to watch for. Defaults to [404].
  • loose: Defaults to true. If true, the hook will return true if the last status code is strictly greater than any code in the errorCodes array.

How it Works Step-by-Step​

Scenario: useNetworkError​

  1. Request Execution: An API request is made via DataClient or a storefront client.
  2. Status Tracking: The hook is intended to observe the resulting HTTP status code of the last request (currently this value is hardcoded to 200, see the warning above).
  3. Comparison: When the status updates, the hook compares the new status code against your errorCodes:
    • If loose: true (the default) and status > code for any configured code, it returns true.
    • If loose: false and status is strictly in errorCodes, it returns true.
  4. Re-render: The component using the hook re-renders with the updated boolean value.

Best Practice: Use useNetworkError in your top-level routing or layout components to handle 404 or 500 errors gracefully by switching to error-specific views.