Add Vercel Analytics integration and improve route transition handling

Author: BasilOmsha

client/src/main.tsx

@@ -1,8 +1,9 @@
 import React from "react"
 import { BrowserRouter } from "react-router-dom"
 
-import { QueryClient , QueryClientProvider } from "@tanstack/react-query"
-import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
+import { ReactQueryDevtools } from "@tanstack/react-query-devtools"
+import { Analytics } from "@vercel/analytics/react"
 import ReactDOM from "react-dom/client"
 
 import App from "./App.tsx"
@@ -24,12 +25,13 @@ ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
             <BrowserRouter
                 future={{
                     v7_relativeSplatPath: true, // Better catch-all route handling
-                    v7_startTransition: true  // Smoother route transitions
+                    v7_startTransition: true // Smoother route transitions
                 }}
             >
                 <App />
                 <ReactQueryDevtools initialIsOpen={false} />
-            </BrowserRouter>           
+                <Analytics />
+            </BrowserRouter>
         </QueryClientProvider>
     </React.StrictMode>
 )