Skip to content

Email template storyboard/preview tool (all RESEND emails) on the Tools page

✅ DONE 2026-06-16

"Email Templates" panel on the Tools page: dropdown of all 6 Resend emails → subject + sandboxed iframe preview, rendered with sample data via GET /api/tools/email-preview (auth-gated, read-only, never sends). React templates (Invoice/Invitation/PaymentLink/WopcPayment) render via @react-email/render; the 2 inline emails (WOPC signing-request, note-notification) were extracted into shared pure builders (lib/email/templates/{wopcSigningRequestHtml, noteNotificationHtml}.ts) so the sender + preview share ONE source (no drift). All 6 verified to render non-empty HTML. Adding more emails later = one entry in the route's TYPES registry. tsc + lint clean.

Goal (owner, 2026-06-15)

A component-library / storyboard view that previews EVERY email the web app sends via RESEND, so the owner can iterate on their formatting later. Starting example: the closing-director WOPC signing-request email (lib/email/sendWopcSigningRequestEmail.ts). A DROPDOWN switches between email types. Add it to the existing demo/tools list on the Tools page (components/tools/ToolsApp.tsx).

Notes

  • Inventory all senders under lib/email/* (Resend). Render each email's HTML/template into a preview pane with sample data + a type dropdown. Read-only preview (no sending).
  • Reuse the Tools-page tool-registration pattern (ToolsApp already lists demo tools).
  • Purpose is presentation iteration, not logic — keep it a pure render harness.

Log

  • 2026-06-15 created (owner). Backlog; unrelated to T-048.