import { createBrowserDeploymentSessionController } from "@agents24/client/browser";
import { StrictMode, useEffect, useSyncExternalStore } from "react";
import { createRoot } from "react-dom/client";

import { Agents24ChatScaffold } from "@/index";
import { useThreadQueryNavigation } from "@/use-thread-query-navigation";

const baseUrl = String(import.meta.env.VITE_AGENTS24_BASE_URL || "https://api.agents24.dev").trim();
const deploymentId = String(import.meta.env.VITE_AGENTS24_DEPLOYMENT_ID || "").trim();

if (!/^acd_[A-Za-z0-9_-]{10,}$/.test(deploymentId)) {
  throw new Error("VITE_AGENTS24_DEPLOYMENT_ID must be a public acd_… deployment ID.");
}

const sessions = createBrowserDeploymentSessionController({ baseUrl, deploymentId });

function GeneratedChatApp() {
  const navigation = useThreadQueryNavigation();
  const session = useSyncExternalStore(sessions.subscribe, sessions.getSnapshot, sessions.getSnapshot);
  useEffect(() => { void sessions.initialize(); }, []);
  const canSignIn = session.authModes.includes("external_oidc");
  return (
    <Agents24ChatScaffold
      client={sessions.client}
      identity={{
        ...session.identity,
        ...(canSignIn ? { onSignIn: () => sessions.signIn() } : {}),
        ...(session.identity.state === "authenticated" ? { onSignOut: () => sessions.signOut() } : {}),
      }}
      {...navigation}
    />
  );
}

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <GeneratedChatApp />
  </StrictMode>,
);