init

dmtp/client/providers/AuthProvider.tsx

@@ -0,0 +1,37 @@
+'use client';
+
+import { AuthModal } from '@/components/modals/AuthModal';
+import { onAuthSuccess } from '@/lib/api';
+import { useEffect, useState } from 'react';
+
+/**
+ * Global authentication handler that shows auth modal when needed
+ */
+export function AuthProvider({ children }: { children: React.ReactNode }) {
+    const [showAuthModal, setShowAuthModal] = useState(false);
+
+    useEffect(() => {
+        const handleAuthRequired = () => {
+            setShowAuthModal(true);
+        };
+
+        window.addEventListener('auth-required', handleAuthRequired);
+        return () => window.removeEventListener('auth-required', handleAuthRequired);
+    }, []);
+
+    const handleAuthSuccess = () => {
+        setShowAuthModal(false);
+        onAuthSuccess(); // Notify any pending requests
+    };
+
+    return (
+        <>
+            {children}
+            <AuthModal
+                isOpen={showAuthModal}
+                onClose={() => setShowAuthModal(false)}
+                onSuccess={handleAuthSuccess}
+            />
+        </>
+    );
+}

dmtp/client/providers/QueryProvider.tsx

@@ -0,0 +1,20 @@
+'use client';
+
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { useState } from 'react';
+
+export function QueryProvider({ children }: { children: React.ReactNode }) {
+  const [queryClient] = useState(
+    () =>
+      new QueryClient({
+        defaultOptions: {
+          queries: {
+            staleTime: 60 * 1000, // 1 minute
+            refetchOnWindowFocus: false,
+          },
+        },
+      })
+  );
+
+  return <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>;
+}