/* global React, ReactDOM, AppCtx, Header, Footer, useReveal, HomePage, BoatsPage, BoatDetail, SellPage, DetailingPage, AboutPage, ContactPage, ImpressumPage, DatenschutzPage, AGBPage, STR, tr */
// ============================================================
// APP: router + language + chrome
// ============================================================
const { useState: useStateA, useEffect: useEffectA, useCallback: useCallbackA } = React;

function WhatsAppFloat() {
  const { lang } = useApp();
  return (
    React.createElement("a", { className: "wa-float", href: "https://api.whatsapp.com/send?phone=491633347560", target: "_blank", rel: "noopener", "aria-label": "WhatsApp" },
      React.createElement("svg", { width: 26, height: 26, viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": true },
        React.createElement("path", { d: "M.057 24l1.687-6.163a11.867 11.867 0 01-1.587-5.946C.16 5.335 5.495 0 12.05 0a11.82 11.82 0 018.413 3.488 11.82 11.82 0 013.48 8.414c-.003 6.557-5.338 11.892-11.893 11.892a11.9 11.9 0 01-5.688-1.448L.057 24zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981zm11.387-5.464c-.074-.124-.272-.198-.57-.347-.297-.149-1.758-.868-2.031-.967-.272-.099-.47-.149-.669.149-.198.297-.768.967-.941 1.165-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.521.151-.172.2-.296.3-.495.099-.198.05-.372-.025-.521-.075-.148-.669-1.611-.916-2.206-.242-.579-.487-.5-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.095 3.2 5.076 4.487.71.306 1.263.489 1.694.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.695.248-1.29.173-1.414z" })
      ),
      React.createElement("span", { className: "wa-label" }, tr(STR.cta.whatsapp, lang))
    )
  );
}

function App() {
  const [lang, setLangState] = useStateA(() => localStorage.getItem("anth_lang") || "de");
  const [route, setRoute] = useStateA("home");
  const [params, setParams] = useStateA({});

  const setLang = useCallbackA((l) => { setLangState(l); localStorage.setItem("anth_lang", l); }, []);
  const go = useCallbackA((r, p = {}) => {
    setRoute(r); setParams(p);
    window.scrollTo({ top: 0, behavior: "auto" });
  }, []);

  useEffectA(() => { document.documentElement.lang = lang; }, [lang]);

  useReveal();

  let page;
  switch (route) {
    case "boats": page = React.createElement(BoatsPage); break;
    case "detail": page = React.createElement(BoatDetail, { id: params.id }); break;
    case "sell": page = React.createElement(SellPage); break;
    case "detailing": page = React.createElement(DetailingPage); break;
    case "about": page = React.createElement(AboutPage); break;
    case "contact": page = React.createElement(ContactPage); break;
    case "impressum": page = React.createElement(ImpressumPage); break;
    case "datenschutz": page = React.createElement(DatenschutzPage); break;
    case "agb": page = React.createElement(AGBPage); break;
    default: page = React.createElement(HomePage);
  }

  return (
    React.createElement(AppCtx.Provider, { value: { lang, setLang, route, go, params } },
      React.createElement(Header),
      React.createElement("main", { key: route + (params.id || "") }, page),
      React.createElement(Footer),
      React.createElement(WhatsAppFloat)
    )
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(React.createElement(App));