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

  const translateText = async (question, context) => {
      try {
          const response = await fetch(`generate-text?question=${encodeURIComponent(question)}&context=${encodeURIComponent(context)}`);
          if (!response.ok) {
              throw new Error('Network response was not ok.');
          }
          const data = await response.json();
          return data.output;
      } catch (error) {
          console.error("Error:", error);
          return "Failed to generate text. Please try again later.";
      }
  };

  textGenForm.addEventListener("submit", async (event) => {
      event.preventDefault();
      const textGenContext = document.getElementById("text-gen-context");
      const textGenQuestion = document.getElementById("text-gen-question");
      const textGenParagraph = document.querySelector(".text-gen-output");

      // Display a loading message or similar feedback
      textGenParagraph.textContent = "Generating answer...";

      const output = await translateText(textGenQuestion.value, textGenContext.value);
      textGenParagraph.textContent = output;
  });
});