// Shape Store — spend points for rewards const { useState: useSStore, useMemo: useMStore } = React; const BALANCE = 940; const LIFETIME = 3420; const REDEEMED_COUNT = 7; const CATEGORIES = ["All", "Shape Merch", "Training", "Nutrition", "Shape Perks", "Coach Tools"]; const PRODUCTS = [ // Shape Merch { id: 1, cat: "Shape Merch", name: "Shape Training Tee", brand: "Shape Merch", cost: 450, retail: 48, img: "tee · midnight", tag: "New", stock: "In stock" }, { id: 2, cat: "Shape Merch", name: "Shape Crewneck", brand: "Shape Merch", cost: 720, retail: 72, img: "crewneck · bone", tag: "Members", stock: "In stock" }, { id: 3, cat: "Shape Merch", name: "Shape Training Bottle", brand: "Shape Merch", cost: 280, retail: 28, img: "bottle · steel", stock: "In stock" }, { id: 4, cat: "Shape Merch", name: "Shape Gym Towel", brand: "Shape Merch", cost: 220, retail: 22, img: "towel · cream", stock: "In stock" }, { id: 5, cat: "Shape Merch", name: "Shape Training Duffel", brand: "Shape Merch", cost: 1640, retail: 165, img: "duffel · canvas", tag: "Peak tier", stock: "In stock", locked: true }, // Training { id: 6, cat: "Training", name: "$25 session credit", brand: "Any Shape coach", cost: 500, retail: 25, img: "credit · 25", stock: "Unlimited" }, { id: 7, cat: "Training", name: "$50 session credit", brand: "Any Shape coach", cost: 950, retail: 50, img: "credit · 50", stock: "Unlimited" }, { id: 8, cat: "Training", name: "Coach 2nd-opinion", brand: "Free 30-min trainer intro", cost: 900, retail: 95, img: "intro · call", stock: "Monthly" }, { id: 9, cat: "Training", name: "Program review credit", brand: "Shape trainer review", cost: 780, retail: 85, img: "program · review", stock: "Unlimited" }, // Nutrition { id: 10, cat: "Nutrition", name: "Meal-plan Refresh", brand: "With your Shape RD", cost: 1200, retail: 140, img: "meal · plan", tag: "Popular", stock: "Unlimited" }, { id: 11, cat: "Nutrition", name: "$25 nutrition credit", brand: "Any Shape nutritionist", cost: 500, retail: 25, img: "nutrition · credit", stock: "Unlimited" }, { id: 12, cat: "Nutrition", name: "Grocery list buildout", brand: "Shape nutrition service", cost: 420, retail: 45, img: "grocery · list", stock: "Unlimited" }, { id: 13, cat: "Nutrition", name: "Recipe archive pack", brand: "Shape nutrition templates", cost: 340, retail: 35, img: "recipes · pack", stock: "Unlimited" }, // Shape Perks { id: 16, cat: "Shape Perks", name: "Annual membership credit", brand: "$200 toward next year", cost: 3500, retail: 200, img: "annual · 200", tag: "Peak tier", stock: "Unlimited", locked: true }, ]; const COACH_LEAD_BOOST_PRODUCTS = [ { id: 101, cat: "Coach Tools", name: "Lead Boost · 7 days", brand: "Marketplace featured placement", cost: 900, retail: 79, img: "boost · 7d", stock: "Activate now", kind: "lead_boost", days: 7 }, { id: 102, cat: "Coach Tools", name: "Lead Boost · 14 days", brand: "Marketplace featured placement", cost: 1600, retail: 139, img: "boost · 14d", stock: "Activate now", kind: "lead_boost", days: 14, tag: "Popular" }, { id: 103, cat: "Coach Tools", name: "Lead Boost · 30 days", brand: "Marketplace featured placement", cost: 3000, retail: 249, img: "boost · 30d", stock: "Activate now", kind: "lead_boost", days: 30 }, ]; function getRoleHint() { try { const qs = new URLSearchParams(window.location.search); const fromQuery = (qs.get("role") || "").toLowerCase(); if (fromQuery === "trainer" || fromQuery === "nutritionist") return fromQuery; const fromSession = (window.sessionStorage.getItem("shapeStoreContext") || "").toLowerCase(); if (fromSession === "trainer" || fromSession === "nutritionist") return fromSession; } catch (_) {} return "trainer"; } async function getShapeAccessToken() { try { if (!window.shapeDb || !window.shapeDb.client || !window.shapeDb.client.auth) return ""; const sessionRes = await window.shapeDb.client.auth.getSession(); return sessionRes?.data?.session?.access_token || ""; } catch (_) { return ""; } } async function redeemLeadBoostRemote({ role, days }) { const token = await getShapeAccessToken(); const headers = { "Content-Type": "application/json" }; if (token) headers.Authorization = `Bearer ${token}`; const res = await fetch("/api/lead-boosts", { method: "POST", headers, credentials: "include", body: JSON.stringify({ role, days }), }); const json = await res.json().catch(() => ({})); if (!res.ok) throw new Error(json?.error || "Lead Boost redemption failed."); return json?.boost || null; } const UNLOCKED = [ { code: "SHAPE-TEE-48F2", name: "Shape Training Tee", expires: "Jun 30", cost: 450, redeemed: "Apr 12" }, { code: "NUTRI-PLAN-04F1", name: "Grocery list buildout", expires: "May 20", cost: 420, redeemed: "Apr 04" }, ]; function StoreHero() { return (
Shape Store

Spend
the points you earned.

Trade Shape Score for Shape merch, training credits, nutrition services, and membership perks. No expiry on points.

Available balance
{BALANCE.toLocaleString()} pts
View Rewards page →
{[ [`${LIFETIME.toLocaleString()}`, "Lifetime earned", "since Jan 2025"], [`${REDEEMED_COUNT}`, "Items redeemed", "4 this quarter"], ["Tempo", "Current tier", "216 to Peak"], ].map(([k, l, s], i) => (
{k}
{l}
{s}
))}
); } function StoreFilters({ cat, setCat, sort, setSort, query, setQuery, affordable, setAffordable }) { const pill = (on) => ({ padding: "9px 16px", borderRadius: 999, border: on ? `1px solid ${INK}` : "1px solid rgba(242,237,228,0.18)", background: on ? INK : "transparent", color: on ? PAPER : INK, fontFamily: sans, fontSize: 13, cursor: "pointer", fontWeight: on ? 500 : 400 }); return (
{CATEGORIES.map((c) => )}
setQuery(e.target.value)} placeholder="Search merch or rewards…" style={{ padding: "10px 16px", borderRadius: 999, border: "1px solid rgba(242,237,228,0.18)", background: "transparent", fontFamily: sans, fontSize: 13, color: INK, minWidth: 220, outline: "none" }} />
); } function ProductCard({ p, balance, onRedeem }) { const canAfford = !p.locked && p.cost <= balance; const dollar = p.retail ? `~$${p.retail} retail` : null; const cta = p.locked ? "Tier locked" : p.kind === "lead_boost" ? "Activate boost →" : canAfford ? "Redeem →" : `+${(p.cost - balance).toLocaleString()} to go`; return (
{p.tag && ( {p.tag} )}
{p.brand}
{p.name}
{p.stock}{dollar ? ` · ${dollar}` : ""}
{p.cost.toLocaleString()} pts
); } function StoreGrid() { const [cat, setCat] = useSStore("All"); const [sort, setSort] = useSStore("Featured"); const [query, setQuery] = useSStore(""); const [affordable, setAffordable] = useSStore(false); const [notice, setNotice] = useSStore(""); const roleHint = useMStore(() => getRoleHint(), []); const allProducts = useMStore(() => [...PRODUCTS, ...COACH_LEAD_BOOST_PRODUCTS], []); async function handleRedeem(product) { if (product.kind !== "lead_boost") { setNotice(`${product.name} unlocked. Code will appear in your locker.`); return; } try { const boost = await redeemLeadBoostRemote({ role: roleHint, days: product.days }); const duration = Number(boost?.days || product.days || 0); setNotice(`Lead Boost is live for ${duration} days (${roleHint}). Marketplace ranking has been updated.`); } catch (err) { setNotice((err && err.message) || "Lead Boost redemption failed. Please try again."); } } const list = useMStore(() => { let arr = allProducts.filter(p => { if (cat !== "All" && p.cat !== cat) return false; if (affordable && (p.locked || p.cost > BALANCE)) return false; if (query && !`${p.name} ${p.brand} ${p.cat}`.toLowerCase().includes(query.toLowerCase())) return false; return true; }); if (sort === "Low to high") arr = [...arr].sort((a, b) => a.cost - b.cost); else if (sort === "High to low") arr = [...arr].sort((a, b) => b.cost - a.cost); else if (sort === "New") arr = [...arr].sort((a, b) => (b.tag === "New" ? 1 : 0) - (a.tag === "New" ? 1 : 0)); return arr; }, [allProducts, cat, sort, query, affordable]); return ( <>
{!!notice && (
{notice}
)}
{list.length} {list.length === 1 ? "item" : "items"}{cat !== "All" ? ` in ${cat}` : ""} {affordable ? " · within your 940 balance" : ""}
Points refresh nightly · 00:00 UTC
{list.length > 0 ? (
{list.map(p => )}
) : (
Nothing matches. Try widening filters or clearing search.
)}
); } function UnlockedCoupons() { return (
Your locker

Unlocked coupons.

Redemption history →
{UNLOCKED.map((u, i) => (
{u.code}
{u.name}
Redeemed {u.redeemed} · expires {u.expires}
))}
); } function StoreFAQ() { const faqs = [ ["Do points expire?", "No. Points earned in Shape Score never expire. Redemption codes, once unlocked, carry the expiry you see on the coupon."], ["Can I mix points + card?", "Yes — choose \"Pay with points + card\" at checkout. Every 100 points covers $10 on eligible items."], ["Who ships Shape merch?", "Shape merch ships through Shape fulfillment. Training and nutrition rewards are delivered inside your account."], ["What if I don't love it?", "30-day returns, points refunded in full. Perishables (nutrition) and digital codes are final sale."], ]; return (
How the store works

Earn in the app.
Spend inside Shape.

Points are Shape's currency for doing the work. The store turns them into Shape merch, training credits, nutrition services, and membership perks.

{faqs.map(([q, a], i) => (
0{i + 1}

{q}

{a}

))}
); } function StorePage() { return (
); } ReactDOM.createRoot(document.getElementById("root")).render();