import React from 'react';
import PokemonList from './pokemon-list';

class WantGroup extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      groupName: props.groupName,
    };
  }

  componentDidMount() {
  }

  render() {
    const that = this;

    const { pokemonList, handleEditPokemonClick, handleDeletePokemonClick, groupId } = that.props;

    return (
      <div>
        <h1>{this.state.groupName}</h1>
        <PokemonList pokemonList={pokemonList} />
        <button style={{ fontSize: '10em' }} onClick={handleDeletePokemonClick(groupId)}>Delete</button>
        <button style={{ fontSize: '10em' }} onClick={handleEditPokemonClick(groupId)}>Edit</button>
      </div>
    );
  }
}

export default WantGroup;