From f1384a53643723358b161f7f94d501b2a4ab13f8 Mon Sep 17 00:00:00 2001 From: Ankit Gade Date: Tue, 7 Jan 2025 17:05:57 +0530 Subject: [PATCH] Add JS entry point for block editor. --- ...kit-reader-revenue-manager-block-editor.js | 17 ++++ includes/Modules/Reader_Revenue_Manager.php | 25 +++++- webpack.config.js | 4 + webpack/blockEditor.config.js | 89 +++++++++++++++++++ webpack/common.js | 4 +- 5 files changed, 136 insertions(+), 3 deletions(-) create mode 100644 assets/js/googlesitekit-reader-revenue-manager-block-editor.js create mode 100644 webpack/blockEditor.config.js diff --git a/assets/js/googlesitekit-reader-revenue-manager-block-editor.js b/assets/js/googlesitekit-reader-revenue-manager-block-editor.js new file mode 100644 index 00000000000..cc450da9143 --- /dev/null +++ b/assets/js/googlesitekit-reader-revenue-manager-block-editor.js @@ -0,0 +1,17 @@ +/** + * Reader Revenue Manager module's block editor entrypoint. + * + * Site Kit by Google, Copyright 2024 Google LLC + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * https://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ diff --git a/includes/Modules/Reader_Revenue_Manager.php b/includes/Modules/Reader_Revenue_Manager.php index c525a5892a7..902d3a2f8b0 100644 --- a/includes/Modules/Reader_Revenue_Manager.php +++ b/includes/Modules/Reader_Revenue_Manager.php @@ -11,6 +11,7 @@ namespace Google\Site_Kit\Modules; use Exception; +use Google\Site_Kit\Core\Assets\Asset; use Google\Site_Kit\Core\Assets\Script; use Google\Site_Kit\Core\Authentication\Clients\Google_Site_Kit_Client; use Google\Site_Kit\Core\Modules\Module; @@ -32,6 +33,7 @@ use Google\Site_Kit\Core\Site_Health\Debug_Data; use Google\Site_Kit\Core\Tags\Guards\Tag_Environment_Type_Guard; use Google\Site_Kit\Core\Tags\Guards\Tag_Verify_Guard; +use Google\Site_Kit\Core\Util\Feature_Flags; use Google\Site_Kit\Core\Util\URL; use Google\Site_Kit\Modules\Reader_Revenue_Manager\Settings; use Google\Site_Kit\Modules\Reader_Revenue_Manager\Synchronize_OnboardingState; @@ -383,7 +385,7 @@ function ( $url ) { protected function setup_assets() { $base_url = $this->context->url( 'dist/assets/' ); - return array( + $assets = array( new Script( 'googlesitekit-modules-reader-revenue-manager', array( @@ -400,6 +402,27 @@ protected function setup_assets() { ) ), ); + + if ( Feature_Flags::enabled( 'rrmModuleV2' ) ) { + $assets[] = new Script( + 'googlesitekit-reader-revenue-manager-block-editor.js', + array( + 'src' => $base_url . 'js/googlesitekit-reader-revenue-manager-block-editor.js', + 'dependencies' => array( + 'googlesitekit-data', + 'googlesitekit-i18n', + 'googlesitekit-modules', + 'wp-components', + 'wp-editor', + 'wp-element', + 'wp-plugins', + ), + 'load_contexts' => array( Asset::CONTEXT_ADMIN_POST_EDITOR ), + ) + ); + } + + return $assets; } /** diff --git a/webpack.config.js b/webpack.config.js index 981f643ae03..fab7b57cc34 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -22,6 +22,7 @@ const { createRules } = require( './webpack/common' ); const adminCssConfig = require( './webpack/adminCss.config' ); const basicModulesConfig = require( './webpack/basicModules.config' ); +const blockEditorConfig = require( './webpack/blockEditor.config' ); const frontendModules = require( './webpack/frontendModules.config' ); const modulesConfig = require( './webpack/modules.config' ); const testBundleConfig = require( './webpack/testBundle.config' ); @@ -45,6 +46,9 @@ function* webpackConfig( env, argv ) { // Build modules that will be used on the frontend, that require wider browser support. yield frontendModules( mode ); + // Build the block editor js. + yield blockEditorConfig( mode ); + // Build the main plugin admin css. yield adminCssConfig( mode ); } diff --git a/webpack/blockEditor.config.js b/webpack/blockEditor.config.js new file mode 100644 index 00000000000..62e6d32b27e --- /dev/null +++ b/webpack/blockEditor.config.js @@ -0,0 +1,89 @@ +/** + * Block editor config webpack partial. + * + * Site Kit by Google, Copyright 2024 Google LLC + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * https://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +/** + * External dependencies + */ +const CircularDependencyPlugin = require( 'circular-dependency-plugin' ); +const ESLintPlugin = require( 'eslint-webpack-plugin' ); +const ManifestPlugin = require( 'webpack-manifest-plugin' ); +const WebpackBar = require( 'webpackbar' ); + +/** + * Internal dependencies + */ +const { + rootDir, + manifestArgs, + resolve, + gutenbergExternals, + createRules, + createMinimizerRules, +} = require( './common' ); + +module.exports = ( mode ) => ( { + entry: { + 'googlesitekit-reader-revenue-manager-block-editor': + './assets/js/googlesitekit-reader-revenue-manager-block-editor.js', + }, + externals: gutenbergExternals, + output: { + filename: + mode === 'production' ? '[name]-[contenthash].js' : '[name].js', + path: rootDir + '/dist/assets/js', + publicPath: '', + // If multiple webpack runtimes (from different compilations) are used on the + // same webpage, there is a risk of conflicts of on-demand chunks in the global + // namespace. + // See: https://webpack.js.org/configuration/output/#outputjsonpfunction. + jsonpFunction: '__googlesitekit_block_editor_webpackJsonp', + }, + performance: { + maxEntrypointSize: 175000, + }, + module: { + rules: createRules( mode ), + }, + plugins: [ + new WebpackBar( { + name: 'Block Editor Entry Points', + color: '#deff13', + } ), + new CircularDependencyPlugin( { + exclude: /node_modules/, + failOnError: true, + allowAsyncCycles: false, + cwd: process.cwd(), + } ), + new ManifestPlugin( { + ...manifestArgs( mode ), + filter( file ) { + return ( file.name || '' ).match( /\.js$/ ); + }, + } ), + new ESLintPlugin( { + emitError: true, + emitWarning: true, + failOnError: true, + } ), + ], + optimization: { + minimizer: createMinimizerRules( mode ), + }, + resolve, +} ); diff --git a/webpack/common.js b/webpack/common.js index 057ab1663dc..a47f62f923d 100644 --- a/webpack/common.js +++ b/webpack/common.js @@ -285,11 +285,11 @@ const gutenbergExternals = { '@wordpress/i18n': [ 'googlesitekit', 'i18n' ], }; -exports.gutenbergExternals = gutenbergExternals; - corePackages.forEach( ( name ) => { gutenbergExternals[ `@wordpress-core/${ name }` ] = [ 'wp', name.replace( /-([a-z])/g, ( match, letter ) => letter.toUpperCase() ), ]; } ); + +exports.gutenbergExternals = gutenbergExternals;