Lots of frontend changes

frontend/src/App.tsx

@@ -1,15 +1,17 @@
 import { useState, useEffect, useCallback, useMemo } from 'react';
 import { trackPageview } from './hooks/usePlausible';
-import MapPage from './components/map/MapPage';
+import MapPage, { type ExportState } from './components/map/MapPage';
 import DataSourcesPage from './components/data-sources/DataSourcesPage';
 import FAQPage from './components/faq/FAQPage';
 import HomePage from './components/home/HomePage';
 import Header, { type Page } from './components/ui/Header';
+import AuthModal from './components/ui/AuthModal';
 import type { FeatureMeta, FeatureGroup, POICategoriesResponse, POICategoryGroup } from './types';
 import { fetchWithRetry, apiUrl } from './lib/api';
 import { parseUrlState } from './lib/url-state';
 import { INITIAL_VIEW_STATE } from './lib/consts';
 import { useTheme } from './hooks/useTheme';
+import { useAuth } from './hooks/useAuth';
 
 declare global {
   interface Window {
@@ -43,6 +45,16 @@ export default function App() {
   });
 
   const { theme, toggleTheme } = useTheme();
+  const {
+    user,
+    loading: authLoading,
+    error: authError,
+    login,
+    register,
+    logout,
+    clearError,
+  } = useAuth();
+  const [showAuthModal, setShowAuthModal] = useState(false);
 
   // Load features and POI categories on mount
   useEffect(() => {
@@ -116,6 +128,8 @@ export default function App() {
     return () => window.removeEventListener('popstate', handlePopState);
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
+  const [exportState, setExportState] = useState<ExportState | null>(null);
+
   if (isScreenshotMode) {
     return (
       <MapPage
@@ -142,6 +156,11 @@ export default function App() {
         onPageChange={navigateTo}
         theme={theme}
         onToggleTheme={toggleTheme}
+        onExport={exportState?.onExport ?? null}
+        exporting={exportState?.exporting ?? false}
+        user={user}
+        onLoginClick={() => setShowAuthModal(true)}
+        onLogout={logout}
       />
       {activePage === 'home' ? (
         <HomePage onOpenDashboard={() => navigateTo('dashboard')} theme={theme} />
@@ -162,6 +181,17 @@ export default function App() {
           pendingInfoFeature={pendingInfoFeature}
           onClearPendingInfoFeature={() => setPendingInfoFeature(null)}
           onNavigateTo={navigateTo}
+          onExportStateChange={setExportState}
+        />
+      )}
+      {showAuthModal && (
+        <AuthModal
+          onClose={() => setShowAuthModal(false)}
+          onLogin={login}
+          onRegister={register}
+          loading={authLoading}
+          error={authError}
+          onClearError={clearError}
         />
       )}
     </div>