feat: implement login page and dashboard layout with authentication

Author: athrael-soju

frontend-nextjs/public/assets/images/fastapi-logo.svg

@@ -8,9 +8,13 @@ import { Toaster } from "@/components/ui/toaster"
 const inter = Inter({ subsets: ["latin"] })
 
 export const metadata: Metadata = {
-  title: "FastAPI Dashboard",
-  description: "Modern admin dashboard for FastAPI applications",
-    generator: 'v0.dev'
+  title: "Full Stack FastAPI Project",
+  description: "A modern full-stack web application built with FastAPI and Next.js",
+  icons: {
+    icon: "/assets/images/favicon.png",
+    shortcut: "/assets/images/favicon.png",
+    apple: "/assets/images/favicon.png",
+  },
 }
 
 export default function RootLayout({

frontend-nextjs/public/assets/images/favicon.png

@@ -2,7 +2,7 @@
 
 import type React from "react"
 
-import { useState } from "react"
+import { useState, useEffect } from "react"
 import { motion } from "framer-motion"
 import { Eye, EyeOff, AlertCircle } from "lucide-react"
 import { Button } from "@/components/ui/button"
@@ -13,6 +13,7 @@ import { Alert, AlertDescription } from "@/components/ui/alert"
 import Link from "next/link"
 import { useRouter } from "next/navigation"
 import { loginLoginAccessToken, type BodyLoginLoginAccessToken } from "@/lib/api-client"
+import { isAuthenticated } from "@/lib/auth"
 
 export default function LoginPage() {
   const [showPassword, setShowPassword] = useState(false)
@@ -22,6 +23,12 @@ export default function LoginPage() {
   const [error, setError] = useState<string | null>(null)
   const router = useRouter()
 
+  useEffect(() => {
+    if (isAuthenticated()) {
+      router.push("/dashboard")
+    }
+  }, [router])
+
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault()
     setIsLoading(true)

frontend-nextjs/public/file.svg

@@ -1,5 +1,27 @@
-import { redirect } from "next/navigation"
+"use client"
+
+import { useEffect } from "react"
+import { useRouter } from "next/navigation"
+import { isAuthenticated } from "@/lib/auth"
 
 export default function HomePage() {
-  redirect("/login")
+  const router = useRouter()
+
+  useEffect(() => {
+    if (isAuthenticated()) {
+      router.push("/dashboard")
+    } else {
+      router.push("/login")
+    }
+  }, [router])
+
+  // Show loading state while redirecting
+  return (
+    <div className="flex items-center justify-center min-h-screen">
+      <div className="text-center">
+        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900 mx-auto"></div>
+        <p className="mt-2 text-gray-600">Redirecting...</p>
+      </div>
+    </div>
+  )
 }