Validations

The template includes a built-in validation system that controls which verifications users must complete before navigating or performing actions (deposit, withdraw, play casino, etc.).

How it works

The brand configuration (features.authValidation) defines which validation modules are active for each context. The system evaluates the user's profile data against these modules and shows the appropriate modal when something is pending.

Two display modes

Mode	When it appears	Can be closed?
Blocker overlay	Global/regulatory/forced validations pending	No (anti-tamper protection)
Steps modal	Context-specific validations (deposit, withdraw, etc.)	Yes (click outside or X button)

Available modules

Module	What it verifies
email	Email address verified via OTP code
phone / sms	Phone number verified via SMS code
address	Full address (zipcode, street, city, state)
docs	Personal documents (CPF, birth date, nationality)
kyc	Identity verification (selfie + documents)
password	Strong password confirmation
user_limits	Responsible gaming limits (time + loss)
terms	Terms and conditions accepted
gps	Geolocation permission granted
bank_account	Bank account registered

Brand configuration

The validation modules for each context come from the brand API (features.authValidation). Example structure:

{
  "global": {
    "active": true,
    "modules": ["user_limits", "address"],
    "frequent": false,
    "minValue": null,
    "device": null
  },
  "deposit": {
    "active": true,
    "modules": ["email", "phone", "address", "kyc"],
    "frequent": false,
    "minValue": null,
    "device": null
  },
  "withdraw": {
    "active": true,
    "modules": ["password"],
    "frequent": true,
    "minValue": 1,
    "device": null
  }
}

Configuration fields

Field	Description
active	Whether this context's validations are enabled
modules	List of module IDs to validate
frequent	If true, modules are re-validated every time (e.g., password on each withdrawal)
minValue	Minimum amount (in cents) to trigger validation. null = always
device	Device filter: null (all), "desktop", "mobile", "desktop_mobile"

Customizing labels and messages

Fork owners can customize the text shown in validation modals by editing:

• app/components/validation/constants.ts — module labels and context messages
• app/components/validation/ui/StepCarousel.tsx — module icons and labels in the step carousel

Theming

All validation modals use the auth.* color tokens from theme.config.ts. Changing the auth section colors will automatically update the validation modals.

See Theming for details on available color tokens.