47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
"use client";
|
|
import { useAuth } from "../contexts/AuthContext";
|
|
|
|
export default function AuthStatus() {
|
|
const { isAuthenticated, user, login, logout, loading } = useAuth();
|
|
|
|
if (loading) {
|
|
return (
|
|
<div className="auth-status loading">
|
|
<p>Loading authentication status...</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="auth-status">
|
|
<div className="auth-info">
|
|
{isAuthenticated ? (
|
|
<>
|
|
<h3>Authenticated ✅</h3>
|
|
{user && (
|
|
<div className="user-info">
|
|
<p>Name: {user.name || "N/A"}</p>
|
|
<p>Email: {user.email || "N/A"}</p>
|
|
</div>
|
|
)}
|
|
</>
|
|
) : (
|
|
<h3>Not authenticated ❌</h3>
|
|
)}
|
|
</div>
|
|
|
|
<div className="auth-actions">
|
|
{isAuthenticated ? (
|
|
<button onClick={logout} className="logout-button">
|
|
Sign Out
|
|
</button>
|
|
) : (
|
|
<button onClick={login} className="login-button">
|
|
Sign In
|
|
</button>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|