Revert "Related Posts: Hide settings in block themes" (#41203)

* Revert "Related Posts: Hide settings in block themes (#41075)" This reverts commit dd375d8. * changelog --------- Co-authored-by: okmttdhr <[email protected]>
Automattic · Jan 24, 2025 · bc7cd0b · bc7cd0b
1 parent e897ce4
commit bc7cd0b
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 68 deletions.
diff --git a/projects/plugins/jetpack/_inc/client/traffic/related-posts.jsx b/projects/plugins/jetpack/_inc/client/traffic/related-posts.jsx
@@ -1,4 +1,5 @@
 import { ToggleControl, getRedirectUrl } from '@automattic/jetpack-components';
+import { createInterpolateElement } from '@wordpress/element';
 import { __, _x } from '@wordpress/i18n';
 import React from 'react';
 import Card from 'components/card';
@@ -88,31 +89,51 @@ class RelatedPostsComponent extends React.Component {
 		);
 	}
 
-	renderSettings() {
-		const isRelatedPostsActive = this.props.getOptionValue( 'related-posts' );
-		const unavailableInOfflineMode = this.props.isUnavailableInOfflineMode( 'related-posts' );
-		const { isBlockThemeActive } = this.props;
-
+	render() {
+		const isRelatedPostsActive = this.props.getOptionValue( 'related-posts' ),
+			unavailableInOfflineMode = this.props.isUnavailableInOfflineMode( 'related-posts' );
 		return (
-			<>
-				<p>
-					{ __(
-						'Keep your visitors engaged with related content at the bottom of each post.',
-						'jetpack'
-					) }
-				</p>
-				<ModuleToggle
-					slug="related-posts"
-					disabled={ unavailableInOfflineMode }
-					activated={ isRelatedPostsActive }
-					toggling={ this.props.isSavingAnyOption( 'related-posts' ) }
-					toggleModule={ this.props.toggleModuleNow }
+			<SettingsCard { ...this.props } hideButton module="related-posts">
+				<SettingsGroup
+					hasChild
+					disableInOfflineMode
+					module={ this.props.getModule( 'related-posts' ) }
+					support={ {
+						text: __(
+							'The feature helps visitors find more of your content by displaying related posts at the bottom of each post.',
+							'jetpack'
+						),
+						link: getRedirectUrl( 'jetpack-support-related-posts' ),
+					} }
 				>
-					<span className="jp-form-toggle-explanation">
-						{ __( 'Show related content after posts', 'jetpack' ) }
-					</span>
-				</ModuleToggle>
-				{ ! isBlockThemeActive && (
+					<p>
+						{ createInterpolateElement(
+							__(
+								'Keep your visitors engaged with related content at the bottom of each post. These settings won’t apply to <a>related posts added using the block editor</a>.',
+								'jetpack'
+							),
+							{
+								a: (
+									<a
+										href={ getRedirectUrl( 'jetpack-support-related-posts' ) }
+										target="_blank"
+										rel="noopener noreferrer"
+									/>
+								),
+							}
+						) }
+					</p>
+					<ModuleToggle
+						slug="related-posts"
+						disabled={ unavailableInOfflineMode }
+						activated={ isRelatedPostsActive }
+						toggling={ this.props.isSavingAnyOption( 'related-posts' ) }
+						toggleModule={ this.props.toggleModuleNow }
+					>
+						<span className="jp-form-toggle-explanation">
+							{ __( 'Show related content after posts', 'jetpack' ) }
+						</span>
+					</ModuleToggle>
 					<FormFieldset>
 						<ToggleControl
 							checked={ this.props.getOptionValue( 'show_headline', 'related-posts' ) }
@@ -205,28 +226,6 @@ class RelatedPostsComponent extends React.Component {
 							</div>
 						) }
 					</FormFieldset>
-				) }
-			</>
-		);
-	}
-
-	render() {
-		const isRelatedPostsActive = this.props.getOptionValue( 'related-posts' );
-		return (
-			<SettingsCard { ...this.props } hideButton module="related-posts">
-				<SettingsGroup
-					hasChild
-					disableInOfflineMode
-					module={ this.props.getModule( 'related-posts' ) }
-					support={ {
-						text: __(
-							'The feature helps visitors find more of your content by displaying related posts at the bottom of each post.',
-							'jetpack'
-						),
-						link: getRedirectUrl( 'jetpack-support-related-posts' ),
-					} }
-				>
-					{ this.renderSettings() }
 				</SettingsGroup>
 				{ ! this.props.isUnavailableInOfflineMode( 'related-posts' ) &&
 					isRelatedPostsActive &&

diff --git a/projects/plugins/jetpack/changelog/revert-41075-update-related-posts-block-theme b/projects/plugins/jetpack/changelog/revert-41075-update-related-posts-block-theme
@@ -0,0 +1,4 @@
+Significance: patch
+Type: other
+
+Revert "Related Posts: Hide settings in block themes" 
diff --git a/projects/plugins/jetpack/modules/related-posts/jetpack-related-posts.php b/projects/plugins/jetpack/modules/related-posts/jetpack-related-posts.php
@@ -7,7 +7,6 @@
 
 use Automattic\Jetpack\Assets;
 use Automattic\Jetpack\Blocks;
-use Automattic\Jetpack\Redirect;
 use Automattic\Jetpack\Sync\Settings;
 
 /**
@@ -737,28 +736,6 @@ public function print_setting_html() {
 				$ui_settings // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- data is escaped when variable is set.
 			);
 		} else {
-			// Hide settings that does not take effect on block themes.
-			if ( wp_is_block_theme() ) {
-				$ui_settings = sprintf(
-					'<p><a href="%s" target="_blank" rel="noopener noreferrer">%s</a> %s</p>',
-					esc_url(
-						Redirect::get_url(
-							'jetpack-support-related-posts',
-							array(
-								'anchor' => 'adding-related-posts-block-theme',
-								'site'   => $this->get_blog_id(),
-							)
-						)
-					),
-					esc_html__( 'Add a Related Posts Block to your site’s template in the site editor', 'jetpack' ),
-					esc_html__( 'to keep your visitors engaged with related content at the bottom of each post.', 'jetpack' )
-				);
-				printf(
-					$ui_settings // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- data is escaped when variable is set.
-				);
-				return;
-			}
-
 			$template = <<<EOT
 <ul id="settings-reading-relatedposts">
 	<li>