import { DashboardPage } from '@brikl/ui';

export default function Dashboard() {
  return (
    <DashboardPage
      title="Mon tableau de bord"
      description="Vue d'ensemble de votre activité"
    />
  );
}

import { DashboardPage } from '@brikl/ui';
import { IconHome, IconUsers, IconSettings, IconAnalytics } from '@brikl/icons';

export default function AdminDashboard() {
  const navigation = [
    {
      label: 'Tableau de bord',
      href: '/dashboard',
      icon: <IconHome />,
      active: true
    },
    {
      label: 'Utilisateurs',
      href: '/users',
      icon: <IconUsers />
    },
    {
      label: 'Analytics',
      href: '/analytics',
      icon: <IconAnalytics />
    },
    {
      label: 'Paramètres',
      href: '/settings',
      icon: <IconSettings />
    }
  ];

  return (
    <DashboardPage
      title="Administration"
      navigation={navigation}
    />
  );
}

import { DashboardPage } from '@brikl/ui';

export default function DashboardWithWidgets() {
  const widgets = [
    {
      title: 'Utilisateurs actifs',
      value: '1,234',
      change: '+12%',
      trend: 'up',
      icon: <IconUsers />
    },
    {
      title: 'Revenus mensuels',
      value: '€45,678',
      change: '+8%',
      trend: 'up',
      icon: <IconDollar />
    },
    {
      title: 'Taux de conversion',
      value: '3.2%',
      change: '-2%',
      trend: 'down',
      icon: <IconTrendingUp />
    },
    {
      title: 'Tickets ouverts',
      value: '89',
      change: '+5%',
      trend: 'up',
      icon: <IconTicket />
    }
  ];

  return (
    <DashboardPage
      title="Tableau de bord"
      widgets={widgets}
    />
  );
}

import { DashboardPage } from '@brikl/ui';

export default function DashboardWithCharts() {
  const charts = [
    {
      title: 'Ventes mensuelles',
      type: 'line',
      data: [
        { month: 'Jan', sales: 1200 },
        { month: 'Fév', sales: 1900 },
        { month: 'Mar', sales: 1500 },
        { month: 'Avr', sales: 2100 }
      ]
    },
    {
      title: 'Répartition des utilisateurs',
      type: 'pie',
      data: [
        { label: 'Nouveaux', value: 45 },
        { label: 'Actifs', value: 35 },
        { label: 'Inactifs', value: 20 }
      ]
    }
  ];

  return (
    <DashboardPage
      title="Analytics"
      charts={charts}
    />
  );
}

import { DashboardPage } from '@brikl/ui';

export default function DashboardWithTables() {
  const recentUsers = [
    {
      id: 1,
      name: 'John Doe',
      email: 'john@example.com',
      status: 'active',
      joined: '2024-01-15'
    },
    {
      id: 2,
      name: 'Jane Smith',
      email: 'jane@example.com',
      status: 'pending',
      joined: '2024-01-14'
    }
  ];

  const columns = [
    { key: 'name', label: 'Nom' },
    { key: 'email', label: 'Email' },
    { key: 'status', label: 'Statut' },
    { key: 'joined', label: 'Date d\'inscription' }
  ];

  return (
    <DashboardPage
      title="Gestion des utilisateurs"
      tables={[
        {
          title: 'Utilisateurs récents',
          data: recentUsers,
          columns: columns
        }
      ]}
    />
  );
}

import { DashboardPage } from '@brikl/ui';

export default function CustomDashboard() {
  return (
    <DashboardPage
      title="Tableau de bord personnalisé"
      theme={{
        primary: '#3B82F6',
        secondary: '#6B7280',
        accent: '#10B981'
      }}
      layout={{
        sidebar: true,
        header: true,
        footer: false
      }}
      user={{
        name: 'John Doe',
        email: 'john@example.com',
        avatar: '/avatars/john.jpg',
        role: 'Administrateur'
      }}
      notifications={[
        {
          id: 1,
          title: 'Nouveau utilisateur',
          message: 'Jane Smith s\'est inscrite',
          type: 'info',
          time: '2 min ago'
        }
      ]}
    />
  );
}