From 42dd0b460b796272f7dec9dadcf07ab2c9ab749c Mon Sep 17 00:00:00 2001 From: Ankit Gade Date: Mon, 24 Feb 2025 15:21:49 +0530 Subject: [PATCH] Code restructuring. --- .../SettingPanel.js | 26 +++-- .../SettingsForm.js | 94 +++++++++---------- .../block-editor-plugin/editor-styles.scss | 29 ++++++ .../{ => block-editor-plugin}/index.js | 4 + .../plugin-registration.js | 9 +- .../plugin-registration.test.js | 22 +++-- .../common/constants.js | 19 ++++ includes/Modules/Reader_Revenue_Manager.php | 4 +- webpack/adminCss.config.js | 1 - webpack/gutenbergBlocks.config.js | 6 +- 10 files changed, 132 insertions(+), 82 deletions(-) rename blocks/reader-revenue-manager/{components => block-editor-plugin}/SettingPanel.js (71%) rename blocks/reader-revenue-manager/{components => block-editor-plugin}/SettingsForm.js (61%) create mode 100644 blocks/reader-revenue-manager/block-editor-plugin/editor-styles.scss rename blocks/reader-revenue-manager/{ => block-editor-plugin}/index.js (83%) rename blocks/reader-revenue-manager/{ => block-editor-plugin}/plugin-registration.js (78%) rename blocks/reader-revenue-manager/{ => block-editor-plugin}/plugin-registration.test.js (80%) create mode 100644 blocks/reader-revenue-manager/common/constants.js diff --git a/blocks/reader-revenue-manager/components/SettingPanel.js b/blocks/reader-revenue-manager/block-editor-plugin/SettingPanel.js similarity index 71% rename from blocks/reader-revenue-manager/components/SettingPanel.js rename to blocks/reader-revenue-manager/block-editor-plugin/SettingPanel.js index c3a1099acd5..e1b74161b2a 100644 --- a/blocks/reader-revenue-manager/components/SettingPanel.js +++ b/blocks/reader-revenue-manager/block-editor-plugin/SettingPanel.js @@ -20,7 +20,6 @@ * WordPress dependencies */ import { __ } from '@wordpress/i18n'; -import { Fragment } from '@wordpress/element'; // eslint-disable-next-line import/no-unresolved import { PluginDocumentSettingPanel } from '@wordpress-core/edit-post'; @@ -32,19 +31,16 @@ import SettingsForm from './SettingsForm'; export default function SettingPanel() { return ( - - } - > -
-

- { __( 'Reader Revenue Manager', 'google-site-kit' ) } -

- -
- - + } + > +
+

{ __( 'Reader Revenue Manager', 'google-site-kit' ) }

+ +
+ ); } diff --git a/blocks/reader-revenue-manager/components/SettingsForm.js b/blocks/reader-revenue-manager/block-editor-plugin/SettingsForm.js similarity index 61% rename from blocks/reader-revenue-manager/components/SettingsForm.js rename to blocks/reader-revenue-manager/block-editor-plugin/SettingsForm.js index b4087776a17..7d99bac9ed2 100644 --- a/blocks/reader-revenue-manager/components/SettingsForm.js +++ b/blocks/reader-revenue-manager/block-editor-plugin/SettingsForm.js @@ -23,16 +23,16 @@ import { __, sprintf } from '@wordpress/i18n'; // eslint-disable-next-line import/no-unresolved import { SelectControl } from '@wordpress-core/components'; // eslint-disable-next-line import/no-unresolved -import { Fragment, useState } from '@wordpress-core/element'; +import { useState } from '@wordpress-core/element'; /** * Internal dependencies */ import Data from 'googlesitekit-data'; import { MODULES_READER_REVENUE_MANAGER } from '../../../assets/js/modules/reader-revenue-manager/datastore/constants'; +import { CORE_EDITOR } from '../common/constants'; const { select, dispatch } = Data; -const CORE_EDITOR = 'core/editor'; export default function SettingsForm() { const productIDs = @@ -64,52 +64,50 @@ export default function SettingsForm() { } return ( - - { + const productIDParts = productID.split( ':' ); + const label = + productIDParts.length > 1 + ? productIDParts[ 1 ] + : productID; + return { + label: sprintf( + /* translators: %s: Product ID */ + __( 'Use "%s"', 'google-site-kit' ), + label ), - value: 'none', - }, - { - label: __( 'Use "open access"', 'google-site-kit' ), - value: 'openaccess', - }, - ...productIDs.map( ( productID ) => { - const productIDParts = productID.split( ':' ); - const label = - productIDParts.length > 1 - ? productIDParts[ 1 ] - : productID; - return { - label: sprintf( - /* translators: %s: Product ID */ - __( 'Use "%s"', 'google-site-kit' ), - label - ), - value: productID, - }; - } ), - ] } - help={ help } - /> - + value: productID, + }; + } ), + ] } + help={ help } + /> ); } diff --git a/blocks/reader-revenue-manager/block-editor-plugin/editor-styles.scss b/blocks/reader-revenue-manager/block-editor-plugin/editor-styles.scss new file mode 100644 index 00000000000..3070a02a4e2 --- /dev/null +++ b/blocks/reader-revenue-manager/block-editor-plugin/editor-styles.scss @@ -0,0 +1,29 @@ +/** + * Reader Revenue Manager: Editor Styles + * + * Site Kit by Google, Copyright 2025 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. + */ + +.editor-sidebar { + .googlesitekit-rrm-settings-panel { + + .googlesitekit-rrm-panel__select-control { + label { + text-transform: none; + white-space: break-spaces; + } + } + } +} diff --git a/blocks/reader-revenue-manager/index.js b/blocks/reader-revenue-manager/block-editor-plugin/index.js similarity index 83% rename from blocks/reader-revenue-manager/index.js rename to blocks/reader-revenue-manager/block-editor-plugin/index.js index 1d836e1b0ab..0cecbcff0fc 100644 --- a/blocks/reader-revenue-manager/index.js +++ b/blocks/reader-revenue-manager/block-editor-plugin/index.js @@ -16,6 +16,10 @@ * limitations under the License. */ +import Data from 'googlesitekit-data'; +import { registerStore } from '../../../assets/js/modules/reader-revenue-manager/datastore'; import { registerReaderRevenueManagerPlugin } from './plugin-registration'; +registerStore( Data ); + registerReaderRevenueManagerPlugin(); diff --git a/blocks/reader-revenue-manager/plugin-registration.js b/blocks/reader-revenue-manager/block-editor-plugin/plugin-registration.js similarity index 78% rename from blocks/reader-revenue-manager/plugin-registration.js rename to blocks/reader-revenue-manager/block-editor-plugin/plugin-registration.js index 30e9d8ccb88..a31c8962cd4 100644 --- a/blocks/reader-revenue-manager/plugin-registration.js +++ b/blocks/reader-revenue-manager/block-editor-plugin/plugin-registration.js @@ -26,15 +26,12 @@ import { registerPlugin } from '@wordpress-core/plugins'; * Internal dependencies */ import Data from 'googlesitekit-data'; -import { registerStore } from '../../assets/js/modules/reader-revenue-manager/datastore'; -import { CORE_MODULES } from '../../assets/js/googlesitekit/modules/datastore/constants'; -import SettingPanel from './components/SettingPanel'; -import { MODULES_READER_REVENUE_MANAGER } from '../../assets/js/modules/reader-revenue-manager/datastore/constants'; +import { CORE_MODULES } from '../../../assets/js/googlesitekit/modules/datastore/constants'; +import SettingPanel from './SettingPanel'; +import { MODULES_READER_REVENUE_MANAGER } from '../../../assets/js/modules/reader-revenue-manager/datastore/constants'; const { select, resolveSelect } = Data; -registerStore( Data ); - export function registerReaderRevenueManagerPlugin() { return Promise.all( [ resolveSelect( CORE_MODULES ).getModules(), diff --git a/blocks/reader-revenue-manager/plugin-registration.test.js b/blocks/reader-revenue-manager/block-editor-plugin/plugin-registration.test.js similarity index 80% rename from blocks/reader-revenue-manager/plugin-registration.test.js rename to blocks/reader-revenue-manager/block-editor-plugin/plugin-registration.test.js index a2a05766f4c..f62255acb2a 100644 --- a/blocks/reader-revenue-manager/plugin-registration.test.js +++ b/blocks/reader-revenue-manager/block-editor-plugin/plugin-registration.test.js @@ -35,11 +35,14 @@ jest.mock( '@wordpress-core/components', () => ( {} ), { jest.mock( '@wordpress-core/element', () => ( {} ), { virtual: true } ); import Data from 'googlesitekit-data'; +import SettingPanel from './SettingPanel'; +import { MODULES_READER_REVENUE_MANAGER } from '../../../assets/js/modules/reader-revenue-manager/datastore/constants'; +import { provideModules } from '../../../tests/js/utils'; import { registerPlugin } from '@wordpress-core/plugins'; +import { registerStore } from '../../../assets/js/modules/reader-revenue-manager/datastore'; import { registerReaderRevenueManagerPlugin } from './plugin-registration'; -import SettingPanel from './components/SettingPanel'; -import { CORE_MODULES } from '../../assets/js/googlesitekit/modules/datastore/constants'; -import { MODULES_READER_REVENUE_MANAGER } from '../../assets/js/modules/reader-revenue-manager/datastore/constants'; + +registerStore( Data ); const { dispatch } = Data; @@ -53,14 +56,11 @@ describe( 'registerReaderRevenueManagerPlugin', () => { } ); it( 'should register the plugin if the module is connected', async () => { - dispatch( CORE_MODULES ).receiveGetModules( [ + provideModules( Data, [ { slug: 'reader-revenue-manager', active: true, connected: true, - shareable: true, - recoverable: true, - internal: false, }, ] ); @@ -75,7 +75,13 @@ describe( 'registerReaderRevenueManagerPlugin', () => { } ); it( 'should not register the plugin if the module is not connected', async () => { - dispatch( CORE_MODULES ).receiveGetModules( [] ); + provideModules( Data, [ + { + slug: 'reader-revenue-manager', + active: true, + connected: false, + }, + ] ); await registerReaderRevenueManagerPlugin(); diff --git a/blocks/reader-revenue-manager/common/constants.js b/blocks/reader-revenue-manager/common/constants.js new file mode 100644 index 00000000000..8db8dbdae23 --- /dev/null +++ b/blocks/reader-revenue-manager/common/constants.js @@ -0,0 +1,19 @@ +/** + * Reader Revenue Manager blocks constants. + * + * Site Kit by Google, Copyright 2025 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. + */ + +export const CORE_EDITOR = 'core/editor'; diff --git a/includes/Modules/Reader_Revenue_Manager.php b/includes/Modules/Reader_Revenue_Manager.php index 1a14ee5a93e..9575dd319d4 100644 --- a/includes/Modules/Reader_Revenue_Manager.php +++ b/includes/Modules/Reader_Revenue_Manager.php @@ -452,7 +452,7 @@ protected function setup_assets() { $assets[] = new Script( 'googlesitekit-reader-revenue-manager-block-editor-plugin', array( - 'src' => $this->context->url( 'dist/assets/js/blocks/reader-revenue-manager/index.js' ), + 'src' => $base_url . 'js/blocks/reader-revenue-manager/block-editor-plugin/index.js', 'dependencies' => array( 'googlesitekit-data', 'googlesitekit-i18n', @@ -466,7 +466,7 @@ protected function setup_assets() { $assets[] = new Stylesheet( 'googlesitekit-block-editor-css', array( - 'src' => $base_url . 'css/googlesitekit-block-editor-css.css', + 'src' => $base_url . 'js/blocks/reader-revenue-manager/block-editor-plugin/editor-styles.css', 'dependencies' => array(), 'load_contexts' => array( Asset::CONTEXT_ADMIN_POST_EDITOR ), ) diff --git a/webpack/adminCss.config.js b/webpack/adminCss.config.js index 5b0f99fc6eb..81cb27fd6ca 100644 --- a/webpack/adminCss.config.js +++ b/webpack/adminCss.config.js @@ -35,7 +35,6 @@ module.exports = ( mode ) => ( { 'googlesitekit-wp-dashboard-css': './assets/sass/wpdashboard.scss', 'googlesitekit-authorize-application-css': './assets/sass/authorize-application.scss', - 'googlesitekit-block-editor-css': './assets/sass/block-editor.scss', }, module: { rules: [ diff --git a/webpack/gutenbergBlocks.config.js b/webpack/gutenbergBlocks.config.js index 7b48921397e..881d1cb121b 100644 --- a/webpack/gutenbergBlocks.config.js +++ b/webpack/gutenbergBlocks.config.js @@ -41,8 +41,10 @@ const { module.exports = ( mode ) => ( { entry: { // Reader Revenue Manager - 'reader-revenue-manager/index': - './blocks/reader-revenue-manager/index.js', + 'reader-revenue-manager/block-editor-plugin/index': + './blocks/reader-revenue-manager/block-editor-plugin/index.js', + 'reader-revenue-manager/block-editor-plugin/editor-styles': + './blocks/reader-revenue-manager/block-editor-plugin/editor-styles.scss', // Sign in with Google block. 'sign-in-with-google/index': './blocks/sign-in-with-google/index.js', 'sign-in-with-google/editor-styles':