Skip to content

AgentCart a eCommerce Demo with MCP Tools for AI agents

Notifications You must be signed in to change notification settings

mohitky2018/AgentCart

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

54 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ›’ AgentCart - Modern E-Commerce Platform

Laravel React TypeScript TailwindCSS License

A full-stack, modern e-commerce platform built with Laravel 12, React 19, TypeScript, and Inertia.js

Featuring a beautiful liquid glass design, PWA support, and AI-powered MCP tools


πŸ“‹ Table of Contents


✨ Features

πŸ›οΈ Customer Features

  • Product Browsing - Browse products by categories with advanced filtering
  • Shopping Cart - Add, update, and remove items from cart
  • Secure Checkout - Complete checkout process with order confirmation
  • Order Tracking - View order history and track order status
  • User Authentication - Register, login, and manage profile
  • Two-Factor Authentication - Enhanced security with 2FA support

πŸ‘¨β€πŸ’Ό Admin Features

  • Dashboard Analytics - Real-time metrics, sales trends, and KPIs
  • Product Management - CRUD operations for products with image uploads
  • Category Management - Organize products into hierarchical categories
  • Inventory Management - Track stock levels and low stock alerts
  • Order Management - View, update, and manage customer orders

🎨 Design & UX

  • Liquid Glass Design - Modern glassmorphism aesthetic with gradients
  • GSAP Animations - Smooth micro-interactions and transitions
  • Responsive Design - Mobile-first, works on all devices
  • Dark/Light Theme - Appearance customization with green color palette
  • PWA Support - Install as a native app on mobile and desktop

πŸ€– AI-Powered MCP Tools

  • 29 MCP Tools - For AI agents to interact with the e-commerce platform
  • Admin Tools - Product, category, inventory, and order management
  • Customer Tools - Shopping, cart, and order operations
  • Public Tools - Product browsing and search

πŸ›  Tech Stack

Backend

Technology Version Purpose
PHP 8.2+ Server-side language
Laravel 12.x PHP framework
Laravel Fortify 1.x Authentication backend
Laravel MCP 0.5.x Model Context Protocol for AI agents
Inertia.js 2.x SPA bridge between Laravel & React

Frontend

Technology Version Purpose
React 19.x Frontend library
TypeScript 5.x Type-safe JavaScript
TailwindCSS 4.x Utility-first CSS framework
GSAP 3.x Animation library
Radix UI Latest Accessible UI components
Lucide React Latest Icon library
Recharts 3.x Charts and data visualization

Development Tools

Tool Purpose
Vite Build tool and dev server
ESLint JavaScript/TypeScript linting
Prettier Code formatting
Pint PHP code style fixer
PHPUnit PHP testing framework

πŸ— Architecture

The application follows Domain-Driven Design (DDD) principles with clear separation of concerns:

app/
β”œβ”€β”€ Domain/                 # Business logic organized by domain
β”‚   β”œβ”€β”€ Catalog/           # Products, Categories
β”‚   β”œβ”€β”€ Dashboard/         # Admin analytics
β”‚   β”œβ”€β”€ Identity/          # Users, Authentication
β”‚   β”œβ”€β”€ Inventory/         # Stock management
β”‚   β”œβ”€β”€ Order/             # Orders, Order Items
β”‚   β”œβ”€β”€ Shared/            # Shared utilities
β”‚   └── Shopping/          # Cart, Checkout
β”œβ”€β”€ Http/                   # HTTP layer (Controllers, Middleware)
β”œβ”€β”€ Mcp/                    # MCP Tools for AI agents
β”‚   β”œβ”€β”€ Servers/           # MCP Server configurations
β”‚   └── Tools/             # 29 MCP tool implementations
β”‚       β”œβ”€β”€ Admin/         # Admin-only tools
β”‚       β”œβ”€β”€ Customer/      # Customer tools
β”‚       └── Public/        # Public tools
└── Models/                 # Eloquent models

πŸš€ Getting Started

Prerequisites

Ensure you have the following installed:

  • PHP >= 8.2
  • Composer >= 2.x
  • Node.js >= 20.x
  • npm >= 10.x
  • SQLite (or MySQL/PostgreSQL)

Installation

  1. Clone the repository

    git clone https://github.com/yourusername/AgentCart.git
    cd AgentCart
  2. Install dependencies

    composer install
    npm install
  3. Run the setup script

    composer setup

    This command will:

    • Install PHP dependencies
    • Copy .env.example to .env
    • Generate application key
    • Run database migrations
    • Install npm dependencies
    • Build frontend assets

Environment Configuration

Copy the example environment file and configure it:

cp .env.example .env

Key environment variables:

# Application
APP_NAME=AgentCart
APP_URL=https://store.heygeeks.in

# Database (SQLite by default)
DB_CONNECTION=sqlite

# For MySQL, uncomment and configure:
# DB_CONNECTION=mysql
# DB_HOST=127.0.0.1
# DB_PORT=3306
# DB_DATABASE=AgentCart
# DB_USERNAME=root
# DB_PASSWORD=

# Dashboard Configuration
DASHBOARD_LOW_STOCK_THRESHOLD=10
DASHBOARD_RECENT_ORDERS_LIMIT=10
DASHBOARD_SALES_TRENDS_DAYS=30

Database Setup

  1. Run migrations

    php artisan migrate
  2. Seed the database with sample data

    php artisan db:seed

    This creates:

    • Admin user: admin@example.com (password: password)
    • 5 sample customer users
    • Sample categories
    • Sample products with images
    • Sample inventory data
    • Sample orders

Running the Application

Development mode (recommended):

composer run dev

This starts concurrently:

  • Laravel development server on https://store.heygeeks.in
  • Queue worker for background jobs
  • Vite dev server for hot module replacement

Or run services individually:

# Terminal 1 - Laravel server
php artisan serve

# Terminal 2 - Vite dev server
npm run dev

# Terminal 3 - Queue worker
php artisan queue:listen

Production build:

npm run build

πŸ“ Project Structure

AgentCart/
β”œβ”€β”€ app/
β”‚   β”œβ”€β”€ Actions/            # Action classes
β”‚   β”œβ”€β”€ Concerns/           # Shared traits
β”‚   β”œβ”€β”€ Domain/             # Domain logic (DDD)
β”‚   β”œβ”€β”€ Http/               # Controllers, Middleware
β”‚   β”œβ”€β”€ Mcp/                # MCP Tools & Servers
β”‚   β”œβ”€β”€ Models/             # Eloquent models
β”‚   └── Providers/          # Service providers
β”œβ”€β”€ config/                 # Configuration files
β”œβ”€β”€ database/
β”‚   β”œβ”€β”€ factories/          # Model factories
β”‚   β”œβ”€β”€ migrations/         # Database migrations
β”‚   └── seeders/            # Database seeders
β”œβ”€β”€ public/                 # Public assets, manifest.json
β”œβ”€β”€ resources/
β”‚   β”œβ”€β”€ css/               # Stylesheets
β”‚   β”œβ”€β”€ js/
β”‚   β”‚   β”œβ”€β”€ components/    # React components (64 components)
β”‚   β”‚   β”œβ”€β”€ hooks/         # Custom React hooks
β”‚   β”‚   β”œβ”€β”€ layouts/       # Page layouts
β”‚   β”‚   β”œβ”€β”€ pages/         # Inertia pages
β”‚   β”‚   β”‚   β”œβ”€β”€ Admin/     # Admin pages
β”‚   β”‚   β”‚   β”œβ”€β”€ Customer/  # Customer pages
β”‚   β”‚   β”‚   β”œβ”€β”€ auth/      # Authentication pages
β”‚   β”‚   β”‚   └── settings/  # Settings pages
β”‚   β”‚   β”œβ”€β”€ types/         # TypeScript types
β”‚   β”‚   └── lib/           # Utilities
β”‚   └── views/             # Blade templates
β”œβ”€β”€ routes/                 # Route definitions
β”œβ”€β”€ storage/                # File storage
└── tests/                  # Test files (74 test files)

πŸ€– MCP Tools

AgentCart includes 29 MCP (Model Context Protocol) tools that allow AI agents to interact with the e-commerce platform:

Admin Tools (15 tools)

Tool Description
GetDashboardMetrics Retrieve dashboard analytics and KPIs
GetLowStockAlerts Get products with low stock levels
CreateProduct Create a new product
UpdateProduct Update product details
DeleteProduct Delete a product
ListProducts List all products with pagination
CreateCategory Create a new category
UpdateCategory Update category details
DeleteCategory Delete a category
ListCategories List all categories
ListOrders List all orders
ViewOrderDetails View order details
UpdateOrderStatus Update order status
AdjustInventory Adjust inventory levels
ViewStockLevels View current stock levels

Customer Tools (10 tools)

Tool Description
ListProducts Browse available products
SearchProducts Search products by keyword
ViewProductDetails View product details
ViewCart View shopping cart contents
AddToCart Add item to cart
UpdateCartItem Update cart item quantity
RemoveCartItem Remove item from cart
Checkout Complete checkout
ListMyOrders List customer's orders
ViewMyOrderDetails View order details

Public Tools (4 tools)

Tool Description
ListProducts Browse public product catalog
ListCategories Browse categories
SearchProducts Search products
ViewProductDetails View product details

MCP Client Configuration

To connect to the MCP server from an AI client (like Claude Desktop), use the following configuration:

{
  "mcpServers": {
    "remote-example": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://store.heygeeks.in/mcp/admin"
      ]
    }
  }
}

How to Use Auth MCP

The MCP server uses OAuth 2.0 authentication via Laravel Passport. Follow these steps to authenticate:

  1. OAuth Flow: When connecting to the MCP server, you'll be redirected to authenticate via the OAuth flow
  2. Authorization: After logging in, authorize the MCP client to access your account
  3. Token Exchange: The MCP client will receive an access token for subsequent requests

Available MCP Endpoints:

Endpoint Description Authentication
/mcp/admin Admin MCP tools Requires admin role
/mcp/customer Customer MCP tools Requires authenticated user
/mcp/public Public MCP tools No authentication required

Note

The mcp-remote package handles the OAuth flow automatically. When you first connect, a browser window will open for authentication.

πŸ“– For detailed setup instructions with Claude Desktop, ChatGPT, LM Studio, Ollama, and Moltbot, see public/mcp-guide.md.


πŸ‘₯ User Roles

Role Description Access
Admin Platform administrator Full access to admin dashboard, product management, orders, inventory
Customer Registered shopper Browse products, manage cart, place orders, view order history
Guest Unregistered visitor Browse products, view product details

πŸ›£ API Routes

Public Routes

Method URI Description
GET / Home page
GET /products Product listing
GET /products/{product} Product details

Customer Routes (Authenticated)

Method URI Description
GET /cart View cart
POST /cart Add to cart
PUT /cart/{cartItem} Update cart item
DELETE /cart/{cartItem} Remove from cart
GET /checkout Checkout page
POST /checkout Process checkout
GET /orders Order history
GET /orders/{order} Order details

Admin Routes (Admin Only)

Method URI Description
GET /admin/dashboard Admin dashboard
CRUD /admin/products Product management
CRUD /admin/categories Category management
GET/PUT /admin/inventory Inventory management
GET/PUT /admin/orders Order management

πŸ§ͺ Testing

The project includes 74 test files covering all major functionality.

Run all tests:

php artisan test

Run with code coverage:

php artisan test --coverage

Run specific test file:

php artisan test tests/Feature/ProductTest.php

Linting:

# PHP linting
composer lint

# JavaScript/TypeScript linting
npm run lint

# Format code
npm run format

πŸ“± PWA Support

AgentCart is a Progressive Web App (PWA) that can be installed on mobile devices and desktops:

Features

  • Installable - Add to home screen on iOS, Android, and desktop
  • Offline Support - Basic offline functionality with service worker
  • App Shortcuts - Quick access to Products, Cart, and Orders
  • Native Feel - Standalone display mode without browser UI

Install the App

  1. Visit the site on your mobile device or desktop
  2. Look for the "Install" prompt or browser's install option
  3. Follow the installation instructions for your platform

🀝 Contributing

We welcome contributions! Please follow these steps:

  1. Fork the repository
  2. Create a feature branch
    git checkout -b feature/amazing-feature
  3. Commit your changes
    git commit -m 'Add amazing feature'
  4. Push to the branch
    git push origin feature/amazing-feature
  5. Open a Pull Request

Development Guidelines

  • Follow PSR-12 coding standards for PHP
  • Use TypeScript strictly (no any types)
  • Write tests for new features
  • Run linting before committing

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.


Built with ❀️ using Laravel, React, and modern web technologies

Report Bug Β· Request Feature

About

AgentCart a eCommerce Demo with MCP Tools for AI agents

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •