import React, { Suspense, lazy } from 'react';
import { createRoot } from 'react-dom/client';
import './styles.css';

// One SPA, served from every *.amerc.ai docroot; pick the app by hostname.
const host = window.location.hostname;
const DocsApp = lazy(() => import('./DocsApp.jsx'));
const PmApp = lazy(() => import('./PmApp.jsx'));
const Scene2DApp = lazy(() => import('./Scene2D.jsx'));

let App = Scene2DApp;
if (host.startsWith('docs.')) App = DocsApp;
else if (host.startsWith('pm.')) App = PmApp;

createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <Suspense fallback={<div style={{ color: '#9fb0d0', fontFamily: 'monospace', padding: 24 }}>Loading amerc…</div>}>
      <App />
    </Suspense>
  </React.StrictMode>,
);