import React from 'react';
import ReactDOM from 'react-dom/client';
import { HashRouter } from 'react-router-dom';
import { ConvexProvider, ConvexReactClient } from 'convex/react';
import { PlatformProvider } from '@discord-clone/shared/src/platform';
import App from '@discord-clone/shared/src/App';
import { ThemeProvider } from '@discord-clone/shared/src/contexts/ThemeContext';
import { VoiceProvider } from '@discord-clone/shared/src/contexts/VoiceContext';
import { SearchProvider } from '@discord-clone/shared/src/contexts/SearchContext';
import electronPlatform from './platform';
import '@discord-clone/shared/src/global.css';

const convex = new ConvexReactClient(import.meta.env.VITE_CONVEX_URL);

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <PlatformProvider platform={electronPlatform}>
      <ThemeProvider>
        <ConvexProvider client={convex}>
          <SearchProvider>
            <VoiceProvider>
              <HashRouter>
                <App />
              </HashRouter>
            </VoiceProvider>
          </SearchProvider>
        </ConvexProvider>
      </ThemeProvider>
    </PlatformProvider>
  </React.StrictMode>,
);