Inspiration
Shopping for a saree often means translating a personal request into filters, comparing several products, opening product pages, and keeping track of a cart. Traditional web agents have to guess at buttons and page structure. We wanted the storefront to expose a clear, predictable interface for people and agents to use together.
What we built
Vaanzari adds browser-native WebMCP tools for public saree discovery and visible cart actions. A compatible agent can search products, retrieve a product, compare products, open a product page, add an available product to the cart, and open the cart. The person remains in control of product choice, checkout, payment, and order confirmation.
How we built it
We register six tools with document.modelContext.registerTool(...): search-sarees, get-saree, compare-sarees, open-saree, add-saree-to-cart, and open-cart. The tools use a public-safe catalog adapter plus browser navigation and cart adapters. Results map back into the visible UI so the person and agent share the same state. We also added a diagnostics view, tests, and a standalone Apache-2.0 reference repository.
Challenges and what we learned
The hard part was choosing a useful boundary without exposing account, customer, checkout, payment, or order workflows to an agent. We learned that structured tools make actions more predictable than UI guessing, while explicit human control keeps consequential commerce decisions with the shopper.
Built With
- mcp
- react
- typescript
- webmcp
Log in or sign up for Devpost to join the conversation.