first round of review

frontend/app/signup/[code]/page.tsx

@@ -7,10 +7,13 @@ import { useAuth } from "../../auth-context";
 export default function SignupWithCodePage() {
   const params = useParams();
   const router = useRouter();
-  const { user } = useAuth();
+  const { user, isLoading } = useAuth();
   const code = params.code as string;
 
   useEffect(() => {
+    // Wait for auth check to complete before redirecting
+    if (isLoading) return;
+    
     if (user) {
       // Already logged in, redirect to home
       router.replace("/");
@@ -18,7 +21,7 @@ export default function SignupWithCodePage() {
       // Redirect to signup with code as query param
       router.replace(`/signup?code=${encodeURIComponent(code)}`);
     }
-  }, [user, code, router]);
+  }, [user, isLoading, code, router]);
 
   return (
     <main style={{ 

frontend/app/signup/page.test.tsx

@@ -5,10 +5,11 @@ import SignupPage from "./page";
 const mockPush = vi.fn();
 vi.mock("next/navigation", () => ({
   useRouter: () => ({ push: mockPush }),
+  useSearchParams: () => ({ get: () => null }),
 }));
 
 vi.mock("../auth-context", () => ({
-  useAuth: () => ({ register: vi.fn() }),
+  useAuth: () => ({ user: null, register: vi.fn() }),
 }));
 
 beforeEach(() => vi.clearAllMocks());
@@ -16,19 +17,18 @@ afterEach(() => cleanup());
 
 test("renders signup form with title", () => {
   render(<SignupPage />);
-  expect(screen.getByRole("heading", { name: "Create account" })).toBeDefined();
+  // Step 1 shows "Join with Invite" title (invite code entry)
+  expect(screen.getByRole("heading", { name: "Join with Invite" })).toBeDefined();
 });
 
-test("renders email and password inputs", () => {
+test("renders invite code input", () => {
   render(<SignupPage />);
-  expect(screen.getByLabelText("Email")).toBeDefined();
-  expect(screen.getByLabelText("Password")).toBeDefined();
-  expect(screen.getByLabelText("Confirm Password")).toBeDefined();
+  expect(screen.getByLabelText("Invite Code")).toBeDefined();
 });
 
-test("renders create account button", () => {
+test("renders continue button", () => {
   render(<SignupPage />);
-  expect(screen.getByRole("button", { name: "Create account" })).toBeDefined();
+  expect(screen.getByRole("button", { name: "Continue" })).toBeDefined();
 });
 
 test("renders link to login", () => {

frontend/app/signup/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useEffect, Suspense } from "react";
+import { useState, useEffect, useCallback, Suspense } from "react";
 import { useRouter, useSearchParams } from "next/navigation";
 import { useAuth } from "../auth-context";
 import { api } from "../api";
@@ -20,6 +20,7 @@ function SignupContent() {
   const [inviteValid, setInviteValid] = useState<boolean | null>(null);
   const [inviteError, setInviteError] = useState("");
   const [isCheckingInvite, setIsCheckingInvite] = useState(false);
+  const [isCheckingInitialCode, setIsCheckingInitialCode] = useState(!!initialCode);
   
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
@@ -37,14 +38,7 @@ function SignupContent() {
     }
   }, [user, router]);
 
-  // Check invite code on mount if provided in URL
-  useEffect(() => {
-    if (initialCode) {
-      checkInvite(initialCode);
-    }
-  }, [initialCode]);
-
-  const checkInvite = async (code: string) => {
+  const checkInvite = useCallback(async (code: string) => {
     if (!code.trim()) {
       setInviteValid(null);
       setInviteError("");
@@ -72,7 +66,14 @@ function SignupContent() {
     } finally {
       setIsCheckingInvite(false);
     }
-  };
+  }, []);
+
+  // Check invite code on mount if provided in URL
+  useEffect(() => {
+    if (initialCode) {
+      checkInvite(initialCode).finally(() => setIsCheckingInitialCode(false));
+    }
+  }, [initialCode, checkInvite]);
 
   const handleInviteSubmit = (e: React.FormEvent) => {
     e.preventDefault();
@@ -110,6 +111,21 @@ function SignupContent() {
     return null;
   }
 
+  // Show loading state while checking initial code from URL
+  if (isCheckingInitialCode) {
+    return (
+      <main style={styles.main}>
+        <div style={styles.container}>
+          <div style={styles.card}>
+            <div style={{ textAlign: "center", color: "rgba(255,255,255,0.6)" }}>
+              Checking invite code...
+            </div>
+          </div>
+        </div>
+      </main>
+    );
+  }
+
   // Step 1: Enter invite code
   if (!inviteValid) {
     return (