Add files via upload

src/App.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
-import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
+import React, { useEffect } from 'react';
+import { BrowserRouter as Router, Routes, Route, useSearchParams, useNavigate } from 'react-router-dom';
 import { Home } from './pages/Home';
 import { Login } from './pages/Login';
 import { Dashboard } from './pages/Dashboard';
@@ -7,20 +7,43 @@ import { Payment } from './pages/Payment';
 import { ThankYou } from './pages/ThankYou';
 import { Terms } from './pages/Terms';
 import { Layout } from './components/Layout';
+import { useStore } from './store/useStore';
+
+// Wrapper component to handle auto-login logic
+function AutoLoginHandler({ children }: { children: React.ReactNode }) {
+  const [searchParams] = useSearchParams();
+  const navigate = useNavigate();
+  const { user, setUser } = useStore();
+  
+  useEffect(() => {
+    const urlPubkey = searchParams.get('npub') || searchParams.get('pubkey');
+    const isIframe = searchParams.get('iframe') === '1';
+
+    // Auto-login if pubkey/npub is in URL and user isn't already logged in
+    if (urlPubkey && !user) {
+      setUser({ pubkey: urlPubkey, isWhitelisted: false });
+      navigate(isIframe ? '/dashboard?iframe=1' : '/dashboard');
+    }
+  }, [searchParams, user, setUser, navigate]);
+
+  return <>{children}</>;
+}
 
 function App() {
   return (
     <Router>
-      <Routes>
-        <Route path="/" element={<Layout />}>
-          <Route index element={<Home />} />
-          <Route path="login" element={<Login />} />
-          <Route path="dashboard" element={<Dashboard />} />
-          <Route path="payment" element={<Payment />} />
-          <Route path="thank-you" element={<ThankYou />} />
-          <Route path="terms" element={<Terms />} />
-        </Route>
-      </Routes>
+      <AutoLoginHandler>
+        <Routes>
+          <Route path="/" element={<Layout />}>
+            <Route index element={<Home />} />
+            <Route path="login" element={<Login />} />
+            <Route path="dashboard" element={<Dashboard />} />
+            <Route path="payment" element={<Payment />} />
+            <Route path="thank-you" element={<ThankYou />} />
+            <Route path="terms" element={<Terms />} />
+          </Route>
+        </Routes>
+      </AutoLoginHandler>
     </Router>
   );
 }

src/pages/Login.tsx

@@ -10,12 +10,21 @@ export function Login() {
   const [isLoading, setIsLoading] = useState(false);
   const [pubkeyInput, setPubkeyInput] = useState('');
   const isIframe = searchParams.get('iframe') === '1';
+  const urlPubkey = searchParams.get('npub') || searchParams.get('pubkey');
 
   useEffect(() => {
+    // Handle URL-based login
+    if (urlPubkey && !user) {
+      setUser({ pubkey: urlPubkey, isWhitelisted: false });
+      navigate(isIframe ? '/dashboard?iframe=1' : '/dashboard');
+      return;
+    }
+
+    // Regular user redirect
     if (user) {
       navigate(isIframe ? '/dashboard?iframe=1' : '/dashboard');
     }
-  }, [user, navigate, isIframe]);
+  }, [user, navigate, isIframe, urlPubkey, setUser]);
 
   const handleExtensionLogin = async () => {
     setIsLoading(true);
@@ -73,6 +82,15 @@ export function Login() {
     }
   };
 
+  // If we're processing URL-based login, show loading state
+  if (urlPubkey && !user) {
+    return (
+      <div className="flex justify-center items-center min-h-[400px]">
+        <div className="animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-orange-500"></div>
+      </div>
+    );
+  }
+
   return (
     <div className="max-w-md mx-auto bg-gray-800 rounded-lg p-8">
       <h1 className="text-2xl font-bold mb-6 text-center">Connect with Nostr</h1>