40 lines
1.3 KiB
TypeScript
40 lines
1.3 KiB
TypeScript
import { createRoot } from "react-dom/client";
|
|
import { lazy, Suspense } from "react";
|
|
import { createBrowserRouter, Link, Outlet, RouterProvider, type RouteObject } from "react-router-dom";
|
|
import { AppShell } from "@stc/ui";
|
|
import { webFeatures } from "./features";
|
|
|
|
function Home() {
|
|
return <p className="work">No features installed yet</p>;
|
|
}
|
|
|
|
function Layout() {
|
|
const nav = webFeatures.flatMap((f) => f.routes.filter((r) => r.nav?.area === "header"));
|
|
const header = (
|
|
<>
|
|
<Link to="/" style={{ fontWeight: 600, color: "var(--head)", textDecoration: "none" }}>STCourses</Link>
|
|
<nav style={{ display: "flex", gap: 14 }}>
|
|
{nav.map((r) => <Link key={r.path} to={r.path}>{r.nav!.label}</Link>)}
|
|
</nav>
|
|
</>
|
|
);
|
|
return (
|
|
<AppShell header={header}>
|
|
<Suspense fallback={null}><Outlet /></Suspense>
|
|
</AppShell>
|
|
);
|
|
}
|
|
|
|
const featureRoutes: RouteObject[] = webFeatures.flatMap((f) =>
|
|
f.routes.map((r) => {
|
|
const Element = lazy(r.element);
|
|
return { path: r.path, element: <Element /> };
|
|
}),
|
|
);
|
|
|
|
const router = createBrowserRouter([
|
|
{ element: <Layout />, children: [...featureRoutes, ...(featureRoutes.some((r) => r.path === "/") ? [] : [{ path: "*", element: <Home /> }])] },
|
|
]);
|
|
|
|
createRoot(document.getElementById("root")!).render(<RouterProvider router={router} />);
|