import React from "react";
import ReactDOM from "react-dom/client";

import { AuthStartupScreen } from "@/app/auth-startup-screen";
import { initializeAuthentication } from "@/shared/auth/keycloak-auth";
import "@/styles.css";
import "maplibre-gl/dist/maplibre-gl.css";
import "katex/dist/katex.min.css";
import "streamdown/styles.css";

const root = ReactDOM.createRoot(document.getElementById("root")!);

root.render(<AuthStartupScreen />);

try {
  const [{ App }, { env }] = await Promise.all([
    import("@/app/app"),
    import("@/shared/config/env")
  ]);
  if (env.TJWATER_ENABLE_MSW) {
    const { worker } = await import("@/mocks/browser");
    await worker.start({ onUnhandledRequest: "bypass" });
  }
  const authentication = await initializeAuthentication(env);
  root.render(
    <React.StrictMode>
      <App authentication={authentication} />
    </React.StrictMode>
  );
} catch (error) {
  console.error("Failed to initialize authentication", error);
  root.render(<AuthStartupScreen error />);
}