import React from 'react'
import ReactDOM from 'react-dom/client'
import { createBrowserRouter, RouterProvider } from 'react-router-dom'
import App from './App.jsx'
import Campaigns from './pages/Campaigns.jsx'
import NewCampaign from './pages/NewCampaign.jsx'
import Play from './pages/Play'
import Settings from './pages/Settings.jsx'
import { trackKeyboardInset } from './keyboard.js'
import './index.css'

trackKeyboardInset()

/* Four routes. `BROWSER-UX-SPEC.md` §97 puts everything else inside a campaign,
 * where it is reachable from the story screen's own panels rather than from a
 * URL of its own.
 *
 * The scenario gallery, the scenario editor and the raw model chat console that
 * used to live here are gone; `App.jsx` records why. */
const router = createBrowserRouter([
  {
    path: '/',
    element: <App />,
    children: [
      { index: true, element: <Campaigns /> },
      { path: 'new', element: <NewCampaign /> },
      { path: 'play/:id', element: <Play /> },
      { path: 'settings', element: <Settings /> },
    ],
  },
])

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <RouterProvider router={router} />
  </React.StrictMode>,
)