Merge branch 'develop' into v5/main

.github/actions/check-pr-status/package.json

@@ -1,6 +1,6 @@
 {
   "name": "check-pr-status",
-  "version": "4.15.4",
+  "version": "4.15.5",
   "private": true,
   "license": "MIT",
   "main": "dist/index.js",

examples/getstarted/jsconfig.json

@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "jsx": "react",
     "moduleResolution": "nodenext",
     "target": "ES2021",
     "checkJs": true,

examples/getstarted/package.json

@@ -1,6 +1,6 @@
 {
   "name": "getstarted",
-  "version": "4.15.4",
+  "version": "4.15.5",
   "private": true,
   "description": "A Strapi application.",
   "license": "SEE LICENSE IN LICENSE",
@@ -14,16 +14,16 @@
   },
   "dependencies": {
     "@strapi/icons": "1.11.0",
-    "@strapi/plugin-color-picker": "4.15.4",
-    "@strapi/plugin-documentation": "4.15.4",
-    "@strapi/plugin-graphql": "4.15.4",
-    "@strapi/plugin-i18n": "4.15.4",
-    "@strapi/plugin-sentry": "4.15.4",
-    "@strapi/plugin-users-permissions": "4.15.4",
-    "@strapi/provider-email-mailgun": "4.15.4",
-    "@strapi/provider-upload-aws-s3": "4.15.4",
-    "@strapi/provider-upload-cloudinary": "4.15.4",
-    "@strapi/strapi": "4.15.4",
+    "@strapi/plugin-color-picker": "4.15.5",
+    "@strapi/plugin-documentation": "4.15.5",
+    "@strapi/plugin-graphql": "4.15.5",
+    "@strapi/plugin-i18n": "4.15.5",
+    "@strapi/plugin-sentry": "4.15.5",
+    "@strapi/plugin-users-permissions": "4.15.5",
+    "@strapi/provider-email-mailgun": "4.15.5",
+    "@strapi/provider-upload-aws-s3": "4.15.5",
+    "@strapi/provider-upload-cloudinary": "4.15.5",
+    "@strapi/strapi": "4.15.5",
     "better-sqlite3": "9.0.0",
     "lodash": "4.17.21",
     "mysql2": "3.6.2",

examples/getstarted/src/admin/app.js

@@ -1,8 +1,18 @@
+import React from 'react';
+import { Button } from '@strapi/design-system';
+
 const config = {
   locales: ['it', 'es', 'en'],
 };
-const bootstrap = () => {
+const bootstrap = (app) => {
   console.log('I AM  BOOTSTRAPPED');
+
+  app.injectContentManagerComponent('editView', 'right-links', {
+    name: 'PreviewButton',
+    Component: () => (
+      <Button onClick={() => window.alert('Not here, The preview is.')}>Preview</Button>
+    ),
+  });
 };
 
 export default {

examples/kitchensink-ts/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchensink-ts",
-  "version": "4.15.4",
+  "version": "4.15.5",
   "private": true,
   "description": "A Strapi application",
   "license": "MIT",
@@ -14,9 +14,9 @@
     "strapi": "strapi"
   },
   "dependencies": {
-    "@strapi/plugin-i18n": "4.15.4",
-    "@strapi/plugin-users-permissions": "4.15.4",
-    "@strapi/strapi": "4.15.4",
+    "@strapi/plugin-i18n": "4.15.5",
+    "@strapi/plugin-users-permissions": "4.15.5",
+    "@strapi/strapi": "4.15.5",
     "better-sqlite3": "9.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

examples/kitchensink/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchensink",
-  "version": "4.15.4",
+  "version": "4.15.5",
   "private": true,
   "description": "A Strapi application.",
   "license": "SEE LICENSE IN LICENSE",
@@ -13,10 +13,10 @@
     "strapi": "strapi"
   },
   "dependencies": {
-    "@strapi/provider-email-mailgun": "4.15.4",
-    "@strapi/provider-upload-aws-s3": "4.15.4",
-    "@strapi/provider-upload-cloudinary": "4.15.4",
-    "@strapi/strapi": "4.15.4",
+    "@strapi/provider-email-mailgun": "4.15.5",
+    "@strapi/provider-upload-aws-s3": "4.15.5",
+    "@strapi/provider-upload-cloudinary": "4.15.5",
+    "@strapi/strapi": "4.15.5",
     "better-sqlite3": "9.0.0",
     "lodash": "4.17.21",
     "mysql2": "3.6.2",

lerna.json

@@ -1,5 +1,5 @@
 {
-  "version": "4.15.4",
+  "version": "4.15.5",
   "packages": ["packages/*", "examples/*"],
   "npmClient": "yarn",
   "useWorkspaces": true,

packages/admin-test-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@strapi/admin-test-utils",
-  "version": "4.15.4",
+  "version": "4.15.5",
   "private": true,
   "description": "Test utilities for the Strapi administration panel",
   "license": "MIT",
@@ -75,8 +75,8 @@
     "@reduxjs/toolkit": "1.9.7",
     "@strapi/pack-up": "workspace:*",
     "@testing-library/jest-dom": "5.16.5",
-    "eslint-config-custom": "4.15.4",
-    "tsconfig": "4.15.4"
+    "eslint-config-custom": "4.15.5",
+    "tsconfig": "4.15.5"
   },
   "peerDependencies": {
     "@reduxjs/toolkit": "^1.9.7",

packages/cli/create-strapi-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-strapi-app",
-  "version": "4.15.4",
+  "version": "4.15.5",
   "description": "Generate a new Strapi application.",
   "keywords": [
     "create-strapi-app",
@@ -44,14 +44,14 @@
     "watch": "pack-up watch"
   },
   "dependencies": {
-    "@strapi/generate-new": "4.15.4",
+    "@strapi/generate-new": "4.15.5",
     "commander": "8.3.0",
     "inquirer": "8.2.5"
   },
   "devDependencies": {
-    "@strapi/pack-up": "4.15.4",
-    "eslint-config-custom": "4.15.4",
-    "tsconfig": "4.15.4"
+    "@strapi/pack-up": "4.15.5",
+    "eslint-config-custom": "4.15.5",
+    "tsconfig": "4.15.5"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

packages/cli/create-strapi-starter/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-strapi-starter",
-  "version": "4.15.4",
+  "version": "4.15.5",
   "description": "Generate a new Strapi application.",
   "keywords": [
     "create-strapi-starter",
@@ -44,7 +44,7 @@
     "watch": "pack-up watch"
   },
   "dependencies": {
-    "@strapi/generate-new": "4.15.4",
+    "@strapi/generate-new": "4.15.5",
     "chalk": "4.1.2",
     "ci-info": "3.8.0",
     "commander": "8.3.0",
@@ -54,9 +54,9 @@
     "ora": "5.4.1"
   },
   "devDependencies": {
-    "@strapi/pack-up": "4.15.4",
-    "eslint-config-custom": "4.15.4",
-    "tsconfig": "4.15.4"
+    "@strapi/pack-up": "4.15.5",
+    "eslint-config-custom": "4.15.5",
+    "tsconfig": "4.15.5"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

packages/core/admin/_internal/node/build.ts

@@ -1,12 +1,10 @@
+import type { CLIContext } from '@strapi/strapi';
 import * as tsUtils from '@strapi/typescript-utils';
 import { checkRequiredDependencies } from './core/dependencies';
+import { getTimer, prettyTime } from './core/timer';
+import { createBuildContext } from './createBuildContext';
 import { writeStaticClientFiles } from './staticFiles';
 import { build as buildWebpack } from './webpack/build';
-import { createBuildContext } from './createBuildContext';
-
-import { getTimer } from './core/timer';
-
-import type { CLIContext } from '@strapi/strapi';
 
 interface BuildOptions extends CLIContext {
   /**
@@ -55,7 +53,7 @@ const build = async ({ logger, cwd, tsconfig, ignorePrompts, ...options }: Build
     tsUtils.compile(cwd, { configOptions: { ignoreDiagnostics: false } });
 
     const compilingDuration = timer.end('compilingTS');
-    compilingTsSpinner.text = `Compiling TS (${compilingDuration}ms)`;
+    compilingTsSpinner.text = `Compiling TS (${prettyTime(compilingDuration)})`;
     compilingTsSpinner.succeed();
   }
 
@@ -70,7 +68,7 @@ const build = async ({ logger, cwd, tsconfig, ignorePrompts, ...options }: Build
     options,
   });
   const contextDuration = timer.end('createBuildContext');
-  contextSpinner.text = `Building build context (${contextDuration}ms)`;
+  contextSpinner.text = `Building build context (${prettyTime(contextDuration)})`;
   contextSpinner.succeed();
 
   timer.start('buildAdmin');
@@ -82,7 +80,7 @@ const build = async ({ logger, cwd, tsconfig, ignorePrompts, ...options }: Build
     await buildWebpack(ctx);
 
     const buildDuration = timer.end('buildAdmin');
-    buildingSpinner.text = `Building admin panel (${buildDuration}ms)`;
+    buildingSpinner.text = `Building admin panel (${prettyTime(buildDuration)})`;
     buildingSpinner.succeed();
   } catch (err) {
     buildingSpinner.fail();

packages/core/admin/_internal/node/core/admin-customisations.ts

@@ -1,5 +1,6 @@
 import path from 'node:path';
-import { loadFile } from './files';
+import { convertSystemPathToModulePath, pathExists } from '../core/files';
+import { BuildContext } from '../createBuildContext';
 
 const ADMIN_APP_FILES = ['app.js', 'app.mjs', 'app.ts', 'app.jsx', 'app.tsx'];
 
@@ -11,17 +12,28 @@ interface AdminCustomisations {
 }
 
 interface AppFile {
+  /**
+   * The system path to the file
+   */
   path: string;
-  config: AdminCustomisations['config'];
+  /**
+   * The module path to the file i.e. how you would import it
+   */
+  modulePath: string;
 }
 
-const loadUserAppFile = async (appDir: string): Promise<AppFile | undefined> => {
+const loadUserAppFile = async ({
+  runtimeDir,
+  appDir,
+}: Pick<BuildContext, 'appDir' | 'runtimeDir'>): Promise<AppFile | undefined> => {
   for (const file of ADMIN_APP_FILES) {
     const filePath = path.join(appDir, 'src', 'admin', file);
-    const configFile = await loadFile(filePath);
 
-    if (configFile) {
-      return { path: filePath, config: configFile };
+    if (await pathExists(filePath)) {
+      return {
+        path: filePath,
+        modulePath: convertSystemPathToModulePath(path.relative(runtimeDir, filePath)),
+      };
     }
   }
 

packages/core/admin/_internal/node/core/files.ts

@@ -1,3 +1,4 @@
+import path from 'node:path';
 import { access } from 'node:fs/promises';
 import { register } from 'esbuild-register/dist/node';
 
@@ -18,7 +19,9 @@ const pathExists = async (path: string) => {
  */
 const loadFile = async (path: string): Promise<undefined | any> => {
   if (await pathExists(path)) {
-    const esbuildOptions = { extensions: ['.js', '.mjs', '.ts'] };
+    const esbuildOptions: Parameters<typeof register>[0] = {
+      extensions: ['.js', '.mjs', '.ts'],
+    };
 
     const { unregister } = register(esbuildOptions);
 
@@ -38,4 +41,34 @@ const loadFile = async (path: string): Promise<undefined | any> => {
   return undefined;
 };
 
-export { pathExists, loadFile };
+/**
+ * @internal
+ *
+ * @description Converts a system path to a module path mainly for `Windows` systems.
+ * where the path separator is `\` instead of `/`, on linux systems the path separator
+ * is identical to the module path separator.
+ */
+const convertSystemPathToModulePath = (sysPath: string) => {
+  if (process.platform === 'win32') {
+    return sysPath.split(path.sep).join(path.posix.sep);
+  } else {
+    return sysPath;
+  }
+};
+
+/**
+ * @internal
+ *
+ * @description Converts a module path to a system path, again largely used for Windows systems.
+ * The original use case was plugins where the resolve path was in module format but we want to
+ * have it relative to the runtime directory.
+ */
+const convertModulePathToSystemPath = (modulePath: string) => {
+  if (process.platform === 'win32') {
+    return modulePath.split(path.posix.sep).join(path.sep);
+  } else {
+    return modulePath;
+  }
+};
+
+export { pathExists, loadFile, convertSystemPathToModulePath, convertModulePathToSystemPath };