// app.jsx — Spree Ravers root
const { useState, useEffect } = React;

const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "lang": "en",
  "accent": "#ff2e93",
  "hero": "animated",
  "density": "spacious",
  "glassMode": "subtle",
  "markerDensity": 3
}/*EDITMODE-END*/;

function App() {
  const [tw, setTweak] = useTweaks(TWEAK_DEFAULTS);
  const [page, setPage] = useState("meetup");
  const t = useT(tw.lang);

  useEffect(() => {
    document.documentElement.style.setProperty("--c-accent", tw.accent);
  }, [tw.accent]);

  useEffect(() => {
    document.body.dataset.glass = tw.glassMode;
  }, [tw.glassMode]);

  useEffect(() => {
    window.scrollTo({ top: 0, behavior: "instant" });
  }, [page]);

  const pageProps = {
    t, lang: tw.lang, accent: tw.accent,
    density: tw.density, glassMode: tw.glassMode,
    markerDensity: tw.markerDensity, hero: tw.hero,
    setPage,
  };

  return (
    <div>
      <Nav page={page} setPage={setPage} lang={tw.lang}
           setLang={(l) => setTweak("lang", l)} t={t} />

      <main>
        {page === "meetup" && <MeetupPage {...pageProps} />}
        {page === "sets"   && <SetsPage   {...pageProps} />}
      </main>

      <Footer t={t} accent={tw.accent} setPage={setPage} />
    </div>
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(<App />);