new

components/dashboard/metric-cards.tsx

@@ -8,8 +8,10 @@ import {
   TrendingUp,
   TrendingDown,
   Activity,
+  Euro,
 } from "lucide-react";
 import { cn } from "@/lib/utils";
+import { convertCreditsToEuros } from "@/lib/utils/currency";
 
 interface MetricCardProps {
   title: string;
@@ -77,6 +79,9 @@ interface MetricCardsProps {
 }
 
 export function MetricCards({ metrics }: MetricCardsProps) {
+  // Conversion des crédits en euros
+  const creditsConversion = convertCreditsToEuros(metrics.totalCreditsUsed);
+
   return (
     <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
       <MetricCard
@@ -105,7 +110,10 @@ export function MetricCards({ metrics }: MetricCardsProps) {
           <CardTitle className="text-sm font-medium text-muted-foreground">
             Crédits totaux
           </CardTitle>
-          <CreditCard className="h-4 w-4 text-muted-foreground" />
+          <div className="flex items-center gap-1">
+            <CreditCard className="h-4 w-4 text-muted-foreground" />
+            <Euro className="h-4 w-4 text-green-600" />
+          </div>
         </CardHeader>
         <CardContent>
           <div className="text-2xl font-bold">
@@ -114,7 +122,22 @@ export function MetricCards({ metrics }: MetricCardsProps) {
           <p className="text-xs text-muted-foreground mt-1">
             crédits disponibles
           </p>
-          <div className="flex items-center space-x-2 text-xs text-muted-foreground mt-1">
+          
+          {/* Conversion en euros */}
+          <div className="mt-2 p-2 bg-green-50 rounded-lg border border-green-200">
+            <div className="flex items-center justify-between">
+              <span className="text-sm font-medium text-green-800">Valeur en EUR:</span>
+              <span className="text-lg font-bold text-green-600">
+                {creditsConversion.formatted.eur}
+              </span>
+            </div>
+            <div className="flex items-center justify-between text-xs text-green-600">
+              <span>USD: {creditsConversion.formatted.usd}</span>
+              <span>Taux: 1 USD = 0.92 EUR</span>
+            </div>
+          </div>
+          
+          <div className="flex items-center space-x-2 text-xs text-muted-foreground mt-2">
             <TrendingUp className="h-3 w-3 text-green-500" />
             <span className="text-green-500">+23%</span>
             <span>par rapport au mois dernier</span>