/* eslint-disable */
// Главный файл: роутер, тема.

const App = () => {
  const hash = useHashRoute();
  const [theme, setTheme] = useTheme();

  // hashes can be #/ or #/services or #/services#infra (anchor on services).
  // We split on second '#'.
  const path = hash.replace(/^#/, "");
  const [route] = path.split("#");

  // After route change, scroll to anchor if any
  React.useEffect(() => {
    const m = path.match(/#([^?]+)$/);
    if (m && m[1]) {
      requestAnimationFrame(() => {
        const el = document.getElementById(m[1]);
        if (el) el.scrollIntoView({ behavior: "auto", block: "start" });
      });
    }
  }, [path]);

  let page;
  if (route === "/" || route === "" || route === "/home") page = <HomePage />;
  else if (route === "/services") page = <ServicesPage />;
  else if (route === "/products") page = <ProductsListPage />;
  else if (route.startsWith("/product/")) {
    const id = route.replace("/product/", "");
    page = <ProductPage id={id} />;
  }
  else if (route === "/approach") page = <ApproachPage />;
  else if (route === "/team") page = <TeamPage />;
  else if (route === "/about") page = <AboutPage />;
  else if (route === "/mincifry") page = <MincifryPage />;
  else if (route === "/contacts") page = <ContactsPage />;
  else if (route === "/legal") page = <LegalPage />;
  else if (route === "/design-system") page = <DesignSystemPage />;
  else page = <NotFound />;

  return (
    <>
      <a href="#main" className="skip">К основному содержимому</a>
      <Header theme={theme} setTheme={setTheme} currentHash={"#" + route} />
      <div id="main">{page}</div>
      <Footer />
    </>
  );
};

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