"use client"; import { useState, useEffect, useCallback, useRef } from "react"; import Image from "next/image"; import { LordIcon } from "@/components/LordIcon"; import { MauritaniaMap } from "@/components/MauritaniaMap"; import { ProjectsCarousel } from "@/components/ProjectsCarousel"; import { EditableSection } from "@/components/admin/EditableSection"; import { useEditMode } from "@/context/EditModeContext"; import { ArrowRight, ChevronLeft, ChevronRight, Handshake, TrendingUp, Play } from "lucide-react"; const HERO_SLIDES = [ { src: "/carousel-images/1.jpg", alt: "ANED - Actions sur le terrain" }, { src: "/carousel-images/3.jpeg", alt: "ANED - Communautés bénéficiaires" }, { src: "/carousel-images/4.jpeg", alt: "ANED - Communautés bénéficiaires" }, { src: "/carousel-images/8.jpeg", alt: "ANED - Nutrition et développement" }, { src: "/carousel-images/7.jpeg", alt: "ANED - Activités sur le terrain" }, { src: "/carousel-images/9.jpeg", alt: "ANED - Projets communautaires" }, ]; // LordIcon URLs and colors are fixed visuals per position — content comes from DB const VALUE_LORD_ICONS = [ { src: "https://cdn.lordicon.com/gqdnbnwt.json", color: "#E67E22" }, { src: "https://cdn.lordicon.com/fhtaantg.json", color: "#4A7C59" }, { src: "https://cdn.lordicon.com/egiwmiit.json", color: "#1E40AF" }, { src: "https://cdn.lordicon.com/dxjqoygy.json", color: "#27AE60" }, ]; function renderHighlighted(text: string) { const parts = text.split(/(\*\*[^*]+\*\*)/g); return parts.map((part, i) => { if (part.startsWith("**") && part.endsWith("**")) { return {part.slice(2, -2)}; } return {part}; }); } type AboutContent = { title: string; description: string; stat1Value: string; stat1Label: string; stat2Value: string; stat2Label: string; stat3Value: string; stat3Label: string; }; type CoreValue = { id: string; number: string; name: string; description: string; color: string; order: number; }; type SiteSettings = { heroTitle: string; heroSubtitle: string; heroCta1Text: string; heroCta1Link: string; heroCta2Text: string; heroCta2Link: string; mapStat1: string; mapStat1Label: string; mapStat2: string; mapStat2Label: string; mapStat3: string; mapStat3Label: string; mapStat4: string; mapStat4Label: string; partnersSectionTitle: string; partnersSectionSubtitle: string; networkBadge1: string; networkBadge2: string; presidentQuote: string; bottomCtaTitle: string; bottomCtaDescription: string; bottomStat1: string; bottomStat1Label: string; bottomStat2: string; bottomStat2Label: string; bottomStat3: string; bottomStat3Label: string; }; type Partner = { id: string; name: string; logo: string; category: string; }; type Campaign = { id: string; title: string; slogan: string | null; description: string | null; amountRaised: string | null; mediaType: string; imageUrl: string | null; videoUrl: string | null; active: boolean; }; const ABOUT_DEFAULTS: AboutContent = { title: "Qui sommes-nous ?", description: "Nous sommes une organisation nationale et pionnière dans les domaines du développement et de l'humanitaire.", stat1Value: "20+", stat1Label: "Années", stat2Value: "7", stat2Label: "Zones", stat3Value: "20+", stat3Label: "Partenaires", }; const SETTINGS_DEFAULTS: SiteSettings = { heroTitle: "Ensemble contre la **malnutrition** pour un meilleur développement", heroSubtitle: "Afin que chaque enfant, chaque femme et chaque ménage sécurise sa situation alimentaire et nutritionnelle de manière **durable**.", heroCta1Text: "Découvrir ANED", heroCta1Link: "#mission", heroCta2Text: "Nos projets", heroCta2Link: "#projets", mapStat1: "20+", mapStat1Label: "années d'expérience", mapStat2: "7", mapStat2Label: "wilayas prioritaires", mapStat3: "50K+", mapStat3Label: "bénéficiaires", mapStat4: "15+", mapStat4Label: "projets réalisés", partnersSectionTitle: "Nos partenaires", partnersSectionSubtitle: "20+ années de collaborations avec les acteurs majeurs du développement et de l'aide humanitaire.", networkBadge1: "ROSA · Lead Nutrition Mauritanie", networkBadge2: "Initiative SUN", presidentQuote: "Ce site Web se veut une vitrine qui met en exergue nos différentes interventions, nos partenaires et les personnes pour lesquelles et avec lesquelles nous travaillons.", bottomCtaTitle: "Ensemble, construisons un avenir sans malnutrition", bottomCtaDescription: "Depuis 2002, ANED protège les enfants et les familles vulnérables de Mauritanie. Chaque partenariat compte.", bottomStat1: "20+", bottomStat1Label: "ans d'expérience", bottomStat2: "50K+", bottomStat2Label: "bénéficiaires", bottomStat3: "7", bottomStat3Label: "wilayas couvertes", }; function toEmbedUrl(url: string): string { try { const ytMatch = url.match(/(?:youtube\.com\/watch\?v=|youtu\.be\/)([A-Za-z0-9_-]{11})/); if (ytMatch) return `https://www.youtube.com/embed/${ytMatch[1]}`; const vimeoMatch = url.match(/vimeo\.com\/(\d+)/); if (vimeoMatch) return `https://player.vimeo.com/video/${vimeoMatch[1]}`; } catch { /* ignore */ } return url; } function HeroCarousel({ about, settings }: { about: AboutContent; settings: SiteSettings }) { const [current, setCurrent] = useState(0); const [transitioning, setTransitioning] = useState(false); const timerRef = useRef | null>(null); const goTo = useCallback((index: number) => { if (transitioning) return; setTransitioning(true); setTimeout(() => { setCurrent(index); setTransitioning(false); }, 300); }, [transitioning]); const prev = useCallback(() => goTo((current - 1 + HERO_SLIDES.length) % HERO_SLIDES.length), [current, goTo]); const next = useCallback(() => goTo((current + 1) % HERO_SLIDES.length), [current, goTo]); useEffect(() => { timerRef.current = setTimeout(() => { setCurrent((c) => (c + 1) % HERO_SLIDES.length); }, 5000); return () => { if (timerRef.current) clearTimeout(timerRef.current); }; }, [current]); return (
{HERO_SLIDES.map((slide, i) => (
{slide.alt}
))}

{renderHighlighted(settings.heroTitle)}

{renderHighlighted(settings.heroSubtitle)}

{about.stat1Value}
{about.stat1Label}
{about.stat2Value}
{about.stat2Label}
{about.stat3Value}
{about.stat3Label}
{HERO_SLIDES.map((_, i) => (
); } export default function Home() { const [partners, setPartners] = useState([]); const [campaign, setCampaign] = useState(null); const [about, setAbout] = useState(ABOUT_DEFAULTS); const [settings, setSettings] = useState(SETTINGS_DEFAULTS); const [coreValues, setCoreValues] = useState([]); const { contentVersion } = useEditMode(); useEffect(() => { fetch("/api/partners").then((r) => r.json()).then(setPartners).catch(console.error); fetch("/api/campaign").then((r) => r.json()).then(setCampaign).catch(console.error); fetch("/api/about").then((r) => r.json()).then((d) => setAbout({ ...ABOUT_DEFAULTS, ...d })).catch(console.error); fetch("/api/site-settings").then((r) => r.json()).then((d) => setSettings({ ...SETTINGS_DEFAULTS, ...d })).catch(console.error); fetch("/api/core-values").then((r) => r.json()).then(setCoreValues).catch(console.error); }, [contentVersion]); return ( <> {/* Campaign Banner */} {campaign && ( <>
En cours
{campaign.title} {campaign.slogan && {campaign.slogan}}
{campaign.slogan && ( {campaign.slogan} )} {campaign.amountRaised && (
{campaign.amountRaised}
)} {(campaign.imageUrl || campaign.videoUrl) && (
{(() => { if (campaign.mediaType === "video" && campaign.videoUrl) { const ytMatch = campaign.videoUrl.match(/(?:youtube\.com\/watch\?v=|youtu\.be\/)([A-Za-z0-9_-]{11})/); if (ytMatch) { /* eslint-disable-next-line @next/next/no-img-element */ return ; } const posterUrl = campaign.videoUrl.replace(/\.[^/.]+$/, ".jpg"); return (
{/* eslint-disable-next-line @next/next/no-img-element */}
); } if (campaign.imageUrl) { /* eslint-disable-next-line @next/next/no-img-element */ return ; } return null; })()}
)}
Voir la campagne
)} {/* Hero Carousel */} {/* Mission Statement */}

{about.title}

{about.description}

{coreValues.slice(0, 4).map((v, i) => { const icon = VALUE_LORD_ICONS[i] ?? VALUE_LORD_ICONS[0]; return (
(e.currentTarget.style.borderColor = icon.color)} onMouseLeave={(e) => (e.currentTarget.style.borderColor = `${icon.color}33`)} >

{v.name}

); })}
{/* Mot de la Présidente — teaser */}

Mot de la Présidente

“

{settings.presidentQuote}

— La Présidente, ANED

Lire le message complet
{/* Interactive Map - Notre Impact */}

Notre impact
en Mauritanie

{settings.mapStat1} {settings.mapStat1Label} dans {settings.mapStat2} wilayas prioritaires

{[ { value: settings.mapStat1, label: settings.mapStat1Label }, { value: settings.mapStat2, label: settings.mapStat2Label }, { value: settings.mapStat3, label: settings.mapStat3Label }, { value: settings.mapStat4, label: settings.mapStat4Label }, ].map((stat) => (
{stat.value}
{stat.label}
))}

Légende

{[ { color: "#C8DFD0", label: "Zone prioritaire", border: "#4A7C59" }, { color: "#D5D8DC", label: "Zone de relation", border: "#7F8C8D" }, { color: "#EAECEE", label: "Non couvert", border: "#BDC3C7" }, ].map((item) => (
{item.label}
))}

Survolez une wilaya pour voir les interventions

 {/* Partners Section */}

Partenariats

{settings.partnersSectionTitle}

{settings.partnersSectionSubtitle}

{partners.length > 0 ? ( partners.map((p) => (
{/* eslint-disable-next-line @next/next/no-img-element */} {p.name}
)) ) : (
Chargement des partenaires...
)}
Membre actif de
{settings.networkBadge1 && ( {settings.networkBadge1} )} {settings.networkBadge2 && ( {settings.networkBadge2} )}
{/* CTA */}

Rejoignez notre mission

{settings.bottomCtaTitle}

{settings.bottomCtaDescription}

{[ { value: settings.bottomStat1, label: settings.bottomStat1Label }, { value: settings.bottomStat2, label: settings.bottomStat2Label }, { value: settings.bottomStat3, label: settings.bottomStat3Label }, ].map((s) => (
{s.value}
{s.label}
))}
); }