import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { RouterProvider } from 'react-router/dom';
import { router } from './router';
import { ThemeProvider } from './contexts/ThemeContext';
import './i18n';
import { initTranslations } from './i18n';
import './styles/tokens.css';
import './styles/global.css';

// Three.js 0.183+ deprecated `THREE.Clock` in favour of `THREE.Timer`, but
// @react-three/fiber 9.5 still instantiates `THREE.Clock` internally on every
// Canvas mount. The deprecation fires a `console.warn` with a noisy stack
// trace on every render path, drowning out real warnings. Filter just this
// one message until R3F ships a fix; everything else still goes through.
const __originalWarn = console.warn.bind(console);
console.warn = (...args: unknown[]) => {
  const first = args[0];
  if (
    typeof first === 'string' &&
    first.includes('THREE.Clock') &&
    first.includes('deprecated')
  ) {
    return;
  }
  __originalWarn(...args);
};

const rootElement = document.getElementById('root');

if (!rootElement) {
  throw new Error('Root element not found');
}

initTranslations().then(() => {
  createRoot(rootElement).render(
    <StrictMode>
      <ThemeProvider>
        <RouterProvider router={router} />
      </ThemeProvider>
    </StrictMode>,
  );
});
