From 0ec44c84ff4444bbef3011711ea2388275a8e3d1 Mon Sep 17 00:00:00 2001 From: Marko Andrijasevic Date: Wed, 1 Mar 2017 19:04:37 +0100 Subject: [PATCH] Disable related fields and buttons when module is inactive --- .../site-settings/seo-settings/form.jsx | 62 ++++++++++++------- client/my-sites/site-settings/style.scss | 4 -- 2 files changed, 41 insertions(+), 25 deletions(-) diff --git a/client/my-sites/site-settings/seo-settings/form.jsx b/client/my-sites/site-settings/seo-settings/form.jsx index cad198f4e5262..629f80fe4b2eb 100644 --- a/client/my-sites/site-settings/seo-settings/form.jsx +++ b/client/my-sites/site-settings/seo-settings/form.jsx @@ -34,7 +34,12 @@ import FormSettingExplanation from 'components/forms/form-setting-explanation'; import CountedTextarea from 'components/forms/counted-textarea'; import Banner from 'components/banner'; import PageViewTracker from 'lib/analytics/page-view-tracker'; -import { getSiteOption, getSeoTitleFormatsForSite, isJetpackMinimumVersion } from 'state/sites/selectors'; +import { + getSiteOption, + getSeoTitleFormatsForSite, + isJetpackMinimumVersion, + isJetpackSite, +} from 'state/sites/selectors'; import { getSelectedSite, getSelectedSiteId } from 'state/ui/selectors'; import { isJetpackModuleActive } from 'state/selectors'; import { toApi as seoTitleToApi } from 'components/seo/meta-title-editor/mappings'; @@ -370,6 +375,7 @@ export const SeoForm = React.createClass( { render() { const { siteId, + siteIsJetpack, jetpackManagementUrl, jetpackVersionSupportsSeo, showAdvancedSeo, @@ -379,7 +385,6 @@ export const SeoForm = React.createClass( { isVerificationToolsActive, } = this.props; const { - jetpack = false, settings: { blog_public = 1 } = {}, @@ -401,8 +406,10 @@ export const SeoForm = React.createClass( { let { googleCode, bingCode, pinterestCode, yandexCode } = this.state; const isSitePrivate = parseInt( blog_public, 10 ) !== 1; - const isJetpackUnsupported = jetpack && ! jetpackVersionSupportsSeo; + const isJetpackUnsupported = siteIsJetpack && ! jetpackVersionSupportsSeo; const isDisabled = isSitePrivate || isJetpackUnsupported || isSubmittingForm || isFetchingSettings; + const isSeoDisabled = isDisabled || ( isSeoToolsActive === false ); + const isVerificationDisabled = isDisabled || ( isVerificationToolsActive === false ); const isSaveDisabled = isDisabled || isSubmittingForm || ( ! showPasteError && invalidCodes.length > 0 ); const sitemapUrl = `${ siteUrl }/sitemap.xml`; @@ -420,17 +427,17 @@ export const SeoForm = React.createClass( { return includes( invalidCodes, service ); }; - const nudgeTitle = jetpack + const nudgeTitle = siteIsJetpack ? this.translate( 'Enable SEO Tools features by upgrading to Jetpack Professional' ) : this.translate( 'Enable SEO Tools features by upgrading to the Business Plan' ); - const submitButton = ( + const seoSubmitButton = (

@@ -667,7 +685,7 @@ export const SeoForm = React.createClass( { value={ googleCode } id="verification_code_google" spellCheck="false" - disabled={ isDisabled } + disabled={ isVerificationDisabled } isError={ hasError( 'google' ) } placeholder={ getMetaTag( 'google', placeholderTagContent ) } onChange={ this.changeGoogleCode } /> @@ -681,7 +699,7 @@ export const SeoForm = React.createClass( { value={ bingCode } id="verification_code_bing" spellCheck="false" - disabled={ isDisabled } + disabled={ isVerificationDisabled } isError={ hasError( 'bing' ) } placeholder={ getMetaTag( 'bing', placeholderTagContent ) } onChange={ this.changeBingCode } /> @@ -695,7 +713,7 @@ export const SeoForm = React.createClass( { value={ pinterestCode } id="verification_code_pinterest" spellCheck="false" - disabled={ isDisabled } + disabled={ isVerificationDisabled } isError={ hasError( 'pinterest' ) } placeholder={ getMetaTag( 'pinterest', placeholderTagContent ) } onChange={ this.changePinterestCode } /> @@ -709,7 +727,7 @@ export const SeoForm = React.createClass( { value={ yandexCode } id="verification_code_yandex" spellCheck="false" - disabled={ isDisabled } + disabled={ isVerificationDisabled } isError={ hasError( 'yandex' ) } placeholder={ getMetaTag( 'yandex', placeholderTagContent ) } onChange={ this.changeYandexCode } /> @@ -750,12 +768,14 @@ const mapStateToProps = ( state, ownProps ) => { // SEO Tools are available with Business plan on WordPress.com, and with Premium plan on Jetpack sites const isAdvancedSeoEligible = site && site.plan && hasBusinessPlan( site.plan ); const siteId = getSelectedSiteId( state ); + const siteIsJetpack = isJetpackSite( state, siteId ); const jetpackManagementUrl = getSiteOption( state, siteId, 'admin_url' ); const jetpackVersionSupportsSeo = isJetpackMinimumVersion( state, siteId, '4.4-beta1' ); - const isAdvancedSeoSupported = site && ( ! site.jetpack || ( site.jetpack && jetpackVersionSupportsSeo ) ); + const isAdvancedSeoSupported = site && ( ! siteIsJetpack || ( siteIsJetpack && jetpackVersionSupportsSeo ) ); return { - siteId: siteId, + siteId, + siteIsJetpack, selectedSite: getSelectedSite( state ), storedTitleFormats: getSeoTitleFormatsForSite( getSelectedSite( state ) ), showAdvancedSeo: isAdvancedSeoEligible && isAdvancedSeoSupported, diff --git a/client/my-sites/site-settings/style.scss b/client/my-sites/site-settings/style.scss index 897dee04b9766..e498469729dae 100644 --- a/client/my-sites/site-settings/style.scss +++ b/client/my-sites/site-settings/style.scss @@ -131,10 +131,6 @@ } } - .seo-settings__seo-form .section-header { - margin-top: 32px; - } - .seo-settings__seo-form .seo-settings__preview-button { display: block; float: left;