import React, { useEffect, useState } from "react";
import "./style.css";

const App = () => {
  const [data, setData] = useState({});
  const [showInfo, setShowInfo] = useState(false);

  const fetchData = async () => {
    const response = await fetch("https://jsonplaceholder.typicode.com/posts");
    const result = await response.json();
    setData(result);
    console.log(result);
  };

  useEffect(() => {
    fetchData();
  }, []);

  const handleButtonClick = () => {
    setShowInfo(!showInfo);
  };

  return (
    <>
      <button onClick={handleButtonClick}>
        {showInfo ? "Hide Info" : "Get Info"}
      </button>
      <br />
      {showInfo && data[10].title}
    </>
  );
};

export default App;