useNetworkInformation

GitHub

Custom hook that tracks the device's network connection status and details (speed, type) using the Network Information API.

Installation

npx sse-hooks add use-network-information

yarn dlx sse-hooks add use-network-information

pnpm dlx sse-hooks add use-network-information

deno run -A npm:sse-hooks add use-network-information

bunx sse-hooks add use-network-information

Usage

example.ts

import { useNetworkInformation } from "./{hooks file}";

const { isOnline, networkInfo } = useNetworkInformation();
if (!isOnline) return <div>You are offline</div>;
return (
  <div>
    Connection: {networkInfo?.effectiveType} ({networkInfo?.downlink} Mbps)
  </div>
);

API

Parameters

Prop	Default	Type

Returns

Return Value	Default	Type
`return`	-	`UseNetworkInformationReturn` Hook return value

Types Aliases

No specific type aliases defined for this component.

Changelog

31af5 — Refactor useBattery hook and remove utility functions

c165d — feat: enhance useRoleGuard and useSSR hooks with additional options and documentation

30da4 — feat: add new hooks and their metadata

2f161 — feat: add useConferenceSystem, useKbd, useMediaQuality, useNetworkInformation, usePortal, useRoleGuard, useScreenShare, useSymbol hooks

useFetch

Custom hook that provides a wrapper around the native `fetch API` to handle HTTP requests with state management, abort capability, and TypeScript support.

useEventCallback

Custom hook that creates a memoized event callback.