Strapi Release: 4.3.0-beta.2

TL;DR

Strapi v4.3.0-beta.2 introduces significant enhancements with TypeScript support and Media Library Folders improvements. TypeScript support includes schema typings and automatic schema types generation, providing better developer experience and type safety. The Media Library Folders feature has received various bug fixes and UI improvements, making asset organization more intuitive. This beta release represents a major step forward in Strapi's developer experience and content management capabilities.

Highlight of the Release

• TypeScript support with schema typings and automatic schema types generation
• Media Library Folders improvements with bug fixes and UI enhancements
• React-refresh integration for increased developer productivity
• Enhanced search capabilities for nested components in GraphQL
• Improved database foreign keys references optimization for MySQL/MariaDB and PostgreSQL
• Multiple UI and accessibility improvements in the admin panel

Migration Guide

Migrating to v4.3.0-beta.2

TypeScript Support

If you want to use TypeScript in your Strapi project:

1. Install TypeScript and required dependencies:

   npm install --save-dev typescript @types/node
   

2. Create a tsconfig.json file in your project root:

   {
     "compilerOptions": {
       "target": "es2018",
       "module": "commonjs",
       "esModuleInterop": true,
       "sourceMap": true,
       "outDir": "dist",
       "rootDir": "src",
       "strict": true
     },
     "include": ["src/**/*"],
     "exclude": ["node_modules", "build", "dist"]
   }
   

3. To generate schema types, run:

   strapi ts:generate-types
   

Media Library Folders

No specific migration steps are required for the Media Library Folders improvements. The enhancements will be available automatically after updating to v4.3.0-beta.2.

Database Optimizations

The database optimizations for MySQL/MariaDB and PostgreSQL are applied automatically. No manual steps are required.

Note on Beta Features

As this is a beta release, we recommend:

• Testing thoroughly in a non-production environment before deploying to production
• Backing up your data before upgrading
• Reporting any issues you encounter to the Strapi GitHub repository

Upgrade Recommendations

Who should upgrade?

• Developers who want to try TypeScript support in their Strapi projects
• Users who need better organization capabilities in the Media Library
• Teams looking for performance improvements in database operations
• Anyone interested in testing the latest features and providing feedback

Upgrade Priority: Medium

This is a beta release with significant new features, but as it's not a stable release, upgrading should be considered carefully:

• Development environments: Recommended for testing the new features
• Staging environments: Consider upgrading to test compatibility with your specific setup
• Production environments: Not recommended until the stable release

How to upgrade:

1. Update your package.json to point to the new version:

   "dependencies": {
     "@strapi/strapi": "4.3.0-beta.2",
     "@strapi/plugin-users-permissions": "4.3.0-beta.2",
     "@strapi/plugin-i18n": "4.3.0-beta.2"
   }
   

2. Run the installation:

   npm install
   # or
   yarn install
   

3. Start your Strapi application:

   npm run develop
   # or
   yarn develop
   

4. Test thoroughly to ensure all functionality works as expected

Remember to back up your data before upgrading, especially if you're considering testing in a production-like environment.

Bug Fixes

Media Library

• Fixed collapsing/expanding options with proper order in SelectTree component
• Fixed folder card border and title focus outline
• Fixed active style of React Select option
• Fixed search functionality for nested elements
• Fixed bulk move select tree functionality
• Removed error notifications and fixed translation issues
• Fixed drag & drop events in MediaLibraryInput
• Fixed drag & drop events in FromComputerForm
• Fixed image dimensions saving for SVG and GIF images

Content Manager

• Fixed relations display when a user does not have read permissions
• Fixed locale picker to always set page to 1 after updating a locale
• Fixed unique fields with empty string value

Content Type Builder

• Fixed search button tooltip
• Fixed attribute option alignment to the left

Authentication

• Fixed AuthenticatedApp tests
• Fixed default permissions in users-permissions plugin

Other

• Fixed circular dependencies breaking types resolution
• Fixed using theme in getSelectStyles
• Fixed form notifications
• Updated system font-family in WYSIWYG editor

New Features

TypeScript Support

• Added schema typings for better type safety and developer experience
• Implemented automatic schema types generation
• Extended the NodeJS global interface and added the Strapi global variable to it
• Added TypeScript compiler API to generate definitions

Media Library Folders Enhancements

• Improved folder selection tree with proper collapsing/expanding options order
• Enhanced search capabilities to find nested elements across all folder levels
• Added bulk move functionality with improved UI
• Implemented tracking events for better analytics

Developer Experience Improvements

• Integrated react-refresh to increase productivity during development
• Added ability to search test files in watch mode for better testing workflow
• Enabled filtering on nested components in GraphQL queries

Database Optimizations

• Optimized database foreign keys references for MySQL/MariaDB
• Optimized database foreign keys references for PostgreSQL

Translations

• Added Hindi translation
• Added Sanskrit translation
• Updated and added missing Polish translations
• Added several items in Chinese (Simplified) translation

Security Updates

• Bumped several dependencies to address security vulnerabilities:

  • Bumped shell-quote from 1.7.2 to 1.7.3
  • Bumped got from 11.8.3 to 11.8.5
  • Bumped parse-url from 6.0.0 to 6.0.2
  • Bumped moment from 2.29.2 to 2.29.4

• Fixed permissions handling in the users-permissions plugin

• Improved security in relations display when a user does not have read permissions

Performance Improvements

Development Workflow

• Integrated react-refresh to increase productivity by preserving component state during hot reloads
• Added ability to search test files in watch mode for faster test execution
• Improved webpack resolver configuration for better build performance

Database Optimizations

• Optimized database foreign keys references for MySQL/MariaDB databases
• Optimized database foreign keys references for PostgreSQL databases
• Improved performance when merging schemas definitions with new lines

Media Library

• Enhanced search capabilities for nested elements, providing faster access to assets
• Improved folder navigation and selection with optimized UI components

GraphQL

• Enabled filtering on nested components for more efficient data retrieval

Impact Summary

Strapi v4.3.0-beta.2 delivers significant improvements focused on developer experience and content management capabilities. The introduction of TypeScript support represents a major step forward for developers, offering better type safety, improved code quality, and enhanced IDE integration. This feature will particularly benefit larger teams and complex projects where type safety is crucial.

The Media Library Folders feature has received numerous bug fixes and UI enhancements, making asset organization more intuitive and efficient. Content managers will appreciate the improved folder navigation, search capabilities across nested folders, and bulk move functionality.

Performance improvements are notable with the integration of react-refresh for faster development workflows and database optimizations for MySQL/MariaDB and PostgreSQL. These changes will result in better development experience and potentially faster database operations.

The release also includes several UI and accessibility improvements throughout the admin panel, making the platform more user-friendly and accessible. Multiple bug fixes address issues in various components, enhancing the overall stability of the platform.

As a beta release, this version is ideal for testing in development environments to provide feedback before the stable release. The improvements in TypeScript support and Media Library organization make this a compelling update for teams looking to enhance their development workflow and content management capabilities.

Full Release Notes