Agentic Cart

An AI agent that shops and completes checkout end-to-end with PayPal - from a natural-language ask to a paid order.

Comment

Inspiration

Checkout is still a manual, multi-step chore: search, compare, add to cart, fill payment, confirm. We wanted to see if one autonomous agent could take a plain-English request all the way to a captured PayPal payment - no human in the loop after the first sentence.

What it does

You type a goal like "a gift for my girlfriend under $100" or "desk setup essentials under $60". The agent reads the real product catalog, picks items that fit the request and budget, and returns a validated cart that you can edit in AG Grid. Press "Review & pay" and the order is created, approved (guest card payment) and captured on PayPal sandbox; the order then lands in the AG Grid order-history table as COMPLETED with its capture id.

How we built it

  • Agent: a Next.js route handler (/api/agent) sends the shopper's request plus the catalog to an OpenAI-compatible LLM with structured/function-calling output, then validates the result (items exist, prices real, within budget). A deterministic heuristic planner runs as a fallback so the flow still completes if the model endpoint is down.
  • Payments: /api/paypal/order and /api/paypal/capture use the PayPal JavaScript SDK and Orders API v2 (create -> approve -> capture). Prices are re-priced server-side from the catalog - client prices are never trusted.
  • UI: Next.js + React + TypeScript, cart and order history rendered with AG Grid (sorting, filtering, pinned columns, inline cart editing).
  • Data: captured orders are stored locally and surfaced in the order-history grid.

Challenges we ran into

  • Keeping an LLM honest: catalog grounding, budget limits and schema validation are enforced in code, not assumed from the prompt.
  • Making the demo resilient: if the free LLM endpoint is unreachable, the heuristic planner still produces a cart, so judges never hit a dead end.
  • PayPal sandbox mechanics: wiring create -> approve -> capture for guest card payments and reading capture status back into our own order record.

Accomplishments that we're proud of

  • A complete natural-language -> paid order loop, verified end-to-end with scripted browser runs covering agent planning, the AG Grid storefront, guest checkout, capture and final order status.
  • Graceful degradation: same UX with or without the LLM endpoint.
  • A storefront that feels real: editable grid cart, live totals, and an auditable order history with PayPal capture ids.

What we learned

  • How far structured output plus server-side validation can take an agent when the payment path must be trustworthy.
  • How quickly PayPal Orders v2 slots into a modern Next.js backend, and which fields the API validates strictly.

What's next for Agentic Cart

  • PayPal webhooks for asynchronous capture/refund events, subscriptions and multi-item reconciliation.
  • A hosted one-click demo plus an automated end-to-end test suite in the repo.
  • Smarter planning (multi-turn preferences, price history) and a mobile-first storefront.

Built With

Share this project:

Updates

posted an update —

Hosted demo is live — you can run the whole checkout in ~30 seconds, no clone needed

Demo: https://agentic-cart-phi.vercel.app Source: https://github.com/Ljunqiang/agentic-cart

What's new since submission

  • Deployed the agent + PayPal sandbox checkout as a production Next.js app (Vercel, region iad1).
  • Hardened order storage: on serverless hosts the filesystem root is read-only, so data/orders.json now falls back to a writable temp dir instead of failing the capture call.
  • Verified the public deployment from independent nodes in Australia, Spain, Portugal, India and Ukraine: GET / and GET /api/orders both return HTTP 200.
  • Reset the demo order history so your run starts clean.

How to try it

  1. Enter a goal in plain English, e.g. a gift for my girlfriend under $100
  2. The agent reads the real catalog, selects matching items and builds the cart
  3. Approve the PayPal sandbox payment (no real money moves) and the captured order appears in /api/orders

Everything runs end-to-end: goal → agent plan → cart → PayPal order → capture → stored order. Happy to walk through the architecture if reviewers have questions.

Log in or sign up for Devpost to join the conversation.

Submission history