Atlas/Showcase

Demo Pages

OverviewAuthDataFormFlagsObservabilityA11y & ThemeConsent
Demo Mode

Data is mocked and in-memory only.

Form Demo

Demonstrates React Hook Form with Zod validation and server error mapping.

Create Demo Item
Fill out the form to create a new item. Try submitting with invalid data to see validation.

A short, descriptive title for the item.

Optional details about the item.

Test Server Validation
The server validates the same rules as the client. Try bypassing client validation:

How to test server validation:

  1. Open browser DevTools (Network tab)
  2. Submit a valid form to see the POST request
  3. Right-click the request → "Edit and Resend"
  4. Modify the body to have an empty title
  5. The response will include fieldErrors

Server response example:

{
  "code": "VALIDATION_FAILED",
  "message": "Request validation failed",
  "userMessage": "Please check your input...",
  "correlationId": "abc-123",
  "details": {
    "fieldErrors": {
      "title": ["Title is required"]
    }
  }
}
Alternative Field Pattern
Atlas also supports a simpler Field component pattern for non-RHF forms:
Uses the Field component from @atlas/ui
This field has an error state