Fediverse: remove support for Jetpack/Atomic sites (#96989)

Automattic · Dec 2, 2024 · 03adc44 · 03adc44
1 parent 001e86d
commit 03adc44
Show file tree

Hide file tree

Showing 6 changed files with 40 additions and 168 deletions.
diff --git a/client/my-sites/site-settings/fediverse-settings/JetpackFediverseSettingsSection.js b/client/my-sites/site-settings/fediverse-settings/JetpackFediverseSettingsSection.js
diff --git a/client/my-sites/site-settings/fediverse-settings/WpcomFediverseSettingsSection.js b/client/my-sites/site-settings/fediverse-settings/WpcomFediverseSettingsSection.js
@@ -1,5 +1,5 @@
 import { getPlan, PLAN_BUSINESS } from '@automattic/calypso-products';
-import { Card, Button } from '@automattic/components';
+import { Button } from '@automattic/components';
 import { ToggleControl } from '@wordpress/components';
 import { addQueryArgs } from '@wordpress/url';
 import { useTranslate } from 'i18n-calypso';
@@ -19,15 +19,7 @@ import {
 	getSitePlanSlug,
 } from 'calypso/state/sites/selectors';
 
-function Wrapper( { children, needsCard } ) {
-	return needsCard ? (
-		<Card className="site-settings__card">{ children }</Card>
-	) : (
-		<p className="fediverse-settings-wrapper">{ children }</p>
-	);
-}
-
-const DomainUpsellCard = ( { siteId, needsCard } ) => {
+const DomainUpsellCard = ( { siteId } ) => {
 	const domain = useSelector( ( state ) => getSiteDomain( state, siteId ) );
 	const linkUrl = addQueryArgs( domainAddNew( domain ), {
 		domainAndPlanPackage: 'true',
@@ -40,7 +32,7 @@ const DomainUpsellCard = ( { siteId, needsCard } ) => {
 		recordTracksEvent( 'calypso_activitypub_domain_upsell_click', { route: currentRoute } );
 	};
 	return (
-		<Wrapper needsCard={ needsCard }>
+		<div>
 			<p>
 				{ translate(
 					'Unlock the full power of the fediverse with a memorable custom domain. Your domain also means that you can take your followers with you, using self-hosted WordPress with the ActivityPub plugin, or any other ActivityPub software.'
@@ -49,7 +41,7 @@ const DomainUpsellCard = ( { siteId, needsCard } ) => {
 			<Button primary href={ linkUrl } onClick={ recordClick }>
 				{ translate( 'Add a custom domain' ) }
 			</Button>
-		</Wrapper>
+		</div>
 	);
 };
 
@@ -96,7 +88,7 @@ const DomainPendingWarning = ( { siteId, domains } ) => {
 	);
 };
 
-const BusinessPlanUpsellCard = ( { siteId, needsCard } ) => {
+const BusinessPlanUpsellCard = ( { siteId } ) => {
 	const sitePlanSlug = useSelector( ( state ) => getSitePlanSlug( state, siteId ) ?? '' );
 	// If the user is already on Atomic, we'll be in `JetpackFediverseSettingsSection` instead.
 	// But they could have purchased the upgrade and not have transferred yet.
@@ -113,7 +105,7 @@ const BusinessPlanUpsellCard = ( { siteId, needsCard } ) => {
 	if ( isBusinessPlan ) {
 		// show a card that links to the plugin page to install the ActivityPub plugin
 		return (
-			<Wrapper needsCard={ needsCard }>
+			<div>
 				<p>
 					{ translate(
 						'Install the ActivityPub plugin to unlock per-author profiles, fine-grained controls, and more.'
@@ -122,11 +114,11 @@ const BusinessPlanUpsellCard = ( { siteId, needsCard } ) => {
 				<Button primary href={ `/plugins/activitypub/${ domain }` }>
 					{ translate( 'Install ActivityPub plugin' ) }
 				</Button>
-			</Wrapper>
+			</div>
 		);
 	}
 	return (
-		<Wrapper needsCard={ needsCard }>
+		<div>
 			<p>
 				{ translate(
 					// Translators: %(planName)s is the name of a plan, eg "Business" or "Creator"
@@ -137,7 +129,7 @@ const BusinessPlanUpsellCard = ( { siteId, needsCard } ) => {
 			<Button primary href={ linkUrl } onClick={ recordClick }>
 				{ translate( 'Upgrade to %(planName)s', { args: { planName } } ) }
 			</Button>
-		</Wrapper>
+		</div>
 	);
 };
 
@@ -152,7 +144,7 @@ const hasPendingDomain = ( domains ) => {
 	return pendingDomain;
 };
 
-const EnabledSettingsSection = ( { data, siteId, needsCard } ) => {
+const EnabledSettingsSection = ( { data, siteId } ) => {
 	const translate = useTranslate();
 	const domains = useSiteDomains( siteId );
 	const { blogIdentifier = '' } = data;
@@ -162,8 +154,8 @@ const EnabledSettingsSection = ( { data, siteId, needsCard } ) => {
 
 	return (
 		<>
-			{ ! hasDomain && <DomainUpsellCard siteId={ siteId } needsCard={ needsCard } /> }
-			<Wrapper needsCard={ needsCard }>
+			{ ! hasDomain && <DomainUpsellCard siteId={ siteId } /> }
+			<div className="fediverse-settings-wrapper">
 				<p>
 					{ translate(
 						'People on the Fediverse (such as on Mastodon) can follow your site using this identifier:'
@@ -173,10 +165,8 @@ const EnabledSettingsSection = ( { data, siteId, needsCard } ) => {
 				<p>
 					<ClipboardButtonInput value={ blogIdentifier } />
 				</p>
-			</Wrapper>
-			{ hasDomain && ! isDomainPending && (
-				<BusinessPlanUpsellCard siteId={ siteId } needsCard={ needsCard } />
-			) }
+			</div>
+			{ hasDomain && ! isDomainPending && <BusinessPlanUpsellCard siteId={ siteId } /> }
 		</>
 	);
 };
@@ -186,7 +176,7 @@ function useDispatchSuccessNotice() {
 	return ( message ) => dispatch( successNotice( message, { duration: 3333 } ) );
 }
 
-export const WpcomFediverseSettingsSection = ( { siteId, needsBorders = true } ) => {
+export const WpcomFediverseSettingsSection = ( { siteId } ) => {
 	const translate = useTranslate();
 	const dispatchSuccessNotice = useDispatchSuccessNotice();
 	const siteTitle = useSelector( ( state ) => getSiteTitle( state, siteId ) );
@@ -214,7 +204,7 @@ export const WpcomFediverseSettingsSection = ( { siteId, needsBorders = true } )
 		: baseSettingsLink;
 	return (
 		<>
-			<Wrapper needsCard={ needsBorders }>
+			<div className="fediverse-settings-wrapper">
 				<p>
 					{ translate(
 						'Broadcast your blog into the fediverse! Attract followers, deliver updates, and receive comments from a diverse user base of ActivityPub-compliant platforms like {{b}}Mastodon{{/b}}.',
@@ -240,10 +230,8 @@ export const WpcomFediverseSettingsSection = ( { siteId, needsBorders = true } )
 						} ) }
 					</Notice>
 				) }
-			</Wrapper>
-			{ isEnabled && (
-				<EnabledSettingsSection data={ data } siteId={ siteId } needsCard={ needsBorders } />
-			) }
+			</div>
+			{ isEnabled && <EnabledSettingsSection data={ data } siteId={ siteId } /> }
 		</>
 	);
 };
diff --git a/client/my-sites/site-settings/fediverse-settings/index.jsx b/client/my-sites/site-settings/fediverse-settings/index.jsx
diff --git a/client/my-sites/site-settings/settings-discussion/main.jsx b/client/my-sites/site-settings/settings-discussion/main.jsx
@@ -4,7 +4,6 @@ import DocumentHead from 'calypso/components/data/document-head';
 import InlineSupportLink from 'calypso/components/inline-support-link';
 import Main from 'calypso/components/main';
 import NavigationHeader from 'calypso/components/navigation-header';
-import { FediverseDeprecatedDiscussionSection } from 'calypso/my-sites/site-settings/fediverse-settings';
 import DiscussionForm from 'calypso/my-sites/site-settings/form-discussion';
 import JetpackDevModeNotice from 'calypso/my-sites/site-settings/jetpack-dev-mode-notice';
 import SiteSettingsNavigation from 'calypso/my-sites/site-settings/navigation';
@@ -29,7 +28,6 @@ const SiteSettingsDiscussion = ( { site, translate } ) => (
 		/>
 
 		<SiteSettingsNavigation site={ site } section="discussion" />
-		<FediverseDeprecatedDiscussionSection />
 		<DiscussionForm />
 	</Main>
 );

diff --git a/client/sites/marketing/connections/services/fediverse.jsx b/client/sites/marketing/connections/services/fediverse.jsx
@@ -1,15 +1,24 @@
 import { Badge, FoldableCard } from '@automattic/components';
 import { useTranslate } from 'i18n-calypso';
 import { useSelector } from 'react-redux';
-import QueryPlugins from 'calypso/components/data/query-plugins';
 import SocialLogo from 'calypso/components/social-logo';
-import { FediverseServiceSection } from 'calypso/my-sites/site-settings/fediverse-settings';
+import { WpcomFediverseSettingsSection } from 'calypso/my-sites/site-settings/fediverse-settings/WpcomFediverseSettingsSection';
 import { useActivityPubStatus } from 'calypso/state/activitypub/use-activitypub-status';
-import { getPluginOnSite } from 'calypso/state/plugins/installed/selectors';
 import { getSite } from 'calypso/state/sites/selectors';
 import isJetpackSite from 'calypso/state/sites/selectors/is-jetpack-site';
 import { getSelectedSiteId } from 'calypso/state/ui/selectors';
 
+const FediverseServiceSection = () => {
+	const siteId = useSelector( getSelectedSiteId );
+	const isJetpack = useSelector( ( state ) => isJetpackSite( state, siteId ) );
+
+	if ( isJetpack ) {
+		return null;
+	}
+
+	return <WpcomFediverseSettingsSection siteId={ siteId } />;
+};
+
 function FediverseHeader() {
 	const translate = useTranslate();
 	return (
@@ -28,26 +37,9 @@ function FediverseHeader() {
 	);
 }
 
-function JetpackFediverseStatus( { siteId } ) {
-	const translate = useTranslate();
-	const plugin = useSelector( ( state ) => getPluginOnSite( state, siteId, 'activitypub' ) );
-	const pluginIsActive = plugin?.active;
-	const pluginIsInstalledAndInactive = plugin && ! pluginIsActive;
-	return (
-		<>
-			<QueryPlugins siteId={ siteId } />
-			{ ( ! plugin || pluginIsInstalledAndInactive ) && (
-				<Badge type="info">{ translate( 'Inactive' ) }</Badge>
-			) }
-			{ pluginIsActive && <Badge type="info-blue">{ translate( 'Enabled' ) }</Badge> }
-		</>
-	);
-}
-
 function FediverseStatus() {
 	const translate = useTranslate();
 	const siteId = useSelector( getSelectedSiteId );
-	const isJetpack = useSelector( ( state ) => isJetpackSite( state, siteId ) );
 	const site = useSelector( ( state ) => getSite( state, siteId ) );
 	const isPrivate = site?.is_private || site?.is_coming_soon;
 	const { isEnabled, isLoading, isError } = useActivityPubStatus( siteId );
@@ -57,10 +49,6 @@ function FediverseStatus() {
 		return null;
 	}
 
-	if ( isJetpack ) {
-		return <JetpackFediverseStatus siteId={ siteId } />;
-	}
-
 	return isEnabled ? (
 		<Badge type="info-blue">{ translate( 'Enabled' ) }</Badge>
 	) : (
@@ -69,6 +57,11 @@ function FediverseStatus() {
 }
 
 export default function Fediverse() {
+	const siteId = useSelector( getSelectedSiteId );
+	const isJetpack = useSelector( ( state ) => isJetpackSite( state, siteId ) );
+	if ( isJetpack ) {
+		return null;
+	}
 	return (
 		<li>
 			<FoldableCard
@@ -79,7 +72,7 @@ export default function Fediverse() {
 				clickableHeader
 				compact
 			>
-				<FediverseServiceSection needsBorders={ false } />
+				<FediverseServiceSection />
 			</FoldableCard>
 		</li>
 	);

diff --git a/client/sites/marketing/style.scss b/client/sites/marketing/style.scss
@@ -129,6 +129,10 @@
 		display: flex;
 	}
 }
+.sharing-service--fediverse .notice.is-compact {
+	margin-left: 0;
+	margin-right: 0;
+}
 
 .buttons__sharing-settings,
 .connections__sharing-settings {