Skip to main content

Demo App Overview

The Clutch Hub Demo App is a React + Vite application demonstrating blockchain-based ride-sharing with passenger and driver roles.

Features​

  • Dual roles — Separate passenger and driver experiences
  • Your own wallet — Connect MetaMask, Trust Wallet or TronLink. The app holds no key: the wallet keeps it and asks before each action
  • Interactive map — Leaflet map for pickup/dropoff selection
  • Full ride lifecycle — Request, offer, accept, pay, cancel
  • Real-time updates — GraphQL subscriptions with polling fallback
  • USDT deposits — Top up CLT by paying USDT (TRC-20) straight to the treasury, independent of the Hub API and SDK
  • Transaction history — Persistent list per wallet address
  • Stage auto-detect — Maps app-stage.* hostname to api-stage.*

Tech Stack​

Key concepts demonstrated​

  1. User sovereignty — Users own and control their keys, in their own wallet
  2. Client-side signing — Private keys never sent to the server, and never held by the app: the wallet signs
  3. Transparency — Transaction history visible on-chain
  4. Trustless operations — Ride state enforced by the blockchain

Live demos​

EnvironmentURL
Mainnet (capped pilot, real USDT)https://app.clutchprotocol.io
Stage (testnet, test money)https://app-stage.clutchprotocol.io
Localhttp://localhost:5173

The same app is served at both hosted addresses and picks its chain and its Hub API from the address it is opened at. On the mainnet pilot, top-ups and withdrawals are open, and the limits are small: see Environments.

Screenshots​

Request a ride screen

Active ride list

note

Screenshots are placeholders. To replace, capture from the running stage demo (https://app-stage.clutchprotocol.io), save as .png into static/img/, and update the references above.

Documentation​