React hook to detect online and offline network state.
You can play with it yourself here filipchalupa.cz/use-connection-state.
npm install use-connection-state
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>
)
}
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>
)
}
- Install dependencies:
npm ci
- Run:
npm run dev