patrickcze

import React, { useState, useEffect, useContext } from "react";

const PING_RESOURCE = "/ping.txt";
const TIMEOUT_TIME_MS = 3000;
const onlinePollingInterval = 10000;

const timeout = (time: number, promise: Promise) => {
  return new Promise(function(resolve, reject) {
    setTimeout(() => {
      reject(new Error("Request timed out."));

patrickcze

import React from "react";
import { useOnlineStatus } from "../../utilities/useOnlineStatus";

const Home: React.FC = () => {
  const isOnline = useOnlineStatus();

  return <div>I am {isOnline ? "online" : "offline"}!</div>;
};

export default Home;

patrickcze

import React from "react";
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";

import Home from "../Home";
import { OnlineStatusProvider } from "../../utilities/useOnlineStatus";

const App: React.FC = () => {
  return (
    <OnlineStatusProvider>
      <Router>

patrickcze

import React, { useState, useEffect, useContext } from "react";

const OnlineStatusContext = React.createContext(true);

export const OnlineStatusProvider: React.FC = ({ children }) => {
  const [onlineStatus, setOnlineStatus] = useState<boolean>(true);

  useEffect(() => {
    window.addEventListener("offline", () => {
      setOnlineStatus(false);