import React from "react";
import { useNavigate } from "react-router-dom";
import { apiClient } from "../utils/httpClients";

export default class Logout extends React.Component {
    constructor(props) {
        super(props);
    }

    async componentDidMount() {
        const logoutResponse = await apiClient.get("/user/logout");
        let navigation = useNavigate();
        if (logoutResponse.status === 401) {
            navigation("/dashboard", { replace: true });
        } else {
            this.redirectTimer = setTimeout(() => {
                navigation("/", { replace: true });
            }, 2000);
        }
    }

    async componentWillUnmount() {
        clearTimeout(this.redirectTimer);
    }

    render() {
        return (
            <div className="page-root">
                <div>
                    <h1>You are now logged out. See you later!</h1>
                    <p className="text-muted">We will redirect you shortly...</p>
                </div>
            </div>
        );
    }
}