const modelUrl = "https://api-inference.huggingface.co/models/Qwen/Qwen3.8-Flash-Next";
const promptEl = document.getElementById("prompt");
const outputEl = document.getElementById("output");
const statusEl = document.getElementById("status");
const generateBtn = document.getElementById("generateBtn");
const clearBtn = document.getElementById("clearBtn");

function setStatus(text, isError = false) {
  statusEl.textContent = text;
  statusEl.style.color = isError ? "#ff9ca7" : "#9cb0d9";
}

function extractGeneratedText(payload) {
  if (Array.isArray(payload) && payload.length > 0) {
    if (typeof payload[0]?.generated_text === "string") {
      return payload[0].generated_text;
    }
    if (Array.isArray(payload[0]?.generated_text)) {
      return payload[0].generated_text.join("\n");
    }
  }

  if (payload && typeof payload.generated_text === "string") {
    return payload.generated_text;
  }

  if (payload && typeof payload.error === "string") {
    throw new Error(payload.error);
  }

  return JSON.stringify(payload, null, 2);
}

async function generateResponse(prompt) {
  const body = {
    inputs: prompt,
    parameters: {
      max_new_tokens: 280,
      temperature: 0.7,
      top_p: 0.95,
      do_sample: true
    },
    options: {
      wait_for_model: true
    }
  };

  const response = await fetch(modelUrl, {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify(body)
  });

  if (!response.ok) {
    const errorText = await response.text();
    throw new Error(`Request failed (${response.status}): ${errorText}`);
  }

  const data = await response.json();
  return extractGeneratedText(data);
}

async function handleGenerate() {
  const prompt = promptEl.value.trim();
  if (!prompt) {
    outputEl.textContent = "Please enter a prompt first.";
    return;
  }

  generateBtn.disabled = true;
  setStatus("Generating…");
  outputEl.textContent = "Working on it…";

  try {
    const answer = await generateResponse(prompt);
    outputEl.textContent = answer.trim() || "The model returned an empty response.";
    setStatus("Done.");
  } catch (error) {
    outputEl.textContent = error.message || "There was an error generating the response.";
    setStatus("Error generating response.", true);
  } finally {
    generateBtn.disabled = false;
  }
}

function handleClear() {
  promptEl.value = "";
  outputEl.textContent = "Your model response will appear here.";
  setStatus("Ready.");
}

generateBtn.addEventListener("click", handleGenerate);
clearBtn.addEventListener("click", handleClear);