document.addEventListener("DOMContentLoaded", () => {
  const textGenForm = document.querySelector(".text-gen-form");

  const translateText = async (text) => {
    const inferResponse = await fetch("/translate", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({ text }),
    });
    console.log("Trying to translate text");
    console.log(text)
    const inferJson = await inferResponse.json();
    return inferJson.translation;
  };

  textGenForm.addEventListener("submit", async (event) => {
    console.log("Submit bottom tapped");
    event.preventDefault();
    const textGenInput = document.getElementById("text-gen-input");
    const textGenParagraph = document.querySelector(".text-gen-output");
    textGenParagraph.textContent = await translateText(textGenInput.value);
  });
});