Payload CMS Release: 3.2.2

Tag Name: v3.2.2

Release Date: 11/29/2024

Payload CMS LogoPayload CMS

Payload CMS is a modern, self-hosted headless content management system built with TypeScript, Node.js, and MongoDB. It's designed specifically for developers who want full control over their content management system while maintaining a powerful admin interface for content editors.

TL;DR

Payload CMS v3.2.2 brings significant improvements to the rich text editor, UI reactivity, and fixes several critical bugs. The release includes fully-typed blocks in the JSX serializer for better type safety, keyboard navigation improvements in Firefox, and fixes for form state management. It also addresses UI issues with search parameters, HMR reactivity, and production build errors. This update enhances developer experience with better TypeScript support and improves overall stability.

Highlight of the Release

    • Fully-typed blocks in JSX serializer for better type safety
    • Fixed keyboard navigation in rich text editor for Firefox users
    • Improved UI reactivity to HMR changes without page refreshes
    • Fixed form state management after document saves
    • Better error handling with Sentry plugin

Migration Guide

No migration is required for this release. This is a patch release that includes bug fixes and minor improvements that are backward compatible with v3.2.1.

Upgrade Recommendations

This is a recommended upgrade for all Payload CMS users, especially those who:

  1. Use the rich text editor with Firefox
  2. Work with custom translation keys
  3. Use multi-tenant applications with Postgres
  4. Experience issues with form state after document saves
  5. Use the Sentry plugin for error tracking

The upgrade process should be straightforward with no breaking changes:

npm install [email protected]
# or
yarn add [email protected]
# or
pnpm add [email protected]

Bug Fixes

Rich Text Editor Improvements

  • Fixed various JSX converter issues in the Lexical rich text editor
  • Added keyboard navigation support to exit the rich text editor in Firefox, solving an accessibility issue where users could get trapped in the editor
  • Ensured the IndentFeature can be properly disabled when removed from lexical editor features

UI Fixes

  • Fixed CSS not defined error in production builds
  • Ensured search parameters are retained when navigating back from documents
  • Modified Form submit button to only use onClick handler when needed, fixing issues with password manager extensions
  • Made UI properly reactive to Hot Module Replacement (HMR) changes without requiring page refreshes

Form and State Management

  • Fixed incorrect formState after document saves by properly resetting from the server
  • Added generic to LabelFunction to prevent type errors when using custom translation keys
  • Stopped sending admin dependencies to client, preventing potential server-only modules from being sent to the client

Plugin Improvements

  • Enhanced Sentry plugin to capture non-APIError errors

New Features

Fully-typed blocks in JSX serializer

The rich text editor now provides full type-safety when using the official JSX converter with blocks. This enhancement significantly improves the developer experience by catching type errors at compile time rather than runtime.

Multi-tenant compatibility with Postgres

Added compatibility for multi-tenant applications with Postgres databases and custom IDs. This includes a useful extractID utility function that helps manage IDs across different collection types.

Security Updates

No specific security fixes were included in this release.

Performance Improvements

UI Reactivity

The UI is now more reactive to Hot Module Replacement (HMR) changes, eliminating the need to refresh the page after code changes. This significantly speeds up development workflows.

Client-side Optimization

Removed unnecessary sending of unrendered PayloadComponents to the client, which were remnants of old betas. This optimization prevents server-only modules from being sent to the client, avoiding potential webpack errors and reducing bundle size.

Impact Summary

Payload CMS v3.2.2 delivers important quality-of-life improvements for both developers and content editors. The release focuses on enhancing type safety with fully-typed blocks in the JSX serializer, fixing accessibility issues in the rich text editor, and improving UI reactivity.

For developers, the addition of TypeScript generics for custom translation keys and better multi-tenant support with Postgres databases streamlines development workflows. Content editors will appreciate the improved keyboard navigation in Firefox and the retention of search parameters when navigating through the admin interface.

The fixes to form state management and UI reactivity create a more stable and predictable editing experience, while the enhancements to the Sentry plugin provide better error tracking capabilities. Overall, this release represents a solid improvement to the stability and usability of Payload CMS without introducing breaking changes.

Full Release Notes

v3.2.2 (2024-11-29)

🚀 Features

  • richtext-lexical: fully-typed blocks in JSX serializer (#9554) (519bb79)

🐛 Bug Fixes

  • add generic to LabelFunction to prevent type error for custom translation keys (#9335) (27eeac2)
  • do not send admin dependencies to client (#9583) (3da9be0)
  • incorrect formState after doc save (#9573) (4b302f2)
  • plugin-sentry: capture non APIError errors to sentry (#9595) (61a51ca)
  • richtext-lexical: allow exiting the RTE with the keyboard in Firefox (#8654) (3c35d81)
  • richtext-lexical: various JSX converter issues (#9570) (17c7945)
  • ui: ensure UI is reactive to HMR changes, without having to refresh the page (#9602) (c4327f2)
  • ui: css is not defined error in production build (#9603) (36a6a19)
  • ui: retains search params when navigating back (#9576) (3961223)
  • ui: ensure Form submit button only uses onClick handler when needed, as that was causing issues with password manager extensions (#9572) (ca07c9f)

🤝 Contributors

Statistics:

File Changed132
Line Additions3,378
Line Deletions2,946
Line Changes6,324
Total Commits19

User Affected:

  • Benefit from fully-typed blocks in JSX serializer for better type safety
  • No longer need to refresh the page after HMR changes
  • Can use custom translation keys without TypeScript errors
  • Multi-tenant applications now work correctly with Postgres

Contributors:

denolfeAlessioGrr1tsuujacobsfletchrilromJarrodMFleschwiessonakhrarovsaidapreamarwinhormiz