Add admin login page and required logic

This commit is contained in:
Muhtadee Taron
2025-07-04 17:55:49 +06:00
parent ac49576b9b
commit 6b2690d1df
19 changed files with 781 additions and 37 deletions

44
app/dashboard/page.tsx Normal file
View File

@ -0,0 +1,44 @@
"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>
);
}

View File

@ -1,6 +1,7 @@
import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
import { AuthProvider } from "@/context/AuthContext";
const geistSans = Geist({
variable: "--font-geist-sans",
@ -13,8 +14,8 @@ const geistMono = Geist_Mono({
});
export const metadata: Metadata = {
title: "NextJS template",
description: "With typescript, tailwindCSS and shadcnUI",
title: "ExamJam App",
description: "Authentication system for ExamJam",
};
export default function RootLayout({
@ -27,7 +28,7 @@ export default function RootLayout({
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
{children}
<AuthProvider>{children}</AuthProvider>
</body>
</html>
);

11
app/login/page.tsx Normal file
View File

@ -0,0 +1,11 @@
import { LoginForm } from "@/components/login-form";
export default function Page() {
return (
<div className="flex min-h-svh w-full items-center justify-center p-6 md:p-10">
<div className="w-full max-w-sm">
<LoginForm />
</div>
</div>
);
}

View File

@ -1,31 +1,5 @@
import Image from "next/image";
import { redirect } from "next/navigation";
export default function Home() {
return (
<div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]">
<main className="flex flex-col gap-[32px] row-start-2 items-center sm:items-start">
<Image
className="dark:invert"
src="/next.svg"
alt="Next.js logo"
width={180}
height={38}
priority
/>{" "}
template with typescript, tailwindCSS and shadcnUI
<ol className="list-inside list-decimal text-sm/6 text-center sm:text-left font-[family-name:var(--font-geist-mono)]">
<li className="mb-2 tracking-[-.01em]">
Get started by editing{" "}
<code className="bg-black/[.05] dark:bg-white/[.06] px-1 py-0.5 rounded font-[family-name:var(--font-geist-mono)] font-semibold">
app/page.tsx
</code>
.
</li>
<li className="tracking-[-.01em]">
Save and see your changes instantly.
</li>
</ol>
</main>
</div>
);
redirect("/dashboard");
}