import { createBrowserRouter, Navigate } from "react-router-dom"
import { ProtectedRoute, AdminRoute } from "./guards"

// Placeholder components — real pages will replace these
function LoginPage() {
  return <div>Login</div>
}
function BooksPage() {
  return <div>Books</div>
}
function MyBorrowsPage() {
  return <div>My Borrows</div>
}
function AdminBooksPage() {
  return <div>Admin / Books</div>
}
function AdminBorrowsPage() {
  return <div>Admin / Borrows</div>
}
function AdminIndexPage() {
  return <Navigate to="/admin/books" replace />
}

export const router = createBrowserRouter([
  {
    path: "/login",
    element: <LoginPage />,
  },
  {
    path: "/",
    element: <Navigate to="/books" replace />,
  },
  {
    path: "/books",
    element: <BooksPage />,
  },
  {
    element: <ProtectedRoute />,
    children: [
      {
        path: "/my-borrows",
        element: <MyBorrowsPage />,
      },
    ],
  },
  {
    element: <AdminRoute />,
    children: [
      {
        path: "/admin",
        element: <AdminIndexPage />,
      },
      {
        path: "/admin/books",
        element: <AdminBooksPage />,
      },
      {
        path: "/admin/borrows",
        element: <AdminBorrowsPage />,
      },
    ],
  },
])
