jettypod 4.4.118 → 4.4.121

package/apps/dashboard/app/signup/page.tsx

@@ -0,0 +1,242 @@
+import { useState, useEffect, useRef } from 'react';
+import { Link } from 'react-router-dom';
+import { Button } from '@/components/ui/Button';
+import { Input } from '@/components/ui/Input';
+import { isTauri, auth } from '@/lib/tauri-bridge';
+
+const API_BASE = 'https://jettypod-update-server.spangbaryn2.workers.dev';
+
+export default function SignupPage() {
+  const [email, setEmail] = useState('');
+  const [otpCode, setOtpCode] = useState('');
+  const [otpSent, setOtpSent] = useState(false);
+  const [isSending, setIsSending] = useState(false);
+  const [isVerifying, setIsVerifying] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const pollRef = useRef<ReturnType<typeof setInterval> | null>(null);
+
+  // Redirect already-authenticated users to dashboard
+  useEffect(() => {
+    async function checkIfAlreadyAuthenticated() {
+      if (isTauri()) {
+        try {
+          const status = await auth.getStatus();
+          if (status.authenticated) {
+            const path = await auth.getPostLoginPath() || '/';
+            window.location.href = path;
+          }
+        } catch {
+          // Ignore — stay on signup page
+        }
+      }
+    }
+    checkIfAlreadyAuthenticated();
+  }, []);
+
+  useEffect(() => {
+    return () => {
+      if (pollRef.current) clearInterval(pollRef.current);
+    };
+  }, []);
+
+  const handleGoogleSignUp = () => {
+    if (!isTauri()) return;
+    auth.loginWithGoogle();
+
+    pollRef.current = setInterval(async () => {
+      try {
+        const status = await auth.getStatus();
+        if (status.authenticated) {
+          if (pollRef.current) clearInterval(pollRef.current);
+          const path = await auth.getPostLoginPath() || '/';
+          window.location.href = path;
+        }
+      } catch {
+        // Ignore — keep polling
+      }
+    }, 1000);
+  };
+
+  const handleSendOTP = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError(null);
+
+    if (!email.trim() || !email.includes('@')) {
+      setError('Please enter a valid email address.');
+      return;
+    }
+
+    setIsSending(true);
+
+    try {
+      const res = await fetch(`${API_BASE}/auth/otp/send`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ email: email.trim().toLowerCase() }),
+      });
+
+      if (!res.ok) {
+        const data = await res.json() as { error?: string };
+        setError(data.error || 'Failed to send code.');
+        return;
+      }
+
+      setOtpSent(true);
+    } catch {
+      setError('Failed to send code. Check your connection.');
+    } finally {
+      setIsSending(false);
+    }
+  };
+
+  const handleVerifyOTP = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError(null);
+
+    if (!otpCode.trim()) {
+      setError('Please enter the code from your email.');
+      return;
+    }
+
+    setIsVerifying(true);
+
+    try {
+      const res = await fetch(`${API_BASE}/auth/otp/verify`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ email: email.trim().toLowerCase(), code: otpCode.trim() }),
+      });
+
+      if (!res.ok) {
+        const data = await res.json() as { error?: string };
+        setError(data.error || 'Invalid or expired code.');
+        setIsVerifying(false);
+        return;
+      }
+
+      const data = await res.json() as { token: string; user: { id: string; email: string; plan: string } };
+
+      if (isTauri()) {
+        await auth.saveToken(data.token, data.user);
+      }
+
+      const path = await auth.getPostLoginPath() || '/';
+      window.location.href = path;
+    } catch {
+      setError('Failed to verify code. Check your connection.');
+      setIsVerifying(false);
+    }
+  };
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen bg-white dark:bg-zinc-900 p-8">
+      <div className="max-w-md w-full space-y-10">
+        {/* Logo */}
+        <div className="flex flex-col items-center space-y-6">
+          <img
+            src="/jettypod_wordmark.png"
+            alt="JettyPod"
+            width={160}
+            height={40}
+          />
+          <h1 className="text-2xl font-semibold text-zinc-900 dark:text-zinc-100 text-center">
+            Create your account
+          </h1>
+          <p className="text-zinc-500 dark:text-zinc-400 text-center">
+            Get started free. No credit card required.
+          </p>
+        </div>
+
+        {/* Error */}
+        {error && (
+          <div className="bg-red-50 dark:bg-red-900/20 border-2 border-red-200 dark:border-red-800 text-red-700 dark:text-red-400 px-5 py-4 rounded-xl text-base">
+            {error}
+          </div>
+        )}
+
+        {/* Google Sign-Up */}
+        <div className="pt-4">
+          <Button
+            onClick={handleGoogleSignUp}
+            size="lg"
+            fullWidth
+          >
+            Sign up with Google
+          </Button>
+        </div>
+
+        {/* Divider */}
+        <div className="flex items-center gap-4">
+          <div className="flex-1 h-px bg-zinc-200 dark:bg-zinc-700" />
+          <span className="text-base text-zinc-400 dark:text-zinc-500">or</span>
+          <div className="flex-1 h-px bg-zinc-200 dark:bg-zinc-700" />
+        </div>
+
+        {/* Email OTP */}
+        {!otpSent ? (
+          <form onSubmit={handleSendOTP} className="space-y-6">
+            <Input
+              type="email"
+              value={email}
+              onChange={(e) => setEmail(e.target.value)}
+              placeholder="Enter your email"
+              disabled={isSending}
+            />
+            <Button
+              type="submit"
+              variant="secondary"
+              size="lg"
+              fullWidth
+              disabled={isSending || !email.trim()}
+            >
+              {isSending ? 'Sending code...' : 'Sign up with email'}
+            </Button>
+          </form>
+        ) : (
+          <form onSubmit={handleVerifyOTP} className="space-y-6">
+            <p className="text-base text-zinc-500 dark:text-zinc-400">
+              We sent a 6-digit code to <span className="font-medium text-zinc-700 dark:text-zinc-300">{email}</span>
+            </p>
+            <Input
+              type="text"
+              value={otpCode}
+              onChange={(e) => setOtpCode(e.target.value)}
+              placeholder="Enter 6-digit code"
+              maxLength={6}
+              autoFocus
+              disabled={isVerifying}
+              className="text-center text-xl tracking-widest font-mono"
+            />
+            <Button
+              type="submit"
+              variant="secondary"
+              size="lg"
+              fullWidth
+              disabled={isVerifying || !otpCode.trim()}
+            >
+              {isVerifying ? 'Verifying...' : 'Verify code'}
+            </Button>
+            <Button
+              type="button"
+              variant="ghost"
+              size="sm"
+              fullWidth
+              onClick={() => { setOtpSent(false); setOtpCode(''); setError(null); }}
+            >
+              Use a different email
+            </Button>
+          </form>
+        )}
+
+        {/* Switch to login */}
+        <p className="text-center text-base text-zinc-500 dark:text-zinc-400">
+          Already have an account?{' '}
+          <Link to="/login" className="font-medium hover:underline" style={{ color: '#819D9F' }}>
+            Sign in
+          </Link>
+        </p>
+      </div>
+    </div>
+  );
+}

package/apps/dashboard/app/subscribe/page.tsx

@@ -1,5 +1,3 @@
-'use client';
-
 import { SubscribeContent } from '@/components/SubscribeContent';
 
 export default function SubscribePage() {

package/apps/dashboard/app/tests/page.tsx

@@ -1,10 +1,43 @@
-import { getTestDashboardData } from '@/lib/tests';
+import { useState, useEffect } from 'react';
 import { RealTimeTestsWrapper } from '@/components/RealTimeTestsWrapper';
-
-export const dynamic = 'force-dynamic';
+import { prefetch } from '@/lib/data-bridge';
 
 export default function TestsPage() {
-  const initialData = getTestDashboardData();
+  const [initialData, setInitialData] = useState<any>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    async function loadData() {
+      try {
+        const data = await prefetch.tests();
+        setInitialData(data);
+      } catch (err) {
+        console.error('Failed to load test data:', err);
+        setInitialData({ suites: [], summary: { total: 0, passing: 0, failing: 0, pending: 0 } });
+      } finally {
+        setLoading(false);
+      }
+    }
+    loadData();
+  }, []);
+
+  if (loading || !initialData) return (
+    <div className="flex-1 max-w-7xl w-full mx-auto px-4 py-4">
+      <div className="flex justify-between items-center mb-6">
+        <div className="h-8 w-32 bg-zinc-200 dark:bg-zinc-800 rounded" style={{ animation: 'skeleton-pulse 1.5s ease-in-out infinite' }} />
+        <div className="flex gap-3">
+          {[1, 2, 3, 4].map(i => (
+            <div key={i} className="h-10 w-20 bg-zinc-200 dark:bg-zinc-800 rounded-lg" style={{ animation: 'skeleton-pulse 1.5s ease-in-out infinite' }} />
+          ))}
+        </div>
+      </div>
+      <div className="space-y-3">
+        {[1, 2, 3, 4, 5].map(i => (
+          <div key={i} className="h-16 bg-zinc-200 dark:bg-zinc-800 rounded-xl" style={{ animation: 'skeleton-pulse 1.5s ease-in-out infinite' }} />
+        ))}
+      </div>
+    </div>
+  );
 
   return <RealTimeTestsWrapper initialData={initialData} />;
 }

package/apps/dashboard/app/welcome/page.tsx

@@ -1,8 +1,7 @@
-'use client';
-
 import { useState, useEffect } from 'react';
 import { WelcomeScreen } from '@/components/WelcomeScreen';
-import type { RecentProject } from '@/lib/db-bridge';
+import { isTauri, project } from '@/lib/tauri-bridge';
+import type { RecentProject } from '@/lib/tauri-bridge';
 
 export default function WelcomePage() {
   const [error, setError] = useState<string | null>(null);
@@ -11,11 +10,11 @@ export default function WelcomePage() {
   // Load recent projects on mount
   useEffect(() => {
     async function loadRecentProjects() {
-      if (!window.electronAPI?.isElectron) {
+      if (!isTauri()) {
         return;
       }
 
-      const projects = await window.electronAPI.project.getRecent();
+      const projects = await project.getRecent();
       setRecentProjects(projects);
     }
 
@@ -25,12 +24,12 @@ export default function WelcomePage() {
   const handleNewProject = async () => {
     setError(null);
 
-    if (!window.electronAPI?.isElectron) {
+    if (!isTauri()) {
       setError('Project creation is only available in the desktop app.');
       return;
     }
 
-    const result = await window.electronAPI.project.newProject();
+    const result = await project.newProject();
 
     if (result.canceled) {
       return;
@@ -47,13 +46,12 @@ export default function WelcomePage() {
   const handleOpenProject = async () => {
     setError(null);
 
-    // Check if we're in Electron
-    if (!window.electronAPI?.isElectron) {
+    if (!isTauri()) {
       setError('Project selection is only available in the desktop app.');
       return;
     }
 
-    const result = await window.electronAPI.project.openDialog();
+    const result = await project.openDialog();
 
     if (result.canceled) {
       // User canceled - do nothing
@@ -69,19 +67,18 @@ export default function WelcomePage() {
     window.location.href = '/';
   };
 
-  const handleSelectRecentProject = async (project: RecentProject) => {
+  const handleSelectRecentProject = async (p: RecentProject) => {
     setError(null);
 
-    // Check if we're in Electron
-    if (!window.electronAPI?.isElectron) {
+    if (!isTauri()) {
       setError('Project selection is only available in the desktop app.');
       return;
     }
 
-    const result = await window.electronAPI.project.openRecent(project.path);
+    const result = await project.openRecent(p.path);
 
     if (!result.success) {
-      setError(result.error || 'Failed to open project');
+      setError('Failed to open project');
       return;
     }
 
@@ -92,7 +89,7 @@ export default function WelcomePage() {
   return (
     <>
       {error && (
-        <div className="fixed top-4 left-1/2 transform -translate-x-1/2 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded z-50">
+        <div className="fixed top-4 left-1/2 transform -translate-x-1/2 bg-red-50 dark:bg-red-900/20 border-2 border-red-200 dark:border-red-800 text-red-700 dark:text-red-400 px-4 py-3 rounded-xl text-base z-50">
           {error}
         </div>
       )}