import React from "react";
import "./index.less";

export default class SelectedTab extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedKey: "0"
    };
  }

  handleChange(item) {
    this.setState({
      selectedKey: item.key
    });
    this.props.onChange(item);
  }

  render() {
    return (
      <div className="selectedTabWrapper">
        {
          this.props.items.map(item => (
            <div className={item.key == this.state.selectedKey ? "selectedTab selectedItem" : "selectedTab"}
                 onClick={() => {
                   this.handleChange(item);
                 }}>
              {item.name}
            </div>
          ))
        }
      </div>
    );
  }
}