Merge pull request #21882 from Yoast/21632-refactor-isaifeatureactive…

…-property add fallback to isAiFeatureEnabled
Yoast · Dec 20, 2024 · 3e0db5e · 3e0db5e
2 parents 364d23f + ebd11ac
commit 3e0db5e
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 9 deletions.
diff --git a/packages/js/src/components/contentAnalysis/ReadabilityAnalysis.js b/packages/js/src/components/contentAnalysis/ReadabilityAnalysis.js
@@ -235,20 +235,21 @@ ReadabilityAnalysis.defaultProps = {
 	shouldUpsell: false,
 	shouldUpsellHighlighting: false,
 	isAiFeatureEnabled: false,
+	isElementor: false,
 };
 
 export default withSelect( select => {
 	const {
 		getReadabilityResults,
 		getMarkButtonStatus,
 		getIsElementorEditor,
-		getPreference,
+		getIsAiFeatureEnabled,
 	} = select( "yoast-seo/editor" );
 
 	return {
 		...getReadabilityResults(),
 		marksButtonStatus: getMarkButtonStatus(),
 		isElementor: getIsElementorEditor(),
-		isAiFeatureEnabled: getPreference( "isAiFeatureActive", false ),
+		isAiFeatureEnabled: getIsAiFeatureEnabled(),
 	};
 } )( ReadabilityAnalysis );
diff --git a/packages/js/src/components/contentAnalysis/SeoAnalysis.js b/packages/js/src/components/contentAnalysis/SeoAnalysis.js
@@ -7,7 +7,6 @@ import { LocationConsumer, RootContext } from "@yoast/externals/contexts";
 import PropTypes from "prop-types";
 import styled from "styled-components";
 import getIndicatorForScore from "../../analysis/getIndicatorForScore";
-import getL10nObject from "../../analysis/getL10nObject";
 import Results from "../../containers/Results";
 import AnalysisUpsell from "../AnalysisUpsell";
 import MetaboxCollapsible from "../MetaboxCollapsible";
@@ -206,8 +205,7 @@ class SeoAnalysis extends Component {
 	 * @returns {void|JSX.Element} The AI Optimize button, or nothing if the button should not be shown.
 	 */
 	renderAIFixesButton = ( hasAIFixes, id ) => {
-		const { isElementor, isAiFeatureEnabled } = this.props;
-		const isPremium = getL10nObject().isPremium;
+		const { isElementor, isAiFeatureEnabled, isPremium } = this.props;
 
 		// Don't show the button if the AI feature is not enabled for Yoast SEO Premium users.
 		if ( isPremium && ! isAiFeatureEnabled ) {
@@ -232,7 +230,7 @@ class SeoAnalysis extends Component {
 	 */
 	render() {
 		const score = getIndicatorForScore( this.props.overallScore );
-		const isPremium = getL10nObject().isPremium;
+		const { isPremium } = this.props;
 		const highlightingUpsellLink = "shortlinks.upsell.sidebar.highlighting_seo_analysis";
 
 		if ( score.className !== "loading" && this.props.keyword === "" ) {
@@ -308,6 +306,7 @@ SeoAnalysis.propTypes = {
 	shouldUpsellHighlighting: PropTypes.bool,
 	isElementor: PropTypes.bool,
 	isAiFeatureEnabled: PropTypes.bool,
+	isPremium: PropTypes.bool,
 };
 
 SeoAnalysis.defaultProps = {
@@ -320,6 +319,7 @@ SeoAnalysis.defaultProps = {
 	shouldUpsellHighlighting: false,
 	isElementor: false,
 	isAiFeatureEnabled: false,
+	isPremium: false,
 };
 
 export default withSelect( ( select, ownProps ) => {
@@ -328,7 +328,8 @@ export default withSelect( ( select, ownProps ) => {
 		getMarksButtonStatus,
 		getResultsForKeyword,
 		getIsElementorEditor,
-		getPreference,
+		getIsPremium,
+		getIsAiFeatureEnabled,
 	} = select( "yoast-seo/editor" );
 
 	const keyword = getFocusKeyphrase();
@@ -338,6 +339,7 @@ export default withSelect( ( select, ownProps ) => {
 		marksButtonStatus: ownProps.hideMarksButtons ? "disabled" : getMarksButtonStatus(),
 		keyword,
 		isElementor: getIsElementorEditor(),
-		isAiFeatureEnabled: getPreference( "isAiFeatureActive", false ),
+		isPremium: getIsPremium(),
+		isAiFeatureEnabled: getIsAiFeatureEnabled(),
 	};
 } )( SeoAnalysis );
diff --git a/packages/js/src/redux/reducers/preferences.js b/packages/js/src/redux/reducers/preferences.js
@@ -1,4 +1,5 @@
 import { isUndefined, get } from "lodash";
+import { getIsAiFeatureEnabled } from "../selectors/preferences";
 import isContentAnalysisActive from "../../analysis/isContentAnalysisActive";
 import isKeywordAnalysisActive from "../../analysis/isKeywordAnalysisActive";
 import isInclusiveLanguageAnalysisActive from "../../analysis/isInclusiveLanguageAnalysisActive";
@@ -33,7 +34,8 @@ function getDefaultState() {
 		isWincherIntegrationActive: isWincherIntegrationActive(),
 		isInsightsEnabled: get( window, "wpseoScriptData.metabox.isInsightsEnabled", false ),
 		isNewsEnabled: get( window, "wpseoScriptData.metabox.isNewsSeoActive", false ),
-		isAiFeatureActive: Boolean( window.wpseoAdminL10n.isAiFeatureActive ),
+		 // The check for AI feature is deprecated, used as fallback. Should be removed once we stop supporting older versions of premium.
+		isAiFeatureActive: getIsAiFeatureEnabled(),
 		isWooCommerceSeoActive: get( window, "wpseoScriptData.metabox.isWooCommerceSeoActive", false ),
 		isWooCommerceActive: get( window, "wpseoScriptData.metabox.isWooCommerceActive", false ),
 		isRtl: get( window, "wpseoScriptData.metabox.isRtl", false ),

diff --git a/packages/js/src/redux/selectors/preferences.js b/packages/js/src/redux/selectors/preferences.js
@@ -1,4 +1,5 @@
 import { get } from "lodash";
+import { select } from "@wordpress/data";
 import { getIsProduct, getIsProductTerm } from "./editorContext";
 
 /**
@@ -73,3 +74,14 @@ export const getIsWooSeoUpsellTerm = ( state ) => {
 
 	return ! isWooSeoActive && isWooCommerceActive && isProductTerm;
 };
+
+/**
+ * @deprecated This function is deprecated and will be removed in future versions.
+ * Please use the getIsAiFeatureEnabled from yoast-seo-premium store instead.
+ *
+ * @returns {boolean} Whether the AI feature is enabled.
+ */
+export const getIsAiFeatureEnabled = () => {
+	const getIsAiFeatureEnabledFromPremium = select( "yoast-seo-premium/editor" )?.getIsAiFeatureEnabled;
+	return getIsAiFeatureEnabledFromPremium ? getIsAiFeatureEnabledFromPremium() : Boolean( window.wpseoAdminL10n.isAiFeatureActive );
+};