Home

>

Tools

>

Strapi

>

Releases

>

4.17.0

Strapi Release: 4.17.0

Tag Name: v4.17.0

Release Date: 1/10/2024

Strapi LogoStrapi

Open-source headless CMS built with Node.js. Provides developers with complete freedom in choosing their favorite tools and frameworks for frontend development.

TL;DR

Strapi v4.17.0 is a significant update focused on TypeScript migration across the codebase, with major improvements to the Blocks editor and Content Releases features. This release enhances developer experience through better type safety, adds new features like block movement and markdown snippets, and fixes several UI/UX issues in the Content Releases interface. Performance improvements include memoization of GenericInput for better rendering efficiency.

Highlight of the Release

    • Extensive TypeScript migration across the codebase for improved developer experience and type safety
    • Enhanced Blocks editor with drag and drop functionality for moving blocks
    • New markdown snippets support for faster content creation (e.g., # for headings)
    • Ability to expand the Blocks editor for a better editing experience
    • Improved Content Releases UI with better error handling and navigation
    • New experimental plugin commands: plugin:init and plugin:verify
    • Performance improvements with memoized GenericInput component

Migration Guide

No breaking changes were mentioned that would require a specific migration guide. The TypeScript migration is mostly internal and shouldn't affect existing applications.

If you're using custom plugins or extensions that interact deeply with Strapi's internals, you might need to update your typings to match the new TypeScript definitions. However, this should be a gradual process and won't break existing JavaScript code.

For GraphQL users, note that the graphql-upload library has been reverted to a non-breaking change version, which might affect you if you were relying on the newer version's features.

Upgrade Recommendations

This release is primarily focused on TypeScript migration and improvements to the Blocks editor and Content Releases features. It's recommended for all users to upgrade, especially if you:

  1. Use the Blocks editor extensively for content creation
  2. Rely on the Content Releases feature
  3. Are developing custom plugins or extensions and would benefit from TypeScript support

The upgrade should be straightforward as there are no breaking changes mentioned. Follow the standard Strapi update process:

npm upgrade [email protected] --save
# or
yarn upgrade [email protected] --exact

After upgrading, restart your Strapi server and verify that all functionality works as expected. If you encounter any issues, check the GitHub repository for potential workarounds or fixes.

Bug Fixes

Content Releases Fixes

  • Fixed duplicate padding in the Heading of the Details page.
  • Removed non-functional Refresh button from the details page.
  • Added proper redirection to the list page when errors occur in the Details page.
  • Added a bottom border below tabs for better visual separation.
  • Added a message and button to create a release when there are no releases in the Add to releases modal.
  • Properly disabled edit and delete buttons in the Details page when user doesn't have permissions.
  • Added a button to navigate to Content Manager when the Details page is empty.

Blocks Editor Fixes

  • Fixed issue with link popup reopening on save/publish.
  • Fixed handling of Enter key on image blocks.
  • Updated placeholder text in blocks link popover for better clarity.

Other Fixes

  • Fixed search in relations to use contains instead of startsWith for better search results.
  • Fixed display of nested components in edit view.
  • Fixed circular dependency in permissions.
  • Fixed GraphQL compatibility by reverting graphql-upload library to non-breaking change version.
  • Fixed type inference issues with entity-service's parameters for generic mapped types.
  • Fixed attributes filtering when no registries are extended.

New Features

Blocks Editor Enhancements

  • Block Movement: Added drag and drop functionality to move blocks up and down in the editor. Users can also use keyboard shortcuts (Cmd/Ctrl + Shift + Up/Down) for accessibility.
  • Markdown Snippets: Added support for markdown-style shortcuts to quickly create different block types:
    • Type # for heading level 1
    • Type ## for heading level 2
    • Type ### for heading level 3
    • Type > for quote blocks
    • Type ``` for code blocks
    • Type + for list items
    • Type ![ for image blocks
  • Expandable Editor: Added ability to expand the Blocks editor for a better editing experience with more screen space.
  • Improved Code Block Handling: Made it easier to exit code blocks with double Enter key press.
  • Better Image Block Interaction: Improved handling of Enter key on image blocks.

Experimental Plugin Commands

  • plugin:init: Added new experimental command to initialize plugins.
  • plugin:verify: Added new experimental command to verify plugins.

Content Releases Improvements

  • Group Release Actions: Added functionality to group release actions by property.
  • Delete Release Action: Added ability to delete a release from the release page.

Security Updates

No specific security fixes were mentioned in this release.

Performance Improvements

Frontend Performance

  • Memoized GenericInput: The GenericInput component has been memoized to prevent unnecessary re-renders, significantly improving performance in forms with many fields.

TypeScript Migration Benefits

  • The extensive TypeScript migration across the codebase brings implicit performance benefits through better code organization and early error detection.
  • Type safety helps prevent runtime errors that could impact performance.

Build Process Improvements

  • Now using NX to build and clean, which provides better dependency management and build caching.
  • Improved handling of TypeScript configuration files for better build performance.

Impact Summary

Strapi v4.17.0 represents a significant milestone in the project's evolution with its extensive TypeScript migration. This change enhances developer experience through improved type safety, better code completion, and earlier error detection during development.

The Blocks editor receives substantial improvements with new features like block movement via drag and drop, markdown snippets for faster content creation, and an expandable editor interface. These changes make content creation more efficient and intuitive for content editors.

Content Releases functionality has been refined with multiple UI/UX improvements, better error handling, and clearer permission controls. This makes the feature more robust and user-friendly for administrators managing content workflows.

Performance improvements include memoization of the GenericInput component, which should result in better rendering performance in forms with many fields.

For developers, the addition of experimental plugin commands (plugin:init and plugin:verify) provides new tools for plugin development and validation.

Overall, this release focuses on developer experience, content editing improvements, and UI refinements rather than introducing major new features or breaking changes. It's a solid update that improves the quality and usability of existing functionality.

Full Release Notes

🔥 Bug fix

  • [core:content-releases] fix(content-releases): fix padding bottom duplicated in the Heading of the Details page (#19066) @simotae14
  • [core:content-releases] fix(content-releases): remove Refresh button from the details page (#19067) @simotae14
  • [core:content-releases] fix(content-releases): redirect to the list page when we have errors in the Details page (#19078) @simotae14
  • [core:content-releases] fix(content-releases): add a bottom border below tabs (#19090) @simotae14
  • [core:content-releases] fix(content-releases): empty Details page add a button to the CM (#19095) @simotae14
  • [core:content-releases] fix(content-releases): CM add Release add content when there are no releases (#19096) @simotae14
  • [core:content-releases] fix(content-releases):disable edit and delete buttons in the Details page when you don't have permissions (#19099) @simotae14
  • [core:helper-plugin] fix(helper-plugin): memoize GenericInput for performance issues (#19177) @joshuaellis
  • [core:strapi] Filter out undefined controllers in startup telemetry checks (#19144) @Convly
  • [plugin:graphql] fix: revert graphql-upload library to non breaking change version (#19182) @Bassel17
  • [typescript] [Types] Fix entity-service's parameters inference for generic mapped types with deep literal intersections (#19093) @Convly

🚀 New feature

  • [core:content-releases] feat(content-releases): delete release action on release page (#19089) @markkaylor
  • [core:content-releases] feat(content-releases): group release actions by property (#19097) @markkaylor

⚙️ Chore

📚 Update and Migration Guides

  • General update guide can be found here
  • Migration guides can be found here 📚

What's Changed

Due to typescript migrations not every PR had a milestone, this it the complete list of PRs from 4.16.2 -> 4.17.0

New Contributors

Full Changelog: v4.16.2...v4.17.0

Statistics:

File Changed300
Line Additions9,531
Line Deletions7,577
Line Changes17,108
Total Commits112

User Affected:

  • Benefits from extensive TypeScript migration across the codebase for better type safety and developer experience
  • Can use new experimental plugin commands: `plugin:init` and `plugin:verify`
  • Gains improved type inference for entity-service parameters
  • Better GraphQL compatibility with reverted graphql-upload library

Contributors:

alexandrebodinremidejjhoward1994joshuaellisMarc-Roiginnerdvationsbelgattitudedependabot[bot]HichamELBSImadhurisandbhorArshiash80Convlysimotae14FeranchzBassel17markkaylor