/* global React, ReactDOM, COPY */
/* Shared page wrapper used by services/convive/blog/blog post/contact pages.
   Each page-html includes this AFTER scripts/shell.jsx + sections.jsx + pages.jsx,
   then calls window.mountPage(<PageComponentName>, "<active>").
*/
const { useState, useEffect } = React;

function PageShell({ Page, active }) {
  const [lang, setLang] = useState(localStorage.getItem("alse-lang") || "es");

  useEffect(() => {
    localStorage.setItem("alse-lang", lang);
    document.documentElement.lang = lang;
  }, [lang]);

  return <Page lang={lang} />;
}

window.mountPage = function (Page, active) {
  ReactDOM.createRoot(document.getElementById("root")).render(
    <PageShell Page={Page} active={active} />
  );
};
