mirror of
https://github.com/xtr-dev/payload-mailing.git
synced 2025-12-10 08:13:23 +00:00
📚 DOCS: Update README for v0.1.0 API changes
- Remove all outdated API examples (sendEmail, scheduleEmail) - Add comprehensive examples using new payload.create() approach - Include template engine configuration options (LiquidJS, Mustache, custom) - Add detailed migration guide from v0.0.x to v0.1.0 - Update feature list to highlight type safety and Payload integration - Replace old API methods section with helper functions - Add template syntax reference for all supported engines - Update Recent Changes section with v0.1.0 breaking changes The README now accurately reflects the simplified collection-based API and provides clear migration paths for existing users. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
325
README.md
325
README.md
@@ -2,16 +2,17 @@
|
|||||||
|
|
||||||
📧 **Template-based email system with scheduling and job processing for PayloadCMS**
|
📧 **Template-based email system with scheduling and job processing for PayloadCMS**
|
||||||
|
|
||||||
⚠️ **Pre-release Warning**: This package is currently in active development (v0.0.x). Breaking changes may occur before v1.0.0. Not recommended for production use.
|
✨ **Simplified API**: Starting from v0.1.0, this plugin uses a simplified API that leverages PayloadCMS collections directly for better type safety and flexibility.
|
||||||
|
|
||||||
## Features
|
## Features
|
||||||
|
|
||||||
✅ **Template System**: Create reusable email templates with Handlebars syntax
|
✅ **Template System**: Create reusable email templates with LiquidJS, Mustache, or simple variables
|
||||||
✅ **Outbox Scheduling**: Schedule emails for future delivery
|
✅ **Type Safety**: Full TypeScript support using your generated Payload types
|
||||||
|
✅ **Flexible Template Engines**: LiquidJS, Mustache, or bring your own template renderer
|
||||||
|
✅ **Email Scheduling**: Schedule emails for future delivery using Payload collections
|
||||||
✅ **Job Integration**: Automatic processing via PayloadCMS jobs queue
|
✅ **Job Integration**: Automatic processing via PayloadCMS jobs queue
|
||||||
✅ **Retry Failed Sends**: Automatic retry mechanism for failed emails
|
✅ **Retry Failed Sends**: Automatic retry mechanism for failed emails
|
||||||
✅ **Template Variables**: Dynamic content with validation
|
✅ **Payload Native**: Uses Payload collections directly - no custom APIs to learn
|
||||||
✅ **Developer API**: Simple methods for sending emails programmatically
|
|
||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
|
|
||||||
@@ -49,53 +50,124 @@ export default buildConfig({
|
|||||||
})
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
### 2. Send emails in your code
|
### 2. Send emails using Payload collections
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
import { sendEmail, scheduleEmail } from '@xtr-dev/payload-mailing'
|
import { renderTemplate } from '@xtr-dev/payload-mailing'
|
||||||
|
|
||||||
// Send immediately using template slug
|
// Option 1: Using templates with variables
|
||||||
const emailId = await sendEmail(payload, {
|
const { html, text, subject } = await renderTemplate(payload, 'welcome-email', {
|
||||||
templateSlug: 'welcome-email',
|
|
||||||
to: 'user@example.com',
|
|
||||||
variables: {
|
|
||||||
firstName: 'John',
|
firstName: 'John',
|
||||||
welcomeUrl: 'https://yoursite.com/welcome'
|
welcomeUrl: 'https://yoursite.com/welcome'
|
||||||
|
})
|
||||||
|
|
||||||
|
// Create email using Payload's collection API (full type safety!)
|
||||||
|
const email = await payload.create({
|
||||||
|
collection: 'emails',
|
||||||
|
data: {
|
||||||
|
to: ['user@example.com'],
|
||||||
|
subject,
|
||||||
|
html,
|
||||||
|
text,
|
||||||
|
// Schedule for later (optional)
|
||||||
|
scheduledAt: new Date(Date.now() + 24 * 60 * 60 * 1000),
|
||||||
|
// Add any custom fields you've defined
|
||||||
|
priority: 1,
|
||||||
|
customField: 'your-value', // Your custom collection fields work!
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
// Schedule for later
|
// Option 2: Direct HTML email (no template needed)
|
||||||
const scheduledId = await scheduleEmail(payload, {
|
const directEmail = await payload.create({
|
||||||
templateSlug: 'reminder-email',
|
collection: 'emails',
|
||||||
to: 'user@example.com',
|
data: {
|
||||||
scheduledAt: new Date(Date.now() + 24 * 60 * 60 * 1000), // 24 hours
|
to: ['user@example.com'],
|
||||||
variables: {
|
subject: 'Welcome!',
|
||||||
eventName: 'Product Launch',
|
html: '<h1>Welcome John!</h1><p>Thanks for joining!</p>',
|
||||||
eventDate: new Date('2024-01-15')
|
text: 'Welcome John! Thanks for joining!',
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
|
## Why This Approach is Better
|
||||||
|
|
||||||
|
- ✅ **Full Type Safety**: Use your generated Payload types
|
||||||
|
- ✅ **No Learning Curve**: Just use `payload.create()` like any collection
|
||||||
|
- ✅ **Maximum Flexibility**: Add any custom fields to your email collection
|
||||||
|
- ✅ **Payload Integration**: Leverage validation, hooks, access control
|
||||||
|
- ✅ **Consistent API**: One way to create data in Payload
|
||||||
|
|
||||||
## Configuration
|
## Configuration
|
||||||
|
|
||||||
### Plugin Options
|
### Plugin Options
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
interface MailingPluginConfig {
|
mailingPlugin({
|
||||||
collections?: {
|
// Template engine (optional)
|
||||||
templates?: string // default: 'email-templates'
|
templateEngine: 'liquidjs', // 'liquidjs' | 'mustache' | 'simple'
|
||||||
emails?: string // default: 'emails'
|
|
||||||
|
// Custom template renderer (optional)
|
||||||
|
templateRenderer: async (template: string, variables: Record<string, any>) => {
|
||||||
|
return yourCustomEngine.render(template, variables)
|
||||||
|
},
|
||||||
|
|
||||||
|
// Email transport
|
||||||
|
transport: {
|
||||||
|
host: 'smtp.gmail.com',
|
||||||
|
port: 587,
|
||||||
|
auth: { user: '...', pass: '...' }
|
||||||
|
},
|
||||||
|
|
||||||
|
// Collection names (optional)
|
||||||
|
collections: {
|
||||||
|
templates: 'email-templates', // default
|
||||||
|
emails: 'emails' // default
|
||||||
|
},
|
||||||
|
|
||||||
|
// Sending options
|
||||||
|
defaultFrom: 'noreply@yoursite.com',
|
||||||
|
defaultFromName: 'Your Site',
|
||||||
|
retryAttempts: 3, // default
|
||||||
|
retryDelay: 300000, // 5 minutes (default)
|
||||||
|
|
||||||
|
// Advanced options
|
||||||
|
emailWrapper: (email) => ({ // optional layout wrapper
|
||||||
|
...email,
|
||||||
|
html: `<html><body>${email.html}</body></html>`
|
||||||
|
}),
|
||||||
|
richTextEditor: lexicalEditor(), // optional custom editor
|
||||||
|
onReady: async (payload) => { // optional initialization hook
|
||||||
|
console.log('Mailing plugin ready!')
|
||||||
}
|
}
|
||||||
defaultFrom?: string
|
})
|
||||||
transport?: Transporter | MailingTransportConfig
|
```
|
||||||
queue?: string // default: 'default'
|
|
||||||
retryAttempts?: number // default: 3
|
### Template Engine Options
|
||||||
retryDelay?: number // default: 300000 (5 minutes)
|
|
||||||
emailWrapper?: EmailWrapperHook // optional email layout wrapper
|
Choose your preferred template engine:
|
||||||
richTextEditor?: RichTextField['editor'] // optional custom rich text editor
|
|
||||||
onReady?: (payload: any) => Promise<void> // optional callback after plugin initialization
|
```typescript
|
||||||
initOrder?: 'before' | 'after' // default: 'before'
|
// LiquidJS (default) - Modern syntax with logic
|
||||||
}
|
mailingPlugin({
|
||||||
|
templateEngine: 'liquidjs' // {% if user.isPremium %}Premium!{% endif %}
|
||||||
|
})
|
||||||
|
|
||||||
|
// Mustache - Logic-less templates
|
||||||
|
mailingPlugin({
|
||||||
|
templateEngine: 'mustache' // {{#user.isPremium}}Premium!{{/user.isPremium}}
|
||||||
|
})
|
||||||
|
|
||||||
|
// Simple variable replacement
|
||||||
|
mailingPlugin({
|
||||||
|
templateEngine: 'simple' // Just {{variable}} replacement
|
||||||
|
})
|
||||||
|
|
||||||
|
// Custom template renderer
|
||||||
|
mailingPlugin({
|
||||||
|
templateRenderer: async (template, variables) => {
|
||||||
|
return handlebars.compile(template)(variables) // Bring your own!
|
||||||
|
}
|
||||||
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
### Transport Configuration
|
### Transport Configuration
|
||||||
@@ -473,71 +545,50 @@ mailingPlugin({
|
|||||||
})
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
## Handlebars Helpers
|
## Template Syntax Reference
|
||||||
|
|
||||||
The plugin includes several built-in helpers:
|
Depending on your chosen template engine, you can use different syntax:
|
||||||
|
|
||||||
- `{{formatDate date 'short'}}` - Format dates (short, long, or default)
|
### LiquidJS (Default)
|
||||||
- `{{formatCurrency amount 'USD'}}` - Format currency
|
- Variables: `{{ user.name }}`
|
||||||
- `{{capitalize string}}` - Capitalize first letter
|
- Logic: `{% if user.isPremium %}Premium content{% endif %}`
|
||||||
- `{{#ifEquals value1 value2}}...{{/ifEquals}}` - Conditional equality
|
- Loops: `{% for item in items %}{{ item.name }}{% endfor %}`
|
||||||
|
- Filters: `{{ amount | formatCurrency }}`, `{{ date | formatDate: "short" }}`
|
||||||
|
|
||||||
## API Methods
|
### Mustache
|
||||||
|
- Variables: `{{ user.name }}`
|
||||||
|
- Logic: `{{#user.isPremium}}Premium content{{/user.isPremium}}`
|
||||||
|
- Loops: `{{#items}}{{ name }}{{/items}}`
|
||||||
|
- No built-in filters (use variables with pre-formatted data)
|
||||||
|
|
||||||
### sendEmail(payload, options)
|
### Simple
|
||||||
|
- Variables only: `{{ user.name }}`, `{{ amount }}`, `{{ date }}`
|
||||||
|
|
||||||
Send an email immediately:
|
### Built-in Filters (LiquidJS only)
|
||||||
|
- `formatDate` - Format dates: `{{ createdAt | formatDate: "short" }}`
|
||||||
|
- `formatCurrency` - Format currency: `{{ amount | formatCurrency: "USD" }}`
|
||||||
|
- `capitalize` - Capitalize first letter: `{{ name | capitalize }}`
|
||||||
|
|
||||||
|
## Available Helper Functions
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
const emailId = await sendEmail(payload, {
|
import {
|
||||||
templateSlug: 'order-confirmation', // optional - use template slug
|
renderTemplate, // Render email templates with variables
|
||||||
to: ['customer@example.com'], // string or array of emails
|
processEmails, // Process pending emails manually
|
||||||
cc: ['manager@example.com'], // optional - array of emails
|
retryFailedEmails, // Retry failed emails
|
||||||
bcc: ['archive@example.com'], // optional - array of emails
|
getMailing // Get mailing service instance
|
||||||
from: 'orders@yoursite.com', // optional, uses default
|
} from '@xtr-dev/payload-mailing'
|
||||||
replyTo: 'support@yoursite.com', // optional
|
|
||||||
subject: 'Custom subject', // required if no template
|
// Render a template
|
||||||
html: '<h1>Custom HTML</h1>', // required if no template
|
const { html, text, subject } = await renderTemplate(payload, 'welcome', {
|
||||||
text: 'Custom text version', // optional
|
name: 'John',
|
||||||
variables: { // template variables
|
activationUrl: 'https://example.com/activate'
|
||||||
orderNumber: '12345',
|
|
||||||
customerName: 'John Doe'
|
|
||||||
},
|
|
||||||
priority: 1 // optional, 1-10 (1 = highest)
|
|
||||||
})
|
})
|
||||||
```
|
|
||||||
|
|
||||||
### scheduleEmail(payload, options)
|
// Process emails manually
|
||||||
|
|
||||||
Schedule an email for later delivery:
|
|
||||||
|
|
||||||
```typescript
|
|
||||||
const emailId = await scheduleEmail(payload, {
|
|
||||||
templateSlug: 'newsletter',
|
|
||||||
to: ['user1@example.com', 'user2@example.com'],
|
|
||||||
scheduledAt: new Date('2024-01-15T10:00:00Z'),
|
|
||||||
variables: {
|
|
||||||
month: 'January',
|
|
||||||
highlights: ['Feature A', 'Feature B']
|
|
||||||
}
|
|
||||||
})
|
|
||||||
```
|
|
||||||
|
|
||||||
### processEmails(payload)
|
|
||||||
|
|
||||||
Manually process pending emails:
|
|
||||||
|
|
||||||
```typescript
|
|
||||||
import { processEmails } from '@xtr-dev/payload-mailing'
|
|
||||||
await processEmails(payload)
|
await processEmails(payload)
|
||||||
```
|
|
||||||
|
|
||||||
### retryFailedEmails(payload)
|
// Retry failed emails
|
||||||
|
|
||||||
Manually retry failed emails:
|
|
||||||
|
|
||||||
```typescript
|
|
||||||
import { retryFailedEmails } from '@xtr-dev/payload-mailing'
|
|
||||||
await retryFailedEmails(payload)
|
await retryFailedEmails(payload)
|
||||||
```
|
```
|
||||||
|
|
||||||
@@ -716,35 +767,85 @@ import {
|
|||||||
} from '@xtr-dev/payload-mailing'
|
} from '@xtr-dev/payload-mailing'
|
||||||
```
|
```
|
||||||
|
|
||||||
|
## Migration Guide (v0.0.x → v0.1.0)
|
||||||
|
|
||||||
|
**🚨 BREAKING CHANGES**: The API has been simplified to use Payload collections directly.
|
||||||
|
|
||||||
|
### Before (v0.0.x)
|
||||||
|
```typescript
|
||||||
|
import { sendEmail, scheduleEmail } from '@xtr-dev/payload-mailing'
|
||||||
|
|
||||||
|
// Old way
|
||||||
|
const emailId = await sendEmail(payload, {
|
||||||
|
templateSlug: 'welcome',
|
||||||
|
to: 'user@example.com',
|
||||||
|
variables: { name: 'John' }
|
||||||
|
})
|
||||||
|
|
||||||
|
const scheduledId = await scheduleEmail(payload, {
|
||||||
|
templateSlug: 'reminder',
|
||||||
|
to: 'user@example.com',
|
||||||
|
scheduledAt: new Date('2024-01-15T10:00:00Z'),
|
||||||
|
variables: { eventName: 'Launch' }
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
### After (v0.1.0+)
|
||||||
|
```typescript
|
||||||
|
import { renderTemplate } from '@xtr-dev/payload-mailing'
|
||||||
|
|
||||||
|
// New way - render template first
|
||||||
|
const { html, text, subject } = await renderTemplate(payload, 'welcome', {
|
||||||
|
name: 'John'
|
||||||
|
})
|
||||||
|
|
||||||
|
// Then create email using Payload collections (full type safety!)
|
||||||
|
const email = await payload.create({
|
||||||
|
collection: 'emails',
|
||||||
|
data: {
|
||||||
|
to: ['user@example.com'],
|
||||||
|
subject,
|
||||||
|
html,
|
||||||
|
text,
|
||||||
|
// For scheduling
|
||||||
|
scheduledAt: new Date('2024-01-15T10:00:00Z'),
|
||||||
|
// Add any custom fields from your collection
|
||||||
|
customField: 'value',
|
||||||
|
}
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
### Benefits of Migration
|
||||||
|
- ✅ **Full TypeScript support** with your generated Payload types
|
||||||
|
- ✅ **Use any custom fields** you add to your email collection
|
||||||
|
- ✅ **Leverage Payload's features**: validation, hooks, access control
|
||||||
|
- ✅ **One consistent API** - just use `payload.create()`
|
||||||
|
- ✅ **No wrapper methods** - direct access to Payload's power
|
||||||
|
|
||||||
## Recent Changes
|
## Recent Changes
|
||||||
|
|
||||||
### v0.0.x (Latest)
|
### v0.1.0 (Latest - Breaking Changes)
|
||||||
|
|
||||||
**🔄 Breaking Changes:**
|
**🚀 Major API Simplification:**
|
||||||
- Removed email layouts system in favor of `emailWrapper` hook for better flexibility
|
- **REMOVED**: `sendEmail()` and `scheduleEmail()` wrapper methods
|
||||||
- Email fields (`to`, `cc`, `bcc`) now use `hasMany: true` for proper array handling
|
- **REMOVED**: `SendEmailOptions` custom types
|
||||||
- Templates now use slug-based lookup instead of ID-based for developer-friendly API
|
- **ADDED**: Direct Payload collection usage with full type safety
|
||||||
- Email collection renamed from "outbox" to "emails"
|
- **ADDED**: `renderTemplate()` helper for template rendering
|
||||||
- Unified job processing: single `process-email-queue` job handles both pending and failed emails
|
- **ADDED**: Support for LiquidJS, Mustache, and custom template engines
|
||||||
|
- **IMPROVED**: Webpack compatibility with proper dynamic imports
|
||||||
|
|
||||||
**✨ New Features:**
|
**Template Engine Enhancements:**
|
||||||
- Rich text editor with automatic HTML/text conversion
|
- **NEW**: LiquidJS support (default) with modern syntax and logic
|
||||||
- Template slugs for easier template reference
|
- **NEW**: Mustache support for logic-less templates
|
||||||
- `emailWrapper` hook for consistent email layouts
|
- **NEW**: Custom template renderer hook for maximum flexibility
|
||||||
- Custom rich text editor configuration support
|
- **NEW**: Simple variable replacement as fallback
|
||||||
- Initialization hooks (`onReady`, `initOrder`) for better plugin lifecycle control
|
- **FIXED**: All webpack compatibility issues resolved
|
||||||
- Improved Handlebars variable interpolation with defensive programming
|
|
||||||
|
|
||||||
**🐛 Bug Fixes:**
|
**Developer Experience:**
|
||||||
- Fixed text version uppercase conversion in headings
|
- **IMPROVED**: Full TypeScript inference using generated Payload types
|
||||||
- Fixed Handlebars interpolation issues in text version
|
- **IMPROVED**: Comprehensive migration guide and documentation
|
||||||
- Improved plugin initialization order to prevent timing issues
|
- **IMPROVED**: Better error handling and async patterns
|
||||||
|
- **SIMPLIFIED**: Cleaner codebase with fewer abstractions
|
||||||
**💡 Improvements:**
|
|
||||||
- Better admin UI with proper array input controls
|
|
||||||
- More robust error handling and logging
|
|
||||||
- Enhanced TypeScript definitions
|
|
||||||
- Simplified template creation workflow
|
|
||||||
|
|
||||||
## License
|
## License
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@xtr-dev/payload-mailing",
|
"name": "@xtr-dev/payload-mailing",
|
||||||
"version": "0.1.0",
|
"version": "0.1.1",
|
||||||
"description": "Template-based email system with scheduling and job processing for PayloadCMS",
|
"description": "Template-based email system with scheduling and job processing for PayloadCMS",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"main": "dist/index.js",
|
"main": "dist/index.js",
|
||||||
|
|||||||
Reference in New Issue
Block a user