Update app.js

app.js

@@ -20,6 +20,7 @@ const COUPON_URL = `${API_BASE}/etc/coupon`; // POST {code}
 const CHAT_URL = `${API_BASE}/etc/chat`; // POST {message,sessionId,email}
 const REFERRAL_URL = `${API_BASE}/etc/referral`; // POST {referrer,friend_name,friend_email,uuid}
 // WIZZARD=false is written via AGENT_INFO_URL (POST { uuid, key, value })
+const CREDITS_URL = `${API_BASE}/payment/credits`; // POST {key}
 const CONTRACT_EXTEND_URL = "https://derez.ai"; // ← replace with Stripe payment link
 const CONTRACT_CANCEL_URL = "https://derez.ai"; // ← replace with Stripe cancellation link
 
@@ -871,7 +872,7 @@ function renderKeys(keys) {
             </div>
             <button class="btn btn-ghost btn-sm"
                     style="align-self:center"
-                    onclick="buyCredits('${escAttr(k.name)}')">
+                    onclick="buyCredits('${escAttr(k.name)}', this)">
                 Buy Credits
             </button>
         </div>`;
@@ -879,9 +880,21 @@ function renderKeys(keys) {
     .join("");
 }
 
-function buyCredits(keyName) {
-  toast(`Opening Derez to purchase credits\u2026`, "info");
-  window.open("https://derez.ai", "_blank");
+async function buyCredits(keyName, btn) {
+  btnLoad(btn, "Processing\u2026");
+  try {
+    const res = await fetch(CREDITS_URL, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ key: keyName }),
+    });
+    if (!res.ok) throw new Error(`Request failed (${res.status})`);
+    toast("Credits purchase initiated!", "success");
+  } catch (err) {
+    toast(err.message, "error");
+  } finally {
+    btnReset(btn);
+  }
 }
 
 /* ═══════════════════════════════════════════════════════════════