import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import { Agentation } from 'agentation'
import './index.css'
import App from './App.tsx'
import { AuthProvider } from './components/AuthContext';
import { ProductAccessibilityGate } from './components/ProductAccessibilityGate';
import { tradingTelemetry } from './lib/runtime';

const telemetryClient = tradingTelemetry.init();
telemetryClient.trackEvent('info', 'app_shell', 'trading_web_bootstrap', {
  feature: 'bootstrap',
  message: window.location.pathname,
  tags: { surface: 'web' },
});

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <ProductAccessibilityGate>
      <AuthProvider>
        <App />
      </AuthProvider>
    </ProductAccessibilityGate>
    {import.meta.env.DEV && (
      <div style={{ position: 'relative', zIndex: 2147483647 }}>
        <Agentation />
      </div>
    )}
  </StrictMode>,
)
