import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { RouterProvider } from "@tanstack/react-router";
import { QueryClientProvider } from "@tanstack/react-query";
import { getRouter } from "./router";
import "./styles.css";

// Inject font + canonical links from JS to keep absolute URLs out of Vite's HTML asset pipeline
const head = document.head;
const addLink = (attrs: Record<string, string>) => {
  const l = document.createElement("link");
  Object.entries(attrs).forEach(([k, v]) => l.setAttribute(k, v));
  head.appendChild(l);
};
addLink({ rel: "preconnect", href: "https://fonts.googleapis.com" });
addLink({ rel: "preconnect", href: "https://fonts.gstatic.com", crossorigin: "" });
addLink({
  rel: "stylesheet",
  href: "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Inter:wght@300;400;500;600&display=swap",
});

const { router, queryClient } = getRouter();

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <QueryClientProvider client={queryClient}>
      <RouterProvider router={router} />
    </QueryClientProvider>
  </StrictMode>,
);