popup.js

const CURRENCY_SYMBOLS = {
  USD: "$",
  EUR: "€",
  GBP: "£",
  CAD: "CA$",
  AUD: "A$",
  JPY: "¥",
  CNY: "¥",
  INR: "₹",
};

document.addEventListener("DOMContentLoaded", () => {
  const toggle = document.getElementById("toggle");
  const status = document.getElementById("status");
  const settingsBtn = document.getElementById("settings-btn");
  const blockedEl = document.getElementById("blocked-count");
  const savedEl = document.getElementById("money-saved");

  let currency = "USD";
  let lastStats = null;

  function renderStats(stats) {
    lastStats = stats || {};
    const sym = CURRENCY_SYMBOLS[currency] || "$";
    blockedEl.textContent = (lastStats.blocked ?? 0).toLocaleString();
    savedEl.textContent = sym + Math.round(lastStats.saved ?? 0).toLocaleString();
  }

  chrome.storage.sync.get({ enabled: true, currency: "USD" }, (data) => {
    currency = data.currency || "USD";
    toggle.checked = data.enabled;
    status.textContent = data.enabled ? "Locking buttons" : "Paused";
    chrome.storage.local.get("stats", ({ stats }) => renderStats(stats));
  });

  chrome.storage.onChanged.addListener((changes, area) => {
    if (area === "local" && changes.stats) {
      renderStats(changes.stats.newValue);
    }
    if (area === "sync" && changes.currency) {
      currency = changes.currency.newValue || "USD";
      renderStats(lastStats);
    }
  });

  toggle.addEventListener("change", () => {
    const enabled = toggle.checked;
    chrome.storage.sync.set({ enabled });
    status.textContent = enabled ? "Locking buttons" : "Paused";

    chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
      if (tabs[0]?.id) {
        chrome.tabs.sendMessage(tabs[0].id, { type: "toggle", enabled });
      }
    });
  });

  settingsBtn.addEventListener("click", () => {
    const ret = chrome.runtime.openOptionsPage?.();
    if (ret && typeof ret.catch === "function") ret.catch(() => {});
  });
});