const textGenForm = document.querySelector('.text-gen-form');

const translateText = async (text) => {
    console.log("Sending request with text:", text);  // Log the input text
    try {
        const inferResponse = await fetch(`infer_t5?input=${encodeURIComponent(text)}`);
        if (!inferResponse.ok) {
            throw new Error(`HTTP error! status: ${inferResponse.status}`);
        }
        const inferJson = await inferResponse.json();
        console.log("Received response:", inferJson);  // Log the response
        return inferJson.output;
    } catch (error) {
        console.error("Error during API request:", error);  // Log any errors
        throw error;
    }
};

textGenForm.addEventListener('submit', async (event) => {
  event.preventDefault();

  const textGenInput = document.getElementById('text-gen-input');
  const textGenParagraph = document.querySelector('.text-gen-output');

  try {
    textGenParagraph.textContent = "Loading...";  // Show loading state
    textGenParagraph.textContent = await translateText(textGenInput.value);
  } catch (err) {
    textGenParagraph.textContent = "An error occurred. Please try again.";  // Show error message
  }
});