SEO Tools: add archive_title page title token

[samiff]

Changes proposed in this Pull Request

Related (prerequisite): Automattic/jetpack#20920

This PR:

• Supports adding & previewing a more generic archive_title token for custom Archive page titles.
• Hides the Date token button for Archives (but we still tokenize existing [date] usage).
• The Date button will only be replaced with the Archive Title button on Jetpack versions >= 10.2-alpha

Testing instructions

• See: SEO Tools: add archive_title page title token jetpack#20920

---

Screenshot for Translators:

[github-actions]

Link to Calypso live: https://calypso.live?image=registry.a8c.com/calypso/app:build-14596
Link to Jetpack Cloud live: https://calypso.live?image=registry.a8c.com/calypso/app:build-14596&env=jetpack

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

Sections (~10 bytes added 📈 [gzipped])

name          parsed_size           gzip_size
posts-custom        +33 B  (+0.0%)      +10 B  (+0.0%)
posts               +33 B  (+0.0%)      +10 B  (+0.0%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Async-loaded Components (~179 bytes added 📈 [gzipped])

name                                                         parsed_size           gzip_size
async-load-calypso-my-sites-site-settings-seo-settings-form       +700 B  (+0.2%)     +160 B  (+0.2%)
async-load-design-blocks                                           +33 B  (+0.0%)      +10 B  (+0.0%)
async-load-calypso-components-web-preview-component                +33 B  (+0.0%)       +9 B  (+0.0%)

React components that are loaded lazily, when a certain part of UI is displayed for the first time.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[samiff]

@jeherve Does the version check added in e4e21fa look ok?

[jeherve]

Does the version check added in e4e21fa look ok?

Yup. Although you could use the isJetpackMinimumVersion utility, to have less work to do?

wp-calypso/client/state/sites/selectors/is-jetpack-minimum-version.js

Lines 5 to 15 in 7655b6d

	/**
	* Returns true if the Jetpack site is running a version meeting the specified
	* minimum, or false if the Jetpack site is running an older version. Returns
	* null if the version cannot be determined or if not a Jetpack site.
	*
	* @param {object} state Global state tree
	* @param {number} siteId Site ID
	* @param {string} version Minimum version
	* @returns {?boolean} Whether running minimum version
	*/
	export default function isJetpackMinimumVersion( state, siteId, version ) {

[samiff]

Although you could use the isJetpackMinimumVersion utility, to have less work to do?

Thanks! Totally missed that one.

[a8ci18n]

This Pull Request is now available for translation here: https://translate.wordpress.com/deliverables/6581579

Thank you @samiff for including a screenshot in the description! This is really helpful for our translators.

[samiff]

@jeherve Small snag here, isJetpackMinimumVersion or fetching getSiteOption( state, siteId, 'jetpack_version' ) won't return truthy for a WPcom non-AT Business plan site which should have the SEO settings.

Would this work, or is there a better way?

	let shouldShowSeoArchiveTitleButton = false;
	if ( isJetpackMinimumVersion( state, siteId, '10.2-alpha' ) ) {
		shouldShowSeoArchiveTitleButton = true;
	} else if (
		! isJetpackSite( state, siteId ) &&
		hasActiveSiteFeature( state, siteId, FEATURE_ADVANCED_SEO )
	) {
		// For non-AT Business plan sites which get SEO features.
		shouldShowSeoArchiveTitleButton = true;
	}

[jeherve]

Yeah, that sounds good to me.

[a8ci18n]

Translation for this Pull Request has now been finished.