// Production entry — picks MobileApp or DesktopApp by viewport,
// wraps in StoreProvider, mounts to #root.
//
// First-launch flow: if the wedding has no brides/groom names set,
// render OnboardingApp so the buyer enters their own data instead
// of inheriting Sloane & Theo. Otherwise straight to the app.

function ProductionRoot() {
  const wedding = useWedding();
  const [isMobile, setIsMobile] = React.useState(() => window.innerWidth < 880);

  React.useEffect(() => {
    const onResize = () => setIsMobile(window.innerWidth < 880);
    window.addEventListener('resize', onResize);
    return () => window.removeEventListener('resize', onResize);
  }, []);

  // Treat "user has filled in real names" as the onboarded signal.
  // Demo data ships with Sloane Vermeer / Theo Adler · we route to onboarding
  // only when the persisted state has NO wedding party at all (cleared via
  // Settings → Start fresh).
  const hasName = !!(wedding && (wedding.brides || wedding.groom));
  if (!hasName) {
    return <OnboardingApp />;
  }

  return isMobile ? <MobileApp /> : <DesktopApp />;
}

const __wosRoot = ReactDOM.createRoot(document.getElementById('root'));
__wosRoot.render(
  <LicenseGate>
    <StoreProvider>
      <SyncBridge />
      <ProductionRoot />
    </StoreProvider>
  </LicenseGate>
);