Merge remote-tracking branch 'origin/Alexis' into Emmanuel

frontend/src/components/Footer.jsx

@@ -1,6 +1,20 @@
-import { Link } from 'react-router-dom'
+import { Link, useLocation } from 'react-router-dom'
+import { useAuth } from '../context/AuthContext'
 
 export default function Footer() {
+  const { pathname } = useLocation()
+  const { user } = useAuth()
+  const isLoggedIn = !!user
+
+  function FooterLink({ to, children, className=''}) {
+    return pathname === to ? (
+      <span className={className}>{children}</span>
+    ) : (
+      <Link to={to} className={className}>
+        {children}
+      </Link>
+    )
+  }
   return (
     <footer className="bg-green-900 text-white">
 
@@ -11,13 +25,11 @@ export default function Footer() {
 
         {/* Logo */}
         <div>
-
+          <FooterLink to='/accueil'>
-          <Link to="/accueil">
             <h3 className="text-xl font-bold mb-3">
               Thé Tip Top
             </h3>
-          </Link>
+          </FooterLink>
-
 
           <p className="text-green-100 text-sm leading-relaxed">
             Participez au jeu-concours Thé Tip Top et tentez de gagner
@@ -39,43 +51,44 @@ export default function Footer() {
           <ul className="space-y-3 text-green-100">
 
             <li>
-              <Link
+              <FooterLink
                 to="/accueil"
                 className="hover:text-white transition"
               >
                 Accueil
-              </Link>
+              </FooterLink> 
             </li>
 
 
             <li>
-              <Link
+              <FooterLink
                 to="/regles-jeu"
                 className="hover:text-white transition"
               >
                 Règles du jeu
-              </Link>
+              </FooterLink>
             </li>
 
 
             <li> 
-              <Link
+              <FooterLink
                 to="/saisir-code-unique"
                 className="hover:text-white transition"
               >
                 Tester mon code
-              </Link>
+              </FooterLink>
             </li>
 
-
+            { !isLoggedIn && (
               <li> 
-              <Link
+                <FooterLink
                   to="/inscription"
                   className="hover:text-white transition"
                 >
                   Créer un compte
-              </Link>
+                </FooterLink>
               </li>
+            )}
 
           </ul>
 
@@ -95,41 +108,41 @@ export default function Footer() {
           <ul className="space-y-3 text-green-100">
 
             <li>
-              <Link
+              <FooterLink
                 to="/mentions-legales"
                 className="hover:text-white transition"
               >
                 Mentions légales
-              </Link>
+              </FooterLink>
             </li>
 
 
             <li>
-              <Link
+              <FooterLink
                 to="/confidentialite"
                 className="hover:text-white transition"
               >
                 Politique de confidentialité
-              </Link>
+              </FooterLink>
             </li>
 
 
             <li> 
-              <Link
+              <FooterLink
                 to="/contact"
                 className="hover:text-white transition"
               >
                 Contact
-              </Link>
+              </FooterLink>
             </li>
 
             <li>
-              <Link
+              <FooterLink
                 to="/sitemap"
                 className="hover:text-white transition"
               >
                 Plan du site
-              </Link>
+              </FooterLink>
             </li>
 
           </ul>

frontend/src/components/Header.jsx

@@ -9,6 +9,7 @@ export default function Header() {
   const navigate = useNavigate()
   const { user, logout } = useAuth()
   const isLoggedIn = !!user
+  const logoContent = <img src={logo} alt="Logo de Thé Tip Top" className="h-10 sm:h-12 w-auto" />
 
   const handleLogout = () => {
     logout()
@@ -28,10 +29,15 @@ export default function Header() {
   return (
     <header className="bg-white shadow-sm relative z-50">
       <div className="max-w-7xl mx-auto px-4 sm:px-6 py-4 flex items-center justify-between">
-
+        {pathname === '/accueil' ? (
-        <Link to={isLoggedIn ? '/mes-gains' : '/accueil'} className="flex items-center flex-shrink-0">
+          <span className="flex items-center flex-shrink-0">
-          <img src={logo} alt="Thé Tip Top" className="h-10 sm:h-12 w-auto" />
+            {logoContent}
+          </span>
+        ) : (
+          <Link to ={'/accueil'} className='flex items-center flex-shrink-0'>
+            {logoContent}
           </Link>
+        )}
 
         {/* Nav desktop */}
         <nav className="hidden md:flex items-center gap-6">
@@ -49,7 +55,7 @@ export default function Header() {
 
           {isLoggedIn ? (
             <div className="flex items-center gap-3">
-              <Link to="/mes-gains" className="flex items-center gap-2 text-sm text-gray-700 hover:text-green-700 font-medium transition-colors">
+              <Link to="/profile" className="flex items-center gap-2 text-sm text-gray-700 hover:text-green-700 font-medium transition-colors">
                 <div className="w-8 h-8 rounded-full bg-[#006B6B] flex items-center justify-center text-white text-xs font-bold">
                   {initials}
                 </div>

frontend/src/pages/MesGains.jsx

@@ -53,7 +53,7 @@ export default function MesGains() {
   useEffect(() => { fetchGains() }, [fetchGains])
 
   return (
-    <div className="min-h-screen bg-white max-w-sm mx-auto px-6 pt-6">
+    <div className="min-h-screen bg-gray-50 flex flex-col px-8 py-12 max-w-lg mx-auto">
       <UserNav active="gains" />
 
       <div className="flex items-center justify-between mb-4">

frontend/src/pages/Profile.jsx

@@ -60,7 +60,7 @@ export default function Profile() {
   )
 
   return (
-    <div className="min-h-screen bg-white max-w-sm mx-auto px-6 pt-6 pb-10">
+    <div className="min-h-screen bg-gray-50 flex flex-col px-8 py-12 max-w-lg mx-auto">
       <UserNav active="profile" />
 
       {/* Avatar */}

frontend/src/pages/ReglesJeu.jsx

@@ -1,6 +1,10 @@
 import { Link } from 'react-router-dom'
+import { useAuth } from '../context/AuthContext'
 
 export default function ReglesJeu() {
+  const { user } = useAuth()
+  const isLoggedIn = !!user
+
   return (
     <div className="bg-green-50 min-h-screen">
 
@@ -79,12 +83,14 @@ export default function ReglesJeu() {
             Inscrivez-vous, entrez votre code de ticket et retirez votre lot en magasin ou en ligne.
           </p>
           <div className="flex flex-col sm:flex-row justify-center gap-3 sm:gap-4">
+            {!isLoggedIn && (
               <Link
                 to="/inscription"
                 className="bg-white text-green-700 px-6 sm:px-8 py-3 rounded-xl font-semibold hover:bg-green-50 text-sm sm:text-base"
               >
                 Inscrivez-vous
               </Link>
+            )}
             <Link
               to="/saisir-code-unique"
               className="border border-white px-6 sm:px-8 py-3 rounded-xl font-semibold hover:bg-green-800 text-sm sm:text-base"

frontend/src/pages/SaisirCodeUnique.jsx

@@ -47,7 +47,7 @@ export default function SaisirCodeUnique() {
   }
 
   return (
-    <div className="min-h-screen bg-gray-50 flex flex-col px-8 py-12 max-w-sm mx-auto">
+    <div className="min-h-screen bg-gray-50 flex flex-col px-8 py-12 max-w-lg mx-auto">
       <UserNav active="code" />
 
       <div className="mb-8">

frontend/src/pages/Sitemap.jsx

@@ -1,4 +1,5 @@
 import { Link } from 'react-router-dom'
+import { useAuth} from '../context/AuthContext'
 
 const sections = [
   {
@@ -41,6 +42,11 @@ const sections = [
 ]
 
 export default function Sitemap() {
+  const { user } = useAuth()
+  const isAdmin = user?.role === 'admin'
+  const visibleSections = sections.filter(
+    (section) => section.title !== 'Espaces professionnels' || isAdmin
+  )
   return (
     <main className="bg-green-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
       <div className="max-w-4xl mx-auto">
@@ -55,7 +61,7 @@ export default function Sitemap() {
         </div>
 
         <div className="grid sm:grid-cols-2 gap-6">
-          {sections.map((section) => (
+          {visibleSections.map((section) => (
             <div key={section.title} className="bg-white rounded-2xl shadow p-5 sm:p-6">
               <h2 className="text-base sm:text-lg font-bold text-green-700 mb-4 pb-2 border-b border-gray-100">
                 {section.title}