Headless Shop Now (On-Store)

// `cart` is the object you fetched from Shopify's GET /cart.js
const shopify = Buffer.from(JSON.stringify(cart)).toString("base64");

const response = await fetch("https://api.loopreturns.com/api/v1/cart", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "X-Authorization": process.env.LOOP_API_KEY,
  },
  body: JSON.stringify({
    cart: [39888235757633],
    shopify,
  }),
});

// 1) On the storefront landing page
const qs = new URLSearchParams(location.search);
if (qs.has("loop_total")) {
  const loop = Object.fromEntries([...qs].filter(([k]) => k.startsWith("loop_")));
  sessionStorage.setItem("loop-onstore", JSON.stringify(loop));
  // (optional) render a credit bar from loop.loop_total / loop.loop_currency / loop.loop_discount_percentage
}

// 2) When the shopper finishes shopping (your own "checkout" handler)
async function handoffToLoop(selectedVariantIds /* number[], repeat ids for quantity */) {
  const loop = JSON.parse(sessionStorage.getItem("loop-onstore"));

  // Call YOUR backend proxy — not Loop directly — so the API key stays server-side.
  const res = await fetch("/api/loop/cart", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({ cart: selectedVariantIds }),
  });
  const { token } = await res.json();

  await clearMyCart(); // your own cart clear

  // 3) Redirect back to Loop
  location.href = `https://${loop.loop_domain}/#/cart/v2/${encodeURIComponent(token)}`;
}

// POST /api/loop/cart — adds the API key server-side and forwards to Loop.
app.post("/api/loop/cart", async (req, res) => {
  const loopRes = await fetch("https://api.loopreturns.com/api/v1/cart", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      "X-Authorization": process.env.LOOP_API_KEY, // Carts scope, never sent to the browser
    },
    body: JSON.stringify({ cart: req.body.cart }),
  });
  res.status(loopRes.status).json(await loopRes.json());
});