diff --git a/frontend/src/components/content-card.tsx b/frontend/src/components/content-card.tsx index c250cff..778a2ad 100644 --- a/frontend/src/components/content-card.tsx +++ b/frontend/src/components/content-card.tsx @@ -3,6 +3,7 @@ import { Edit, Eye, + Flag, Heart, MoreHorizontal, Share2, @@ -34,6 +35,7 @@ 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 { ReportDialog } from "./report-dialog"; import { UserContentEditDialog } from "./user-content-edit-dialog"; interface ContentCardProps { @@ -49,6 +51,7 @@ export function ContentCard({ content, onUpdate }: ContentCardProps) { const [isLiked, setIsLiked] = React.useState(content.isLiked || false); const [likesCount, setLikesCount] = React.useState(content.favoritesCount); const [editDialogOpen, setEditDialogOpen] = React.useState(false); + const [reportDialogOpen, setReportDialogOpen] = React.useState(false); const isAuthor = user?.uuid === content.authorId; const isVideo = !content.mimeType.startsWith("image/"); @@ -188,6 +191,12 @@ export function ContentCard({ content, onUpdate }: ContentCardProps) { Partager + {!isAuthor && ( + setReportDialogOpen(true)}> + + Signaler + + )} diff --git a/frontend/src/components/report-dialog.tsx b/frontend/src/components/report-dialog.tsx new file mode 100644 index 0000000..666ccb8 --- /dev/null +++ b/frontend/src/components/report-dialog.tsx @@ -0,0 +1,117 @@ +"use client"; + +import { useState } from "react"; +import { toast } from "sonner"; +import { Button } from "@/components/ui/button"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, +} from "@/components/ui/dialog"; +import { Label } from "@/components/ui/label"; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from "@/components/ui/select"; +import { Textarea } from "@/components/ui/textarea"; +import { ReportReason, ReportService } from "@/services/report.service"; + +interface ReportDialogProps { + contentId?: string; + tagId?: string; + open: boolean; + onOpenChange: (open: boolean) => void; +} + +export function ReportDialog({ + contentId, + tagId, + open, + onOpenChange, +}: ReportDialogProps) { + const [reason, setReason] = useState(ReportReason.INAPPROPRIATE); + const [description, setDescription] = useState(""); + const [isSubmitting, setIsSubmitting] = useState(false); + + const handleSubmit = async () => { + setIsSubmitting(true); + try { + await ReportService.create({ + contentId, + tagId, + reason, + description, + }); + toast.success("Signalement envoyé avec succès. Merci de nous aider à maintenir la communauté sûre."); + onOpenChange(false); + setDescription(""); + } catch (error) { + toast.error("Erreur lors de l'envoi du signalement."); + } finally { + setIsSubmitting(false); + } + }; + + return ( + + + + Signaler le contenu + + Pourquoi signalez-vous ce contenu ? Un modérateur examinera votre demande. + + +
+
+ + +
+
+ +