diff --git a/projects/plugins/jetpack/changelog/update-stop-loading-subscribe-block-when-module-disabled b/projects/plugins/jetpack/changelog/update-stop-loading-subscribe-block-when-module-disabled
new file mode 100644
index 0000000000000..20e9453acba35
--- /dev/null
+++ b/projects/plugins/jetpack/changelog/update-stop-loading-subscribe-block-when-module-disabled
@@ -0,0 +1,4 @@
+Significance: minor
+Type: enhancement
+
+Subscriptions: stops loading editor functionality (i.e. the block and panels) when subscriptions module is disabled.
diff --git a/projects/plugins/jetpack/extensions/blocks/subscriptions/edit.js b/projects/plugins/jetpack/extensions/blocks/subscriptions/edit.js
index 244ceea62be85..fd13b816809cf 100644
--- a/projects/plugins/jetpack/extensions/blocks/subscriptions/edit.js
+++ b/projects/plugins/jetpack/extensions/blocks/subscriptions/edit.js
@@ -1,5 +1,4 @@
import { numberFormat, ThemeProvider } from '@automattic/jetpack-components';
-import { useModuleStatus } from '@automattic/jetpack-shared-extension-utils';
import {
BlockControls,
InspectorControls,
@@ -18,7 +17,6 @@ import clsx from 'clsx';
import { isEqual } from 'lodash';
import { getActiveStyleName } from '../../shared/block-styles';
import { getValidatedAttributes } from '../../shared/get-validated-attributes';
-import { isNewsletterFeatureEnabled } from '../../shared/memberships/edit';
import GetAddPaidPlanButton, { paidPlanButtonText } from '../../shared/memberships/utils';
import './view.scss';
import { store as membershipProductsStore } from '../../store/membership-products';
@@ -34,13 +32,10 @@ import {
DEFAULT_SUCCESS_MESSAGE,
} from './constants';
import SubscriptionControls from './controls';
-import { SubscriptionsPlaceholder } from './subscription-placeholder';
-import SubscriptionSkeletonLoader from './subscription-skeleton-loader';
const { getComputedStyle } = window;
const isGradientAvailable = !! useGradient;
const useGradientIfAvailable = isGradientAvailable ? useGradient : () => ( {} );
-const name = metadata.name.replace( 'jetpack/', '' );
const applyFallbackStyles = withFallbackStyles( ( node, ownProps ) => {
const { buttonBackgroundColor, textColor } = ownProps;
@@ -77,9 +72,6 @@ export function SubscriptionEdit( props ) {
} = props;
const blockProps = useBlockProps();
- const { isLoadingModules, isChangingStatus, isModuleActive, changeStatus } =
- useModuleStatus( name );
-
const validatedAttributes = getValidatedAttributes( metadata.attributes, attributes );
if ( ! isEqual( validatedAttributes, attributes ) ) {
setAttributes( validatedAttributes );
@@ -103,12 +95,6 @@ export function SubscriptionEdit( props ) {
const activeStyleName = getActiveStyleName( metadata.styles, className );
const { subscriberCount, subscriberCountString } = useSelect( select => {
- if ( ! isModuleActive ) {
- return {
- subscriberCounts: 0,
- subscriberCountString: '',
- };
- }
const { emailSubscribers, socialFollowers } =
select( membershipProductsStore ).getSubscriberCounts();
let count = emailSubscribers;
@@ -217,9 +203,6 @@ export function SubscriptionEdit( props ) {
const previousButtonBackgroundColor = usePrevious( buttonBackgroundColor );
useEffect( () => {
- if ( ! isModuleActive ) {
- return;
- }
if (
previousButtonBackgroundColor?.color !== borderColor?.color ||
borderColor?.color === buttonBackgroundColor?.color
@@ -227,108 +210,7 @@ export function SubscriptionEdit( props ) {
return;
}
setBorderColor( buttonBackgroundColor.color );
- }, [
- buttonBackgroundColor,
- previousButtonBackgroundColor,
- borderColor,
- setBorderColor,
- isModuleActive,
- ] );
-
- let content;
-
- const paidPlanLabel = paidPlanButtonText( hasTierPlans );
-
- if ( isLoadingModules ) {
- content = ;
- } else if ( ! isModuleActive ) {
- content = (
-
- );
- } else {
- content = (
- <>
-
-
-
- { isNewsletterFeatureEnabled() && (
-
-
-
-
-
- ) }
-
-
-
-
-
- { activeStyleName !== 'button' && (
-
- ) }
- setAttributes( { submitButtonText: value } ) }
- style={ buttonStyles }
- value={ submitButtonText }
- withoutInteractiveFormatting
- allowedFormats={ [ 'core/bold', 'core/italic', 'core/strikethrough' ] }
- />
-
-
-
- { showSubscribersTotal && (
-
- { subscriberCountString }
-
- ) }
-
- >
- );
- }
+ }, [ buttonBackgroundColor, previousButtonBackgroundColor, borderColor, setBorderColor ] );
return (
- { content }
+
+
+
+
+
+
+
+
+
+
+
+
+ { activeStyleName !== 'button' && (
+
+ ) }
+ setAttributes( { submitButtonText: value } ) }
+ style={ buttonStyles }
+ value={ submitButtonText }
+ withoutInteractiveFormatting
+ allowedFormats={ [ 'core/bold', 'core/italic', 'core/strikethrough' ] }
+ />
+
+
+
+ { showSubscribersTotal && (
+
{ subscriberCountString }
+ ) }
+
);
}
diff --git a/projects/plugins/jetpack/extensions/blocks/subscriptions/panel.js b/projects/plugins/jetpack/extensions/blocks/subscriptions/panel.js
index 8fdcd9b3db59e..8e0269029095c 100644
--- a/projects/plugins/jetpack/extensions/blocks/subscriptions/panel.js
+++ b/projects/plugins/jetpack/extensions/blocks/subscriptions/panel.js
@@ -5,9 +5,8 @@ import {
isPrivateSite,
JetpackEditorPanelLogo,
useAnalytics,
- useModuleStatus,
} from '@automattic/jetpack-shared-extension-utils';
-import { Button, ExternalLink, Flex, FlexItem, Notice, PanelRow } from '@wordpress/components';
+import { Button, Notice, PanelRow } from '@wordpress/components';
import { useSelect } from '@wordpress/data';
import {
PluginPrePublishPanel,
@@ -30,32 +29,10 @@ import {
MisconfigurationWarning,
} from '../../shared/memberships/utils';
import { store as membershipProductsStore } from '../../store/membership-products';
-import metadata from './block.json';
import { NewsletterTestEmailModal } from './email-preview';
import './panel.scss';
-const name = metadata.name.replace( 'jetpack/', '' );
-
-const SubscriptionsPanelPlaceholder = ( { children } ) => {
- return (
-
-
- { __(
- 'In order to send posts to your subscribers, activate the Subscriptions feature.',
- 'jetpack'
- ) }
-
- { children }
-
-
- { __( 'Learn more about Subscriptions', 'jetpack' ) }
-
-
-
- );
-};
-
function NewsletterEditorSettingsPanel( { accessLevel } ) {
return (
(
>
);
-function NewsletterPrePublishSettingsPanel( { accessLevel, isModuleActive, showPreviewModal } ) {
- const { tracks } = useAnalytics();
- const { changeStatus, isLoadingModules, isChangingStatus } = useModuleStatus( name );
-
- const enableSubscriptionsModule = () => {
- tracks.recordEvent( 'jetpack_editor_subscriptions_enable' );
- return changeStatus( true );
- };
-
- // Subscriptions will not be triggered for a post that was already published in the past.
- const shouldLoadSubscriptionPlaceholder = useSelect( select => {
- const meta = select( editorStore ).getEditedPostAttribute( 'meta' );
- return ! isModuleActive && ! isLoadingModules && ! meta?.jetpack_post_was_ever_published;
- } );
-
+function NewsletterPrePublishSettingsPanel( { accessLevel, showPreviewModal } ) {
const postVisibility = useSelect( select => select( editorStore ).getEditedPostVisibility() );
const showMisconfigurationWarning = getShowMisconfigurationWarning( postVisibility, accessLevel );
- // Nudge to enable module
- if ( ! isModuleActive && shouldLoadSubscriptionPlaceholder ) {
- return (
- }
- >
-
-
-
-
- );
- }
-
return (
<>
}
>
- { isModuleActive && (
- <>
-
- { showMisconfigurationWarning ? (
-
- ) : (
-
- ) }
-
- >
+
+ { showMisconfigurationWarning ? (
+
+ ) : (
+
) }
+
>
);
@@ -247,7 +177,6 @@ function NewsletterPostPublishSettingsPanel( { accessLevel } ) {
}
export default function SubscribePanels() {
- const { isModuleActive } = useModuleStatus( name );
const postType = useSelect( select => select( editorStore ).getCurrentPostType(), [] );
const [ isModalOpen, setIsModalOpen ] = useState( false );
@@ -273,16 +202,15 @@ export default function SubscribePanels() {
return (
<>
- { isModuleActive && }
+
{
tracks.recordEvent( 'jetpack_send_email_preview_prepublish_preview_button' );
setIsModalOpen( true );
} }
/>
- { isModuleActive && }
+
setIsModalOpen( false ) } />
>
);
diff --git a/projects/plugins/jetpack/extensions/blocks/subscriptions/subscription-placeholder.js b/projects/plugins/jetpack/extensions/blocks/subscriptions/subscription-placeholder.js
deleted file mode 100644
index 10eb1286f8160..0000000000000
--- a/projects/plugins/jetpack/extensions/blocks/subscriptions/subscription-placeholder.js
+++ /dev/null
@@ -1,48 +0,0 @@
-import { useAnalytics, getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils';
-import { Button, ExternalLink, Placeholder } from '@wordpress/components';
-import { useEffect } from '@wordpress/element';
-import { __ } from '@wordpress/i18n';
-import metadata from './block.json';
-
-const icon = getBlockIconComponent( metadata );
-
-export const SubscriptionsPlaceholder = ( { changeStatus, isLoading, isModuleActive } ) => {
- const { tracks } = useAnalytics();
-
- const enableSubscriptionsModule = () => {
- tracks.recordEvent( 'jetpack_editor_subscriptions_enable' );
- return changeStatus( true );
- };
-
- // Track when the placeholder is viewed.
- useEffect( () => {
- tracks.recordEvent( 'jetpack_editor_subscriptions_placeholder_view' );
- }, [ tracks ] );
-
- return (
-
-
-
-
- { __( 'Learn more about the Subscriptions feature.', 'jetpack' ) }
-
-
-
- );
-};
diff --git a/projects/plugins/jetpack/extensions/blocks/subscriptions/subscription-skeleton-loader.js b/projects/plugins/jetpack/extensions/blocks/subscriptions/subscription-skeleton-loader.js
deleted file mode 100644
index bb7f1f2d57c44..0000000000000
--- a/projects/plugins/jetpack/extensions/blocks/subscriptions/subscription-skeleton-loader.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import { LoadingPlaceholder } from '@automattic/jetpack-components';
-import { Placeholder, Flex, FlexBlock, FlexItem } from '@wordpress/components';
-
-function SubscriptionSkeletonLoader() {
- return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
-}
-export default SubscriptionSkeletonLoader;
diff --git a/projects/plugins/jetpack/extensions/blocks/subscriptions/subscriptions.php b/projects/plugins/jetpack/extensions/blocks/subscriptions/subscriptions.php
index 3c16140fb731a..ec3b6f1d915aa 100644
--- a/projects/plugins/jetpack/extensions/blocks/subscriptions/subscriptions.php
+++ b/projects/plugins/jetpack/extensions/blocks/subscriptions/subscriptions.php
@@ -43,9 +43,16 @@ function register_block() {
return;
}
+ /**
+ * Do not proceed if the newsletter feature (Subscriptions module) is not enabled
+ */
+ if ( ! Jetpack::is_module_active( 'subscriptions' ) ) {
+ return;
+ }
+
require_once JETPACK__PLUGIN_DIR . '/modules/memberships/class-jetpack-memberships.php';
- if ( \Jetpack_Memberships::should_enable_monetize_blocks_in_editor() ) {
+ if ( \Jetpack_Memberships::should_enable_monetize_blocks_in_editor() ) {
Blocks::jetpack_register_block(
__DIR__,
array(
@@ -61,22 +68,6 @@ function register_block() {
);
}
- /*
- * If the Subscriptions module is not active,
- * do not make any further changes on the site.
- */
- if ( ! Jetpack::is_module_active( 'subscriptions' ) ) {
- return;
- }
-
- /**
- * Do not proceed if the newsletter feature is not enabled
- * or if the 'Jetpack_Memberships' class does not exists.
- */
- if ( ! class_exists( '\Jetpack_Memberships' ) ) {
- return;
- }
-
register_post_meta(
'post',
META_NAME_FOR_POST_LEVEL_ACCESS_SETTINGS,
diff --git a/projects/plugins/jetpack/extensions/blocks/subscriptions/test/edit.js b/projects/plugins/jetpack/extensions/blocks/subscriptions/test/edit.js
index c04916f35df8a..a7dd734ca1fba 100644
--- a/projects/plugins/jetpack/extensions/blocks/subscriptions/test/edit.js
+++ b/projects/plugins/jetpack/extensions/blocks/subscriptions/test/edit.js
@@ -1,5 +1,5 @@
import { useModuleStatus } from '@automattic/jetpack-shared-extension-utils';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { SubscriptionEdit } from '../edit';
@@ -104,34 +104,6 @@ describe( 'SubscriptionEdit', () => {
).toBeInTheDocument();
} );
- test( 'renders subscription placeholder when module is disabled', async () => {
- useModuleStatus.mockReturnValue( {
- isModuleActive: false,
- changeStatus: jest.fn(),
- } );
-
- render( );
-
- const button = screen.getByText( defaultAttributes.subscriptionPlaceholderText );
- fireEvent.submit( button );
- expect( screen.getByText( defaultAttributes.subscriptionPlaceholderText ) ).toBeInTheDocument();
- } );
-
- test( 'calls subscription activation when placeholder button is clicked', async () => {
- const user = userEvent.setup();
- const onChangeStatus = jest.fn();
- useModuleStatus.mockReturnValue( {
- isModuleActive: false,
- changeStatus: onChangeStatus,
- } );
-
- render( );
-
- const actionButton = screen.getByText( defaultAttributes.subscriptionPlaceholderText );
- await user.click( actionButton );
- expect( onChangeStatus ).toHaveBeenCalledWith( true );
- } );
-
test( 'renders button with default text', async () => {
render( );