import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import { BrowserRouter } from 'react-router-dom'
import App from './App.jsx'
import { ZinoProvider } from './api/provider.jsx'
import { basePath, requireConfigValue } from './runtimeConfig.js'
import './index.css'

/**
 * The API base URL is read at RUNTIME, from the config.js the server writes
 * when it places the build — never compiled in. One artifact is promoted
 * between environments unchanged, so a build-time URL would point every
 * environment at whichever backend happened to build it.
 *
 * requireConfigValue throws rather than falling back, so a production build
 * with no config.js fails loudly on the first paint instead of quietly calling
 * the wrong backend.
 */
const baseUrl = requireConfigValue('VITE_ZINO_API_URL')

createRoot(document.getElementById('root')).render(
  <StrictMode>
    {/* basename comes from the <base href> the server wrote, so one build
        serves any mount path without a rebuild. */}
    <BrowserRouter basename={basePath()}>
      <ZinoProvider baseUrl={baseUrl}>
        <App />
      </ZinoProvider>
    </BrowserRouter>
  </StrictMode>,
)