import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { createBrowserRouter, RouterProvider } from "react-router";

import { Toaster } from "@/shared/ui/sonner";
import { TooltipProvider } from "@/shared/ui/tooltip";

import { AppRouter } from "./router/app-router";
import "./styles/index.css";

const queryClient = new QueryClient();
// Keep the existing route composition while enabling the studio's navigation
// blocker for links and browser Back/Forward, not just tab-close protection.
const router = createBrowserRouter([{ path: "*", element: <AppRouter /> }]);

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