use-connection-state
TypeScript icon, indicating that this package has built-in type declarations

0.2.0 • Public • Published

Connection state hook npm npm type definitions

React hook to detect online and offline network state.

You can play with it yourself here filipchalupa.cz/use-connection-state.

Installation

npm install use-connection-state

Usage

import { useConnectionState } from 'use-connection-state'

const App = () => {
	const connection = useConnectionState()

	return (
		<main>
			<h1>Connection state</h1>
			<p>Online: {connection === 'online' ? 'yes' : 'no'}</p>
		</main>
	)
}

Endpoints

import { createUseConnectionStateHook } from 'use-connection-state'

// Add endpoints to detect connection state. The library will try to fetch these endpoints.
const useConnectionStateWithEndpoints = createUseConnectionStateHook({
	endpoints: [location.href, 'https://www.google.com'],
})

const App = () => {
	const connection = useConnectionStateWithEndpoints()

	return (
		<main>
			<h1>Connection state</h1>
			<p>Online: {connection === 'online' ? 'yes' : 'no'}</p>
		</main>
	)
}

Development

  • Install dependencies: npm ci
  • Run: npm run dev

Package Sidebar

Install

npm i use-connection-state

Weekly Downloads

36

Version

0.2.0

License

ISC

Unpacked Size

9.43 kB

Total Files

9

Last publish

Collaborators

  • onset