Files
memegoat/frontend/src/app/(dashboard)/help/page.tsx
Mathis HERRIOT fb7ddde42e feat(app): add dashboard pages for settings, admin, and public user profiles
Introduce new pages for profile settings, admin dashboard (users, contents, categories), and public user profiles. Enhance profile functionality with avatar uploads and bio updates. Include help and improved content trends/recent pages. Streamline content display using `HomeContent`.
2026-01-14 21:43:27 +01:00

73 lines
2.6 KiB
TypeScript

import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/accordion";
import { HelpCircle } from "lucide-react";
export default function HelpPage() {
const faqs = [
{
question: "Comment puis-je publier un mème ?",
answer:
"Pour publier un mème, vous devez être connecté à votre compte. Cliquez sur le bouton 'Publier' dans la barre latérale, choisissez votre fichier (image ou GIF), donnez-lui un titre et une catégorie, puis validez.",
},
{
question: "Quels formats de fichiers sont acceptés ?",
answer:
"Nous acceptons les images au format PNG, JPEG, WebP et les GIF animés. La taille maximale recommandée est de 2 Mo.",
},
{
question: "Comment fonctionnent les favoris ?",
answer:
"En cliquant sur l'icône de cœur sur un mème, vous l'ajoutez à vos favoris. Vous pouvez retrouver tous vos mèmes favoris dans l'onglet 'Mes Favoris' de votre profil.",
},
{
question: "Puis-je supprimer un mème que j'ai publié ?",
answer:
"Oui, vous pouvez supprimer vos propres mèmes en vous rendant sur votre profil, en sélectionnant le mème et en cliquant sur l'option de suppression.",
},
{
question: "Comment fonctionne le système de recherche ?",
answer:
"Vous pouvez rechercher des mèmes par titre en utilisant la barre de recherche dans la colonne de droite. Vous pouvez également filtrer par catégories ou par tags populaires.",
},
];
return (
<div className="max-w-3xl mx-auto py-12 px-4">
<div className="flex items-center gap-3 mb-8">
<div className="bg-primary/10 p-3 rounded-xl">
<HelpCircle className="h-6 w-6 text-primary" />
</div>
<h1 className="text-3xl font-bold">Centre d'aide</h1>
</div>
<div className="bg-white dark:bg-zinc-900 border rounded-2xl p-6 shadow-sm mb-12">
<h2 className="text-xl font-semibold mb-6">Foire Aux Questions</h2>
<Accordion type="single" collapsible className="w-full">
{faqs.map((faq, index) => (
<AccordionItem key={index} value={`item-${index}`}>
<AccordionTrigger className="text-left">
{faq.question}
</AccordionTrigger>
<AccordionContent className="text-muted-foreground leading-relaxed">
{faq.answer}
</AccordionContent>
</AccordionItem>
))}
</Accordion>
</div>
<div className="text-center space-y-4">
<h2 className="text-lg font-medium">Vous ne trouvez pas de réponse ?</h2>
<p className="text-muted-foreground">
N'hésitez pas à nous contacter sur nos réseaux sociaux ou par email.
</p>
<p className="font-semibold text-primary">contact@memegoat.local</p>
</div>
</div>
);
}