fix
This commit is contained in:
David
parent
d9868dd49f
commit
0d814e9a94
@ -21,10 +21,31 @@ import {
|
||||
Anchor,
|
||||
Container,
|
||||
FileText,
|
||||
LayoutDashboard,
|
||||
} from 'lucide-react';
|
||||
import { useAuth } from '@/lib/context/auth-context';
|
||||
|
||||
export default function LandingPage() {
|
||||
const [isScrolled, setIsScrolled] = useState(false);
|
||||
const { user, isAuthenticated, loading } = useAuth();
|
||||
|
||||
// Helper function to get user initials
|
||||
const getUserInitials = () => {
|
||||
if (!user) return '';
|
||||
const firstInitial = user.firstName?.charAt(0)?.toUpperCase() || '';
|
||||
const lastInitial = user.lastName?.charAt(0)?.toUpperCase() || '';
|
||||
return firstInitial + lastInitial || user.email?.charAt(0)?.toUpperCase() || '?';
|
||||
};
|
||||
|
||||
// Helper function to get full name
|
||||
const getFullName = () => {
|
||||
if (!user) return '';
|
||||
if (user.firstName && user.lastName) {
|
||||
return `${user.firstName} ${user.lastName}`;
|
||||
}
|
||||
return user.email || '';
|
||||
};
|
||||
|
||||
const heroRef = useRef(null);
|
||||
const featuresRef = useRef(null);
|
||||
const statsRef = useRef(null);
|
||||
@ -225,18 +246,42 @@ export default function LandingPage() {
|
||||
>
|
||||
Tarifs
|
||||
</Link>
|
||||
<Link
|
||||
href="/login"
|
||||
className="text-white hover:text-brand-turquoise transition-colors font-medium"
|
||||
>
|
||||
Connexion
|
||||
</Link>
|
||||
<Link
|
||||
href="/register"
|
||||
className="px-6 py-2.5 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-lg font-medium"
|
||||
>
|
||||
Commencer Gratuitement
|
||||
</Link>
|
||||
|
||||
{/* Affichage conditionnel: connecté vs non connecté */}
|
||||
{loading ? (
|
||||
<div className="w-8 h-8 rounded-full bg-white/20 animate-pulse" />
|
||||
) : isAuthenticated && user ? (
|
||||
<Link
|
||||
href="/dashboard"
|
||||
className="flex items-center space-x-3 group"
|
||||
>
|
||||
{/* Avatar avec initiales */}
|
||||
<div className="w-10 h-10 rounded-full bg-brand-turquoise flex items-center justify-center text-white font-semibold text-sm border-2 border-white/30 group-hover:border-white transition-colors">
|
||||
{getUserInitials()}
|
||||
</div>
|
||||
{/* Nom de l'utilisateur */}
|
||||
<span className="text-white font-medium group-hover:text-brand-turquoise transition-colors max-w-[150px] truncate">
|
||||
{getFullName()}
|
||||
</span>
|
||||
{/* Icône dashboard */}
|
||||
<LayoutDashboard className="w-5 h-5 text-white/70 group-hover:text-brand-turquoise transition-colors" />
|
||||
</Link>
|
||||
) : (
|
||||
<>
|
||||
<Link
|
||||
href="/login"
|
||||
className="text-white hover:text-brand-turquoise transition-colors font-medium"
|
||||
>
|
||||
Connexion
|
||||
</Link>
|
||||
<Link
|
||||
href="/register"
|
||||
className="px-6 py-2.5 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-lg font-medium"
|
||||
>
|
||||
Commencer Gratuitement
|
||||
</Link>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -310,19 +355,31 @@ export default function LandingPage() {
|
||||
transition={{ duration: 0.8, delay: 0.5 }}
|
||||
className="flex flex-col sm:flex-row items-center justify-center space-y-4 sm:space-y-0 sm:space-x-6 mb-12"
|
||||
>
|
||||
<Link
|
||||
href="/register"
|
||||
className="group px-8 py-4 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-2xl hover:scale-105 font-semibold text-lg w-full sm:w-auto flex items-center justify-center space-x-2"
|
||||
>
|
||||
<span>Créer un compte gratuit</span>
|
||||
<ArrowRight className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
|
||||
</Link>
|
||||
<Link
|
||||
href="/login"
|
||||
className="px-8 py-4 bg-white text-brand-navy rounded-lg hover:bg-gray-50 transition-all hover:shadow-xl font-semibold text-lg w-full sm:w-auto"
|
||||
>
|
||||
Voir la démo
|
||||
</Link>
|
||||
{isAuthenticated && user ? (
|
||||
<Link
|
||||
href="/dashboard"
|
||||
className="group px-8 py-4 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-2xl hover:scale-105 font-semibold text-lg w-full sm:w-auto flex items-center justify-center space-x-2"
|
||||
>
|
||||
<span>Accéder au Dashboard</span>
|
||||
<LayoutDashboard className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
|
||||
</Link>
|
||||
) : (
|
||||
<>
|
||||
<Link
|
||||
href="/register"
|
||||
className="group px-8 py-4 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-2xl hover:scale-105 font-semibold text-lg w-full sm:w-auto flex items-center justify-center space-x-2"
|
||||
>
|
||||
<span>Créer un compte gratuit</span>
|
||||
<ArrowRight className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
|
||||
</Link>
|
||||
<Link
|
||||
href="/login"
|
||||
className="px-8 py-4 bg-white text-brand-navy rounded-lg hover:bg-gray-50 transition-all hover:shadow-xl font-semibold text-lg w-full sm:w-auto"
|
||||
>
|
||||
Voir la démo
|
||||
</Link>
|
||||
</>
|
||||
)}
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
</div>
|
||||
@ -703,19 +760,31 @@ export default function LandingPage() {
|
||||
variants={itemVariants}
|
||||
className="flex flex-col sm:flex-row items-center justify-center space-y-4 sm:space-y-0 sm:space-x-6"
|
||||
>
|
||||
<Link
|
||||
href="/register"
|
||||
className="group px-8 py-4 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-2xl hover:scale-105 font-semibold text-lg w-full sm:w-auto flex items-center justify-center space-x-2"
|
||||
>
|
||||
<span>Créer un compte gratuit</span>
|
||||
<ArrowRight className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
|
||||
</Link>
|
||||
<Link
|
||||
href="/login"
|
||||
className="px-8 py-4 bg-brand-navy text-white rounded-lg hover:bg-brand-navy/90 transition-all hover:shadow-xl font-semibold text-lg w-full sm:w-auto"
|
||||
>
|
||||
Se connecter
|
||||
</Link>
|
||||
{isAuthenticated && user ? (
|
||||
<Link
|
||||
href="/dashboard"
|
||||
className="group px-8 py-4 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-2xl hover:scale-105 font-semibold text-lg w-full sm:w-auto flex items-center justify-center space-x-2"
|
||||
>
|
||||
<span>Accéder au Dashboard</span>
|
||||
<LayoutDashboard className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
|
||||
</Link>
|
||||
) : (
|
||||
<>
|
||||
<Link
|
||||
href="/register"
|
||||
className="group px-8 py-4 bg-brand-turquoise text-white rounded-lg hover:bg-brand-turquoise/90 transition-all hover:shadow-2xl hover:scale-105 font-semibold text-lg w-full sm:w-auto flex items-center justify-center space-x-2"
|
||||
>
|
||||
<span>Créer un compte gratuit</span>
|
||||
<ArrowRight className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
|
||||
</Link>
|
||||
<Link
|
||||
href="/login"
|
||||
className="px-8 py-4 bg-brand-navy text-white rounded-lg hover:bg-brand-navy/90 transition-all hover:shadow-xl font-semibold text-lg w-full sm:w-auto"
|
||||
>
|
||||
Se connecter
|
||||
</Link>
|
||||
</>
|
||||
)}
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
@ -779,7 +848,7 @@ export default function LandingPage() {
|
||||
|
||||
{/* Products */}
|
||||
<div>
|
||||
<h4 className="font-bold text-lg mb-4">Produits</h4>
|
||||
<h4 className="font-bold text-lg mb-4 text-white">Produits</h4>
|
||||
<ul className="space-y-3 text-white/70 text-sm">
|
||||
<li>
|
||||
<Link href="#features" className="hover:text-brand-turquoise transition-colors">
|
||||
@ -814,7 +883,7 @@ export default function LandingPage() {
|
||||
|
||||
{/* Company */}
|
||||
<div>
|
||||
<h4 className="font-bold text-lg mb-4">Entreprise</h4>
|
||||
<h4 className="font-bold text-lg mb-4 text-white">Entreprise</h4>
|
||||
<ul className="space-y-3 text-white/70 text-sm">
|
||||
<li>
|
||||
<Link href="/about" className="hover:text-brand-turquoise transition-colors">
|
||||
@ -846,7 +915,7 @@ export default function LandingPage() {
|
||||
|
||||
{/* Legal */}
|
||||
<div>
|
||||
<h4 className="font-bold text-lg mb-4">Légal</h4>
|
||||
<h4 className="font-bold text-lg mb-4 text-white">Légal</h4>
|
||||
<ul className="space-y-3 text-white/70 text-sm">
|
||||
<li>
|
||||
<Link href="/privacy" className="hover:text-brand-turquoise transition-colors">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user