@strapi/admin 4.12.7 → 4.13.0-alpha.1

package/server/services/permission/permissions-manager/validate.js

@@ -0,0 +1,218 @@
+'use strict';
+
+const { subject: asSubject, detectSubjectType } = require('@casl/ability');
+const { permittedFieldsOf } = require('@casl/ability/extra');
+const {
+  defaults,
+  omit,
+  isArray,
+  isEmpty,
+  isNil,
+  flatMap,
+  some,
+  prop,
+  uniq,
+  intersection,
+  getOr,
+  isObject,
+} = require('lodash/fp');
+
+const {
+  contentTypes,
+  traverseEntity,
+  traverse,
+  validate,
+  pipeAsync,
+  errors: { ValidationError },
+} = require('@strapi/utils');
+
+const { throwPassword, throwDisallowedFields } = validate.visitors;
+const { ADMIN_USER_ALLOWED_FIELDS } = require('../../../domain/user');
+
+const { constants, isScalarAttribute, getNonVisibleAttributes, getWritableAttributes } =
+  contentTypes;
+const {
+  ID_ATTRIBUTE,
+  CREATED_AT_ATTRIBUTE,
+  UPDATED_AT_ATTRIBUTE,
+  PUBLISHED_AT_ATTRIBUTE,
+  CREATED_BY_ATTRIBUTE,
+  UPDATED_BY_ATTRIBUTE,
+} = constants;
+
+const COMPONENT_FIELDS = ['__component'];
+
+const STATIC_FIELDS = [ID_ATTRIBUTE];
+
+const throwInvalidParam = ({ key }) => {
+  throw new ValidationError(`Invalid parameter ${key}`);
+};
+
+module.exports = ({ action, ability, model }) => {
+  const schema = strapi.getModel(model);
+
+  const createValidateQuery = (options = {}) => {
+    const { fields } = options;
+
+    // TODO: validate relations to admin users in all validators
+    const permittedFields = fields.shouldIncludeAll ? null : getQueryFields(fields.permitted);
+
+    const validateFilters = pipeAsync(
+      traverse.traverseQueryFilters(throwDisallowedFields(permittedFields), { schema }),
+      traverse.traverseQueryFilters(throwDisallowedAdminUserFields, { schema }),
+      traverse.traverseQueryFilters(throwPassword, { schema }),
+      traverse.traverseQueryFilters(
+        ({ key, value }) => {
+          if (isObject(value) && isEmpty(value)) {
+            throwInvalidParam({ key });
+          }
+        },
+        { schema }
+      )
+    );
+
+    const validateSort = pipeAsync(
+      traverse.traverseQuerySort(throwDisallowedFields(permittedFields), { schema }),
+      traverse.traverseQuerySort(throwDisallowedAdminUserFields, { schema }),
+      traverse.traverseQuerySort(throwPassword, { schema }),
+      traverse.traverseQuerySort(
+        ({ key, attribute, value }) => {
+          if (!isScalarAttribute(attribute) && isEmpty(value)) {
+            throwInvalidParam({ key });
+          }
+        },
+        { schema }
+      )
+    );
+
+    const validateFields = pipeAsync(
+      traverse.traverseQueryFields(throwDisallowedFields(permittedFields), { schema }),
+      traverse.traverseQueryFields(throwPassword, { schema })
+    );
+
+    return async (query) => {
+      if (query.filters) {
+        await validateFilters(query.filters);
+      }
+
+      if (query.sort) {
+        await validateSort(query.sort);
+      }
+
+      if (query.fields) {
+        await validateFields(query.fields);
+      }
+
+      return true;
+    };
+  };
+
+  const createValidateInput = (options = {}) => {
+    const { fields } = options;
+
+    const permittedFields = fields.shouldIncludeAll ? null : getInputFields(fields.permitted);
+
+    return pipeAsync(
+      // Remove fields hidden from the admin
+      traverseEntity(throwHiddenFields, { schema }),
+      // Remove not allowed fields (RBAC)
+      traverseEntity(throwDisallowedFields(permittedFields), { schema }),
+      // Remove roles from createdBy & updatedBy fields
+      omitCreatorRoles
+    );
+  };
+
+  const wrapValidate = (createValidateFunction) => {
+    const wrappedValidate = async (data, options = {}) => {
+      if (isArray(data)) {
+        return Promise.all(data.map((entity) => wrappedValidate(entity, options)));
+      }
+
+      const { subject, action: actionOverride } = getDefaultOptions(data, options);
+
+      const permittedFields = permittedFieldsOf(ability, actionOverride, subject, {
+        fieldsFrom: (rule) => rule.fields || [],
+      });
+
+      const hasAtLeastOneRegistered = some(
+        (fields) => !isNil(fields),
+        flatMap(prop('fields'), ability.rulesFor(actionOverride, detectSubjectType(subject)))
+      );
+      const shouldIncludeAllFields = isEmpty(permittedFields) && !hasAtLeastOneRegistered;
+
+      const validateOptions = {
+        ...options,
+        fields: {
+          shouldIncludeAll: shouldIncludeAllFields,
+          permitted: permittedFields,
+          hasAtLeastOneRegistered,
+        },
+      };
+
+      const validateFunction = createValidateFunction(validateOptions);
+
+      return validateFunction(data);
+    };
+
+    return wrappedValidate;
+  };
+
+  const getDefaultOptions = (data, options) => {
+    return defaults({ subject: asSubject(model, data), action }, options);
+  };
+
+  /**
+   * Omit creator fields' (createdBy & updatedBy) roles from the admin API responses
+   */
+  const omitCreatorRoles = omit([`${CREATED_BY_ATTRIBUTE}.roles`, `${UPDATED_BY_ATTRIBUTE}.roles`]);
+
+  /**
+   * Visitor used to remove hidden fields from the admin API responses
+   */
+  const throwHiddenFields = ({ key, schema }) => {
+    const isHidden = getOr(false, ['config', 'attributes', key, 'hidden'], schema);
+
+    if (isHidden) {
+      throwInvalidParam({ key });
+    }
+  };
+
+  /**
+   * Visitor used to omit disallowed fields from the admin users entities & avoid leaking sensitive information
+   */
+  const throwDisallowedAdminUserFields = ({ key, attribute, schema }) => {
+    if (schema.uid === 'admin::user' && attribute && !ADMIN_USER_ALLOWED_FIELDS.includes(key)) {
+      throwInvalidParam({ key });
+    }
+  };
+
+  const getInputFields = (fields = []) => {
+    const nonVisibleAttributes = getNonVisibleAttributes(schema);
+    const writableAttributes = getWritableAttributes(schema);
+
+    const nonVisibleWritableAttributes = intersection(nonVisibleAttributes, writableAttributes);
+
+    return uniq([
+      ...fields,
+      ...STATIC_FIELDS,
+      ...COMPONENT_FIELDS,
+      ...nonVisibleWritableAttributes,
+    ]);
+  };
+
+  const getQueryFields = (fields = []) => {
+    return uniq([
+      ...fields,
+      ...STATIC_FIELDS,
+      ...COMPONENT_FIELDS,
+      CREATED_AT_ATTRIBUTE,
+      UPDATED_AT_ATTRIBUTE,
+      PUBLISHED_AT_ATTRIBUTE,
+    ]);
+  };
+
+  return {
+    validateQuery: wrapValidate(createValidateQuery),
+    validateInput: wrapValidate(createValidateInput),
+  };
+};

package/utils/create-cache-dir.js

@@ -9,20 +9,29 @@ const getCustomAppConfigFile = require('./get-custom-app-config-file');
 const getPkgPath = (name) => path.dirname(require.resolve(`${name}/package.json`));
 
 async function createPluginsJs(plugins, dest) {
-  const pluginsArray = plugins.map(({ pathToPlugin, name }) => {
+  const pluginsArray = plugins.map(({ pathToPlugin, name, info }) => {
     const shortName = _.camelCase(name);
 
+    let realPath = '';
+
     /**
-     * path.join, on windows, it uses backslashes to resolve path.
-     * The problem is that Webpack does not windows paths
-     * With this tool, we need to rely on "/" and not "\".
-     * This is the reason why '..\\..\\..\\node_modules\\@strapi\\plugin-content-type-builder/strapi-admin.js' was not working.
-     * The regexp at line 105 aims to replace the windows backslashes by standard slash so that webpack can deal with them.
-     * Backslash looks to work only for absolute paths with webpack => https://webpack.js.org/concepts/module-resolution/#absolute-paths
+     * We're using a module here so we want to keep using the module resolution procedure.
      */
-    const realPath = path
-      .join(path.relative(path.resolve(dest, 'admin', 'src'), pathToPlugin), 'strapi-admin.js')
-      .replace(/\\/g, '/');
+    if (info?.packageName || info?.required) {
+      /**
+       * path.join, on windows, it uses backslashes to resolve path.
+       * The problem is that Webpack does not windows paths
+       * With this tool, we need to rely on "/" and not "\".
+       * This is the reason why '..\\..\\..\\node_modules\\@strapi\\plugin-content-type-builder/strapi-admin.js' was not working.
+       * The regexp at line 105 aims to replace the windows backslashes by standard slash so that webpack can deal with them.
+       * Backslash looks to work only for absolute paths with webpack => https://webpack.js.org/concepts/module-resolution/#absolute-paths
+       */
+      realPath = path.join(pathToPlugin, 'strapi-admin').replace(/\\/g, '/');
+    } else {
+      realPath = path
+        .join(path.relative(path.resolve(dest, 'admin', 'src'), pathToPlugin), 'strapi-admin')
+        .replace(/\\/g, '/');
+    }
 
     return {
       name,
@@ -76,12 +85,49 @@ async function createCacheDir({ appDir, plugins }) {
     'tsconfig.json'
   );
 
-  const pluginsWithFront = Object.keys(plugins)
-    .filter((pluginName) => {
-      const pluginInfo = plugins[pluginName];
-      return fs.existsSync(path.resolve(pluginInfo.pathToPlugin, 'strapi-admin.js'));
+  const pluginsWithFront = Object.entries(plugins)
+    .filter(([, plugin]) => {
+      /**
+       * There are two ways a plugin should be imported, either it's local to the strapi app,
+       * or it's an actual npm module that's installed and resolved via node_modules.
+       *
+       * We first check if the plugin is local to the strapi app, using a regular `resolve` because
+       * the pathToPlugin will be relative i.e. `/Users/my-name/strapi-app/src/plugins/my-plugin`.
+       *
+       * If the file doesn't exist well then it's probably a node_module, so instead we use `require.resolve`
+       * which will resolve the path to the module in node_modules. If it fails with the specific code `MODULE_NOT_FOUND`
+       * then it doesn't have an admin part to the package.
+       *
+       * NOTE: we should try to move to `./package.json[exports]` map with bundling of our own plugins,
+       * because these entry files are written in commonjs restricting features e.g. tree-shaking.
+       */
+      try {
+        const isLocalPluginWithLegacyAdminFile = fs.existsSync(
+          path.resolve(`${plugin.pathToPlugin}/strapi-admin.js`)
+        );
+
+        if (!isLocalPluginWithLegacyAdminFile) {
+          const isModulewithLegacyAdminFile = require.resolve(
+            `${plugin.pathToPlugin}/strapi-admin.js`
+          );
+
+          return isModulewithLegacyAdminFile;
+        }
+
+        return isLocalPluginWithLegacyAdminFile;
+      } catch (err) {
+        if (err.code === 'MODULE_NOT_FOUND') {
+          /**
+           * the plugin does not contain FE code, so we
+           * don't want to import it anyway
+           */
+          return false;
+        }
+
+        throw err;
+      }
     })
-    .map((name) => ({ name, ...plugins[name] }));
+    .map(([name, plugin]) => ({ name, ...plugin }));
 
   // create .cache dir
   await fs.emptyDir(cacheDir);
@@ -128,4 +174,4 @@ async function createCacheDir({ appDir, plugins }) {
   }
 }
 
-module.exports = createCacheDir;
+module.exports = { createCacheDir, createPluginsJs };

package/utils/create-plugins-exclude-path.js

@@ -1,40 +1,20 @@
 'use strict';
 
-const { sep, join } = require('path');
-
 const NODE_MODULES = 'node_modules';
 /**
  * @param {string[]} pluginsPath – an array of paths to the plugins from the user's directory
  * @returns {RegExp} a regex that will exclude _all_ node_modules except for the plugins in the pluginsPath array.
  */
 const createPluginsExcludePath = (pluginsPath = []) => {
-  /**
-   * converts the full path to just the plugin path
-   * e.g. `/Users/username/strapi/node_modules/@scope/plugin-name`
-   * to `@scope/plugin-name`
-   */
-  const tsxPlugins = pluginsPath.reduce((acc, curr) => {
-    const dirPaths = curr.split(sep);
-
-    const nodeModulePathIndex = dirPaths.findIndex((val) => val === NODE_MODULES);
-
-    if (nodeModulePathIndex > 0) {
-      const pluginNodeModulePath = dirPaths.slice(nodeModulePathIndex + 1);
-      return [...acc, join(...pluginNodeModulePath)];
-    }
-
-    return acc;
-  }, []);
-
   /**
    * If there aren't any plugins in the node_modules array, just return the node_modules regex
    * without complicating it.
    */
-  if (tsxPlugins.length === 0) {
+  if (pluginsPath.length === 0) {
     return /node_modules/;
   }
 
-  return new RegExp(`${NODE_MODULES}/(?!(${tsxPlugins.join('|')}))`);
+  return new RegExp(`${NODE_MODULES}/(?!(${pluginsPath.join('|')}))`);
 };
 
-module.exports = createPluginsExcludePath;
+module.exports = { createPluginsExcludePath };

package/utils/get-plugins.js

@@ -0,0 +1,110 @@
+'use strict';
+
+const { join, resolve, sep, posix } = require('path');
+const fs = require('fs');
+// eslint-disable-next-line import/no-extraneous-dependencies
+const glob = require('glob');
+
+const getPlugins = (pluginsAllowlist) => {
+  const rootPath = resolve(__dirname, '..', join('..', '..', '..', 'packages'));
+  /**
+   * So `glob` only supports '/' as a path separator, so we need to replace
+   * the path separator for the current OS with '/'. e.g. on windows it's `\`.
+   *
+   * see https://github.com/isaacs/node-glob/#windows for more information
+   *
+   * and see https://github.com/isaacs/node-glob/issues/467#issuecomment-1114240501 for the recommended fix.
+   */
+  let corePath = join(rootPath, 'core', '*');
+  let pluginsPath = join(rootPath, 'plugins', '*');
+
+  if (process.platform === 'win32') {
+    corePath = corePath.split(sep).join(posix.sep);
+    pluginsPath = pluginsPath.split(sep).join(posix.sep);
+  }
+
+  const corePackageDirs = glob.sync(corePath);
+  const pluginsPackageDirs = glob.sync(pluginsPath);
+
+  const plugins = [...corePackageDirs, ...pluginsPackageDirs]
+    .map((directory) => {
+      const isCoreAdmin = directory.includes('packages/core/admin');
+
+      if (isCoreAdmin) {
+        return null;
+      }
+
+      const { name, strapi } = require(join(directory, 'package.json'));
+
+      /**
+       * this will remove any of our packages that are
+       * not actually plugins for the application
+       */
+      if (!strapi) {
+        return null;
+      }
+
+      /**
+       * we want the name of the node_module
+       */
+      return {
+        pathToPlugin: name,
+        name: strapi.name,
+        info: { ...strapi, packageName: name },
+        directory,
+      };
+    })
+    .filter((plugin) => {
+      if (!plugin) {
+        return false;
+      }
+
+      /**
+       * There are two ways a plugin should be imported, either it's local to the strapi app,
+       * or it's an actual npm module that's installed and resolved via node_modules.
+       *
+       * We first check if the plugin is local to the strapi app, using a regular `resolve` because
+       * the pathToPlugin will be relative i.e. `/Users/my-name/strapi-app/src/plugins/my-plugin`.
+       *
+       * If the file doesn't exist well then it's probably a node_module, so instead we use `require.resolve`
+       * which will resolve the path to the module in node_modules. If it fails with the specific code `MODULE_NOT_FOUND`
+       * then it doesn't have an admin part to the package.
+       *
+       * NOTE: we should try to move to `./package.json[exports]` map with bundling of our own plugins,
+       * because these entry files are written in commonjs restricting features e.g. tree-shaking.
+       */
+      try {
+        const isLocalPluginWithLegacyAdminFile = fs.existsSync(
+          resolve(`${plugin.pathToPlugin}/strapi-admin.js`)
+        );
+
+        if (!isLocalPluginWithLegacyAdminFile) {
+          const isModulewithLegacyAdminFile = require.resolve(
+            `${plugin.pathToPlugin}/strapi-admin.js`
+          );
+
+          return isModulewithLegacyAdminFile;
+        }
+
+        return isLocalPluginWithLegacyAdminFile;
+      } catch (err) {
+        if (err.code === 'MODULE_NOT_FOUND') {
+          /**
+           * the plugin does not contain FE code, so we
+           * don't want to import it anyway
+           */
+          return false;
+        }
+
+        throw err;
+      }
+    });
+
+  if (Array.isArray(pluginsAllowlist)) {
+    return plugins.filter((plugin) => pluginsAllowlist.includes(plugin.pathToPlugin));
+  }
+
+  return plugins;
+};
+
+module.exports = { getPlugins };

package/utils/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-const createCacheDir = require('./create-cache-dir');
+const { createCacheDir } = require('./create-cache-dir');
 const getCustomWebpackConfig = require('./get-custom-webpack-config');
 const shouldBuildAdmin = require('./should-build-admin');
 const watchAdminFiles = require('./watch-admin-files');

package/webpack.config.js

@@ -4,24 +4,23 @@ const path = require('path');
 const webpack = require('webpack');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const ForkTsCheckerPlugin = require('fork-ts-checker-webpack-plugin');
+const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const { ESBuildMinifyPlugin } = require('esbuild-loader');
 const WebpackBar = require('webpackbar');
-const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
 const browserslist = require('browserslist');
 const browserslistToEsbuild = require('browserslist-to-esbuild');
 
 const alias = require('./webpack.alias');
 const getClientEnvironment = require('./env');
-const createPluginsExcludePath = require('./utils/create-plugins-exclude-path');
+const { createPluginsExcludePath } = require('./utils/create-plugins-exclude-path');
 
 module.exports = ({
-  cacheDir,
   dest,
   entry,
   env,
   optimize,
-  pluginsPath,
+  plugins,
   options = {
     backend: 'http://localhost:1337',
     adminPath: '/admin/',
@@ -45,7 +44,11 @@ module.exports = ({
       ]
     : [];
 
-  const excludeRegex = createPluginsExcludePath(pluginsPath);
+  const nodeModulePluginPaths = Object.values(plugins)
+    .filter((plugin) => plugin.info?.packageName || plugin.info?.required)
+    .map((plugin) => plugin.pathToPlugin);
+
+  const excludeRegex = createPluginsExcludePath(nodeModulePluginPaths);
 
   // Ensure we use the config in this directory, even if run with a different
   // working directory
@@ -84,7 +87,6 @@ module.exports = ({
         {
           test: /\.tsx?$/,
           loader: require.resolve('esbuild-loader'),
-          include: [cacheDir, ...pluginsPath],
           exclude: excludeRegex,
           options: {
             loader: 'tsx',
@@ -92,8 +94,8 @@ module.exports = ({
           },
         },
         {
-          test: /\.m?jsx?$/,
-          include: [cacheDir, ...pluginsPath],
+          test: /\.(js|jsx|mjs)$/,
+          exclude: excludeRegex,
           use: {
             loader: require.resolve('esbuild-loader'),
             options: {
@@ -150,10 +152,7 @@ module.exports = ({
     },
     resolve: {
       alias,
-      symlinks: false,
       extensions: ['.js', '.jsx', '.react.js', '.ts', '.tsx'],
-      mainFields: ['browser', 'module', 'jsnext:main', 'main'],
-      modules: ['node_modules', path.resolve(__dirname, 'node_modules')],
     },
     plugins: [
       new HtmlWebpackPlugin({
@@ -167,9 +166,7 @@ module.exports = ({
           configFile: tsConfigFilePath,
         },
       }),
-
       !isProduction && process.env.REACT_REFRESH !== 'false' && new ReactRefreshWebpackPlugin(),
-
       ...webpackPlugins,
     ].filter(Boolean),
   };

package/admin/src/content-manager/components/AttributeFilter/Filters.js

@@ -1,58 +0,0 @@
-import React, { useRef, useState } from 'react';
-
-import { Box, Button } from '@strapi/design-system';
-import { FilterListURLQuery, FilterPopoverURLQuery, useTracking } from '@strapi/helper-plugin';
-import { Filter } from '@strapi/icons';
-import PropTypes from 'prop-types';
-import { useIntl } from 'react-intl';
-
-const Filters = ({ displayedFilters }) => {
-  const [isVisible, setIsVisible] = useState(false);
-  const { formatMessage } = useIntl();
-  const buttonRef = useRef();
-  const { trackUsage } = useTracking();
-
-  const handleToggle = () => {
-    if (!isVisible) {
-      trackUsage('willFilterEntries');
-    }
-    setIsVisible((prev) => !prev);
-  };
-
-  return (
-    <>
-      <Box paddingTop={1} paddingBottom={1}>
-        <Button
-          variant="tertiary"
-          ref={buttonRef}
-          startIcon={<Filter />}
-          onClick={handleToggle}
-          size="S"
-        >
-          {formatMessage({ id: 'app.utils.filters', defaultMessage: 'Filters' })}
-        </Button>
-        {isVisible && (
-          <FilterPopoverURLQuery
-            displayedFilters={displayedFilters}
-            isVisible={isVisible}
-            onToggle={handleToggle}
-            source={buttonRef}
-          />
-        )}
-      </Box>
-      <FilterListURLQuery filtersSchema={displayedFilters} />
-    </>
-  );
-};
-
-Filters.propTypes = {
-  displayedFilters: PropTypes.arrayOf(
-    PropTypes.shape({
-      name: PropTypes.string.isRequired,
-      metadatas: PropTypes.shape({ label: PropTypes.string }),
-      fieldSchema: PropTypes.shape({ type: PropTypes.string }),
-    })
-  ).isRequired,
-};
-
-export default Filters;

package/admin/src/content-manager/components/AttributeFilter/hooks/useAllowedAttributes.js

@@ -1,42 +0,0 @@
-import { findMatchingPermissions, useRBACProvider } from '@strapi/helper-plugin';
-import get from 'lodash/get';
-
-const NOT_ALLOWED_FILTERS = ['json', 'component', 'media', 'richtext', 'dynamiczone', 'password'];
-const TIMESTAMPS = ['createdAt', 'updatedAt'];
-
-const useAllowedAttributes = (contentType, slug) => {
-  const { allPermissions } = useRBACProvider();
-
-  const readPermissionsForSlug = findMatchingPermissions(allPermissions, [
-    {
-      action: 'plugin::content-manager.explorer.read',
-      subject: slug,
-    },
-  ]);
-
-  const readPermissionForAttr = get(readPermissionsForSlug, ['0', 'properties', 'fields'], []);
-  const attributesArray = Object.keys(get(contentType, ['attributes']), {});
-  const allowedAttributes = attributesArray
-    .filter((attr) => {
-      const current = get(contentType, ['attributes', attr], {});
-
-      if (!current.type) {
-        return false;
-      }
-
-      if (NOT_ALLOWED_FILTERS.includes(current.type)) {
-        return false;
-      }
-
-      if (!readPermissionForAttr.includes(attr) && attr !== 'id' && !TIMESTAMPS.includes(attr)) {
-        return false;
-      }
-
-      return true;
-    })
-    .sort();
-
-  return allowedAttributes;
-};
-
-export default useAllowedAttributes;