Vantage

Overview

Vantage is a product-analytics admin by SonoJS (demo workspace: Acme Inc). Built with Vite 7, React 19, TypeScript, Tailwind CSS 3, Recharts, Lucide, Framer Motion, GSAP, React Router, and Sonner. Overview streams MRR, active users, conversion, and session KPIs with live activity feed, revenue chart, traffic sources, and top pages. Analytics adds metric comparison, conversion funnel, retention heatmap, cohort table, and geo breakdown. Customers includes segment chips, sortable health table, and detail drawer. Reports covers template gallery, builder, schedules, and exports. Settings has general, appearance, billing, API keys, notifications, and danger zone. Login page with dashboard mock. Demo chrome only - fictional metrics, no backend. Vite build ready for Cloudflare Workers.

Highlights

1. 01

   Live overview

   Streaming KPIs, revenue chart, live feed, traffic donut, and top pages with range controls.

2. 02

   Deep analytics

   Metric comparison, conversion funnel, retention heatmap, cohorts, and geo breakdown.

3. 03

   Customers + reports

   Health-scored customer table with drawer, plus report templates, schedules, and exports.

4. 04

   Vite and fork-ready

   Vite 7 + React 19 + Tailwind 3 + Recharts - npm run build to dist/ for Workers.

You get

• Full Vite + React 19 + TypeScript source (Vantage)
• Overview, Analytics, Customers, Reports, Settings, Login
• Command palette, theme toggle, live metrics simulation
• Recharts charts, Framer Motion / GSAP motion, Lucide icons
• Radix UI primitives + Sonner toasts