Skip to content

useOnlineStatus()

useOnlineStatus(): boolean

Defined in: hooks/dom/useOnlineStatus.ts:62

A React hook to track whether the current environment is online.

It:

  • Reads the initial value from navigator.onLine (when available).
  • Subscribes to the global online and offline events on window.
  • Updates state whenever connectivity changes.

In non-browser/SSR environments, it defaults to true and will only start updating once hydrated in the browser.

Returns

boolean

true if the browser is online, otherwise false.

Example

tsx
import { useOnlineStatus } from '@zl-asica/react';

const StatusBanner = () => {
  const online = useOnlineStatus();

  if (!online) {
    return <p>You are currently offline.</p>;
  }

  return <p>All good, you are online ✅</p>;
};

Released under the MIT License.