candle-annotator/openspec/changes/archive/2026-02-20-user-accounts/specs/register-page/spec.md

ADDED Requirements

Requirement: Register page at /register

The system SHALL serve a registration page at /register (route src/app/(public)/register/page.tsx). The page SHALL match the Lovable design mockup from lovable_design_html/candles_lovable_design_register_page.html.

Scenario: Register page renders

• WHEN an unauthenticated user navigates to /register
• THEN the register page renders with a centered card containing the registration form

Scenario: Authenticated user redirected

• WHEN an authenticated user navigates to /register
• THEN they are redirected to /app

Requirement: Register page navigation

The register page navbar SHALL display a back arrow and the CandleAnnotator logo/name, linking to / (landing page).

Scenario: Back to landing

• WHEN a user clicks the CandleAnnotator logo in the register page navbar
• THEN they are navigated to /

Requirement: Registration form

The register card SHALL display a "Create account" heading, "Start annotating charts in seconds" subtitle, and a form with name input, email input, password input (min 8 characters hint), and "Create Account" submit button.

Scenario: Successful registration

• WHEN a user fills in name, email, and password (8+ chars) and clicks "Create Account"
• THEN a POST request is sent to /api/auth/register with { name, email, password }
• AND on success (HTTP 201), the user is automatically signed in via signIn("credentials", { email, password }) and redirected to /app

Scenario: Duplicate email error

• WHEN a user registers with an email that already exists
• THEN an error message is displayed: "Email already registered"

Scenario: Short password error

• WHEN a user enters a password shorter than 8 characters
• THEN an error message is displayed: "Password must be at least 8 characters"

Scenario: Missing fields

• WHEN a user clicks "Create Account" with empty required fields
• THEN browser-native validation prevents submission (fields are required)

Requirement: Google OAuth registration button

The register form SHALL include a "Continue with Google" button. Clicking it SHALL call signIn("google", { callbackUrl: "/app" }). If the user is new, Auth.js creates their account automatically.

Scenario: Google registration

• WHEN a new user clicks "Continue with Google"
• THEN they are redirected to Google OAuth, and on success a user record is created and they land on /app

Requirement: Login link

The register page SHALL display "Already have an account? Sign in" below the form. "Sign in" SHALL link to /login.

Scenario: Navigate to login

• WHEN a user clicks "Sign in"
• THEN they are navigated to /login