pixies

1import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
2import {faExclamationTriangle} from "@fortawesome/free-solid-svg-icons";
3import {useEffect, useState} from "react";
4import "./styles.sass";
5
6export const Error = (props) => {
7    const [reloadTimer, setReloadTimer] = useState(5);
8
9    useEffect(() => {
10        if (props.disableReload) return;
11        const interval = setInterval(() => {
12            if (reloadTimer > 0) {
13                setReloadTimer(reloadTimer - 1)
14            } else {
15                window.location = window.location.href;
16            }
17        }, 1000);
18
19        return () => clearInterval(interval);
20    }, [reloadTimer]);
21
22    return (
23        <div className={"error-page" + (props.disableReload ? " no-reload" : "")}>
24            <FontAwesomeIcon icon={faExclamationTriangle} size="8x"/>
25            <h1>{props.text}</h1>
26            {!props.disableReload && <h2>Reloading {reloadTimer !== 0 ? <>in <span>{reloadTimer}</span> seconds</> :
27                <span>now</span>}...</h2>}
28        </div>
29    )
30}