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

import Layout from "./components/Layout";
import Dashboard from "./pages/Dashboard";
import Jobs from "./pages/Jobs";
import Products from "./pages/Products";
import Crawl from "./pages/Crawl";
import Costs from "./pages/Costs";
import TestSearch from "./pages/TestSearch";
import Settings from "./pages/Settings";
import "./index.css";

const queryClient = new QueryClient({
  defaultOptions: { queries: { retry: 1, refetchOnWindowFocus: false } },
});

const router = createBrowserRouter([
  {
    element: <Layout />,
    children: [
      { path: "/", element: <Dashboard /> },
      { path: "/jobs", element: <Jobs /> },
      { path: "/products", element: <Products /> },
      { path: "/crawl", element: <Crawl /> },
      { path: "/costs", element: <Costs /> },
      { path: "/test", element: <TestSearch /> },
      { path: "/settings", element: <Settings /> },
    ],
  },
]);

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