🎮 Monarc - Permissionless Pay-Per-Play Gaming Platform

A decentralized gaming platform with an AI agent that autonomously pays for game sessions on the Monad Testnet.

✨ Features

• 🤖 Permissionless AI Agent: Auto-approves and signs transactions without user intervention
• 💰 Pay-Per-Play: Micro-payments (0.001 MON) for 15-second game sessions
• 🎨 Comic Pop-Art UI: Bright, flashy design with bubble backgrounds
• 🛒 Marketplace: Browse games with "Buy Full Game" option (0.3 MON)
• ⚡ Native MON Payments: No ERC20 tokens, uses Monad's native currency
• 🔐 Smart Contract: 97/3 revenue split between dev and platform

🏗️ Architecture

Frontend (React + TypeScript + Vite)

• Agent Wallet: Autonomous wallet with private key in localStorage
• Payment Gate: x402 payment protocol integration
• Auto-Pay Agent: Budget-based auto-approval system
• Marketplace: Game browsing and purchasing UI

Backend (Node.js + Express)

• Session Management: In-memory session tracking
• Payment Verification: On-chain event verification
• x402 Protocol: HTTP 402 Payment Required responses

Smart Contract (Solidity)

• GamePayment.sol: Native MON payment handling
• Revenue Split: Automatic distribution to dev/platform wallets
• Events: GamePlayed event for backend verification

🚀 Quick Start

Prerequisites

• Node.js 18+
• MetaMask or compatible wallet
• Monad Testnet MON tokens

Installation

1. Clone the repository

git clone https://github.com/YOUR_USERNAME/Monarc.git
cd Monarc

2. Install backend dependencies

cd backend
npm install

3. Install frontend dependencies

cd ../frontend
npm install

4. Configure backend environment

cd ../backend
cp .env.example .env

Then edit the .env file with your settings:

PORT=3000
RPC_URL=https://testnet-rpc.monad.xyz
CONTRACT_ADDRESS=0x606A39EaC6AFf9ef72E142F3B8bFb2D2EE79B468
GAME_COST=0.001

Note: The contract address above is the default. If you deploy your own contract, replace it with your deployed address.

5. Deploy the smart contract (Optional)

• Open GamePayment_clean.sol in Remix IDE
• Connect to Monad Testnet
• Deploy with your dev and platform wallet addresses
• Copy the deployed contract address to backend/.env

Running the Application

1. Start the backend

cd backend
node server.js

2. Start the frontend (in a new terminal)

cd frontend
npm run dev

3. Open the app

• Navigate to http://localhost:5173
• Click "DEMO LOGIN" or connect your wallet

🤖 Using the AI Agent

1. Open the Agent Panel: Click the 🤖 button (bottom-right)
2. Copy Agent Address: Find the cyan monospace address box
3. Fund the Agent: Send 0.01 MON to the agent address
4. Wait for Balance: Balance updates every 5 seconds
5. Play Games: Click "PLAY NOW" - no MetaMask popup!

Agent Configuration

• Budget: 0.005 MON (total spending limit)
• Threshold: 0.002 MON (max auto-approve amount)
• Auto-Plays: ~5 plays before manual approval required

📁 Project Structure

Monarc/
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   │   ├── AutoPayAgent.tsx    # Agent UI & settings
│   │   │   ├── PaymentGate.tsx     # Payment handling
│   │   │   ├── Marketplace.tsx     # Game marketplace
│   │   │   └── GameView.tsx        # Game interface
│   │   ├── services/
│   │   │   ├── AgentWallet.ts      # Autonomous wallet
│   │   │   └── api.ts              # Backend API calls
│   │   ├── App.tsx                 # Main app component
│   │   └── index.css               # Comic theme styles
│   └── package.json
├── backend/
│   ├── server.js                   # Express server
│   ├── abi.json                    # Contract ABI
│   ├── .env                        # Environment config
│   └── package.json
├── GamePayment_clean.sol           # Smart contract
└── README.md

🔧 Configuration

Backend (.env)

PORT=3000
RPC_URL=https://testnet-rpc.monad.xyz
CONTRACT_ADDRESS=0xYourContractAddress
GAME_COST=0.001

Agent Settings (Frontend)

• Enabled: true (default)
• Budget: 0.005 MON
• Threshold: 0.002 MON
• Session Duration: 15 seconds

🛠️ Tech Stack

• Frontend: React, TypeScript, Vite, ethers.js
• Backend: Node.js, Express, ethers.js
• Blockchain: Solidity, Monad Testnet
• Styling: Vanilla CSS (Comic Pop-Art theme)

🔐 Security Notes

⚠️ Demo Use Only: The agent wallet stores private keys in browser localStorage. This is suitable for small demo amounts but NOT for production use with significant funds.

📝 License

MIT

🤝 Contributing

Contributions welcome! Please open an issue or PR.

📧 Contact

For questions or support, please open an issue on GitHub.

---

Built with ❤️ for the Monad Testnet