/**
 * @file apps/admin-web/src/main.tsx
 * @description Application entry point for the Admin Web React app.
 *
 * This file bootstraps the React application and sets up the authentication
 * provider tree.  The component hierarchy establishes the following order of
 * operations:
 *
 *   1. React.StrictMode    – Enables additional runtime checks and warnings
 *                            in development to catch common mistakes early.
 *
 *   2. MsalProvider        – Provides the MSAL instance to all child components
 *                            via React context.  Required for any component
 *                            that uses `useMsal`, `useIsAuthenticated`, etc.
 *
 *   3. AuthProvider        – Wraps the app in the two-stage authentication gate:
 *                            (a) Entra ID / MSAL sign-in
 *                            (b) Cosmos DB entitlement check
 *                            No child component renders until both checks pass.
 *
 *   4. App                 – The main application with routing and all pages.
 *
 * The `index.css` import applies the global design system tokens and base
 * styles defined for the Admin Web.
 */

import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import { MsalProvider } from '@azure/msal-react'
import { msalInstance } from './auth/msalConfig'
import { AuthProvider } from './auth/AuthProvider'
import App from './App.tsx'
import './index.css'

// Mount the React tree into the `<div id="root">` element defined in
// `index.html`.  The non-null assertion (!) is safe because Vite's template
// always includes a root element.
createRoot(document.getElementById('root')!).render(
  <StrictMode>
    {/* Provide the MSAL singleton to the entire React tree */}
    <MsalProvider instance={msalInstance}>
      {/* Two-stage auth gate: MSAL + Cosmos DB entitlement */}
      <AuthProvider>
        {/* Full admin application with routing */}
        <App />
      </AuthProvider>
    </MsalProvider>
  </StrictMode>,
)