Source

// Polls' entry. "/" keeps the static landing and mounts the join and create boxes and "Your events" into it.
// "/<code>" looks up a 6-digit code; "/e/<id>" is the audience view; "/e/<id>/admin" and "/e/<id>/present" are the host's.
import { createRoot } from "react-dom/client";
import { usePath } from "./lib/router";
import { Toaster } from "./ui";
import { CodeJoin, EventPage, type View } from "./Event";
import { Start, YourEvents } from "./Start";
import "./styles.css";

const LANDING_TITLE = document.title;

function App() {
  const path = usePath();
  const code = path.match(/^\/([1-9]\d{5})\/?$/);
  const event = path.match(/^\/e\/([A-Za-z0-9]{20})(?:\/(admin|present))?\/?$/);
  document.body.classList.toggle("app-mode", Boolean(code || event));
  document.body.classList.toggle("present-mode", event?.[2] === "present");
  if (!code && !event) document.title = LANDING_TITLE;
  return (
    <>
      {code ? <CodeJoin code={code[1]} key={code[1]} /> : event ? <EventPage eventId={event[1]} view={(event[2] as View) || "audience"} key={path} /> : null}
      <Toaster />
    </>
  );
}

createRoot(document.getElementById("app")!).render(<App />);
const startSlot = document.getElementById("start");
if (startSlot) createRoot(startSlot).render(<Start />);
const mineSlot = document.getElementById("your-events");
if (mineSlot) createRoot(mineSlot).render(<YourEvents />);