import React, { Component } from "react";
import { withRouter } from "react-router-dom";
import "./adminMenu.scss";
import { adminMenu } from "../../state/adminMenu";

class AdminMenu extends Component {
    constructor(props) {
        super(props);

        this.state = {adminMenu};
    }

    clickEventHandler = (e) => {
        const elem = adminMenu.find(el => el.id === +e.target.id)
        this.props.history.push(elem.path)
    }

    render(){
        return(
            <div className = "menu-block">
                {adminMenu.map(el =>
                                el.text !== "Log out" && el.text !== "Main Page" &&
                                <div 
                                className="menu-skew" 
                                path = {el.path}  
                                key={el.id} 
                                id = {el.id} 
                                onClick = {this.clickEventHandler}
                                >
                                    <h2 className = "menu-text">{el.text.toUpperCase()}</h2>
                                    {/* <Link to={el.path} className = "menu-text"> {el.text.toUpperCase()} </Link> */}
                                </div>
							)
						}
            </div>
        )
    }
}

export default withRouter(AdminMenu)