options.js

document.addEventListener("DOMContentLoaded", async () => {
  const apiKeyInput = document.getElementById("apiKey");
  const saveBtn = document.getElementById("saveBtn");
  const clearBtn = document.getElementById("clearBtn");
  const toast = document.getElementById("toast");

  // Load existing key
  const { apiKey } = await chrome.storage.sync.get("apiKey");
  if (apiKey) {
    apiKeyInput.value = apiKey;
  }

  function showToast(message, type) {
    toast.textContent = message;
    toast.className = "toast " + type;
    setTimeout(() => {
      toast.className = "toast";
    }, 3000);
  }

  saveBtn.addEventListener("click", async () => {
    const key = apiKeyInput.value.trim();
    if (!key) {
      showToast("Please enter an API key.", "error");
      return;
    }

    await chrome.storage.sync.set({ apiKey: key });
    showToast("API key saved successfully!", "success");
  });

  clearBtn.addEventListener("click", async () => {
    apiKeyInput.value = "";
    await chrome.storage.sync.remove("apiKey");
    showToast("API key cleared.", "success");
  });

  // Save on Enter
  apiKeyInput.addEventListener("keydown", (e) => {
    if (e.key === "Enter") {
      saveBtn.click();
    }
  });
});