feat: add UI components and improve layout

- Introduced new UI components: Input, Label, ScrollArea, Separator, Sheet, Skeleton, Table.
- Implemented utility function for class name merging.
- Enhanced the authenticated layout with a sidebar and user menu.
- Added login functionality with improved UI and error handling.
- Integrated theme provider for consistent theming across the application.
- Updated styles with Tailwind CSS and custom properties for dark mode support.
- Refactored routes to utilize new components and improve user experience.

src/routes/__root.tsx

@@ -2,6 +2,7 @@ import { Outlet, createRootRouteWithContext } from '@tanstack/react-router'
 import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'
 import { TanstackDevtools } from '@tanstack/react-devtools'
 import type { SupabaseAuthState } from '@/auth/supabase'
+import { ThemeProvider } from '@/components/theme-provider'
 
 interface AuthContext {
   auth: SupabaseAuthState
@@ -10,18 +11,21 @@ interface AuthContext {
 export const Route = createRootRouteWithContext<AuthContext>()({
   component: () => (
     <>
-      <Outlet />
-      <TanstackDevtools
-        config={{
-          position: 'bottom-left',
-        }}
-        plugins={[
-          {
-            name: 'Tanstack Router',
-            render: <TanStackRouterDevtoolsPanel />,
-          },
-        ]}
-      />
+      <ThemeProvider defaultTheme="light" storageKey="vite-ui-theme">
+
+        <Outlet />
+        <TanstackDevtools
+          config={{
+            position: 'bottom-left',
+          }}
+          plugins={[
+            {
+              name: 'Tanstack Router',
+              render: <TanStackRouterDevtoolsPanel />,
+            },
+          ]}
+        />
+      </ThemeProvider>
     </>
   ),
 })