/* global React, ReactDOM, LandingPage */

function useDevice() {
  const get = () => (typeof window !== 'undefined' && window.innerWidth < 768 ? 'mobile' : 'desktop');
  const [device, setDevice] = React.useState(get);
  React.useEffect(() => {
    const onR = () => setDevice(get());
    window.addEventListener('resize', onR);
    return () => window.removeEventListener('resize', onR);
  }, []);
  return device;
}

function Site() {
  const device = useDevice();
  // Hero headline — same default as the tweaks panel had.
  const headline = 'Transformo<br/>cliques em <em>clientes.</em>';
  return <LandingPage device={device} headline={headline} key={device} />;
}

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