import "./styles.css";
import { useState } from "react";

export default function App() {
  const [basket, setBasket] = useState([]);

  const loadPokemons = function () {
    return fetch("https://pokeapi.co/api/v2/pokemon");
  };

  const doLoadPokemons = function () {
    loadPokemons()
      .then((poke) => poke.json())
      .then((poke) => {
        setBasket(poke.results);
      });
  };
  return (
    <div className="App">
      <button onClick={doLoadPokemons}>Load</button>
      <h1>Pokemons</h1>
      <pre>{basket.map((pokemon) => pokemon.name + "\n")}</pre>
    </div>
  );
}