feat(client): setup tanstack query and axios

Signed-off-by: Noa Virellia <noa@requiem.garden>

client/src/routes/__root.tsx

@@ -1,13 +1,18 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { createRootRoute, Outlet } from '@tanstack/react-router';
 import { TanStackRouterDevtools } from '@tanstack/react-router-devtools';
 import { ThemeProvider } from '@/components/theme-provider';
 import '@/index.css';
 
+const queryClient = new QueryClient();
+
 function RootLayout() {
   return (
     <>
       <ThemeProvider defaultTheme="dark" storageKey="vite-ui-theme">
-        <Outlet />
+        <QueryClientProvider client={queryClient}>
+          <Outlet />
+        </QueryClientProvider>
       </ThemeProvider>
       <TanStackRouterDevtools />
     </>

client/src/routes/index.tsx

@@ -1,4 +1,6 @@
 import { createFileRoute } from '@tanstack/react-router';
+import { Suspense } from 'react';
+import { Time } from '@/components/Time';
 
 export const Route = createFileRoute('/')({
   component: Index,
@@ -8,6 +10,9 @@ function Index() {
   return (
     <div className="p-2">
       <h3>Welcome Home!</h3>
+      <Suspense fallback={<div>Loading...</div>}>
+        <Time />
+      </Suspense>
     </div>
   );
 }