import React from "react";
import { createRoot } from "react-dom/client";
import App from "./App";
import { ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import { IntlProvider } from "react-intl";

import "../../dev-env";
import { i18nUtils } from "../../i18n/utils/locales";

if (process.env.NODE_ENV !== "development") {
  (window as any).console = { log: () => {} };
  (window as any).console.debug = () => {};
  (window as any).console.info = () => {};
  (window as any).console.warn = () => {};
}

function mount() {
  const defaultLocale = i18nUtils.getDefaultLocale();
  // const defaultLocale = "en";

  const el = document.getElementById("root");

  if (!el) {
    console.warn("App root element not found");
    return;
  }

  createRoot(el).render(
    <div style={{ paddingRight: "20px", paddingTop: "20px" }}>
      <React.StrictMode>
        <IntlProvider
          locale={defaultLocale}
          messages={i18nUtils.getMessages(defaultLocale)}
        >
          <App />
          <ToastContainer position="bottom-right" autoClose={3000} />
        </IntlProvider>
      </React.StrictMode>
    </div>,
  );
}

mount();