import React from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { Redirect, Link } from "react-router-dom";

const mapStateToProps = (state) => ({
  isActivated: state.userStore.get("isActivated"),
  isLogged: state.userStore.get("isLogged"),
});

const UserActivation = (props) => {
  if (!props.isLogged) {
    return <Redirect to="/users/login" />;
  }

  if (props.isActivated) {
    return <Redirect to="/" />;
  }

  return (
    <div className="row">
      <div className="col-12 col-md-8 offset-md-2">
        <h2>Waiting for activation</h2>
        <hr />
        <h3>
          Hang tight! Your user will soon be activated by the administrators of
          this site.
        </h3>
        <Link to="/users/logout">Logout</Link>
      </div>
    </div>
  );
};
UserActivation.propTypes = {
  isActivated: PropTypes.bool.isRequired,
  isLogged: PropTypes.bool.isRequired,
};

export default connect(mapStateToProps)(UserActivation);