Bas van den Aakster f5cf5dfea9 Docs: Split README into core plugin docs and separate WEBPUSH guide
Move web push notification documentation to dedicated WEBPUSH.md file.
README now focuses on core notifications collection functionality with
references to WEBPUSH.md for push notification features.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-27 21:25:30 +01:00
2025-09-30 20:16:49 +02:00
2025-09-30 20:16:49 +02:00

@xtr-dev/payload-notifications

npm version

A PayloadCMS plugin that adds a configurable notifications collection for sending messages with titles, content, and attachable relationship items.

⚠️ 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.

Features

  • 📧 Notifications collection with title and message fields
  • 🔗 Configurable relationship attachments to any collection
  • 📱 Built-in read/unread status tracking
  • 🎯 Recipient targeting support
  • ⚙️ Flexible plugin configuration
  • 📅 Automatic timestamp tracking
  • 🔔 Optional web push notifications support (see WEBPUSH.md)

Installation

npm install @xtr-dev/payload-notifications

Basic Usage

Add the plugin to your Payload config:

import { buildConfig } from 'payload/config'
import { notificationsPlugin } from '@xtr-dev/payload-notifications'

export default buildConfig({
  plugins: [
    notificationsPlugin({
      // Basic configuration
    })
  ],
  // ... rest of your config
})

Configuration

Basic Configuration

notificationsPlugin({
  collections: {
    slug: 'notifications', // Default collection slug
  }
})

Advanced Configuration with Relationships

notificationsPlugin({
  collections: {
    slug: 'notifications',
    labels: {
      singular: 'Notification',
      plural: 'Notifications'
    }
  },
  relationships: [
    {
      name: 'order',
      relationTo: 'orders',
      label: 'Related Order'
    },
    {
      name: 'user',
      relationTo: 'users',
      label: 'Related User'
    },
    {
      name: 'product',
      relationTo: 'products',
      label: 'Related Product'
    }
  ],
  access: {
    // Custom access control functions
    read: ({ req }) => Boolean(req.user),
    create: ({ req }) => Boolean(req.user?.role === 'admin'),
    update: ({ req }) => Boolean(req.user?.role === 'admin'),
    delete: ({ req }) => Boolean(req.user?.role === 'admin'),
  },
  fields: [
    // Add custom fields to the notifications collection
  ]
})

For web push notifications setup, see WEBPUSH.md

Collection Schema

The plugin creates a notifications collection with the following fields:

  • title (required text): The notification title
  • message (required richText): The notification content
  • recipient (optional relationship): User who should receive the notification (optional if using custom recipient fields)
  • isRead (checkbox): Read status tracking
  • readAt (date): When the notification was read
  • attachments (group): Configurable relationship fields
  • createdAt/updatedAt: Automatic timestamps

API Usage

Creating Notifications

const notification = await payload.create({
  collection: 'notifications',
  data: {
    title: 'Order Shipped',
    message: [
      {
        children: [
          { text: 'Your order has been shipped and is on its way!' }
        ]
      }
    ],
    recipient: userId,
    attachments: {
      order: orderId,
      product: productId
    }
  }
})

Querying Notifications

// Get unread notifications for a user
const unreadNotifications = await payload.find({
  collection: 'notifications',
  where: {
    and: [
      { recipient: { equals: userId } },
      { isRead: { equals: false } }
    ]
  },
  sort: '-createdAt'
})

// Mark notification as read
await payload.update({
  collection: 'notifications',
  id: notificationId,
  data: {
    isRead: true,
    readAt: new Date()
  }
})

Plugin Options

Option Type Default Description
collections.slug string 'notifications' Collection slug
collections.labels object { singular: 'Notification', plural: 'Notifications' } Collection labels
relationships array [] Configurable relationship fields
access object Default access Custom access control functions
fields array [] Additional custom fields

Relationship Configuration

Each relationship in the relationships array supports:

{
  name: string;        // Field name in attachments group
  relationTo: string;  // Target collection slug
  label?: string;      // Admin UI label
  required?: boolean;  // Whether field is required
  hasMany?: boolean;   // Allow multiple selections
}

Examples

E-commerce Notifications

notificationsPlugin({
  relationships: [
    { name: 'order', relationTo: 'orders', label: 'Order' },
    { name: 'product', relationTo: 'products', label: 'Product', hasMany: true },
    { name: 'customer', relationTo: 'customers', label: 'Customer' }
  ]
})

Content Management Notifications

notificationsPlugin({
  relationships: [
    { name: 'post', relationTo: 'posts', label: 'Blog Post' },
    { name: 'page', relationTo: 'pages', label: 'Page' },
    { name: 'media', relationTo: 'media', label: 'Media', hasMany: true }
  ]
})

Web Push Notifications

The plugin includes optional web push notifications support for PWA and mobile browser users. For complete setup instructions, configuration options, and usage examples, see WEBPUSH.md.

TypeScript Support

The plugin includes full TypeScript support. Types are automatically generated based on your configuration.

License

MIT

Description
No description provided
Readme 224 KiB
Languages
TypeScript 90.9%
JavaScript 9.1%