first commit

app/analytics/page.tsx

@@ -0,0 +1,49 @@
+import { Suspense } from "react";
+import { Card, CardContent } from "@/components/ui/card";
+import { UsageAnalytics } from "@/components/dashboard/usage-analytics";
+import { RecentTransactions } from "@/components/dashboard/recent-transactions";
+import { BarChart3 } from "lucide-react";
+
+function AnalyticsSkeleton() {
+  return (
+    <div className="space-y-4">
+      {Array.from({ length: 4 }).map((_, i) => (
+        <Card key={i}>
+          <CardContent className="p-6">
+            <div className="animate-pulse space-y-2">
+              <div className="h-4 bg-gray-200 rounded w-3/4"></div>
+              <div className="h-8 bg-gray-200 rounded"></div>
+            </div>
+          </CardContent>
+        </Card>
+      ))}
+    </div>
+  );
+}
+
+export default function AnalyticsPage() {
+  return (
+    <div className="space-y-6">
+      <div>
+        <h1 className="text-3xl font-bold tracking-tight flex items-center gap-2">
+          <BarChart3 className="h-8 w-8" />
+          Analytics détaillées
+        </h1>
+        <p className="text-muted-foreground">
+          Analyses approfondies des performances et de l&apos;utilisation de
+          Cercle GPT
+        </p>
+      </div>
+
+      <Suspense fallback={<AnalyticsSkeleton />}>
+        <div className="space-y-6">
+          {/* Analytics des utilisateurs */}
+          <UsageAnalytics />
+          
+          {/* Transactions récentes - toute la largeur */}
+          <RecentTransactions />
+        </div>
+      </Suspense>
+    </div>
+  );
+}