Auth
Location: src/components/Auth.jsx
Overview
Auth is the authentication gate for CommonPlace. It provides a combined login/registration form that toggles between sign-in and sign-up modes. Registration requires an invite code, enforcing the platform's invite-only model during private beta.
The component uses Supabase Auth for both signInWithPassword and signUp. On sign-up, the display name is passed via options.data so the database trigger can create the profile automatically.
Relevant Invariants
- Invariant #7: "Human-Scale Social Contexts" -- Invite code gating keeps the community small and intentional.
- Invariant #19: "Complexity Must Be Earned" -- New users must be invited by existing members.
Props
This component takes no props. It reads the invite code from VITE_INVITE_CODE environment variable (falling back to a default).
Form Fields
| Field | Mode | Required | Description |
|---|---|---|---|
| Display Name | Sign-up only | Yes | How friends will see the user |
| Invite Code | Sign-up only | Yes | Must match the configured invite code |
| Both | Yes | User's email address | |
| Password | Both | Yes | Minimum 6 characters |
Key Behaviors
- Mode Toggle: Users switch between login and registration via a toggle button at the bottom of the form.
- Invite Validation: The invite code is validated client-side before the sign-up request is sent.
- Error Display: Errors from Supabase or invite validation are shown in an error message banner.
- Loading State: The submit button is disabled while authentication is in progress.
- Profile Creation: A database trigger creates the user profile on sign-up using the display name from auth metadata.
Usage
import Auth from '@/components/Auth';
// Rendered when no session exists
{!session && <Auth />}
Related
Last updated: 2026-02-07