feat: revue de code, doc CODE_REVIEW, forfaits 2026, traduction LLM, providers avec modèle

Made-with: Cursor

frontend/src/app/dashboard/glossaries/GlossaryCard.tsx

@@ -0,0 +1,83 @@
+'use client';
+
+import { memo, useCallback } from 'react';
+import { Card, CardContent } from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { Badge } from '@/components/ui/badge';
+import { BookText, Pencil, Trash2 } from 'lucide-react';
+import type { GlossaryListItem } from './types';
+
+interface GlossaryCardProps {
+  glossary: GlossaryListItem;
+  onEdit: (id: string) => void;
+  onDelete: (id: string, name: string) => void;
+  isDeleting?: boolean;
+}
+
+export const GlossaryCard = memo(function GlossaryCard({
+  glossary,
+  onEdit,
+  onDelete,
+  isDeleting = false,
+}: GlossaryCardProps) {
+  const handleEdit = useCallback(() => {
+    onEdit(glossary.id);
+  }, [glossary.id, onEdit]);
+
+  const handleDelete = useCallback(() => {
+    onDelete(glossary.id, glossary.name);
+  }, [glossary.id, glossary.name, onDelete]);
+
+  const formattedDate = new Date(glossary.created_at).toLocaleDateString('en-US', {
+    year: 'numeric',
+    month: 'short',
+    day: 'numeric',
+  });
+
+  return (
+    <Card className="group hover:border-border/80 transition-colors">
+      <CardContent className="p-4">
+        <div className="flex items-start justify-between gap-4">
+          <div className="flex items-start gap-3 min-w-0 flex-1">
+            <div className="flex size-10 shrink-0 items-center justify-center rounded-lg bg-accent/10">
+              <BookText className="size-5 text-accent" />
+            </div>
+            <div className="min-w-0 flex-1">
+              <h3 className="font-medium text-foreground truncate">{glossary.name}</h3>
+              <div className="flex items-center gap-2 mt-1">
+                <Badge variant="secondary" className="text-xs">
+                  {glossary.terms_count} {glossary.terms_count === 1 ? 'term' : 'terms'}
+                </Badge>
+                <span className="text-xs text-muted-foreground">
+                  Created {formattedDate}
+                </span>
+              </div>
+            </div>
+          </div>
+          
+          <div className="flex items-center gap-1 shrink-0">
+            <Button
+              variant="ghost"
+              size="icon-sm"
+              onClick={handleEdit}
+              className="opacity-0 group-hover:opacity-100 transition-opacity"
+              aria-label={`Edit ${glossary.name}`}
+            >
+              <Pencil className="size-3.5 text-muted-foreground hover:text-foreground" />
+            </Button>
+            <Button
+              variant="ghost"
+              size="icon-sm"
+              onClick={handleDelete}
+              disabled={isDeleting}
+              className="opacity-0 group-hover:opacity-100 transition-opacity"
+              aria-label={`Delete ${glossary.name}`}
+            >
+              <Trash2 className="size-3.5 text-muted-foreground hover:text-destructive" />
+            </Button>
+          </div>
+        </div>
+      </CardContent>
+    </Card>
+  );
+});