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

This commit is contained in:
Emma781227
2026-07-23 15:12:15 +02:00
7 changed files with 76 additions and 45 deletions

View File

@@ -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() { 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 ( return (
<footer className="bg-green-900 text-white"> <footer className="bg-green-900 text-white">
@@ -11,13 +25,11 @@ export default function Footer() {
{/* Logo */} {/* Logo */}
<div> <div>
<FooterLink to='/accueil'>
<Link to="/accueil">
<h3 className="text-xl font-bold mb-3"> <h3 className="text-xl font-bold mb-3">
Thé Tip Top Thé Tip Top
</h3> </h3>
</Link> </FooterLink>
<p className="text-green-100 text-sm leading-relaxed"> <p className="text-green-100 text-sm leading-relaxed">
Participez au jeu-concours Thé Tip Top et tentez de gagner 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"> <ul className="space-y-3 text-green-100">
<li> <li>
<Link <FooterLink
to="/accueil" to="/accueil"
className="hover:text-white transition" className="hover:text-white transition"
> >
Accueil Accueil
</Link> </FooterLink>
</li> </li>
<li> <li>
<Link <FooterLink
to="/regles-jeu" to="/regles-jeu"
className="hover:text-white transition" className="hover:text-white transition"
> >
Règles du jeu Règles du jeu
</Link> </FooterLink>
</li> </li>
<li> <li>
<Link <FooterLink
to="/saisir-code-unique" to="/saisir-code-unique"
className="hover:text-white transition" className="hover:text-white transition"
> >
Tester mon code Tester mon code
</Link> </FooterLink>
</li> </li>
{ !isLoggedIn && (
<li> <li>
<Link <FooterLink
to="/inscription" to="/inscription"
className="hover:text-white transition" className="hover:text-white transition"
> >
Créer un compte Créer un compte
</Link> </FooterLink>
</li> </li>
)}
</ul> </ul>
@@ -95,41 +108,41 @@ export default function Footer() {
<ul className="space-y-3 text-green-100"> <ul className="space-y-3 text-green-100">
<li> <li>
<Link <FooterLink
to="/mentions-legales" to="/mentions-legales"
className="hover:text-white transition" className="hover:text-white transition"
> >
Mentions légales Mentions légales
</Link> </FooterLink>
</li> </li>
<li> <li>
<Link <FooterLink
to="/confidentialite" to="/confidentialite"
className="hover:text-white transition" className="hover:text-white transition"
> >
Politique de confidentialité Politique de confidentialité
</Link> </FooterLink>
</li> </li>
<li> <li>
<Link <FooterLink
to="/contact" to="/contact"
className="hover:text-white transition" className="hover:text-white transition"
> >
Contact Contact
</Link> </FooterLink>
</li> </li>
<li> <li>
<Link <FooterLink
to="/sitemap" to="/sitemap"
className="hover:text-white transition" className="hover:text-white transition"
> >
Plan du site Plan du site
</Link> </FooterLink>
</li> </li>
</ul> </ul>

View File

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

View File

@@ -53,7 +53,7 @@ export default function MesGains() {
useEffect(() => { fetchGains() }, [fetchGains]) useEffect(() => { fetchGains() }, [fetchGains])
return ( 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" /> <UserNav active="gains" />
<div className="flex items-center justify-between mb-4"> <div className="flex items-center justify-between mb-4">

View File

@@ -60,7 +60,7 @@ export default function Profile() {
) )
return ( 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" /> <UserNav active="profile" />
{/* Avatar */} {/* Avatar */}

View File

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

View File

@@ -47,7 +47,7 @@ export default function SaisirCodeUnique() {
} }
return ( 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" /> <UserNav active="code" />
<div className="mb-8"> <div className="mb-8">

View File

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