// Plassic marketing — app shell with hash routing.
//
// Production build: tweaks-panel.jsx is intentionally not shipped (it's a
// design-time editor). The Tweaks API is shimmed below so app.jsx renders
// the marketing pages without the editor UI.

const { useState: useS_App, useEffect: useE_App } = React;

function useHashRoute() {
  const [route, setRoute] = useS_App(() => window.location.hash.replace(/^#/, '') || '/');
  useE_App(() => {
    const f = () => setRoute(window.location.hash.replace(/^#/, '') || '/');
    window.addEventListener('hashchange', f);
    return () => window.removeEventListener('hashchange', f);
  }, []);
  function nav(p) { window.location.hash = p; }
  return [route, nav];
}

// Production shims — replace tweaks-panel.jsx exports.
function useTweaks(defaults) {
  return [defaults, () => {}];
}
const TweaksPanel = () => null;
const TweakSection = () => null;
const TweakSlider = () => null;
const TweakText = () => null;
const TweakToggle = () => null;
const TweakButton = () => null;

const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "heroScore": 73,
  "headline": "We scanned 14,328 products this week. Here's what's in yours.",
  "showBanner": true,
  "shareVariant": "clean"
}/*EDITMODE-END*/;

function App() {
  const [route, nav] = useHashRoute();
  const [tweaks, setTweak] = useTweaks(TWEAK_DEFAULTS);

  let page;
  if (route === '/' || route === '') {
    page = <HomePage onNav={nav} tweaks={tweaks} />;
  } else if (route.startsWith('/scan/')) {
    const slug = route.slice('/scan/'.length);
    page = <ScanSharePage slug={slug} onNav={nav} />;
  } else if (route.startsWith('/wall')) {
    page = <WallPage onNav={nav} tweaks={tweaks} />;
  } else if (route.startsWith('/methodology')) {
    page = <MethodologyPage onNav={nav} />;
  } else if (route.startsWith('/premium')) {
    page = <PremiumPage onNav={nav} />;
  } else if (route.startsWith('/challenge')) {
    page = <ChallengePage onNav={nav} />;
  } else {
    page = <HomePage onNav={nav} tweaks={tweaks} />;
  }

  return (
    <div className="col" data-screen-label={`Marketing · ${route}`}>
      {page}
    </div>
  );
}

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