/* global React, ReactDOM, MobileApp, DtApp, useState, useEffect */

function DeployRoot() {
  const [isDesktop, setIsDesktop] = useState(() => window.matchMedia("(min-width: 860px)").matches);

  useEffect(() => {
    const media = window.matchMedia("(min-width: 860px)");
    const onChange = () => setIsDesktop(media.matches);
    onChange();
    media.addEventListener("change", onChange);
    return () => media.removeEventListener("change", onChange);
  }, []);

  return isDesktop ? <DtApp /> : <MobileApp />;
}

ReactDOM.createRoot(document.getElementById("root")).render(<DeployRoot />);