feature: add referral statistic to dashboard

This commit is contained in:
DeathKaioken 2025-10-04 00:08:09 +02:00
parent 57e0f4ecac
commit 696174bbc4

View File

@ -11,7 +11,8 @@ import {
UserCircleIcon, UserCircleIcon,
StarIcon, StarIcon,
ChartBarIcon, ChartBarIcon,
HeartIcon HeartIcon,
BuildingOffice2Icon // <-- added
} from '@heroicons/react/24/outline' } from '@heroicons/react/24/outline'
export default function DashboardPage() { export default function DashboardPage() {
@ -80,6 +81,13 @@ export default function DashboardPage() {
{ label: 'Activity', value: '15', icon: ChartBarIcon } { label: 'Activity', value: '15', icon: ChartBarIcon }
] ]
// Referral statistics (mock values)
const referralStats = [
{ label: 'Registered Users', value: '123', icon: UsersIcon, color: 'bg-indigo-600' },
{ label: 'Personal Users', value: '85', icon: UserCircleIcon, color: 'bg-teal-600' },
{ label: 'Company Users', value: '38', icon: BuildingOffice2Icon, color: 'bg-amber-600' },
]
return ( return (
<div className="min-h-screen flex flex-col bg-gray-50"> <div className="min-h-screen flex flex-col bg-gray-50">
<Header /> <Header />
@ -132,6 +140,26 @@ export default function DashboardPage() {
</div> </div>
</div> </div>
{/* Referral Statistics */}
<div className="mb-8">
<h2 className="text-xl font-semibold text-gray-900 mb-4">Referral Statistics</h2>
<div className="grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3">
{referralStats.map((stat, i) => (
<div key={i} className="relative overflow-hidden rounded-lg bg-white px-4 pb-10 pt-5 shadow sm:px-6 sm:pt-6">
<dt>
<div className={`absolute rounded-md ${stat.color} p-3`}>
<stat.icon aria-hidden="true" className="h-6 w-6 text-white" />
</div>
<p className="ml-16 truncate text-sm font-medium text-gray-500">{stat.label}</p>
</dt>
<dd className="ml-16 flex items-baseline pb-2">
<p className="text-2xl font-semibold text-gray-900">{stat.value}</p>
</dd>
</div>
))}
</div>
</div>
{/* Quick Actions */} {/* Quick Actions */}
<div className="mb-8"> <div className="mb-8">
<h2 className="text-xl font-semibold text-gray-900 mb-4">Quick Actions</h2> <h2 className="text-xl font-semibold text-gray-900 mb-4">Quick Actions</h2>