import React, { Suspense } from "react";
import ReactDOM from "react-dom";
import ThemeProvider from "./providers/ThemeProvider";
import CssBaseline from "@material-ui/core/CssBaseline";
import AppRouter from "./components/AppRouter";
import { TuitioProvider } from "@flare/tuitio-client-react";
import { ToastProvider } from "./providers";
import env from "./utils/env";
import "./utils/i18n";

ReactDOM.render(
  <TuitioProvider tuitioUrl={env.REACT_APP_TUITIO_URL}>
    <ThemeProvider>
      <CssBaseline />
      <Suspense fallback={<div>Loading...</div>}>
        <ToastProvider>
          <AppRouter />
        </ToastProvider>
      </Suspense>
    </ThemeProvider>
  </TuitioProvider>,
  document.getElementById("root")
);