'use client';

import { useState } from 'react';

import UserRoleDistribution from '@/components/Dashboard/admin/UserRoleDistribution';
import ConsultationsReport from '@/components/Dashboard/admin/ConsultationsReport';
import MonthlyActivityChart from '@/components/Dashboard/admin/MonthlyActivityChart';
import ReportDownloadCard from '@/components/Dashboard/admin/ReportDownloadCard';

export default function AdminReports() {
  const [sidebarOpen, setSidebarOpen] = useState(false);

  return (
    <div className="flex min-h-screen bg-gray-100 text-black">
      <div className="flex flex-col flex-1 w-full">
        <main className="p-4 space-y-6">
          <h1 className="text-2xl font-bold">Reports & Analytics</h1>

          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
            <UserRoleDistribution />
            <ConsultationsReport />
          </div>

          <MonthlyActivityChart />
          <ReportDownloadCard />
        </main>
      </div>
    </div>
  );
}
