diff --git a/frontend/src/components/content-card.tsx b/frontend/src/components/content-card.tsx index 48cfc4b..a64a2e6 100644 --- a/frontend/src/components/content-card.tsx +++ b/frontend/src/components/content-card.tsx @@ -1,6 +1,6 @@ "use client"; -import { Eye, Heart, MoreHorizontal, Share2 } from "lucide-react"; +import { Edit, Eye, Heart, MoreHorizontal, Share2, Trash2 } from "lucide-react"; import Image from "next/image"; import Link from "next/link"; import { useRouter } from "next/navigation"; @@ -15,20 +15,31 @@ import { CardFooter, CardHeader, } from "@/components/ui/card"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, +} from "@/components/ui/dropdown-menu"; import { useAuth } from "@/providers/auth-provider"; import { ContentService } from "@/services/content.service"; import { FavoriteService } from "@/services/favorite.service"; import type { Content } from "@/types/content"; +import { UserContentEditDialog } from "./user-content-edit-dialog"; interface ContentCardProps { content: Content; + onUpdate?: () => void; } -export function ContentCard({ content }: ContentCardProps) { - const { isAuthenticated } = useAuth(); +export function ContentCard({ content, onUpdate }: ContentCardProps) { + const { isAuthenticated, user } = useAuth(); const router = useRouter(); const [isLiked, setIsLiked] = React.useState(content.isLiked || false); const [likesCount, setLikesCount] = React.useState(content.favoritesCount); + const [editDialogOpen, setEditDialogOpen] = React.useState(false); + + const isAuthor = user?.uuid === content.authorId; React.useEffect(() => { setIsLiked(content.isLiked || false); @@ -71,28 +82,69 @@ export function ContentCard({ content }: ContentCardProps) { } }; + const handleDelete = async () => { + if (!confirm("Êtes-vous sûr de vouloir supprimer ce mème ?")) return; + + try { + await ContentService.remove(content.id); + toast.success("Mème supprimé !"); + onUpdate?.(); + } catch (_error) { + toast.error("Erreur lors de la suppression."); + } + }; + return ( - - - - - {content.author.username[0].toUpperCase()} - -
- - {content.author.displayName || content.author.username} - - - {new Date(content.createdAt).toLocaleDateString("fr-FR")} - -
- -
+ <> + + + + + {content.author.username[0].toUpperCase()} + +
+ + {content.author.displayName || content.author.username} + + + {new Date(content.createdAt).toLocaleDateString("fr-FR")} + +
+ +
+ + + + + + {isAuthor && ( + <> + setEditDialogOpen(true)}> + + Modifier + + + + Supprimer + + + )} + toast.success("Lien copié !")}> + + Partager + + + +
+
{content.mimeType.startsWith("image/") ? ( @@ -161,5 +213,12 @@ export function ContentCard({ content }: ContentCardProps) {
+ onUpdate?.()} + /> + ); }