import { Home } from "@/routes/Home";
import { Login } from "@/routes/Login";
import { Piece } from "@/routes/Piece";
import { Root } from "@/routes/Root";
import { lazy, StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { createBrowserRouter, RouterProvider } from "react-router-dom";
import "./style.css";

const Attachment = lazy(() => import("@/routes/Attachment"));

const router = createBrowserRouter([
	{
		path: "/",
		Component: Root,
		children: [
			{
				index: true,
				Component: Home,
			},
			{
				path: "piece/:pieceId",
				children: [
					{
						index: true,
						Component: Piece,
					},
					{
						path: "attachment/:attachmentId",
						Component: Attachment,
					}
				]
			},
		],
	},
	{
		path: "/login",
		Component: Login,
	},
]);

const rootElement = document.getElementById("root") as HTMLDivElement;
const root = createRoot(rootElement);

root.render(
	<StrictMode>
		<RouterProvider router={router} />
	</StrictMode>
);