import { i18n } from "arm-common";
import agui from "arm-gui";
import React from "react";
import { connect } from "react-redux";

import { AppConstants } from "../../constants/AppConstants.js";
import AccountActions from "./AccountActions.js";


export default class Logout extends React.PureComponent {
    componentDidMount() {
        this.props.logout();
    }

    back = () => {
        this.props.history.push("login");
        location.reload();
    }

    render() {
        return (
            <LoginContainer header footer={`V. ${AppConstants.VERSIONE}`}>
                <agui.aCard>
                    <agui.aCardHeader>
                        {i18n("V2.LOGOUT.CARD_TIT.USER_LOGGED_OUT", "Utente Disconnesso")}
                    </agui.aCardHeader>

                    <agui.aCardBody>
                        <p>{i18n("V2.LOGOUT.MESS_LOG.SESSION_HAS_BEEN_CLOSED.", "Session has been closed.")}</p>
                        <p>{i18n("V2.LOGOUT.MESS_LOG.TO_WORK_ON_THE_APPLICATION", "To work on the application click on the \"home\" button")}</p>
                    </agui.aCardBody>

                    <agui.aCardFooter>
                        <agui.aButton
                            bs="primary"
                            type="submit"
                            onClick={this.back}
                        > {i18n("V2.LOGOUT.BUTTON_TIT_LOG.HOME", "HOME")} </agui.aButton>
                    </agui.aCardFooter>
                </agui.aCard>
            </LoginContainer>
        );
    }
}

const mapDispatchToProps = (dispatch) => ({
    logout: () => dispatch(AccountActions.logout()),
});

Logout = connect(null, mapDispatchToProps)(Logout);