@hed-hog/lms 0.0.304 → 0.0.305

package/hedhog/frontend/app/page.tsx.ejs

@@ -1,1222 +1,5 @@
-'use client';
-
-import { Page, PageHeader } from '@/components/entity-list';
-import { Avatar, AvatarFallback } from '@/components/ui/avatar';
-import { Badge } from '@/components/ui/badge';
-import { Button } from '@/components/ui/button';
-import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardHeader,
-  CardTitle,
-} from '@/components/ui/card';
-import { Skeleton } from '@/components/ui/skeleton';
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from '@/components/ui/table';
-import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
-import {
-  addDays,
-  format,
-  getDay,
-  parse,
-  setHours,
-  setMinutes,
-  startOfWeek,
-} from 'date-fns';
-import { ptBR } from 'date-fns/locale/pt-BR';
-import { motion, type Variants } from 'framer-motion';
-import {
-  Award,
-  BarChart3,
-  BookOpen,
-  CalendarDays,
-  CheckCircle2,
-  ChevronLeft,
-  ChevronRight,
-  FileCheck,
-  GraduationCap,
-  LayoutDashboard,
-  Percent,
-  TrendingDown,
-  TrendingUp,
-  Users,
-} from 'lucide-react';
-import { useTranslations } from 'next-intl';
-import { usePathname } from 'next/navigation';
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { Calendar, dateFnsLocalizer, type View } from 'react-big-calendar';
-import 'react-big-calendar/lib/css/react-big-calendar.css';
-import {
-  Area,
-  AreaChart,
-  Bar,
-  BarChart,
-  CartesianGrid,
-  Cell,
-  Line,
-  LineChart,
-  Pie,
-  PieChart,
-  ResponsiveContainer,
-  Tooltip,
-  XAxis,
-  YAxis,
-} from 'recharts';
-
-// ── Navigation ─────────────────────────────────────────────────────────────────
-
-const NAV_ITEMS = [
-  { label: 'Dashboard', href: '/', icon: LayoutDashboard },
-  { label: 'Cursos', href: '/cursos', icon: BookOpen },
-  { label: 'Turmas', href: '/turmas', icon: Users },
-  { label: 'Exames', href: '/exames', icon: FileCheck },
-  { label: 'Formacoes', href: '/formacoes', icon: GraduationCap },
-  { label: 'Relatorios', href: '/relatorios', icon: BarChart3 },
-];
-
-// ── Big Calendar localizer ─────────────────────────────────────────────────────
-
-const locales = { 'pt-BR': ptBR };
-
-const localizer = dateFnsLocalizer({
-  format,
-  parse,
-  startOfWeek: () => startOfWeek(new Date(), { weekStartsOn: 1 }),
-  getDay,
-  locales,
-});
-
-// ── Mock Data ──────────────────────────────────────────────────────────────────
-
-const growthData = [
-  { mes: 'Jul', alunos: 1820 },
-  { mes: 'Ago', alunos: 1950 },
-  { mes: 'Set', alunos: 2100 },
-  { mes: 'Out', alunos: 2280 },
-  { mes: 'Nov', alunos: 2540 },
-  { mes: 'Dez', alunos: 2690 },
-  { mes: 'Jan', alunos: 2847 },
-];
-
-const engagementData = [
-  { semana: 'S1', acessos: 820, videoAssistidos: 340, exercicios: 150 },
-  { semana: 'S2', acessos: 950, videoAssistidos: 420, exercicios: 200 },
-  { semana: 'S3', acessos: 870, videoAssistidos: 380, exercicios: 180 },
-  { semana: 'S4', acessos: 1100, videoAssistidos: 510, exercicios: 260 },
-  { semana: 'S5', acessos: 1250, videoAssistidos: 580, exercicios: 310 },
-  { semana: 'S6', acessos: 1180, videoAssistidos: 540, exercicios: 290 },
-  { semana: 'S7', acessos: 1350, videoAssistidos: 620, exercicios: 350 },
-  { semana: 'S8', acessos: 1420, videoAssistidos: 680, exercicios: 380 },
-];
-
-const topCoursesData = [
-  { curso: 'React Avancado', acessos: 847 },
-  { curso: 'Python IA', acessos: 723 },
-  { curso: 'UX Design', acessos: 651 },
-  { curso: 'Node.js API', acessos: 582 },
-  { curso: 'Data Science', acessos: 498 },
-  { curso: 'Flutter', acessos: 412 },
-];
-
-const categoryDistribution = [
-  { nome: 'Tecnologia', valor: 38 },
-  { nome: 'Design', valor: 22 },
-  { nome: 'Gestao', valor: 18 },
-  { nome: 'Marketing', valor: 14 },
-  { nome: 'Outros', valor: 8 },
-];
-
-const PIE_COLORS = [
-  'oklch(0.205 0 0)',
-  'oklch(0.45 0 0)',
-  'oklch(0.60 0 0)',
-  'oklch(0.75 0 0)',
-  'oklch(0.87 0 0)',
-];
-
-const today = new Date();
-
-function genCalendarEvents() {
-  const turmas = [
-    { nome: 'React Avancado - T01', cor: 'oklch(0.205 0 0)' },
-    { nome: 'Python IA - T02', cor: 'oklch(0.45 0 0)' },
-    { nome: 'UX Design - T01', cor: 'oklch(0.60 0 0)' },
-    { nome: 'Node.js API - T03', cor: 'oklch(0.35 0 0)' },
-    { nome: 'Data Science - T01', cor: 'oklch(0.50 0 0)' },
-  ];
-  const events: {
-    title: string;
-    start: Date;
-    end: Date;
-    resource: { cor: string };
-  }[] = [];
-  for (let d = -14; d <= 30; d++) {
-    const dia = addDays(today, d);
-    const dayOfWeek = dia.getDay();
-    if (dayOfWeek === 0 || dayOfWeek === 6) continue;
-    const numAulas = dayOfWeek % 2 === 0 ? 3 : 2;
-    for (let a = 0; a < numAulas; a++) {
-      const turma = turmas[(d + 14 + a) % turmas.length]!;
-      const horaInicio = 8 + a * 3;
-      events.push({
-        title: turma.nome,
-        start: setMinutes(setHours(dia, horaInicio), 0),
-        end: setMinutes(setHours(dia, horaInicio + 2), 0),
-        resource: { cor: turma.cor },
-      });
-    }
-  }
-  return events;
-}
-
-const enrollments = [
-  {
-    id: 1,
-    aluno: 'Ana Costa',
-    email: 'ana.costa@email.com',
-    curso: 'React Avancado',
-    data: '01/03/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 2,
-    aluno: 'Bruno Silva',
-    email: 'bruno.s@email.com',
-    curso: 'Python IA',
-    data: '28/02/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 3,
-    aluno: 'Carla Santos',
-    email: 'carla.s@email.com',
-    curso: 'UX Design',
-    data: '28/02/2026',
-    status: 'Pendente',
-  },
-  {
-    id: 4,
-    aluno: 'Daniel Rocha',
-    email: 'daniel.r@email.com',
-    curso: 'Node.js API',
-    data: '27/02/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 5,
-    aluno: 'Elena Martins',
-    email: 'elena.m@email.com',
-    curso: 'Data Science',
-    data: '27/02/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 6,
-    aluno: 'Fabio Lima',
-    email: 'fabio.l@email.com',
-    curso: 'Flutter',
-    data: '26/02/2026',
-    status: 'Pendente',
-  },
-  {
-    id: 7,
-    aluno: 'Gisele Alves',
-    email: 'gisele.a@email.com',
-    curso: 'React Avancado',
-    data: '26/02/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 8,
-    aluno: 'Hugo Pereira',
-    email: 'hugo.p@email.com',
-    curso: 'Python IA',
-    data: '25/02/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 9,
-    aluno: 'Isabela Nunes',
-    email: 'isabela.n@email.com',
-    curso: 'UX Design',
-    data: '25/02/2026',
-    status: 'Cancelada',
-  },
-  {
-    id: 10,
-    aluno: 'Joao Mendes',
-    email: 'joao.m@email.com',
-    curso: 'Data Science',
-    data: '24/02/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 11,
-    aluno: 'Karen Oliveira',
-    email: 'karen.o@email.com',
-    curso: 'Node.js API',
-    data: '24/02/2026',
-    status: 'Confirmada',
-  },
-  {
-    id: 12,
-    aluno: 'Lucas Ferreira',
-    email: 'lucas.f@email.com',
-    curso: 'Flutter',
-    data: '23/02/2026',
-    status: 'Pendente',
-  },
-];
-
-const nextClasses = [
-  {
-    id: 1,
-    turma: 'React Avancado - T01',
-    disciplina: 'Hooks Avancados',
-    professor: 'Prof. Marcos',
-    data: '02/03/2026',
-    horario: '08:00 - 10:00',
-  },
-  {
-    id: 2,
-    turma: 'Python IA - T02',
-    disciplina: 'Redes Neurais',
-    professor: 'Prof. Lucia',
-    data: '02/03/2026',
-    horario: '10:30 - 12:30',
-  },
-  {
-    id: 3,
-    turma: 'UX Design - T01',
-    disciplina: 'Prototipagem',
-    professor: 'Prof. Renata',
-    data: '02/03/2026',
-    horario: '14:00 - 16:00',
-  },
-  {
-    id: 4,
-    turma: 'Node.js API - T03',
-    disciplina: 'Auth & JWT',
-    professor: 'Prof. Andre',
-    data: '03/03/2026',
-    horario: '08:00 - 10:00',
-  },
-  {
-    id: 5,
-    turma: 'Data Science - T01',
-    disciplina: 'Visualizacao',
-    professor: 'Prof. Paulo',
-    data: '03/03/2026',
-    horario: '10:30 - 12:30',
-  },
-  {
-    id: 6,
-    turma: 'React Avancado - T01',
-    disciplina: 'Context API',
-    professor: 'Prof. Marcos',
-    data: '04/03/2026',
-    horario: '08:00 - 10:00',
-  },
-  {
-    id: 7,
-    turma: 'Python IA - T02',
-    disciplina: 'CNN',
-    professor: 'Prof. Lucia',
-    data: '04/03/2026',
-    horario: '10:30 - 12:30',
-  },
-  {
-    id: 8,
-    turma: 'Flutter - T01',
-    disciplina: 'Widgets',
-    professor: 'Prof. Thiago',
-    data: '05/03/2026',
-    horario: '14:00 - 16:00',
-  },
-  {
-    id: 9,
-    turma: 'UX Design - T01',
-    disciplina: 'Testes A/B',
-    professor: 'Prof. Renata',
-    data: '05/03/2026',
-    horario: '08:00 - 10:00',
-  },
-  {
-    id: 10,
-    turma: 'Node.js API - T03',
-    disciplina: 'WebSockets',
-    professor: 'Prof. Andre',
-    data: '06/03/2026',
-    horario: '08:00 - 10:00',
-  },
-];
-
-// ── Helpers ────────────────────────────────────────────────────────────────────
-
-const ITEMS_PER_PAGE = 5;
-
-function getInitials(name: string) {
-  return name
-    .split(' ')
-    .map((n) => n[0])
-    .join('')
-    .toUpperCase()
-    .slice(0, 2);
-}
-
-function statusColor(status: string) {
-  if (status === 'Confirmada') return 'bg-emerald-100 text-emerald-700';
-  if (status === 'Pendente') return 'bg-amber-100 text-amber-700';
-  return 'bg-red-100 text-red-700';
-}
-
-// ── Chart Tooltip Style ────────────────────────────────────────────────────────
-
-const chartTooltipStyle = {
-  backgroundColor: 'hsl(var(--card))',
-  border: '1px solid hsl(var(--border))',
-  borderRadius: '8px',
-  fontSize: '12px',
-  boxShadow: '0 4px 6px -1px rgba(0,0,0,0.1)',
-};
-
-// ── Container Animations ───────────────────────────────────────────────────────
-
-const stagger = {
-  hidden: {},
-  show: { transition: { staggerChildren: 0.08 } },
-};
-
-const fadeUp: Variants = {
-  hidden: { opacity: 0, y: 16 },
-  show: { opacity: 1, y: 0, transition: { duration: 0.35, ease: 'easeOut' } },
-};
-
-// ── Component ──────────────────────────────────────────────────────────────────
-
-export default function DashboardPage() {
-  const t = useTranslations('lms.DashboardPage');
-
-  const pathname = usePathname();
-  const [loading, setLoading] = useState(true);
-  const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
-
-  // Calendar
-  const [calendarView, setCalendarView] = useState<View>('month');
-  const [calendarDate, setCalendarDate] = useState(today);
-  const calendarEvents = useMemo(() => genCalendarEvents(), []);
-
-  // Table pagination
-  const [enrollPage, setEnrollPage] = useState(1);
-  const [classesPage, setClassesPage] = useState(1);
-
-  useEffect(() => {
-    const timer = setTimeout(() => setLoading(false), 1000);
-    return () => clearTimeout(timer);
-  }, []);
-
-  const enrollTotalPages = Math.ceil(enrollments.length / ITEMS_PER_PAGE);
-  const pagedEnrollments = enrollments.slice(
-    (enrollPage - 1) * ITEMS_PER_PAGE,
-    enrollPage * ITEMS_PER_PAGE
-  );
-
-  const classesTotalPages = Math.ceil(nextClasses.length / ITEMS_PER_PAGE);
-  const pagedClasses = nextClasses.slice(
-    (classesPage - 1) * ITEMS_PER_PAGE,
-    classesPage * ITEMS_PER_PAGE
-  );
-
-  const eventStyleGetter = useCallback(
-    (event: { resource?: { cor?: string } }) => ({
-      style: {
-        backgroundColor: event.resource?.cor ?? 'oklch(0.205 0 0)',
-        border: 'none',
-        borderRadius: '4px',
-        color: '#fff',
-        fontSize: '0.75rem',
-        padding: '2px 6px',
-      },
-    }),
-    []
-  );
-
-  const calendarMessages = useMemo(
-    () => ({
-      today: 'Hoje',
-      previous: 'Anterior',
-      next: 'Proximo',
-      month: 'Mes',
-      week: 'Semana',
-      day: 'Dia',
-      agenda: 'Agenda',
-      date: 'Data',
-      time: 'Hora',
-      event: 'Evento',
-      noEventsInRange: 'Sem aulas neste periodo.',
-      showMore: (count: number) => `+${count} mais`,
-    }),
-    []
-  );
-
-  const kpis = [
-    {
-      titulo: 'Total de Alunos',
-      valor: '2.847',
-      variacao: '+12.5%',
-      positivo: true,
-      icone: Users,
-      descricao: 'vs. mes anterior',
-    },
-    {
-      titulo: 'Cursos Ativos',
-      valor: '48',
-      variacao: '+3',
-      positivo: true,
-      icone: BookOpen,
-      descricao: 'novos este mes',
-    },
-    {
-      titulo: 'Turmas Ativas',
-      valor: '24',
-      variacao: '+5',
-      positivo: true,
-      icone: CalendarDays,
-      descricao: 'em andamento',
-    },
-    {
-      titulo: 'Certificados Emitidos',
-      valor: '1.203',
-      variacao: '+87',
-      positivo: true,
-      icone: Award,
-      descricao: 'este mes',
-    },
-    {
-      titulo: 'Taxa de Conclusao',
-      valor: '78.3%',
-      variacao: '+2.1%',
-      positivo: true,
-      icone: CheckCircle2,
-      descricao: 'media geral',
-    },
-    {
-      titulo: 'Taxa de Aprovacao',
-      valor: '84.7%',
-      variacao: '-0.8%',
-      positivo: false,
-      icone: Percent,
-      descricao: 'nos exames',
-    },
-  ];
-
-  return (
-    <Page>
-      <PageHeader
-        title={t('title')}
-        description={t('description')}
-        breadcrumbs={[
-          {
-            label: t('breadcrumbs.home'),
-            href: '/',
-          },
-          {
-            label: t('breadcrumbs.lms'),
-          },
-        ]}
-      />
-
-      {/* ── Main Content ──────────────────────────────────────────────────── */}
-
-      <motion.div initial="hidden" animate="show" variants={stagger}>
-        {/* ── KPIs ────────────────────────────────────────────────────────── */}
-        <div className="mb-8 grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6">
-          {kpis.map((kpi, i) => (
-            <motion.div key={kpi.titulo} variants={fadeUp}>
-              {loading ? (
-                <Card>
-                  <CardContent className="p-5">
-                    <Skeleton className="mb-3 h-4 w-24" />
-                    <Skeleton className="mb-2 h-8 w-20" />
-                    <Skeleton className="h-3 w-32" />
-                  </CardContent>
-                </Card>
-              ) : (
-                <motion.div
-                  whileHover={{ y: -2 }}
-                  transition={{ duration: 0.2 }}
-                >
-                  <Card className="transition-shadow hover:shadow-md">
-                    <CardContent className="p-5">
-                      <div className="flex items-center justify-between">
-                        <p className="text-xs font-medium text-muted-foreground">
-                          {kpi.titulo}
-                        </p>
-                        <div className="flex size-8 items-center justify-center rounded-lg bg-muted">
-                          <kpi.icone className="size-4 text-muted-foreground" />
-                        </div>
-                      </div>
-                      <p className="mt-2 text-2xl font-bold tracking-tight">
-                        {kpi.valor}
-                      </p>
-                      <div className="mt-1.5 flex items-center gap-1.5">
-                        {kpi.positivo ? (
-                          <span className="flex items-center gap-0.5 rounded-full bg-emerald-50 px-1.5 py-0.5 text-[11px] font-semibold text-emerald-700">
-                            <TrendingUp className="size-3" />
-                            {kpi.variacao}
-                          </span>
-                        ) : (
-                          <span className="flex items-center gap-0.5 rounded-full bg-red-50 px-1.5 py-0.5 text-[11px] font-semibold text-red-600">
-                            <TrendingDown className="size-3" />
-                            {kpi.variacao}
-                          </span>
-                        )}
-                        <span className="text-[11px] text-muted-foreground">
-                          {kpi.descricao}
-                        </span>
-                      </div>
-                    </CardContent>
-                  </Card>
-                </motion.div>
-              )}
-            </motion.div>
-          ))}
-        </div>
-
-        {/* ── Charts Row 1 ────────────────────────────────────────────────── */}
-        <div className="mb-8 grid grid-cols-1 gap-4 lg:grid-cols-7">
-          {/* Line chart - Crescimento de alunos */}
-          <motion.div className="lg:col-span-4" variants={fadeUp}>
-            {loading ? (
-              <Card>
-                <CardContent className="p-6">
-                  <Skeleton className="mb-4 h-5 w-48" />
-                  <Skeleton className="h-[300px] w-full" />
-                </CardContent>
-              </Card>
-            ) : (
-              <Card>
-                <CardHeader className="pb-2">
-                  <CardTitle className="text-sm font-semibold">
-                    Crescimento de Alunos
-                  </CardTitle>
-                  <CardDescription>
-                    Evolucao mensal do total de matriculas
-                  </CardDescription>
-                </CardHeader>
-                <CardContent>
-                  <ResponsiveContainer width="100%" height={300}>
-                    <LineChart data={growthData}>
-                      <CartesianGrid
-                        strokeDasharray="3 3"
-                        stroke="hsl(var(--border))"
-                      />
-                      <XAxis
-                        dataKey="mes"
-                        fontSize={12}
-                        tickLine={false}
-                        axisLine={false}
-                      />
-                      <YAxis fontSize={12} tickLine={false} axisLine={false} />
-                      <Tooltip contentStyle={chartTooltipStyle} />
-                      <Line
-                        type="monotone"
-                        dataKey="alunos"
-                        stroke="oklch(0.205 0 0)"
-                        strokeWidth={2.5}
-                        dot={{
-                          r: 4,
-                          fill: 'oklch(0.205 0 0)',
-                          strokeWidth: 2,
-                          stroke: '#fff',
-                        }}
-                        activeDot={{ r: 6 }}
-                        name="Alunos"
-                      />
-                    </LineChart>
-                  </ResponsiveContainer>
-                </CardContent>
-              </Card>
-            )}
-          </motion.div>
-
-          {/* Area chart - Engajamento */}
-          <motion.div className="lg:col-span-3" variants={fadeUp}>
-            {loading ? (
-              <Card>
-                <CardContent className="p-6">
-                  <Skeleton className="mb-4 h-5 w-40" />
-                  <Skeleton className="h-[300px] w-full" />
-                </CardContent>
-              </Card>
-            ) : (
-              <Card>
-                <CardHeader className="pb-2">
-                  <CardTitle className="text-sm font-semibold">
-                    Engajamento
-                  </CardTitle>
-                  <CardDescription>
-                    Acessos, videos e exercicios por semana
-                  </CardDescription>
-                </CardHeader>
-                <CardContent>
-                  <ResponsiveContainer width="100%" height={300}>
-                    <AreaChart data={engagementData}>
-                      <defs>
-                        <linearGradient
-                          id="colorAcessos"
-                          x1="0"
-                          y1="0"
-                          x2="0"
-                          y2="1"
-                        >
-                          <stop
-                            offset="5%"
-                            stopColor="oklch(0.205 0 0)"
-                            stopOpacity={0.15}
-                          />
-                          <stop
-                            offset="95%"
-                            stopColor="oklch(0.205 0 0)"
-                            stopOpacity={0}
-                          />
-                        </linearGradient>
-                        <linearGradient
-                          id="colorVideos"
-                          x1="0"
-                          y1="0"
-                          x2="0"
-                          y2="1"
-                        >
-                          <stop
-                            offset="5%"
-                            stopColor="oklch(0.55 0 0)"
-                            stopOpacity={0.15}
-                          />
-                          <stop
-                            offset="95%"
-                            stopColor="oklch(0.55 0 0)"
-                            stopOpacity={0}
-                          />
-                        </linearGradient>
-                      </defs>
-                      <CartesianGrid
-                        strokeDasharray="3 3"
-                        stroke="hsl(var(--border))"
-                      />
-                      <XAxis
-                        dataKey="semana"
-                        fontSize={12}
-                        tickLine={false}
-                        axisLine={false}
-                      />
-                      <YAxis fontSize={12} tickLine={false} axisLine={false} />
-                      <Tooltip contentStyle={chartTooltipStyle} />
-                      <Area
-                        type="monotone"
-                        dataKey="acessos"
-                        stroke="oklch(0.205 0 0)"
-                        strokeWidth={2}
-                        fill="url(#colorAcessos)"
-                        name="Acessos"
-                      />
-                      <Area
-                        type="monotone"
-                        dataKey="videoAssistidos"
-                        stroke="oklch(0.55 0 0)"
-                        strokeWidth={2}
-                        fill="url(#colorVideos)"
-                        name="Videos"
-                      />
-                      <Area
-                        type="monotone"
-                        dataKey="exercicios"
-                        stroke="oklch(0.75 0 0)"
-                        strokeWidth={1.5}
-                        fill="none"
-                        name="Exercicios"
-                      />
-                    </AreaChart>
-                  </ResponsiveContainer>
-                </CardContent>
-              </Card>
-            )}
-          </motion.div>
-        </div>
-
-        {/* ── Charts Row 2 ────────────────────────────────────────────────── */}
-        <div className="mb-8 grid grid-cols-1 gap-4 lg:grid-cols-7">
-          {/* Bar chart - Cursos mais acessados */}
-          <motion.div className="lg:col-span-4" variants={fadeUp}>
-            {loading ? (
-              <Card>
-                <CardContent className="p-6">
-                  <Skeleton className="mb-4 h-5 w-48" />
-                  <Skeleton className="h-[300px] w-full" />
-                </CardContent>
-              </Card>
-            ) : (
-              <Card>
-                <CardHeader className="pb-2">
-                  <CardTitle className="text-sm font-semibold">
-                    Cursos Mais Acessados
-                  </CardTitle>
-                  <CardDescription>
-                    Ranking por numero de acessos este mes
-                  </CardDescription>
-                </CardHeader>
-                <CardContent>
-                  <ResponsiveContainer width="100%" height={300}>
-                    <BarChart data={topCoursesData} layout="vertical">
-                      <CartesianGrid
-                        strokeDasharray="3 3"
-                        stroke="hsl(var(--border))"
-                        horizontal={false}
-                      />
-                      <XAxis
-                        type="number"
-                        fontSize={12}
-                        tickLine={false}
-                        axisLine={false}
-                      />
-                      <YAxis
-                        type="category"
-                        dataKey="curso"
-                        fontSize={12}
-                        tickLine={false}
-                        axisLine={false}
-                        width={110}
-                      />
-                      <Tooltip contentStyle={chartTooltipStyle} />
-                      <Bar
-                        dataKey="acessos"
-                        fill="oklch(0.205 0 0)"
-                        radius={[0, 4, 4, 0]}
-                        name="Acessos"
-                        barSize={24}
-                      />
-                    </BarChart>
-                  </ResponsiveContainer>
-                </CardContent>
-              </Card>
-            )}
-          </motion.div>
-
-          {/* Pie chart - Distribuicao por categoria */}
-          <motion.div className="lg:col-span-3" variants={fadeUp}>
-            {loading ? (
-              <Card>
-                <CardContent className="p-6">
-                  <Skeleton className="mb-4 h-5 w-48" />
-                  <Skeleton className="mx-auto h-[220px] w-[220px] rounded-full" />
-                </CardContent>
-              </Card>
-            ) : (
-              <Card>
-                <CardHeader className="pb-2">
-                  <CardTitle className="text-sm font-semibold">
-                    Distribuicao por Categoria
-                  </CardTitle>
-                  <CardDescription>
-                    Percentual de cursos ativos por area
-                  </CardDescription>
-                </CardHeader>
-                <CardContent className="flex flex-col items-center">
-                  <ResponsiveContainer width="100%" height={220}>
-                    <PieChart>
-                      <Pie
-                        data={categoryDistribution}
-                        cx="50%"
-                        cy="50%"
-                        innerRadius={55}
-                        outerRadius={85}
-                        dataKey="valor"
-                        nameKey="nome"
-                        strokeWidth={3}
-                        stroke="hsl(var(--background))"
-                      >
-                        {categoryDistribution.map((_, index) => (
-                          <Cell
-                            key={`cell-${index}`}
-                            fill={PIE_COLORS[index]}
-                          />
-                        ))}
-                      </Pie>
-                      <Tooltip
-                        contentStyle={chartTooltipStyle}
-                        formatter={(value: number) => [
-                          `${value}%`,
-                          'Percentual',
-                        ]}
-                      />
-                    </PieChart>
-                  </ResponsiveContainer>
-                  <div className="mt-3 flex flex-wrap justify-center gap-x-4 gap-y-2">
-                    {categoryDistribution.map((item, i) => (
-                      <div
-                        key={item.nome}
-                        className="flex items-center gap-1.5 text-xs"
-                      >
-                        <span
-                          className="inline-block size-2.5 rounded-full"
-                          style={{ backgroundColor: PIE_COLORS[i] }}
-                        />
-                        <span className="text-muted-foreground">
-                          {item.nome} ({item.valor}%)
-                        </span>
-                      </div>
-                    ))}
-                  </div>
-                </CardContent>
-              </Card>
-            )}
-          </motion.div>
-        </div>
-
-        {/* ── Calendar ────────────────────────────────────────────────────── */}
-        <motion.div className="mb-8" variants={fadeUp}>
-          {loading ? (
-            <Card>
-              <CardContent className="p-6">
-                <Skeleton className="mb-4 h-5 w-40" />
-                <Skeleton className="h-[500px] w-full rounded-lg" />
-              </CardContent>
-            </Card>
-          ) : (
-            <Card>
-              <CardHeader className="pb-2">
-                <CardTitle className="text-sm font-semibold">
-                  Calendario Global de Aulas
-                </CardTitle>
-                <CardDescription>
-                  Todas as aulas de todas as turmas
-                </CardDescription>
-              </CardHeader>
-              <CardContent>
-                <div className="h-[520px] lg:h-[580px]">
-                  <Calendar
-                    localizer={localizer}
-                    events={calendarEvents}
-                    startAccessor="start"
-                    endAccessor="end"
-                    view={calendarView}
-                    onView={(v) => setCalendarView(v)}
-                    date={calendarDate}
-                    onNavigate={(d) => setCalendarDate(d)}
-                    views={['month', 'week']}
-                    messages={calendarMessages}
-                    eventPropGetter={eventStyleGetter}
-                    culture="pt-BR"
-                    popup
-                    style={{ height: '100%' }}
-                  />
-                </div>
-              </CardContent>
-            </Card>
-          )}
-        </motion.div>
-
-        {/* ── Tables ──────────────────────────────────────────────────────── */}
-        <motion.div className="mb-8" variants={fadeUp}>
-          <Tabs defaultValue="matriculas">
-            <TabsList className="mb-4">
-              <TabsTrigger value="matriculas">Ultimas Matriculas</TabsTrigger>
-              <TabsTrigger value="aulas">Proximas Aulas</TabsTrigger>
-            </TabsList>
-
-            {/* ─ Tab: Matriculas ─ */}
-            <TabsContent value="matriculas">
-              {loading ? (
-                <Card>
-                  <CardContent className="p-6">
-                    {Array.from({ length: 5 }).map((_, i) => (
-                      <div key={i} className="mb-4 flex items-center gap-4">
-                        <Skeleton className="size-10 rounded-full" />
-                        <div className="flex-1">
-                          <Skeleton className="mb-2 h-4 w-40" />
-                          <Skeleton className="h-3 w-24" />
-                        </div>
-                        <Skeleton className="h-6 w-20" />
-                      </div>
-                    ))}
-                  </CardContent>
-                </Card>
-              ) : (
-                <Card>
-                  <CardHeader className="pb-2">
-                    <CardTitle className="text-sm font-semibold">
-                      Ultimas Matriculas
-                    </CardTitle>
-                    <CardDescription>
-                      {enrollments.length} matriculas recentes
-                    </CardDescription>
-                  </CardHeader>
-                  <CardContent>
-                    <div className="overflow-x-auto">
-                      <Table>
-                        <TableHeader>
-                          <TableRow>
-                            <TableHead>Aluno</TableHead>
-                            <TableHead className="hidden sm:table-cell">
-                              Email
-                            </TableHead>
-                            <TableHead>Curso</TableHead>
-                            <TableHead className="hidden md:table-cell">
-                              Data
-                            </TableHead>
-                            <TableHead>Status</TableHead>
-                          </TableRow>
-                        </TableHeader>
-                        <TableBody>
-                          {pagedEnrollments.map((m) => (
-                            <TableRow key={m.id}>
-                              <TableCell>
-                                <div className="flex items-center gap-2.5">
-                                  <Avatar className="size-8">
-                                    <AvatarFallback className="bg-foreground text-[10px] font-medium text-background">
-                                      {getInitials(m.aluno)}
-                                    </AvatarFallback>
-                                  </Avatar>
-                                  <span className="font-medium">{m.aluno}</span>
-                                </div>
-                              </TableCell>
-                              <TableCell className="hidden text-muted-foreground sm:table-cell">
-                                {m.email}
-                              </TableCell>
-                              <TableCell>{m.curso}</TableCell>
-                              <TableCell className="hidden text-muted-foreground md:table-cell">
-                                {m.data}
-                              </TableCell>
-                              <TableCell>
-                                <span
-                                  className={`inline-flex items-center rounded-full px-2 py-0.5 text-[11px] font-semibold ${statusColor(m.status)}`}
-                                >
-                                  {m.status}
-                                </span>
-                              </TableCell>
-                            </TableRow>
-                          ))}
-                        </TableBody>
-                      </Table>
-                    </div>
-
-                    {/* Pagination */}
-                    <div className="mt-4 flex items-center justify-between border-t pt-4">
-                      <p className="text-xs text-muted-foreground">
-                        Mostrando {(enrollPage - 1) * ITEMS_PER_PAGE + 1} -{' '}
-                        {Math.min(
-                          enrollPage * ITEMS_PER_PAGE,
-                          enrollments.length
-                        )}{' '}
-                        de {enrollments.length}
-                      </p>
-                      <div className="flex items-center gap-1">
-                        <Button
-                          variant="outline"
-                          size="icon"
-                          className="size-8"
-                          disabled={enrollPage === 1}
-                          onClick={() => setEnrollPage((p) => p - 1)}
-                          aria-label="Pagina anterior"
-                        >
-                          <ChevronLeft className="size-4" />
-                        </Button>
-                        {Array.from({ length: enrollTotalPages }).map(
-                          (_, i) => (
-                            <Button
-                              key={i}
-                              variant={
-                                enrollPage === i + 1 ? 'default' : 'outline'
-                              }
-                              size="icon"
-                              className="size-8 text-xs"
-                              onClick={() => setEnrollPage(i + 1)}
-                            >
-                              {i + 1}
-                            </Button>
-                          )
-                        )}
-                        <Button
-                          variant="outline"
-                          size="icon"
-                          className="size-8"
-                          disabled={enrollPage === enrollTotalPages}
-                          onClick={() => setEnrollPage((p) => p + 1)}
-                          aria-label="Proxima pagina"
-                        >
-                          <ChevronRight className="size-4" />
-                        </Button>
-                      </div>
-                    </div>
-                  </CardContent>
-                </Card>
-              )}
-            </TabsContent>
-
-            {/* ─ Tab: Proximas Aulas ─ */}
-            <TabsContent value="aulas">
-              {loading ? (
-                <Card>
-                  <CardContent className="p-6">
-                    {Array.from({ length: 5 }).map((_, i) => (
-                      <div key={i} className="mb-4 flex items-center gap-4">
-                        <Skeleton className="size-8 rounded-lg" />
-                        <div className="flex-1">
-                          <Skeleton className="mb-2 h-4 w-48" />
-                          <Skeleton className="h-3 w-32" />
-                        </div>
-                        <Skeleton className="h-6 w-28" />
-                      </div>
-                    ))}
-                  </CardContent>
-                </Card>
-              ) : (
-                <Card>
-                  <CardHeader className="pb-2">
-                    <CardTitle className="text-sm font-semibold">
-                      Proximas Aulas
-                    </CardTitle>
-                    <CardDescription>
-                      Agenda das proximas aulas programadas
-                    </CardDescription>
-                  </CardHeader>
-                  <CardContent>
-                    <div className="overflow-x-auto">
-                      <Table>
-                        <TableHeader>
-                          <TableRow>
-                            <TableHead>Turma</TableHead>
-                            <TableHead>Disciplina</TableHead>
-                            <TableHead className="hidden sm:table-cell">
-                              Professor
-                            </TableHead>
-                            <TableHead>Data</TableHead>
-                            <TableHead className="hidden md:table-cell">
-                              Horario
-                            </TableHead>
-                          </TableRow>
-                        </TableHeader>
-                        <TableBody>
-                          {pagedClasses.map((aula) => (
-                            <TableRow key={aula.id}>
-                              <TableCell>
-                                <div className="flex items-center gap-2">
-                                  <div className="flex size-8 items-center justify-center rounded-lg bg-muted">
-                                    <BookOpen className="size-3.5 text-muted-foreground" />
-                                  </div>
-                                  <span className="font-medium">
-                                    {aula.turma}
-                                  </span>
-                                </div>
-                              </TableCell>
-                              <TableCell>{aula.disciplina}</TableCell>
-                              <TableCell className="hidden text-muted-foreground sm:table-cell">
-                                {aula.professor}
-                              </TableCell>
-                              <TableCell>
-                                <Badge
-                                  variant="outline"
-                                  className="text-xs font-normal"
-                                >
-                                  {aula.data}
-                                </Badge>
-                              </TableCell>
-                              <TableCell className="hidden text-muted-foreground md:table-cell">
-                                {aula.horario}
-                              </TableCell>
-                            </TableRow>
-                          ))}
-                        </TableBody>
-                      </Table>
-                    </div>
-
-                    {/* Pagination */}
-                    <div className="mt-4 flex items-center justify-between border-t pt-4">
-                      <p className="text-xs text-muted-foreground">
-                        Mostrando {(classesPage - 1) * ITEMS_PER_PAGE + 1} -{' '}
-                        {Math.min(
-                          classesPage * ITEMS_PER_PAGE,
-                          nextClasses.length
-                        )}{' '}
-                        de {nextClasses.length}
-                      </p>
-                      <div className="flex items-center gap-1">
-                        <Button
-                          variant="outline"
-                          size="icon"
-                          className="size-8"
-                          disabled={classesPage === 1}
-                          onClick={() => setClassesPage((p) => p - 1)}
-                          aria-label="Pagina anterior"
-                        >
-                          <ChevronLeft className="size-4" />
-                        </Button>
-                        {Array.from({ length: classesTotalPages }).map(
-                          (_, i) => (
-                            <Button
-                              key={i}
-                              variant={
-                                classesPage === i + 1 ? 'default' : 'outline'
-                              }
-                              size="icon"
-                              className="size-8 text-xs"
-                              onClick={() => setClassesPage(i + 1)}
-                            >
-                              {i + 1}
-                            </Button>
-                          )
-                        )}
-                        <Button
-                          variant="outline"
-                          size="icon"
-                          className="size-8"
-                          disabled={classesPage === classesTotalPages}
-                          onClick={() => setClassesPage((p) => p + 1)}
-                          aria-label="Proxima pagina"
-                        >
-                          <ChevronRight className="size-4" />
-                        </Button>
-                      </div>
-                    </div>
-                  </CardContent>
-                </Card>
-              )}
-            </TabsContent>
-          </Tabs>
-        </motion.div>
-
-        {/* ── Footer status ──────────────────────────────────────────────── */}
-        {!loading && (
-          <motion.div variants={fadeUp}>
-            <Card>
-              <CardContent className="flex flex-wrap items-center justify-between gap-4 p-4">
-                <div className="flex items-center gap-2.5">
-                  <Badge
-                    variant="secondary"
-                    className="gap-1.5 text-xs font-medium"
-                  >
-                    <span className="inline-block size-2 rounded-full bg-emerald-500" />
-                    Sistema Operacional
-                  </Badge>
-                </div>
-                <div className="flex flex-wrap gap-x-6 gap-y-1 text-xs text-muted-foreground">
-                  <span>24 turmas ativas</span>
-                  <span>48 cursos publicados</span>
-                  <span>2.847 alunos matriculados</span>
-                  <span>1.203 certificados</span>
-                </div>
-              </CardContent>
-            </Card>
-          </motion.div>
-        )}
-      </motion.div>
-    </Page>
-  );
-}
+import { redirect } from 'next/navigation';
+
+export default function LmsPage() {
+  redirect('/lms/courses');
+}