5) API Requirements

Gallery/Filters

GET /api/infographics → list with filters: q, toptier, category, subcat, min, max.

GET /api/infographics/:id → detail for modal preview.

Creator Upload

POST /api/creator/infographics (auth)
Body: title, top_tier, subcategories[], category, preview_image_url, pptx_url?, keynote_url?, gslides_url?, download_bundle_url?
Stored as approval_status='pending', is_active=false.

Admin Approve

PATCH /api/admin/infographics/:id/activate { active: boolean } and/or update approval_status.

Checkout (Bundle of up to 4)

POST /api/infographics/checkout (auth)
Body: { selectedIds: string[] } (1–4 items)
Server:

Validate selected IDs exist and are approved & active.

Create pending purchase (record selected_ids).

Create Stripe Checkout for a single global price ($14.99) regardless of count (1–4).

success_url includes purchase=<id> (for auto-download polling).

Return { checkoutUrl, purchaseId }.

Ownership / Download

GET /api/infographics/purchases/:id (auth) → returns purchase row (status, download_url).

GET /api/infographics/:id/my-status is not needed per-item (ownership is for the bundle purchase). Optional to expose a “My purchases” list:

GET /api/me/infographic-purchases → list for Account page.

GET /api/infographics/purchases/:id/download (auth) → verifies paid, redirects to the signed ZIP URL (or streams).

Webhook

Reuse the existing Stripe webhook route; recognize new product (below) and mark infographic purchase as paid, then set the purchase’s download_url to the assembled ZIP (see §6).

6) Download Assembly (ZIP for selected items)

MVP behavior:

On checkout create: store selected_ids with the purchase.

On webhook (session completed):

Build a ZIP containing the selected slides:

Prefer the format hierarchy: if download_bundle_url present use that item’s folder/zip; else include the best available source (pptx_url OR keynote_url OR gslides_url as a link.txt inside the zip).

Upload the ZIP to storage (S3 or your CDN) and set purchase download_url to that ZIP.

On success return, the page polls GET /api/infographics/purchases/:id until status==='paid' and download_url is set; then auto-start download.

If ZIP building is heavy, you can defer: set download_url to a dynamic endpoint that zips on demand and streams (caches result by purchase_id).

7) Stripe (single, global price)

New product for infographics so reporting is clean:

Product ID: ibrandbiz_infographic_bundle

Price lookup_key: ibrandbiz_infographic_bundle_price_v1

Amount: 1499 (USD)

Checkout always uses quantity: 1 and the global price (even if user selected 1–4 slides).

Keep the webhook and env pattern you used for Cover & Divider. (Optional: same Pro coupon path.)

ENV

INFOGRAPHIC_BUNDLE_PRICE_CENTS=1499
INFOGRAPHIC_BUNDLE_CURRENCY=usd

8) Frontend Requirements

Route: /business-assets/templates/infographics (replace/remove the current Infographic AI route).

Gallery Grid:

Card with thumbnail, top-tier badge, 1–2 subcat chips, small formats text (“PPTX / Keynote / Slides”), and a checkbox (top-left).

Clicking image opens lightbox (zoomed, watermarked). Checkbox changes don’t open lightbox.

Disabled checkbox when 4 already selected.

Selection Tray (fixed bottom on scroll):

Left: “Selected: N / 4”

Right: Button “Buy Now – $14.99” (disabled if N=0)

On click → POST /api/infographics/checkout with the selectedIds.

Success Return:

Recognize ?success=true&purchase=<id> → poll /api/infographics/purchases/:id for up to ~20s → auto-download ZIP when ready → toast fallback if delayed.

My Purchases:

Show past infographic purchases with a Download button (calls /api/infographics/purchases/:id/download).

Watermark

Same overlay CSS as Covers (gallery + lightbox).

Accessibility

Checkbox is keyboard-focusable; button has clear focus ring; lightbox closes via ESC.

9) Contributor Upload (mirror Covers)

Add an “Upload Infographic Template” page mirroring the Covers creator form:

Fields: title, top_tier, subcategories[], category, preview_image_url, (pptx_url | keynote_url | gslides_url | zip)

Submit to /api/creator/infographics → pending

Admin toggles approval_status='approved', is_active=true.

Monetization: reuse existing creator payouts logic (same as other marketplace assets).

10) Sidebar & Navigation

Under Business Assets → Templates → Infographic Templates.

Remove the old Infographic AI page/entry and route.

11) Acceptance Criteria (must pass)

Gallery loads active, approved infographic items with watermark overlay.

Filters work (search, top-tier, category, sub-category, price).

Checkboxes: user can select 1–4 items; the 5th attempt is blocked with a toast.

Selection tray shows N/4 and Buy Now – $14.99; disabled when N=0.

Buy Now launches Stripe Checkout (single global price).

On success redirect, auto-download begins (ZIP of selected items).

“My Purchases” lists prior bundles; Download works only when paid.

Creator upload → admin approve → item appears in gallery.

Old Infographic AI UI/route removed.

Mobile/desktop responsive; keyboard accessible; no console errors.

12) Edge Cases

If an item becomes inactive after it was selected but before checkout → backend should validate and return a clear error: “One or more items are unavailable. Please reselect.”

If the user opens success URL before webhook finishes → poll until paid, then download; after timeout show toast.

If any selected item has only a Google Slides link → include a small README.txt and links.txt inside the ZIP pointing to the Slides file(s).