import { RouterProvider } from "@octanejs/tanstack-router";
import type { RenderRouteProps } from "@octanejs/vite-plugin";
import { getClientRouter } from "./router.client.ts";
import { ROUTER_STATE_KEY, type AppRouter } from "./router.ts";

// On the server the RenderRoute middleware (router.server.ts) has already built
// and loaded a per-request router and placed it in request state. In the
// browser there is no state, so the singleton loaded by pre-hydrate.ts is used.
export function App(props: RenderRouteProps) {
  const router = (props.state?.get(ROUTER_STATE_KEY) as AppRouter | undefined) ?? getClientRouter();
  return <RouterProvider router={router} />;
}