From 504f2cb26ec7c26c266edd1f3a0cf3f65c1e767a Mon Sep 17 00:00:00 2001 From: Jeremy Herve Date: Tue, 11 Dec 2018 19:22:13 +0100 Subject: [PATCH 1/4] Admin Page: new Performance tab. - See #10550 - Move existing cards over to a new "Performance" section. --- _inc/client/admin.js | 1 + .../components/navigation-settings/index.jsx | 231 +++++++++--------- .../components/non-admin-view/index.jsx | 1 + _inc/client/main.jsx | 2 + _inc/client/performance/index.jsx | 66 +++++ .../client/{writing => performance}/media.jsx | 0 .../{traffic => performance}/search.jsx | 0 .../speed-up-site.jsx | 0 _inc/client/settings/index.jsx | 53 ++-- _inc/client/traffic/index.jsx | 12 +- _inc/client/writing/index.jsx | 9 - 11 files changed, 214 insertions(+), 161 deletions(-) create mode 100644 _inc/client/performance/index.jsx rename _inc/client/{writing => performance}/media.jsx (100%) rename _inc/client/{traffic => performance}/search.jsx (100%) rename _inc/client/{writing => performance}/speed-up-site.jsx (100%) diff --git a/_inc/client/admin.js b/_inc/client/admin.js index b7d57040cf104..f0bcdf327bf6e 100644 --- a/_inc/client/admin.js +++ b/_inc/client/admin.js @@ -77,6 +77,7 @@ function render() { + diff --git a/_inc/client/components/navigation-settings/index.jsx b/_inc/client/components/navigation-settings/index.jsx index fe0a6fc09ded3..f07b08099ec79 100644 --- a/_inc/client/components/navigation-settings/index.jsx +++ b/_inc/client/components/navigation-settings/index.jsx @@ -1,6 +1,9 @@ /** * External dependencies + * + * @format */ + import PropTypes from 'prop-types'; import React from 'react'; import createReactClass from 'create-react-class'; @@ -18,14 +21,11 @@ import intersection from 'lodash/intersection'; /** * Internal dependencies */ -import { - filterSearch, - getSearchTerm -} from 'state/search'; +import { filterSearch, getSearchTerm } from 'state/search'; import { userCanManageModules as _userCanManageModules, userIsSubscriber as _userIsSubscriber, - userCanPublish + userCanPublish, } from 'state/initial-state'; import { isSiteConnected, isCurrentUserLinked } from 'state/connection'; import { isModuleActivated, getModules } from 'state/modules'; @@ -81,11 +81,11 @@ export const NavigationSettings = createReactClass( { trackNavClick( target ) { analytics.tracks.recordJetpackClick( { target: 'nav_item', - path: target + path: target, } ); }, - /** + /** * The UrlSearch mixin callback to form a new location href string. * * @param {string} href the current location string @@ -100,7 +100,7 @@ export const NavigationSettings = createReactClass( { return '#' + splitHash[ 0 ] + ( keyword ? '?term=' + keyword : '' ); }, - /** + /** * Check that the module list includes at least one of these modules. * * @param {array} modules Modules that are probably included in the module list. @@ -120,87 +120,93 @@ export const NavigationSettings = createReactClass( { if ( this.props.userCanManageModules ) { navItems = ( - { - this.hasAnyOfThese( [ - 'masterbar', - 'markdown', - 'after-the-deadline', - 'custom-content-types', - 'photon', - 'carousel', - 'post-by-email', - 'infinite-scroll', - 'minileven' - ] ) && ( - - { __( 'Writing', { context: 'Navigation item.' } ) } - - ) - } - { - this.hasAnyOfThese( [ - 'publicize', - 'sharedaddy', - 'likes' - ] ) && ( - - { __( 'Sharing', { context: 'Navigation item.' } ) } - - ) - } - { - this.hasAnyOfThese( [ - 'comments', - 'gravatar-hovercards', - 'markdown', - 'subscriptions' - ] ) && ( - - { __( 'Discussion', { context: 'Navigation item.' } ) } - - ) - } - { - this.hasAnyOfThese( [ - 'seo-tools', - 'wordads', - 'stats', - 'related-posts', - 'verification-tools', - 'sitemaps', - 'google-analytics' - ] ) && ( - - { __( 'Traffic', { context: 'Navigation item.' } ) } - - ) - } - { - ( this.hasAnyOfThese( [ - 'protect', - 'sso', - 'vaultpress' - ] ) || this.props.isPluginActive( 'akismet/akismet.php' ) ) && ( - - { __( 'Security', { context: 'Navigation item.' } ) } - - ) - } + { this.hasAnyOfThese( [ + 'masterbar', + 'markdown', + 'after-the-deadline', + 'custom-content-types', + 'post-by-email', + 'infinite-scroll', + 'minileven', + ] ) && ( + + { __( 'Writing', { context: 'Navigation item.' } ) } + + ) } + { this.hasAnyOfThese( [ 'publicize', 'sharedaddy', 'likes' ] ) && ( + + { __( 'Sharing', { context: 'Navigation item.' } ) } + + ) } + { this.hasAnyOfThese( [ + 'comments', + 'gravatar-hovercards', + 'markdown', + 'subscriptions', + ] ) && ( + + { __( 'Discussion', { context: 'Navigation item.' } ) } + + ) } + { this.hasAnyOfThese( [ + 'carousel', + 'lazy-images', + 'photon', + 'photon-cdn', + 'search', + 'videopress' + ] ) && ( + + { __( 'Performance', { context: 'Navigation item.' } ) } + + ) } + { this.hasAnyOfThese( [ + 'seo-tools', + 'wordads', + 'stats', + 'related-posts', + 'verification-tools', + 'sitemaps', + 'google-analytics', + ] ) && ( + + { __( 'Traffic', { context: 'Navigation item.' } ) } + + ) } + { ( this.hasAnyOfThese( [ 'protect', 'sso', 'vaultpress' ] ) || + this.props.isPluginActive( 'akismet/akismet.php' ) ) && ( + + { __( 'Security', { context: 'Navigation item.' } ) } + + ) } ); } else if ( this.props.isSubscriber ) { @@ -209,32 +215,29 @@ export const NavigationSettings = createReactClass( { if ( ! this.props.isModuleActivated( 'publicize' ) || ! this.props.userCanPublish ) { sharingTab = ''; } else { - sharingTab = this.hasAnyOfThese( [ - 'publicize' - ] ) && ( + sharingTab = this.hasAnyOfThese( [ 'publicize' ] ) && ( + selected={ this.props.route.path === '/sharing' } + > { __( 'Sharing', { context: 'Navigation item.' } ) } ); } navItems = ( - { - this.hasAnyOfThese( [ - 'after-the-deadline', - 'post-by-email' - ] ) && ( - - { __( 'Writing', { context: 'Navigation item.' } ) } - - ) - } + { this.hasAnyOfThese( [ 'after-the-deadline', 'post-by-email' ] ) && ( + + { __( 'Writing', { context: 'Navigation item.' } ) } + + ) } { // Give only Publicize to non admin users sharingTab @@ -252,11 +255,11 @@ export const NavigationSettings = createReactClass( { ); - } + }, } ); NavigationSettings.contextTypes = { - router: PropTypes.object.isRequired + router: PropTypes.object.isRequired, }; NavigationSettings.propTypes = { @@ -266,7 +269,7 @@ NavigationSettings.propTypes = { isLinked: PropTypes.bool.isRequired, isSiteConnected: PropTypes.bool.isRequired, isModuleActivated: PropTypes.func.isRequired, - searchHasFocus: PropTypes.bool.isRequired + searchHasFocus: PropTypes.bool.isRequired, }; NavigationSettings.defaultProps = { @@ -276,11 +279,11 @@ NavigationSettings.defaultProps = { isLinked: false, isSiteConnected: false, isModuleActivated: noop, - searchHasFocus: false + searchHasFocus: false, }; export default connect( - ( state ) => { + state => { return { userCanManageModules: _userCanManageModules( state ), isSubscriber: _userIsSubscriber( state ), @@ -290,12 +293,12 @@ export default connect( isModuleActivated: module => isModuleActivated( state, module ), moduleList: getModules( state ), isPluginActive: plugin_slug => isPluginActive( state, plugin_slug ), - searchTerm: getSearchTerm( state ) + searchTerm: getSearchTerm( state ), }; }, - ( dispatch ) => { + dispatch => { return { - searchForTerm: ( term ) => dispatch( filterSearch( term ) ) + searchForTerm: term => dispatch( filterSearch( term ) ), }; } )( NavigationSettings ); diff --git a/_inc/client/components/non-admin-view/index.jsx b/_inc/client/components/non-admin-view/index.jsx index 413fb3c7a90b8..103492b32fd4d 100644 --- a/_inc/client/components/non-admin-view/index.jsx +++ b/_inc/client/components/non-admin-view/index.jsx @@ -36,6 +36,7 @@ class NonAdminView extends React.Component { case '/settings': case '/writing': case '/sharing': + case '/performance': if ( ! this.props.isSubscriber ) { navComponent = ; pageComponent = + + + + + + ); + } +} + +export default connect( state => { + return { + module: module_name => getModule( state, module_name ), + isUnavailableInDevMode: module_name => isUnavailableInDevMode( state, module_name ), + isModuleFound: module_name => isModuleFound( state, module_name ), + getModuleOverride: module_name => getModuleOverride( state, module_name ), + }; +} )( Performance ); diff --git a/_inc/client/writing/media.jsx b/_inc/client/performance/media.jsx similarity index 100% rename from _inc/client/writing/media.jsx rename to _inc/client/performance/media.jsx diff --git a/_inc/client/traffic/search.jsx b/_inc/client/performance/search.jsx similarity index 100% rename from _inc/client/traffic/search.jsx rename to _inc/client/performance/search.jsx diff --git a/_inc/client/writing/speed-up-site.jsx b/_inc/client/performance/speed-up-site.jsx similarity index 100% rename from _inc/client/writing/speed-up-site.jsx rename to _inc/client/performance/speed-up-site.jsx diff --git a/_inc/client/settings/index.jsx b/_inc/client/settings/index.jsx index a7f6896b5920f..a5db338ec9417 100644 --- a/_inc/client/settings/index.jsx +++ b/_inc/client/settings/index.jsx @@ -1,6 +1,9 @@ /** * External dependencies + * + * @format */ + import React from 'react'; import { translate as __ } from 'i18n-calypso'; @@ -8,12 +11,14 @@ import { translate as __ } from 'i18n-calypso'; * Internal dependencies */ import Discussion from 'discussion'; -import Security from 'security'; +import Performance from 'performance'; +import Security from 'security/index.jsx'; +import Sharing from 'sharing/index.jsx'; import Traffic from 'traffic'; -import Writing from 'writing'; -import Sharing from 'sharing'; -import SearchableModules from 'searchable-modules'; -import Privacy from 'privacy'; +import Writing from 'writing/index.jsx'; + +import SearchableModules from 'searchable-modules/index.jsx'; +import Privacy from 'privacy/index.jsx'; export default class extends React.Component { static displayName = 'SearchableSettings'; @@ -29,51 +34,45 @@ export default class extends React.Component {
{ commonProps.searchTerm - ? __( - 'No search results found for %(term)s', - { - args: { - term: commonProps.searchTerm - } - } - ) - : __( 'Enter a search term to find settings or close search.' ) - } + ? __( 'No search results found for %(term)s', { + args: { + term: commonProps.searchTerm, + }, + } ) + : __( 'Enter a search term to find settings or close search.' ) }
+ - +
); diff --git a/_inc/client/traffic/index.jsx b/_inc/client/traffic/index.jsx index d92ab2a77f146..bd63480594bd3 100644 --- a/_inc/client/traffic/index.jsx +++ b/_inc/client/traffic/index.jsx @@ -19,7 +19,6 @@ import { GoogleAnalytics } from './google-analytics'; import { Ads } from './ads'; import { SiteStats } from './site-stats'; import { RelatedPosts } from './related-posts'; -import Search from './search'; import { VerificationServices } from './verification-services'; import Sitemaps from './sitemaps'; import { getLastPostUrl } from 'state/initial-state'; @@ -43,7 +42,6 @@ export class Traffic extends React.Component { foundRelated = this.props.isModuleFound( 'related-posts' ), foundVerification = this.props.isModuleFound( 'verification-tools' ), foundSitemaps = this.props.isModuleFound( 'sitemaps' ), - foundSearch = this.props.isModuleFound( 'search' ), foundAnalytics = this.props.isModuleFound( 'google-analytics' ); if ( ! this.props.searchTerm && ! this.props.active ) { @@ -57,8 +55,7 @@ export class Traffic extends React.Component { ! foundRelated && ! foundVerification && ! foundSitemaps && - ! foundAnalytics && - ! foundSearch + ! foundAnalytics ) { return null; } @@ -72,13 +69,6 @@ export class Traffic extends React.Component { className="jp-settings-description" /> - { - foundSearch && ( - - ) - } { foundAds && ( ) } - - { this.props.isModuleFound( 'custom-content-types' ) && ( From 1ef419ae6e56729037a3bc342a89334081979313 Mon Sep 17 00:00:00 2001 From: Filipe Varela Date: Thu, 13 Dec 2018 09:43:40 +0000 Subject: [PATCH 2/4] Add settings description See: https://github.com/Automattic/jetpack/pull/10940/ --- _inc/client/performance/index.jsx | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/_inc/client/performance/index.jsx b/_inc/client/performance/index.jsx index 81231ef4c8e87..74db647bfba01 100644 --- a/_inc/client/performance/index.jsx +++ b/_inc/client/performance/index.jsx @@ -6,6 +6,7 @@ import React, { Component } from 'react'; import { connect } from 'react-redux'; +import { translate as __ } from 'i18n-calypso'; /** * Internal dependencies @@ -14,6 +15,7 @@ import { getModule } from 'state/modules'; import { isUnavailableInDevMode } from 'state/connection'; import { getModuleOverride } from 'state/modules'; import { isModuleFound } from 'state/search'; +import Card from 'components/card'; import QuerySite from 'components/data/query-site'; import Media from './media'; import Search from './search'; @@ -48,6 +50,12 @@ class Performance extends Component { return (
+ + + From a68d015f09cd56a2c770def8b0f7f7580c8cc1ca Mon Sep 17 00:00:00 2001 From: Jeremy Herve Date: Tue, 18 Dec 2018 12:20:04 +0100 Subject: [PATCH 3/4] Fix imports --- _inc/client/settings/index.jsx | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/_inc/client/settings/index.jsx b/_inc/client/settings/index.jsx index a5db338ec9417..3ba93eb948373 100644 --- a/_inc/client/settings/index.jsx +++ b/_inc/client/settings/index.jsx @@ -12,13 +12,12 @@ import { translate as __ } from 'i18n-calypso'; */ import Discussion from 'discussion'; import Performance from 'performance'; -import Security from 'security/index.jsx'; -import Sharing from 'sharing/index.jsx'; +import Privacy from 'privacy'; +import SearchableModules from 'searchable-modules'; +import Security from 'security'; +import Sharing from 'sharing'; import Traffic from 'traffic'; -import Writing from 'writing/index.jsx'; - -import SearchableModules from 'searchable-modules/index.jsx'; -import Privacy from 'privacy/index.jsx'; +import Writing from 'writing'; export default class extends React.Component { static displayName = 'SearchableSettings'; @@ -46,10 +45,7 @@ export default class extends React.Component { active={ '/discussion' === this.props.route.path } { ...commonProps } /> - + Date: Tue, 18 Dec 2018 13:20:42 +0100 Subject: [PATCH 4/4] Make the new Performance tab the default tab in Jetpack settings --- .../components/navigation-settings/index.jsx | 40 +++++++++---------- _inc/client/settings/index.jsx | 7 +++- 2 files changed, 24 insertions(+), 23 deletions(-) diff --git a/_inc/client/components/navigation-settings/index.jsx b/_inc/client/components/navigation-settings/index.jsx index f07b08099ec79..dba4434f14b71 100644 --- a/_inc/client/components/navigation-settings/index.jsx +++ b/_inc/client/components/navigation-settings/index.jsx @@ -120,6 +120,24 @@ export const NavigationSettings = createReactClass( { if ( this.props.userCanManageModules ) { navItems = ( + { this.hasAnyOfThese( [ + 'carousel', + 'lazy-images', + 'photon', + 'photon-cdn', + 'search', + 'videopress', + ] ) && ( + + { __( 'Performance', { context: 'Navigation item.' } ) } + + ) } { this.hasAnyOfThese( [ 'masterbar', 'markdown', @@ -132,9 +150,7 @@ export const NavigationSettings = createReactClass( { { __( 'Writing', { context: 'Navigation item.' } ) } @@ -162,24 +178,6 @@ export const NavigationSettings = createReactClass( { { __( 'Discussion', { context: 'Navigation item.' } ) } ) } - { this.hasAnyOfThese( [ - 'carousel', - 'lazy-images', - 'photon', - 'photon-cdn', - 'search', - 'videopress' - ] ) && ( - - { __( 'Performance', { context: 'Navigation item.' } ) } - - ) } { this.hasAnyOfThese( [ 'seo-tools', 'wordads', diff --git a/_inc/client/settings/index.jsx b/_inc/client/settings/index.jsx index 3ba93eb948373..a4a8b27edd18c 100644 --- a/_inc/client/settings/index.jsx +++ b/_inc/client/settings/index.jsx @@ -45,7 +45,10 @@ export default class extends React.Component { active={ '/discussion' === this.props.route.path } { ...commonProps } /> - +