feat(api)!: app management refactor, admin panel entrypoint

 BREAKING CHANGE: there are significant changes to the api exported to the modules, a complete documentation will be available next sprint

Co-authored-by: Giuliano Caregnato <[email protected]>

.eslintrc.js

@@ -16,7 +16,8 @@ module.exports = {
 	globals: {
 		WATCH_SERVER: 'readonly',
 		BASE_PATH: 'readonly',
-		FLAVOR: 'readonly',
+		__SHELL_ENV__: 'readonly',
+		__CARBONIO_DEV__: 'readonly',
 		PACKAGE_NAME: 'readonly',
 		PACKAGE_VERSION: 'readonly',
 		cliSettings: 'readonly'

Jenkinsfile

@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: AGPL-3.0-only
 
 library(
-	identifier: 'zapp-jenkins-lib@github-pipeline',
+	identifier: 'zapp-jenkins-lib@github-pipeline-v2',
 	retriever: modernSCM([
 		$class: 'GitSCMSource',
 		remote: '[email protected]:zextras/zapp-jenkins-lib.git',

zapp.webpack.js → carbonio.webpack.js

@@ -1,11 +1,8 @@
 /*
- * SPDX-FileCopyrightText: 2021 Zextras <https://www.zextras.com>
+ * SPDX-FileCopyrightText: 2022 Zextras <https://www.zextras.com>
  *
  * SPDX-License-Identifier: AGPL-3.0-only
  */
-// SPDX-FileCopyrightText: 2021 Zextras <https://www.zextras.com>
-//
-// SPDX-License-Identifier: AGPL-3.0-only
 
 /* eslint-disable @typescript-eslint/no-var-requires */
 
@@ -14,21 +11,13 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const { DefinePlugin } = require('webpack');
 const CopyPlugin = require('copy-webpack-plugin');
+const CircularDependencyPlugin = require('circular-dependency-plugin');
 const commitHash = require('child_process').execSync('git rev-parse HEAD').toString().trim();
 
 const babelRC = require('./babel.config');
 
 const baseStaticPath = `/static/iris/carbonio-shell-ui/${commitHash}/`;
 
-console.log(`Building Shell using base static path: `);
-console.log(` ${baseStaticPath} `);
-/**
- * The flavor of the build
- * @type {'npm' | 'app'}
- */
-const flavor = process.env.ZX_SHELL_FLAVOR || 'APP';
-
-let indexFile;
 const pathsToCopy = [
 	{
 		from: 'node_modules/@zextras/carbonio-design-system/dist/tinymce/skins',
@@ -37,55 +26,56 @@ const pathsToCopy = [
 	{
 		from: 'assets/',
 		to: ''
+	},
+	{
+		from: 'translations',
+		to: 'i18n'
 	}
 ];
-switch (flavor.toUpperCase()) {
-	case 'NPM':
-		indexFile = path.resolve(process.cwd(), 'src', 'index-npm.tsx');
-		pathsToCopy.push({ from: 'translations', to: 'shelli18n' });
-		pathsToCopy.push({
-			from: 'src/mockServiceWorker.js',
-			to: 'mockServiceWorker.js'
-		});
-		break;
-	case 'APP':
-	default:
-		indexFile = path.resolve(process.cwd(), 'src', 'index.tsx');
-		pathsToCopy.push({ from: 'translations', to: 'i18n' });
-}
 
 module.exports = (_, pkg, options, mode) => {
 	const server = `https://${options.host ?? 'localhost:4443'}`;
 	return {
 		mode,
 		entry: {
-			index: indexFile
+			index: path.resolve(process.cwd(), 'src', 'index.tsx')
 		},
 		devtool: 'source-map',
 		output: {
 			path: path.resolve(process.cwd(), 'dist'),
-			filename: flavor.toUpperCase() !== 'APP' ? '[name].js' : '[name].[chunkhash:8].js',
+			filename: '[name].[chunkhash:8].js',
 			chunkFilename: '[name].[chunkhash:8].chunk.js',
 			publicPath: baseStaticPath
 		},
 		target: 'web',
 		resolve: {
-			extensions: ['*', '.js', '.jsx', '.ts', '.tsx'],
+			extensions: ['*', '.js', '.jsx', '.ts', '.tsx', '.d.ts'],
 			alias: {}
 		},
 		devServer: {
 			port: 9000,
 			historyApiFallback: {
 				index: `${baseStaticPath}/index.html`,
 				rewrites: [
-					{
-						from: /\/carbonio\/*/,
-						to: `${baseStaticPath}/index.html`
-					}
+					// eslint-disable-next-line no-nested-ternary
+					options.watchType === 'carbonioAdmin'
+						? {
+								from: /\/carbonioAdmin\/*/,
+								to: `${baseStaticPath}/admin.html`
+						  }
+						: options.watchType === 'carbonioStandalone'
+						? {
+								from: /\/carbonioStandalone\/*/,
+								to: `${baseStaticPath}/standalone.html`
+						  }
+						: {
+								from: /\/carbonio\/*/,
+								to: `${baseStaticPath}/index.html`
+						  }
 				]
 			},
 			https: true,
-			open: ['/carbonio/'],
+			open: [`/${options.watchType || 'carbonio'}/`],
 			proxy: [
 				{
 					context: ['/static/login/**'],
@@ -97,14 +87,28 @@ module.exports = (_, pkg, options, mode) => {
 					}
 				},
 				{
-					context: ['!/static/iris/carbonio-shell-ui/**/*', '!/carbonio/', '!/carbonio/**/*'],
+					context: [
+						'!/static/iris/carbonio-shell-ui/**/*',
+						`!/${options.watchType || 'carbonio'}/`,
+						`!/${options.watchType || 'carbonio'}/**/*`
+					],
 					target: server,
 					secure: false,
 					logLevel: 'debug',
 					cookieDomainRewrite: {
 						'*': server,
 						[server]: 'localhost:9000'
 					}
+				},
+				{
+					context: ['/carbonioAdmin/**/*'],
+					target: `https://localhost:9000/${baseStaticPath}/admin.html`,
+					secure: false,
+					logLevel: 'debug',
+					cookieDomainRewrite: {
+						'*': server,
+						[server]: 'localhost:9000'
+					}
 				}
 			]
 		},
@@ -118,7 +122,7 @@ module.exports = (_, pkg, options, mode) => {
 				},
 				{
 					test: /\.(css)$/,
-					exclude: [/node_modules\/tinymce/],
+					// exclude: [/node_modules\/tinymce/],
 					use: [
 						{
 							loader: MiniCssExtractPlugin.loader,
@@ -140,7 +144,11 @@ module.exports = (_, pkg, options, mode) => {
 					]
 				},
 				{
-					test: /\.(png|jpg|gif|woff2?|svg|eot|ttf|ogg|mp3)$/,
+					test: /\.svg$/,
+					use: ['@svgr/webpack']
+				},
+				{
+					test: /\.(png|jpg|gif|woff2?|eot|ttf|ogg|mp3)$/,
 					include: [/src/],
 					use: [
 						{
@@ -155,12 +163,22 @@ module.exports = (_, pkg, options, mode) => {
 			new CopyPlugin({
 				patterns: pathsToCopy
 			}),
+			new CircularDependencyPlugin({
+				// exclude detection of files based on a RegExp
+				exclude: /node_modules/,
+				// add errors to webpack instead of warnings
+				failOnError: false,
+				// allow import cycles that include an asynchronous import,
+				// e.g. via import(/* webpackMode: "weak" */ './file.js')
+				allowAsyncCycles: true,
+				// set the current working directory for displaying module paths
+				cwd: process.cwd()
+			}),
 			new DefinePlugin({
 				WATCH_SERVER: JSON.stringify(server),
 				COMMIT_ID: JSON.stringify(commitHash.toString().trim()),
 				PACKAGE_VERSION: JSON.stringify(pkg.version),
-				PACKAGE_NAME: JSON.stringify(pkg.zapp.name),
-				FLAVOR: JSON.stringify(flavor.toUpperCase()),
+				PACKAGE_NAME: JSON.stringify(pkg.carbonio.name),
 				BASE_PATH: JSON.stringify(baseStaticPath)
 			}),
 			new MiniCssExtractPlugin({
@@ -172,13 +190,47 @@ module.exports = (_, pkg, options, mode) => {
 				inject: true,
 				template: path.resolve(process.cwd(), 'src', 'index.template.html'),
 				chunks: ['index'],
-				BASE_PATH: baseStaticPath
+				BASE_PATH: baseStaticPath,
+				SHELL_ENV: 'carbonio'
+			}),
+			new HtmlWebpackPlugin({
+				inject: true,
+				template: path.resolve(process.cwd(), 'src', 'index.template.html'),
+				chunks: ['index'],
+				filename: 'admin.html',
+				BASE_PATH: baseStaticPath,
+				SHELL_ENV: 'carbonioAdmin'
+			}),
+			new HtmlWebpackPlugin({
+				inject: true,
+				template: path.resolve(process.cwd(), 'src', 'index.template.html'),
+				chunks: ['index'],
+				filename: 'standalone.html',
+				BASE_PATH: baseStaticPath,
+				SHELL_ENV: 'carbonioStandalone'
 			}),
 			new HtmlWebpackPlugin({
 				inject: false,
 				template: path.resolve(process.cwd(), 'commit.template'),
 				filename: 'commit',
 				COMMIT_ID: commitHash
+			}),
+			new HtmlWebpackPlugin({
+				inject: false,
+				template: path.resolve(
+					process.cwd(),
+					'node_modules/@zextras/carbonio-ui-sdk/scripts/configs/component.template'
+				),
+				filename: 'component.json',
+				name: pkg.carbonio.name,
+				description: pkg.description,
+				version: pkg.version,
+				commit: commitHash,
+				priority: pkg.carbonio.priority,
+				type: pkg.carbonio.type,
+				attrKey: pkg.carbonio.attrKey ?? '',
+				icon: pkg.carbonio.icon ?? 'CubeOutline',
+				display: pkg.carbonio.display
 			})
 		]
 	};