✨ Migrate to TanStack Query (React Query) and TanStack Router (#637)

new-frontend/src/main.tsx

@@ -1,35 +1,33 @@
-import React from 'react';
 import ReactDOM from 'react-dom/client';
-
-import { ChakraProvider } from '@chakra-ui/provider';
-import { createStandaloneToast } from '@chakra-ui/toast';
-import { RouterProvider, createBrowserRouter } from 'react-router-dom';
+import { ChakraProvider } from '@chakra-ui/react';
+import { QueryClient, QueryClientProvider } from 'react-query';
+import { RouterProvider, createRouter } from '@tanstack/react-router'
+import { routeTree } from './routeTree.gen'
 
 import { OpenAPI } from './client';
-import { isLoggedIn } from './hooks/useAuth';
-import privateRoutes from './routes/private_route';
-import publicRoutes from './routes/public_route';
 import theme from './theme';
-
+import { StrictMode } from 'react';
 
 OpenAPI.BASE = import.meta.env.VITE_API_URL;
 OpenAPI.TOKEN = async () => {
   return localStorage.getItem('access_token') || '';
 }
 
-const router = createBrowserRouter([
-  isLoggedIn() ? privateRoutes() : {},
-  ...publicRoutes(),
-]);
+const queryClient = new QueryClient();
 
-const { ToastContainer } = createStandaloneToast();
+const router = createRouter({ routeTree })
+declare module '@tanstack/react-router' {
+  interface Register {
+    router: typeof router
+  }
+}
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
+  <StrictMode>
     <ChakraProvider theme={theme}>
-      <RouterProvider router={router} />
-      <ToastContainer />
+      <QueryClientProvider client={queryClient}>
+        <RouterProvider router={router} />
+      </QueryClientProvider>
     </ChakraProvider>
-  </React.StrictMode>,
-)
-
+  </StrictMode>
+);