45 lines
1.5 KiB
TypeScript
45 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import { useAuth } from "@/context/AuthContext";
|
|
import ProtectedRoute from "@/components/ProtectedRoute";
|
|
|
|
export default function DashboardPage() {
|
|
const { authState, logout } = useAuth();
|
|
|
|
return (
|
|
<ProtectedRoute>
|
|
<div className="min-h-screen bg-gray-100">
|
|
<nav className="bg-white shadow-sm">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="flex justify-between h-16">
|
|
<div className="flex items-center">
|
|
<h1 className="text-xl font-bold text-gray-900">Dashboard</h1>
|
|
</div>
|
|
<div className="flex items-center">
|
|
<span className="text-gray-600 mr-4">
|
|
Welcome, {authState.user?.email}
|
|
</span>
|
|
<button
|
|
onClick={logout}
|
|
className="px-4 py-2 text-sm text-white bg-red-600 rounded-md hover:bg-red-700"
|
|
>
|
|
Logout
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<main className="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
|
|
<div className="px-4 py-6 sm:px-0">
|
|
<div className="border-4 border-dashed border-gray-200 rounded-lg h-96 flex items-center justify-center">
|
|
<p className="text-gray-500">
|
|
Your protected dashboard content goes here
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</ProtectedRoute>
|
|
);
|
|
}
|