@strapi/admin 4.2.1-alpha.0 → 4.3.0-beta.2

package/index.js

@@ -1,66 +1,34 @@
 'use strict';
 
 const path = require('path');
-const _ = require('lodash');
 const fs = require('fs-extra');
 const webpack = require('webpack');
 const WebpackDevServer = require('webpack-dev-server');
+const { isUsingTypeScript } = require('@strapi/typescript-utils');
 const chalk = require('chalk');
-const chokidar = require('chokidar');
-const getWebpackConfig = require('./webpack.config');
 
-const getPkgPath = name => path.dirname(require.resolve(`${name}/package.json`));
+const {
+  createCacheDir,
+  getCustomWebpackConfig,
+  shouldBuildAdmin,
+  watchAdminFiles,
+} = require('./utils');
 
-const DEFAULT_PLUGINS = [
-  'content-type-builder',
-  'content-manager',
-  'upload',
-  'email',
-  'i18n',
-  'users-permissions',
-];
+async function build({ appDir, buildDestDir, env, forceBuild, optimize, options, plugins }) {
+  const buildAdmin = await shouldBuildAdmin({ appDir, plugins });
 
-function getCustomWebpackConfig(dir, config) {
-  const adminConfigPath = path.join(dir, 'src', 'admin', 'webpack.config.js');
-
-  let webpackConfig = getWebpackConfig(config);
-
-  if (fs.existsSync(adminConfigPath)) {
-    const webpackAdminConfig = require(path.resolve(adminConfigPath));
-
-    if (_.isFunction(webpackAdminConfig)) {
-      // Expose the devServer configuration
-      if (config.devServer) {
-        webpackConfig.devServer = config.devServer;
-      }
-
-      webpackConfig = webpackAdminConfig(webpackConfig, webpack);
-
-      if (!webpackConfig) {
-        console.error(
-          `${chalk.red('Error:')} Nothing was returned from your custom webpack configuration`
-        );
-        process.exit(1);
-      }
-    }
-  }
-
-  return webpackConfig;
-}
-
-async function build({ plugins, dir, env, options, optimize, forceBuild }) {
-  const buildAdmin = await shouldBuildAdmin({ dir, plugins });
+  const useTypeScript = await isUsingTypeScript(path.join(appDir, 'src', 'admin'), 'tsconfig.json');
 
   if (!buildAdmin && !forceBuild) {
     return;
   }
 
   // Create the cache dir containing the front-end files.
-  await createCacheDir({ dir, plugins });
+  await createCacheDir({ appDir, plugins });
 
-  const cacheDir = path.resolve(dir, '.cache');
+  const cacheDir = path.resolve(appDir, '.cache');
   const entry = path.resolve(cacheDir, 'admin', 'src');
-  const dest = path.resolve(dir, 'build');
+  const dest = path.resolve(buildDestDir, 'build');
 
   // Roots for the @strapi/babel-plugin-switch-ee-ce
   const roots = {
@@ -70,15 +38,23 @@ async function build({ plugins, dir, env, options, optimize, forceBuild }) {
 
   const pluginsPath = Object.keys(plugins).map(pluginName => plugins[pluginName].pathToPlugin);
 
-  const config = getCustomWebpackConfig(dir, {
-    entry,
-    pluginsPath,
+  // Either use the tsconfig file from the generated app or the one inside the .cache folder
+  // so we can develop plugins in TS while being in a JS app
+  const tsConfigFilePath = useTypeScript
+    ? path.join(appDir, 'src', 'admin', 'tsconfig.json')
+    : path.resolve(entry, 'tsconfig.json');
+
+  const config = getCustomWebpackConfig(appDir, {
+    appDir,
     cacheDir,
     dest,
+    entry,
     env,
-    options,
     optimize,
+    options,
+    pluginsPath,
     roots,
+    tsConfigFilePath,
   });
 
   const compiler = webpack(config);
@@ -109,115 +85,24 @@ async function build({ plugins, dir, env, options, optimize, forceBuild }) {
   });
 }
 
-async function createPluginsJs(plugins, dest) {
-  const pluginsArray = plugins.map(({ pathToPlugin, name }) => {
-    const shortName = _.camelCase(name);
-
-    /**
-     * 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
-     */
-    const realPath = path
-      .join(path.relative(path.resolve(dest, 'admin', 'src'), pathToPlugin), 'strapi-admin.js')
-      .replace(/\\/g, '/');
-
-    return {
-      name,
-      pathToPlugin: realPath,
-      shortName,
-    };
-  });
-
-  const content = `
-${pluginsArray
-  .map(({ pathToPlugin, shortName }) => {
-    const req = `'${pathToPlugin}'`;
-
-    return `import ${shortName} from ${req};`;
-  })
-  .join('\n')}
-
-
-const plugins = {
-${[...pluginsArray]
-  .map(({ name, shortName }) => {
-    return `  '${name}': ${shortName},`;
-  })
-  .join('\n')}
-};
-
-export default plugins;
-`;
-
-  return fs.writeFile(path.resolve(dest, 'admin', 'src', 'plugins.js'), content);
-}
-
-async function clean({ dir }) {
-  const buildDir = path.join(dir, 'build');
-  const cacheDir = path.join(dir, '.cache');
+async function clean({ appDir, buildDestDir }) {
+  // FIXME rename admin build dir and path to build dir
+  const buildDir = path.join(buildDestDir, 'build');
+  // .cache dir is always located at the root of the app
+  const cacheDir = path.join(appDir, '.cache');
 
   fs.removeSync(buildDir);
   fs.removeSync(cacheDir);
 }
 
-async function copyAdmin(dest) {
-  const adminPath = getPkgPath('@strapi/admin');
-
-  // TODO copy ee folders for plugins
-  await fs.copy(path.resolve(adminPath, 'ee', 'admin'), path.resolve(dest, 'ee', 'admin'));
-
-  await fs.ensureDir(path.resolve(dest, 'config'));
-  await fs.copy(path.resolve(adminPath, 'admin'), path.resolve(dest, 'admin'));
-
-  // Copy package.json
-  await fs.copy(path.resolve(adminPath, 'package.json'), path.resolve(dest, 'package.json'));
-}
-
-async function createCacheDir({ dir, plugins }) {
-  const cacheDir = path.resolve(dir, '.cache');
-
-  const pluginsWithFront = Object.keys(plugins)
-    .filter(pluginName => {
-      const pluginInfo = plugins[pluginName];
-      return fs.existsSync(path.resolve(pluginInfo.pathToPlugin, 'strapi-admin.js'));
-    })
-    .map(name => ({ name, ...plugins[name] }));
-
-  // create .cache dir
-  await fs.emptyDir(cacheDir);
-
-  // copy admin core code
-  await copyAdmin(cacheDir);
-
-  // Copy app.js
-  const customAdminConfigFilePath = path.join(dir, 'src', 'admin', 'app.js');
-
-  if (fs.existsSync(customAdminConfigFilePath)) {
-    await fs.copy(customAdminConfigFilePath, path.resolve(cacheDir, 'admin', 'src', 'app.js'));
-  }
-
-  // Copy admin extensions folder
-  const adminExtensionFolder = path.join(dir, 'src', 'admin', 'extensions');
-
-  if (fs.existsSync(adminExtensionFolder)) {
-    await fs.copy(adminExtensionFolder, path.resolve(cacheDir, 'admin', 'src', 'extensions'));
-  }
-
-  // create plugins.js with plugins requires
-  await createPluginsJs(pluginsWithFront, cacheDir);
-}
-
-async function watchAdmin({ plugins, dir, host, port, browser, options }) {
+async function watchAdmin({ appDir, browser, buildDestDir, host, options, plugins, port }) {
+  const useTypeScript = await isUsingTypeScript(path.join(appDir, 'src', 'admin'), 'tsconfig.json');
   // Create the cache dir containing the front-end files.
-  const cacheDir = path.join(dir, '.cache');
-  await createCacheDir({ dir, plugins });
+  const cacheDir = path.join(appDir, '.cache');
+  await createCacheDir({ appDir, plugins });
 
   const entry = path.join(cacheDir, 'admin', 'src');
-  const dest = path.join(dir, 'build');
+  const dest = path.join(buildDestDir, 'build');
   const env = 'development';
 
   // Roots for the @strapi/babel-plugin-switch-ee-ce
@@ -228,14 +113,20 @@ async function watchAdmin({ plugins, dir, host, port, browser, options }) {
 
   const pluginsPath = Object.keys(plugins).map(pluginName => plugins[pluginName].pathToPlugin);
 
+  // Either use the tsconfig file from the generated app or the one inside the .cache folder
+  // so we can develop plugins in TS while being in a JS app
+  const tsConfigFilePath = useTypeScript
+    ? path.join(appDir, 'src', 'admin', 'tsconfig.json')
+    : path.resolve(entry, 'tsconfig.json');
+
   const args = {
-    entry,
+    appDir,
     cacheDir,
-    pluginsPath,
     dest,
+    entry,
     env,
-    port,
     options,
+    pluginsPath,
     roots,
     devServer: {
       port,
@@ -246,7 +137,6 @@ async function watchAdmin({ plugins, dir, host, port, browser, options }) {
           warnings: false,
         },
       },
-
       open: browser === 'true' ? true : browser,
       devMiddleware: {
         publicPath: options.adminPath,
@@ -256,9 +146,10 @@ async function watchAdmin({ plugins, dir, host, port, browser, options }) {
         disableDotRule: true,
       },
     },
+    tsConfigFilePath,
   };
 
-  const webpackConfig = getCustomWebpackConfig(dir, args);
+  const webpackConfig = getCustomWebpackConfig(appDir, args);
 
   const compiler = webpack(webpackConfig);
 
@@ -279,90 +170,7 @@ async function watchAdmin({ plugins, dir, host, port, browser, options }) {
 
   runServer();
 
-  watchFiles(dir);
-}
-
-/**
- * Listen to files change and copy the changed files in the .cache/admin folder
- * when using the dev mode
- * @param {string} dir
- */
-async function watchFiles(dir) {
-  const cacheDir = path.join(dir, '.cache');
-  const appExtensionFile = path.join(dir, 'src', 'admin', 'app.js');
-  const extensionsPath = path.join(dir, 'src', 'admin', 'extensions');
-
-  // Only watch the admin/app.js file and the files that are in the ./admin/extensions/folder
-  const filesToWatch = [appExtensionFile, extensionsPath];
-
-  const watcher = chokidar.watch(filesToWatch, {
-    ignoreInitial: true,
-    ignorePermissionErrors: true,
-  });
-
-  watcher.on('all', async (event, filePath) => {
-    const isAppFile = filePath.includes(appExtensionFile);
-
-    // The app.js file needs to be copied in the .cache/admin/src/app.js and the other ones needs to
-    // be copied in the .cache/admin/src/extensions folder
-    const targetPath = isAppFile
-      ? path.join(path.normalize(filePath.split(appExtensionFile)[1]), 'app.js')
-      : path.join('extensions', path.normalize(filePath.split(extensionsPath)[1]));
-
-    const destFolder = path.join(cacheDir, 'admin', 'src');
-
-    if (event === 'unlink' || event === 'unlinkDir') {
-      // Remove the file or folder
-      // We need to copy the original files when deleting an override one
-      try {
-        fs.removeSync(path.join(destFolder, targetPath));
-      } catch (err) {
-        console.log('An error occured while deleting the file', err);
-      }
-    } else {
-      // In any other case just copy the file into the .cache/admin/src folder
-      try {
-        await fs.copy(filePath, path.join(destFolder, targetPath));
-      } catch (err) {
-        console.log(err);
-      }
-    }
-  });
-}
-
-const hasCustomAdminCode = async dir => {
-  const customAdminPath = path.join(dir, 'src', 'admin');
-  const customAdminConfigFile = path.join(customAdminPath, 'app.js');
-  const customAdminWebpackFile = path.join(customAdminPath, 'webpack.config.js');
-
-  const hasCustomConfigFile = await fs.pathExists(customAdminConfigFile);
-  const hasCustomWebpackFile = await fs.pathExists(customAdminWebpackFile);
-
-  return hasCustomConfigFile || hasCustomWebpackFile;
-};
-
-/**
- * Checks if the project's installed plugins are not the same as a default one.
- * @param {Object} plugins
- * @returns {boolean}
- */
-const hasNonDefaultPlugins = plugins => {
-  // List of plugins that are not the ones installed in a generated app
-  const installedPlugins = Object.keys(plugins).filter(x => !DEFAULT_PLUGINS.includes(x));
-
-  // List of default plugins uninstalled from a generated app
-  const missingPlugins = DEFAULT_PLUGINS.filter(x => !Object.keys(plugins).includes(x));
-
-  const diff = [...installedPlugins, ...missingPlugins];
-
-  return diff.length > 0;
-};
-
-async function shouldBuildAdmin({ dir, plugins }) {
-  const appHasCustomAdminCode = await hasCustomAdminCode(dir);
-  const appHasNonDefaultPlugins = hasNonDefaultPlugins(plugins);
-
-  return appHasCustomAdminCode || appHasNonDefaultPlugins;
+  watchAdminFiles(appDir, useTypeScript);
 }
 
 module.exports = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@strapi/admin",
-  "version": "4.2.1-alpha.0",
+  "version": "4.3.0-beta.2",
   "description": "Strapi Admin",
   "repository": {
     "type": "git",
@@ -28,6 +28,7 @@
     "develop:webpack": "cross-env NODE_ENV=development webpack serve --config webpack.config.dev.js --progress profile",
     "prepublishOnly": "yarn build",
     "build": "rimraf build && node ./scripts/build.js",
+    "build:mesure": "rimraf build && cross-env MESURE_BUILD_SPEED=true node ./scripts/build.js",
     "test": "echo \"no tests yet\"",
     "test:unit": "jest --verbose",
     "test:front": "cross-env IS_EE=true jest --config ./jest.config.front.js",
@@ -40,7 +41,7 @@
     "@babel/plugin-transform-runtime": "7.16.7",
     "@babel/polyfill": "7.12.1",
     "@babel/preset-env": "7.16.7",
-    "@babel/preset-react": "7.16.7",
+    "@babel/preset-react": "7.18.6",
     "@babel/runtime": "7.16.7",
     "@casl/ability": "^5.4.3",
     "@fingerprintjs/fingerprintjs": "3.3.2",
@@ -48,27 +49,30 @@
     "@fortawesome/fontawesome-svg-core": "^1.2.35",
     "@fortawesome/free-brands-svg-icons": "^5.15.3",
     "@fortawesome/free-solid-svg-icons": "^5.15.3",
-    "@fortawesome/react-fontawesome": "^0.1.14",
-    "@strapi/babel-plugin-switch-ee-ce": "4.2.1-alpha.0",
-    "@strapi/design-system": "1.1.1",
-    "@strapi/helper-plugin": "4.2.1-alpha.0",
-    "@strapi/icons": "1.1.1",
-    "@strapi/utils": "4.2.1-alpha.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
+    "@pmmmwh/react-refresh-webpack-plugin": "0.5.7",
+    "@strapi/babel-plugin-switch-ee-ce": "4.3.0-beta.2",
+    "@strapi/design-system": "1.2.0",
+    "@strapi/helper-plugin": "4.3.0-beta.2",
+    "@strapi/icons": "1.2.0",
+    "@strapi/typescript-utils": "4.3.0-beta.2",
+    "@strapi/utils": "4.3.0-beta.2",
     "axios": "0.24.0",
-    "babel-loader": "8.2.3",
+    "babel-loader": "8.2.5",
     "babel-plugin-styled-components": "2.0.2",
     "bcryptjs": "2.4.3",
     "chalk": "^4.1.1",
     "chokidar": "^3.5.1",
-    "codemirror": "^5.61.0",
+    "codemirror": "^5.65.6",
     "cross-env": "^7.0.3",
     "css-loader": "6.5.1",
-    "date-fns": "2.22.1",
+    "date-fns": "2.28.0",
     "dotenv": "8.5.1",
-    "esbuild-loader": "2.18.0",
+    "esbuild-loader": "^2.19.0",
     "execa": "^1.0.0",
     "fast-deep-equal": "3.1.3",
     "font-awesome": "^4.7.0",
+    "fork-ts-checker-webpack-plugin": "7.2.1",
     "formik": "^2.2.6",
     "fs-extra": "10.0.0",
     "highlight.js": "^10.4.1",
@@ -96,14 +100,14 @@
     "markdown-it-sup": "1.0.0",
     "match-sorter": "^4.0.2",
     "mini-css-extract-plugin": "2.4.4",
-    "moment": "^2.29.1",
+    "moment": "^2.29.4",
     "node-polyfill-webpack-plugin": "1.1.4",
     "p-map": "4.0.0",
     "passport-local": "1.0.0",
     "prop-types": "^15.7.2",
     "qs": "6.10.1",
     "react": "^17.0.2",
-    "react-copy-to-clipboard": "^5.0.3",
+    "react-copy-to-clipboard": "^5.1.0",
     "react-dnd": "^14.0.2",
     "react-dnd-html5-backend": "^14.0.0",
     "react-dom": "^17.0.2",
@@ -112,7 +116,8 @@
     "react-helmet": "^6.1.0",
     "react-intl": "5.20.2",
     "react-query": "3.24.3",
-    "react-redux": "7.2.3",
+    "react-redux": "7.2.8",
+    "react-refresh": "0.11.0",
     "react-router": "5.2.0",
     "react-router-dom": "5.2.0",
     "react-select": "^4.0.2",
@@ -121,24 +126,26 @@
     "redux-saga": "^0.16.0",
     "reselect": "^4.0.0",
     "rimraf": "3.0.2",
-    "sanitize-html": "2.4.0",
-    "semver": "7.3.5",
+    "sanitize-html": "2.7.0",
+    "semver": "7.3.7",
     "sift": "13.5.0",
     "style-loader": "3.3.1",
     "styled-components": "5.3.3",
-    "webpack": "5.65.0",
-    "webpack-cli": "4.9.1",
-    "webpack-dev-server": "4.7.3",
-    "webpackbar": "5.0.0-3",
+    "webpack": "^5.73.0",
+    "webpack-cli": "^4.10.0",
+    "webpack-dev-server": "^4.9.3",
+    "webpackbar": "^5.0.2",
     "yup": "^0.32.9"
   },
   "devDependencies": {
-    "duplicate-dependencies-webpack-plugin": "0.2.0",
-    "webpack-bundle-analyzer": "4.4.1"
+    "duplicate-dependencies-webpack-plugin": "^1.0.2",
+    "glob": "8.0.3",
+    "speed-measure-webpack-plugin": "1.5.0",
+    "webpack-bundle-analyzer": "^4.5.0"
   },
   "engines": {
     "node": ">=14.19.1 <=16.x.x",
     "npm": ">=6.0.0"
   },
-  "gitHead": "90bd3b9e294a69cd9538bde4e2e853e6de60f238"
+  "gitHead": "42aba356ad1b0751584d3b375e83baa4a2c18f65"
 }

package/scripts/build.js

@@ -3,7 +3,11 @@
 const path = require('path');
 const webpack = require('webpack');
 const { isObject } = require('lodash');
+// eslint-disable-next-line node/no-extraneous-require
+const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
+
 const webpackConfig = require('../webpack.config');
+const getPluginsPath = require('../utils/get-plugins-path');
 const {
   getCorePluginsPath,
   getPluginToInstallPath,
@@ -12,29 +16,41 @@ const {
 
 const PLUGINS_TO_INSTALL = ['i18n', 'users-permissions'];
 
+// Wrapper that outputs the webpack speed
+const smp = new SpeedMeasurePlugin();
+
 const buildAdmin = async () => {
   const entry = path.join(__dirname, '..', 'admin', 'src');
   const dest = path.join(__dirname, '..', 'build');
+  const tsConfigFilePath = path.join(__dirname, '..', 'admin', 'src', 'tsconfig.json');
+
   const corePlugins = getCorePluginsPath();
   const plugins = getPluginToInstallPath(PLUGINS_TO_INSTALL);
   const allPlugins = { ...corePlugins, ...plugins };
+  const pluginsPath = getPluginsPath();
 
   await createPluginsFile(allPlugins);
 
   const args = {
     entry,
     dest,
-    cacheDir: path.resolve(__dirname, '..'),
-    pluginsPath: [path.resolve(__dirname, '../../../../packages')],
+    cacheDir: path.join(__dirname, '..'),
+    pluginsPath,
     env: 'production',
     optimize: true,
     options: {
       backend: 'http://localhost:1337',
       adminPath: '/admin/',
     },
+    tsConfigFilePath,
   };
 
-  const compiler = webpack(webpackConfig(args));
+  const config =
+    process.env.MEASURE_BUILD_SPEED === 'true'
+      ? smp.wrap(webpackConfig(args))
+      : webpackConfig(args);
+
+  const compiler = webpack(config);
 
   console.log('Building the admin panel');
 

package/server/controllers/admin.js

@@ -5,6 +5,7 @@ const execa = require('execa');
 const _ = require('lodash');
 const { exists } = require('fs-extra');
 const { ValidationError } = require('@strapi/utils').errors;
+const { isUsingTypeScript } = require('@strapi/typescript-utils');
 // eslint-disable-next-line node/no-extraneous-require
 const ee = require('@strapi/strapi/lib/utils/ee');
 
@@ -81,10 +82,31 @@ module.exports = {
     return projectSettingsService.updateProjectSettings({ ...body, ...formatedFiles });
   },
 
+  async telemetryProperties(ctx) {
+    // If the telemetry is disabled, ignore the request and return early
+    if (strapi.telemetry.isDisabled) {
+      ctx.status = 204;
+      return;
+    }
+
+    const useTypescriptOnServer = await isUsingTypeScript(strapi.dirs.app.root);
+    const useTypescriptOnAdmin = await isUsingTypeScript(
+      path.join(strapi.dirs.app.root, 'src', 'admin')
+    );
+
+    return {
+      data: {
+        useTypescriptOnServer,
+        useTypescriptOnAdmin,
+      },
+    };
+  },
+
   async information() {
     const currentEnvironment = strapi.config.get('environment');
     const autoReload = strapi.config.get('autoReload', false);
     const strapiVersion = strapi.config.get('info.strapi', null);
+    const dependencies = strapi.config.get('info.dependencies', {});
     const nodeVersion = process.version;
     const communityEdition = !strapi.EE;
     const useYarn = await exists(path.join(process.cwd(), 'yarn.lock'));
@@ -94,6 +116,7 @@ module.exports = {
         currentEnvironment,
         autoReload,
         strapiVersion,
+        dependencies,
         nodeVersion,
         communityEdition,
         useYarn,

package/server/policies/index.js

@@ -3,4 +3,5 @@
 module.exports = {
   isAuthenticatedAdmin: require('./isAuthenticatedAdmin'),
   hasPermissions: require('./hasPermissions'),
+  isTelemetryEnabled: require('./isTelemetryEnabled'),
 };

package/server/policies/isTelemetryEnabled.js

@@ -0,0 +1,16 @@
+'use strict';
+
+const { createPolicy } = require('@strapi/utils').policy;
+
+/**
+ * This policy is used for routes dealing with telemetry and analytics content.
+ * It will fails when the telemetry has been disabled on the server.
+ */
+module.exports = createPolicy({
+  name: 'admin::isTelemetryEnabled',
+  handler(_ctx, _config, { strapi }) {
+    if (strapi.telemetry.isDisabled) {
+      return false;
+    }
+  },
+});

package/server/routes/admin.js

@@ -49,6 +49,14 @@ module.exports = [
       policies: ['admin::isAuthenticatedAdmin'],
     },
   },
+  {
+    method: 'GET',
+    path: '/telemetry-properties',
+    handler: 'admin.telemetryProperties',
+    config: {
+      auth: false,
+    },
+  },
   {
     method: 'GET',
     path: '/plugins',

package/server/routes/serve-admin-panel.js

@@ -5,7 +5,7 @@ const fse = require('fs-extra');
 const koaStatic = require('koa-static');
 
 const registerAdminPanelRoute = ({ strapi }) => {
-  let buildDir = resolve(strapi.dirs.root, 'build');
+  let buildDir = resolve(strapi.dirs.dist.root, 'build');
 
   if (!fse.pathExistsSync(buildDir)) {
     buildDir = resolve(__dirname, '../../build');