refactor: update authentication flow and cookie management
- Changed COOKIE_NAME from "peakSkills_userId" to "session_token" for better clarity. - Updated AuthClient to handle login and registration with new data structures. - Enhanced AuthWrapper to manage user sessions and display appropriate messages. - Added error handling in LoginForm and RegisterForm for better user feedback. - Refactored user service methods to streamline user creation and verification processes.
This commit is contained in:
@@ -1,24 +1,56 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { useState, useEffect } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { LoginForm, RegisterForm } from "./index";
|
||||
import { authClient } from "@/clients";
|
||||
import { useToast } from "@/hooks/use-toast";
|
||||
import { UserProfile } from "@/lib/types";
|
||||
|
||||
interface AuthWrapperProps {
|
||||
teams: any[];
|
||||
initialUser?: UserProfile | null;
|
||||
}
|
||||
|
||||
export function AuthWrapper({ teams }: AuthWrapperProps) {
|
||||
export function AuthWrapper({ teams, initialUser }: AuthWrapperProps) {
|
||||
const [isLogin, setIsLogin] = useState(true);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const router = useRouter();
|
||||
const { toast } = useToast();
|
||||
|
||||
// Rediriger si l'utilisateur est déjà connecté
|
||||
useEffect(() => {
|
||||
// Temporairement désactivé pour éviter la boucle
|
||||
// if (initialUser) {
|
||||
// router.push("/");
|
||||
// }
|
||||
}, [initialUser, router]);
|
||||
|
||||
const handleLogin = async (email: string, password: string) => {
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
try {
|
||||
// TODO: Implémenter la logique de login
|
||||
console.log("Login attempt:", { email, password });
|
||||
// await authClient.login(email, password);
|
||||
} catch (error) {
|
||||
const response = await authClient.login({ email, password });
|
||||
|
||||
toast({
|
||||
title: "Connexion réussie",
|
||||
description: response.message,
|
||||
});
|
||||
|
||||
// Rediriger vers l'accueil après connexion
|
||||
router.push("/");
|
||||
} catch (error: any) {
|
||||
console.error("Login failed:", error);
|
||||
|
||||
const errorMessage = error.response?.data?.error || "Erreur de connexion";
|
||||
|
||||
setError(errorMessage);
|
||||
toast({
|
||||
title: "Erreur de connexion",
|
||||
description: errorMessage,
|
||||
variant: "destructive",
|
||||
});
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -32,23 +64,88 @@ export function AuthWrapper({ teams }: AuthWrapperProps) {
|
||||
teamId: string;
|
||||
}) => {
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
try {
|
||||
// TODO: Implémenter la logique de register
|
||||
console.log("Register attempt:", data);
|
||||
// await authClient.register(data);
|
||||
} catch (error) {
|
||||
const response = await authClient.register(data);
|
||||
|
||||
toast({
|
||||
title: "Compte créé",
|
||||
description: response.message,
|
||||
});
|
||||
|
||||
// Basculer vers le login après inscription réussie
|
||||
setIsLogin(true);
|
||||
} catch (error: any) {
|
||||
console.error("Register failed:", error);
|
||||
|
||||
const errorMessage =
|
||||
error.response?.data?.error || "Erreur lors de la création du compte";
|
||||
|
||||
setError(errorMessage);
|
||||
toast({
|
||||
title: "Erreur d'inscription",
|
||||
description: errorMessage,
|
||||
variant: "destructive",
|
||||
});
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleLogout = async () => {
|
||||
try {
|
||||
await authClient.logout();
|
||||
// Rediriger vers la page de login après déconnexion
|
||||
window.location.href = "/login";
|
||||
} catch (error) {
|
||||
console.error("Logout failed:", error);
|
||||
// En cas d'erreur, forcer le rechargement pour nettoyer l'état
|
||||
window.location.reload();
|
||||
}
|
||||
};
|
||||
|
||||
// Si l'utilisateur est déjà connecté, afficher un message au lieu de rediriger
|
||||
if (initialUser) {
|
||||
return (
|
||||
<div className="text-center mb-12">
|
||||
<div className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-white/5 border border-white/10 backdrop-blur-sm mb-6">
|
||||
<span className="text-sm font-medium text-slate-200">PeakSkills</span>
|
||||
</div>
|
||||
|
||||
<h1 className="text-4xl font-bold mb-4 text-white">
|
||||
Vous êtes déjà connecté
|
||||
</h1>
|
||||
<p className="text-lg text-slate-400 mb-8">
|
||||
Bonjour {initialUser.firstName} {initialUser.lastName}
|
||||
</p>
|
||||
|
||||
<div className="max-w-2xl mx-auto space-y-6">
|
||||
<div className="flex gap-4 justify-center">
|
||||
<button
|
||||
onClick={() => (window.location.href = "/")}
|
||||
className="px-6 py-3 bg-blue-500 hover:bg-blue-600 text-white rounded-lg"
|
||||
>
|
||||
Aller à l'accueil
|
||||
</button>
|
||||
<button
|
||||
onClick={handleLogout}
|
||||
className="px-6 py-3 bg-gray-500 hover:bg-gray-600 text-white rounded-lg"
|
||||
>
|
||||
Se déconnecter
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (isLogin) {
|
||||
return (
|
||||
<LoginForm
|
||||
onSubmit={handleLogin}
|
||||
onSwitchToRegister={() => setIsLogin(false)}
|
||||
loading={loading}
|
||||
error={error}
|
||||
/>
|
||||
);
|
||||
}
|
||||
@@ -59,6 +156,7 @@ export function AuthWrapper({ teams }: AuthWrapperProps) {
|
||||
onSubmit={handleRegister}
|
||||
onSwitchToLogin={() => setIsLogin(true)}
|
||||
loading={loading}
|
||||
error={error}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user