import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { AuthKitProvider } from "@workos-inc/authkit-react";
import { App } from "./app/App";
import {
  WORKOS_API_HOSTNAME,
  WORKOS_CLIENT_ID,
  WORKOS_PERSIST_SESSION,
  WORKOS_REDIRECT_URI,
} from "./config";
import { getAppCopy } from "./i18n/catalog";
import { registerServiceWorker } from "./pwa/registerServiceWorker";
import "./styles/styles.css";
import "./styles/multitrack.css";
import "@fontsource-variable/inter";
import "@fontsource-variable/manrope";
import "@fortawesome/fontawesome-free/css/fontawesome.min.css";
import "@fortawesome/fontawesome-free/css/solid.min.css";
import "./styles/aurora-reference.css";
import "./styles/aurora.css";

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

if (!rootElement) {
  throw new Error("No se encontró el elemento raíz #root.");
}

if (!WORKOS_CLIENT_ID) {
  rootElement.textContent = getAppCopy().login.missingClientId;
} else {
  createRoot(rootElement).render(
    <StrictMode>
      <AuthKitProvider
        clientId={WORKOS_CLIENT_ID}
        apiHostname={WORKOS_API_HOSTNAME}
        redirectUri={WORKOS_REDIRECT_URI}
        devMode={WORKOS_PERSIST_SESSION}
      >
        <App />
      </AuthKitProvider>
    </StrictMode>,
  );
  registerServiceWorker();
}
