import { prisma } from '@/lib/prisma';
import { 
  Users, 
  Store, 
  Clock, 
  MessageCircle,
  Eye
} from 'lucide-react';

async function getStats() {
  const usersCount = await prisma.user.count();
  const businessCount = await prisma.business.count();
  const pendingCount = await prisma.business.count({ where: { verified: false } });
  const commentsCount = await prisma.comment.count();
  
  // Aggregate views
  const aggregateResult = await prisma.business.aggregate({
    _sum: {
      viewCount: true
    }
  });
  const totalViews = aggregateResult._sum.viewCount || 0;

  return { usersCount, businessCount, pendingCount, commentsCount, totalViews };
}

export default async function DashboardPage() {
  const stats = await getStats();

  const statCards = [
    { label: 'Utilisateurs', value: stats.usersCount, icon: Users, color: 'text-blue-400' },
    { label: 'Entrepreneurs', value: stats.businessCount, icon: Store, color: 'text-emerald-400' },
    { label: 'En attente', value: stats.pendingCount, icon: Clock, color: 'text-amber-400' },
    { label: 'Commentaires', value: stats.commentsCount, icon: MessageCircle, color: 'text-purple-400' },
    { label: 'Total Vues', value: stats.totalViews, icon: Eye, color: 'text-brand-400' },
  ];

  return (
    <div>
      <div className="mb-8">
        <h1 className="text-3xl font-bold text-white mb-2">Tableau de bord</h1>
        <p className="text-slate-400">Vue d'ensemble de l'activité sur la plateforme.</p>
      </div>

      <div className="stats-grid">
        {statCards.map((card) => (
          <div key={card.label} className="card">
            <div className="flex justify-between items-start mb-4">
              <div className={`p-2 rounded-lg bg-slate-800 ${card.color}`}>
                <card.icon className="w-6 h-6" />
              </div>
              <span className="text-2xl font-bold text-white">{card.value}</span>
            </div>
            <h3 className="text-slate-400 font-medium">{card.label}</h3>
          </div>
        ))}
      </div>

      <div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
        <div className="card">
          <h2 className="text-xl font-bold text-white mb-4">Derniers entrepreneurs</h2>
          <div className="space-y-4">
            <p className="text-slate-500 italic">Bientôt disponible...</p>
          </div>
        </div>
        <div className="card">
          <h2 className="text-xl font-bold text-white mb-4">Activité récente</h2>
          <div className="space-y-4">
            <p className="text-slate-500 italic">Bientôt disponible...</p>
          </div>
        </div>
      </div>
    </div>
  );
}
