import React, { useEffect } from 'react'
import { logout } from '../actions/auth.actions';
import { connect } from 'react-redux';
import { ConnectedPage as Page } from './page';

export function LogoutPage({ dispatch, isLoggedIn, history }) {
    useEffect(() => {
        dispatch(logout());
    }, []);
    
    useEffect(() => {
        if (!isLoggedIn) history.push("/login");
    }, [isLoggedIn]);

    return (
        <Page title="Déconnexion">
            <div className="message is-info">
                <div className="message-body">
                    Déconnexion en cours...
                </div>
            </div>
        </Page>
    )
}

function mapStateToProps({ session }) {
    return { isLoggedIn: session.isLoggedIn };
}

export const ConnectedLogoutPage = connect(mapStateToProps)(LogoutPage);