/* App router for the Oca website UI kit. */
function App() {
  const [route, setRoute] = React.useState("home");
  const go = (r) => { setRoute(r); window.scrollTo({ top: 0 }); };

  let screen;
  if (route === "home") screen = <window.Home go={go} />;
  else if (route === "about") screen = <window.About go={go} />;
  else if (route === "services") screen = <window.Services go={go} />;
  else if (route === "projects") screen = <window.Projects go={go} />;
  else if (route === "gallery") screen = <window.Gallery go={go} />;
  else if (route === "contact") screen = <window.Contact go={go} />;
  else if (route.startsWith("project:")) screen = <window.ProjectDetail id={route.slice(8)} go={go} />;
  else screen = <window.Home go={go} />;

  // After (re)render, let the generic editor re-scan for data-edit nodes and re-apply any overrides.
  // Also ensure the footer auth controls (Login/Edit) get (re)injected.
  React.useEffect(() => {
    const t = setTimeout(() => {
      try {
        if (window.LLEditable) {
          if (typeof window.LLEditable.refresh === 'function') {
            window.LLEditable.refresh();
          } else if (typeof window.LLEditable.reload === 'function') {
            window.LLEditable.reload();
          }
        }
      } catch (e) {}
    }, 80);
    return () => clearTimeout(t);
  }, [route]);

  return screen;
}

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