Email Notifications

AllyProof sends email notifications when scans complete, alerting your team to new results, score changes, and critical violations. Emails are delivered via Resend using React Email templates.

Notification Types

What a Scan Complete Email Includes

The scan complete email is the most common notification. It provides a concise summary of scan results:

• Site name and URL — Which site was scanned
• Accessibility score — The 0-100 score with a color indicator (green/yellow/red)
• Score change — Arrow up/down with point difference from the previous scan
• Violation summary — Count of violations by severity (critical, serious, moderate, minor)
• Pages scanned — Total number of pages included in the scan
• Scan duration — How long the scan took
• View Report link — Direct link to the scan results in the AllyProof dashboard

Notification Preferences

Each team member can configure their notification preferences in Settings > Notifications:

Organization admins can also set default notification preferences for new team members.

Resend Integration

AllyProof uses Resend for transactional email delivery. Resend provides:

• Free tier: 3,000 emails per month (sufficient for most Starter and Agency plans)
• High deliverability with SPF, DKIM, and DMARC support
• React Email templates for type-safe, component-based email authoring
• Delivery tracking and bounce handling

RESEND_API_KEY Setup

1. Create a Resend account at resend.com
2. Add and verify your sending domain (e.g. notifications.allyproof.com)
3. Generate an API key in the Resend dashboard
4. Add it to your environment:

   RESEND_API_KEY=re_xxxxxxxxxxxxxxxxxxxx
   RESEND_FROM_EMAIL=AllyProof <notifications@allyproof.com>

React Email Templates

Email templates are built with React Email, which lets you author emails as React components with full TypeScript support. Templates are located in the src/emails/ directory:

src/emails/
  ├── scan-complete.tsx      — Scan results summary
  ├── critical-violations.tsx — Critical violation alert
  ├── score-drop.tsx         — Score regression warning
  └── components/
      ├── header.tsx         — Shared email header with logo
      ├── footer.tsx         — Unsubscribe link and legal text
      └── score-badge.tsx    — Color-coded score display

Templates use inline styles (required for email client compatibility) and are responsive across Gmail, Outlook, Apple Mail, and other major clients.

Sending Emails in the Scan Pipeline

Notification emails are sent at the end of the scan pipeline, after all results have been stored and the accessibility score has been calculated:

Scan complete
  ├── Store violations in database
  ├── Calculate accessibility score
  ├── Generate AI fix suggestions (async)
  └── Send notification emails
       ├── Query org members with notifications enabled
       ├── Build email from React Email template
       └── Send via Resend API

Email sending is non-blocking — if Resend is temporarily unavailable, the scan results are still saved. Failed email deliveries are logged and can be retried.

Testing Emails Locally

During development, you can preview email templates without sending real emails:

• Use the React Email dev server: npx email dev --dir src/emails to preview templates in your browser with hot reload
• Set RESEND_API_KEY to a test key from Resend to send to verified addresses only