import "./AddUrl.css";

function AddUrl({ setShort }) {
  return (
    <div>
      <h1 id="title">ENCURTADOR DE URL</h1>
      <form
        id="id-form"
        method="post"
        onSubmit={(e) => {
          e.preventDefault();

          const form = e.target;
          const formData = new FormData(form);
          const formJson = Object.fromEntries(formData.entries());
          let data = formJson["url"];

          fetch("https://sl.azuminha.com/add/" + encodeURIComponent(data))
            .then((response) => {
              if (!response.ok) {
                throw new Error("Network response was not ok");
              }
              return response.text();
            })
            .then((result) => {
              console.log(result);
              setShort("sl.azuminha.com/" + result);
              //const res = document.createElement("p");
              //res.textContent = data + " => " + "sl.azuminha.com/" + result;
              //document.body.appendChild(res);
            });
        }}
      >
        <label id="id-label">
          URL:
          <input name="url" id="inp" type="text" />
        </label>
        <button
          id="btn1"
          onClick={() => {
            console.log("OLA");
          }}
        >
          enviar
        </button>
      </form>
    </div>
  );
}

export default AddUrl;