From a51751ccd2d2717059f403e8efcf8586369cd070 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Wed, 6 Jul 2016 11:16:35 +0200 Subject: [PATCH 01/16] Add guards to decodeEntieties so it is not called with undefined. --- client/my-sites/theme/controller.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/my-sites/theme/controller.jsx b/client/my-sites/theme/controller.jsx index 67de5b7661b24..13d4f65a1600b 100644 --- a/client/my-sites/theme/controller.jsx +++ b/client/my-sites/theme/controller.jsx @@ -88,8 +88,8 @@ export function details( context, next ) { const props = { themeSlug: slug, contentSection: context.params.section, - title: decodeEntities( title ) + ' — WordPress.com', // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 - description: decodeEntities( themeDetails.description ), + title: title ? decodeEntities( title ) + ' — WordPress.com' : '', // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 + description: themeDetails.description ? decodeEntities( themeDetails.description ) : '', canonicalUrl: `https://wordpress.com/theme/${ slug }`, // TODO: use getDetailsUrl() When it becomes availavle image: themeDetails.screenshot, isLoggedIn: !! user From 985df9592b17ed018acb7a1a00ddb5f527661783 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Tue, 26 Jul 2016 13:08:26 +0200 Subject: [PATCH 02/16] First draft for connected Head in main.jsx --- client/my-sites/theme/controller.jsx | 29 +--------------------- client/my-sites/theme/main.jsx | 36 +++++++++++++++++++++++----- 2 files changed, 31 insertions(+), 34 deletions(-) diff --git a/client/my-sites/theme/controller.jsx b/client/my-sites/theme/controller.jsx index 13d4f65a1600b..18b4d8e20131f 100644 --- a/client/my-sites/theme/controller.jsx +++ b/client/my-sites/theme/controller.jsx @@ -26,20 +26,6 @@ import { decodeEntities } from 'lib/formatting'; const debug = debugFactory( 'calypso:themes' ); let themeDetailsCache = new Map(); -export function makeElement( ThemesComponent, Head, store, props ) { - return ( - - - - ); -} - export function fetchThemeDetailsData( context, next ) { if ( ! config.isEnabled( 'manage/themes/details' ) || ! context.isServerSide ) { return next(); @@ -81,19 +67,6 @@ export function details( context, next ) { const title = i18n.translate( '%(themeName)s Theme', { args: { themeName } } ); - const Head = user - ? require( 'layout/head' ) - : require( 'my-sites/themes/head' ); - - const props = { - themeSlug: slug, - contentSection: context.params.section, - title: title ? decodeEntities( title ) + ' — WordPress.com' : '', // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 - description: themeDetails.description ? decodeEntities( themeDetails.description ) : '', - canonicalUrl: `https://wordpress.com/theme/${ slug }`, // TODO: use getDetailsUrl() When it becomes availavle - image: themeDetails.screenshot, - isLoggedIn: !! user - }; if ( startsWith( context.prevPath, '/design' ) ) { context.store.dispatch( setBackPath( context.prevPath ) ); @@ -105,7 +78,7 @@ export function details( context, next ) { ); - context.primary = makeElement( ConnectedComponent, Head, context.store, props ); + context.primary = ConnectedComponent( { themeSlug : slug, contentSection: context.params.section, isLoggedIn: !! user } ); context.secondary = null; // When we're logged in, we need to remove the sidebar. next(); } diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index f56382a54751b..096995564544a 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -384,16 +384,40 @@ const ThemeSheet = React.createClass( { } ); const WrappedThemeSheet = ( props ) => { + const Head = props.isLoggedIn + ? require( 'layout/head' ) + : require( 'my-sites/themes/head' ); + + let sheet; if ( ! props.isLoggedIn || props.selectedSite ) { - return ; + sheet = ; + } else { + sheet = ( + + + + ); } + const themeName = `${ props.name }s Theme`; + const title = themeName + ' — WordPress.com'; + + const canonicalUrl = `https://wordpress.com/theme/${ props.id }`; // TODO: use getDetailsUrl() When it becomes availavle + return ( - - - - ); + + { sheet } + + //sheet + ) + }; const bindDefaultOptionToDispatch = ( dispatch, ownProps ) => { From 1658c61409a8558860117c1c1919e60fdf3e0761 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Tue, 26 Jul 2016 16:11:18 +0200 Subject: [PATCH 03/16] Remove decodeEntietis from SSR check --- server/pragma-checker/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/server/pragma-checker/index.js b/server/pragma-checker/index.js index e5f6c60d7c7f5..c5e376690dda9 100644 --- a/server/pragma-checker/index.js +++ b/server/pragma-checker/index.js @@ -13,6 +13,7 @@ var SSR_READY = '/** @ssr-ready **/'; var IGNORED_MODULES = [ 'config', // Different modules on client & server 'lib/wp', // Different modules on client & server + 'lib/formatting', // Different modules on client & server 'lib/analytics', // nooped on the server until we develop an isomorphic version 'lib/route', // nooped on the server until we can extract the isomorphic bits 'lib/upgrades/actions', // nooped on the server as it still uses the singleton Flux architecture From a143269a4817a4270baacd85cccb5d79d4b67bf2 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Tue, 26 Jul 2016 16:12:18 +0200 Subject: [PATCH 04/16] Removing not used. --- client/my-sites/theme/controller.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/client/my-sites/theme/controller.jsx b/client/my-sites/theme/controller.jsx index 18b4d8e20131f..aaae1c5f9a265 100644 --- a/client/my-sites/theme/controller.jsx +++ b/client/my-sites/theme/controller.jsx @@ -21,7 +21,6 @@ import { } from 'state/themes/actions'; import wpcom from 'lib/wp'; import config from 'config'; -import { decodeEntities } from 'lib/formatting'; const debug = debugFactory( 'calypso:themes' ); let themeDetailsCache = new Map(); From e23beac12bd9984852bd113c973e93c27c710896 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Tue, 26 Jul 2016 16:17:47 +0200 Subject: [PATCH 05/16] Correct linter warning and removed unused elements. --- client/my-sites/theme/controller.jsx | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/client/my-sites/theme/controller.jsx b/client/my-sites/theme/controller.jsx index aaae1c5f9a265..66c570c05249e 100644 --- a/client/my-sites/theme/controller.jsx +++ b/client/my-sites/theme/controller.jsx @@ -2,10 +2,8 @@ * External Dependencies */ import React from 'react'; -import omit from 'lodash/omit'; import debugFactory from 'debug'; import startsWith from 'lodash/startsWith'; -import i18n from 'i18n-calypso'; /** * Internal Dependencies @@ -13,7 +11,6 @@ import i18n from 'i18n-calypso'; import ThemeSheetComponent from './main'; import ThemeDetailsComponent from 'components/data/theme-details'; import { getCurrentUser } from 'state/current-user/selectors'; -import { getThemeDetails } from 'state/themes/theme-details/selectors'; import { receiveThemeDetails, receiveThemeDetailsFailure, @@ -23,7 +20,7 @@ import wpcom from 'lib/wp'; import config from 'config'; const debug = debugFactory( 'calypso:themes' ); -let themeDetailsCache = new Map(); +const themeDetailsCache = new Map(); export function fetchThemeDetailsData( context, next ) { if ( ! config.isEnabled( 'manage/themes/details' ) || ! context.isServerSide ) { @@ -61,11 +58,6 @@ export function fetchThemeDetailsData( context, next ) { export function details( context, next ) { const { slug } = context.params; const user = getCurrentUser( context.store.getState() ); - const themeDetails = getThemeDetails( context.store.getState(), slug ) || false; - const themeName = themeDetails.name; - const title = i18n.translate( '%(themeName)s Theme', { - args: { themeName } - } ); if ( startsWith( context.prevPath, '/design' ) ) { context.store.dispatch( setBackPath( context.prevPath ) ); @@ -77,7 +69,7 @@ export function details( context, next ) { ); - context.primary = ConnectedComponent( { themeSlug : slug, contentSection: context.params.section, isLoggedIn: !! user } ); + context.primary = ConnectedComponent( { themeSlug: slug, contentSection: context.params.section, isLoggedIn: !! user } ); context.secondary = null; // When we're logged in, we need to remove the sidebar. next(); } From 7a3123689a62e14f890ca2fcdbdc4082ba19f4ed Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Tue, 26 Jul 2016 16:58:37 +0200 Subject: [PATCH 06/16] Move Head to proper place. --- client/my-sites/theme/main.jsx | 105 ++++++++++++++++----------------- 1 file changed, 51 insertions(+), 54 deletions(-) diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index 096995564544a..ab982f0d5ccaf 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -45,6 +45,7 @@ import { getBackPath } from 'state/themes/themes-ui/selectors'; import EmptyContentComponent from 'components/empty-content'; import ThemePreview from 'my-sites/themes/theme-preview'; import PageViewTracker from 'lib/analytics/page-view-tracker'; +import { decodeEntities } from 'lib/formatting'; const ThemeSheet = React.createClass( { displayName: 'ThemeSheet', @@ -345,33 +346,53 @@ const ThemeSheet = React.createClass( { const analyticsPath = `/theme/:slug${ section ? '/' + section : '' }${ siteID ? '/:site_id' : '' }`; const analyticsPageTitle = `Themes > Details Sheet${ section ? ' > ' + titlecase( section ) : '' }${ siteID ? ' > Site' : '' }`; + const Head = this.props.isLoggedIn + ? require( 'layout/head' ) + : require( 'my-sites/themes/head' ); + + const themeName = this.props.name ; + const title = i18n.translate( '%(themeName)s Theme', { + args: { themeName } + } ) + + const canonicalUrl = `https://wordpress.com/theme/${ this.props.id }`; // TODO: use getDetailsUrl() When it becomes availavle + return ( -
- - { this.renderBar() } - { siteID && } - - { this.state.showPreview && this.renderPreview() } - - { this.renderButton() } - -
-
-
- { this.renderSectionNav( section ) } - { this.renderSectionContent( section ) } -
+ + +
+ + { this.renderBar() } + { siteID && } + + { this.state.showPreview && this.renderPreview() } + + { this.renderButton() } + +
+
+
+ { this.renderSectionNav( section ) } + { this.renderSectionContent( section ) } +
+
+
+
+ { this.renderScreenshot() }
-
- { this.renderScreenshot() } -
-
-
+ + ); }, @@ -384,40 +405,16 @@ const ThemeSheet = React.createClass( { } ); const WrappedThemeSheet = ( props ) => { - const Head = props.isLoggedIn - ? require( 'layout/head' ) - : require( 'my-sites/themes/head' ); - - let sheet; if ( ! props.isLoggedIn || props.selectedSite ) { - sheet = ; - } else { - sheet = ( - - - - ); + return ; } - const themeName = `${ props.name }s Theme`; - const title = themeName + ' — WordPress.com'; - - const canonicalUrl = `https://wordpress.com/theme/${ props.id }`; // TODO: use getDetailsUrl() When it becomes availavle - return ( - - { sheet } - - //sheet - ) - + + + + ); }; const bindDefaultOptionToDispatch = ( dispatch, ownProps ) => { From 4d85fa019caec1a190c26a9540b4974791aa826e Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Tue, 26 Jul 2016 17:00:17 +0200 Subject: [PATCH 07/16] Linter warnings corrected. --- client/my-sites/theme/main.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index ab982f0d5ccaf..cfe38f75189a6 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -350,10 +350,10 @@ const ThemeSheet = React.createClass( { ? require( 'layout/head' ) : require( 'my-sites/themes/head' ); - const themeName = this.props.name ; + const themeName = this.props.name; const title = i18n.translate( '%(themeName)s Theme', { args: { themeName } - } ) + } ); const canonicalUrl = `https://wordpress.com/theme/${ this.props.id }`; // TODO: use getDetailsUrl() When it becomes availavle @@ -363,7 +363,7 @@ const ThemeSheet = React.createClass( { title= { decodeEntities( title || '' ) + ' — WordPress.com' } description={ decodeEntities( this.props.description || '' ) } type={ 'website' } - canonicalUrl={ canonicalUrl } + canonicalUrl={ canonicalUrl } image={ this.props.screenshot } tier={ this.props.tier || 'all' }>
From 803ae8f4efbbfeef6e6d43ba661881f746990056 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Fri, 29 Jul 2016 11:59:38 +0200 Subject: [PATCH 08/16] Move makeElement to place where it is used. --- client/my-sites/themes/controller.jsx | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/client/my-sites/themes/controller.jsx b/client/my-sites/themes/controller.jsx index 38d2f6930dbe6..8424d716efbe0 100644 --- a/client/my-sites/themes/controller.jsx +++ b/client/my-sites/themes/controller.jsx @@ -1,7 +1,9 @@ /** * External Dependencies */ +import React from 'react'; import i18n from 'i18n-calypso'; +import omit from 'lodash/omit'; /** * Internal Dependencies @@ -12,7 +14,20 @@ import LoggedOutComponent from './logged-out'; import trackScrollPage from 'lib/track-scroll-page'; import buildTitle from 'lib/screen-title/utils'; import { getAnalyticsData } from './helpers'; -import { makeElement } from 'my-sites/theme/controller'; + +function makeElement( ThemesComponent, Head, store, props ) { + return ( + + + + ); +} function getProps( context ) { const { tier, site_id: siteId } = context.params; From 0dae8b5ea86fde5956615766588d55e681dcd315 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Fri, 29 Jul 2016 14:24:19 +0200 Subject: [PATCH 09/16] Use Head from layout and add missing TODO --- client/my-sites/theme/main.jsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index cfe38f75189a6..ab32bb7193d77 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -45,6 +45,7 @@ import { getBackPath } from 'state/themes/themes-ui/selectors'; import EmptyContentComponent from 'components/empty-content'; import ThemePreview from 'my-sites/themes/theme-preview'; import PageViewTracker from 'lib/analytics/page-view-tracker'; +import Head from 'layout/head'; import { decodeEntities } from 'lib/formatting'; const ThemeSheet = React.createClass( { @@ -346,14 +347,10 @@ const ThemeSheet = React.createClass( { const analyticsPath = `/theme/:slug${ section ? '/' + section : '' }${ siteID ? '/:site_id' : '' }`; const analyticsPageTitle = `Themes > Details Sheet${ section ? ' > ' + titlecase( section ) : '' }${ siteID ? ' > Site' : '' }`; - const Head = this.props.isLoggedIn - ? require( 'layout/head' ) - : require( 'my-sites/themes/head' ); - const themeName = this.props.name; const title = i18n.translate( '%(themeName)s Theme', { args: { themeName } - } ); + } ); // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 const canonicalUrl = `https://wordpress.com/theme/${ this.props.id }`; // TODO: use getDetailsUrl() When it becomes availavle From 036411eb36b2fe5e2ebbe1d8dcf9bfd7e8dd63a4 Mon Sep 17 00:00:00 2001 From: Bartosz Budzanowski Date: Fri, 29 Jul 2016 22:45:38 +0200 Subject: [PATCH 10/16] Remove unnecessary prop and add default value for Header. --- client/layout/head/index.jsx | 2 ++ client/my-sites/theme/main.jsx | 3 +-- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/client/layout/head/index.jsx b/client/layout/head/index.jsx index 90020beb4d9c0..b6fec6b0a7745 100644 --- a/client/layout/head/index.jsx +++ b/client/layout/head/index.jsx @@ -38,4 +38,6 @@ Head.propTypes = { children: React.PropTypes.node, }; +Head.defaultProps = { site_name: 'WordPress.com' }; + export default Head; diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index ab32bb7193d77..0def001af6c95 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -361,8 +361,7 @@ const ThemeSheet = React.createClass( { description={ decodeEntities( this.props.description || '' ) } type={ 'website' } canonicalUrl={ canonicalUrl } - image={ this.props.screenshot } - tier={ this.props.tier || 'all' }> + image={ this.props.screenshot }>
{ this.renderBar() } From 7ba1648928c732546e7e51cbc7ede8e62cbc6e4b Mon Sep 17 00:00:00 2001 From: Bernhard Reiter Date: Mon, 1 Aug 2016 15:21:45 +0200 Subject: [PATCH 11/16] Themes: Pre-fill theme details on client side --- client/my-sites/theme/controller.jsx | 14 ++++++++++++-- client/my-sites/theme/main.jsx | 11 +++++------ 2 files changed, 17 insertions(+), 8 deletions(-) diff --git a/client/my-sites/theme/controller.jsx b/client/my-sites/theme/controller.jsx index 66c570c05249e..95601c6a1ac23 100644 --- a/client/my-sites/theme/controller.jsx +++ b/client/my-sites/theme/controller.jsx @@ -4,6 +4,7 @@ import React from 'react'; import debugFactory from 'debug'; import startsWith from 'lodash/startsWith'; +import isEmpty from 'lodash/isEmpty'; /** * Internal Dependencies @@ -16,6 +17,7 @@ import { receiveThemeDetailsFailure, setBackPath } from 'state/themes/actions'; +import { getThemeDetails } from 'state/themes/theme-details/selectors'; import wpcom from 'lib/wp'; import config from 'config'; @@ -23,12 +25,20 @@ const debug = debugFactory( 'calypso:themes' ); const themeDetailsCache = new Map(); export function fetchThemeDetailsData( context, next ) { - if ( ! config.isEnabled( 'manage/themes/details' ) || ! context.isServerSide ) { + if ( ! config.isEnabled( 'manage/themes/details' ) ) { return next(); } const themeSlug = context.params.slug; - const theme = themeDetailsCache.get( themeSlug ); + + // If theme details for the given slug are present in the Redux state, + // it has been filled earlier during this request, so we can re-use it. + let theme = getThemeDetails( context.store.getState(), themeSlug ); + if ( ! isEmpty( theme ) ) { + return next(); + } + + theme = themeDetailsCache.get( themeSlug ); const HOUR_IN_MS = 3600000; if ( theme && ( theme.timestamp + HOUR_IN_MS > Date.now() ) ) { diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index 0def001af6c95..130b82aa7dbf9 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -347,18 +347,17 @@ const ThemeSheet = React.createClass( { const analyticsPath = `/theme/:slug${ section ? '/' + section : '' }${ siteID ? '/:site_id' : '' }`; const analyticsPageTitle = `Themes > Details Sheet${ section ? ' > ' + titlecase( section ) : '' }${ siteID ? ' > Site' : '' }`; - const themeName = this.props.name; - const title = i18n.translate( '%(themeName)s Theme', { - args: { themeName } - } ); // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 + const title = decodeEntities( i18n.translate( '%(themeName)s Theme', { + args: { themeName: this.props.name } + } ) ) + ' — WordPress.com'; // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 const canonicalUrl = `https://wordpress.com/theme/${ this.props.id }`; // TODO: use getDetailsUrl() When it becomes availavle return ( From 61967f5e2a9005b7aec4a7ab85d75838d418d732 Mon Sep 17 00:00:00 2001 From: Bernhard Reiter Date: Fri, 15 Jul 2016 14:25:28 +0200 Subject: [PATCH 12/16] Head: CamelCase siteName --- client/layout/head/index.jsx | 4 ++-- client/my-sites/themes/head.jsx | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/client/layout/head/index.jsx b/client/layout/head/index.jsx index b6fec6b0a7745..ee6fa29cc720e 100644 --- a/client/layout/head/index.jsx +++ b/client/layout/head/index.jsx @@ -9,7 +9,7 @@ import debugFactory from 'debug'; const debug = debugFactory( 'calypso:layout:head' ); -const Head = ( { title, description, canonicalUrl, type, site_name, image, children } ) => ( +const Head = ( { title, description, canonicalUrl, type, siteName, image, children } ) => (
{ children } From 5c6956c466078f4125b75ac12bf3aea3e3eed956 Mon Sep 17 00:00:00 2001 From: Bernhard Reiter Date: Fri, 15 Jul 2016 14:26:50 +0200 Subject: [PATCH 13/16] Head: Add propTypes --- client/layout/head/index.jsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/client/layout/head/index.jsx b/client/layout/head/index.jsx index ee6fa29cc720e..158f01c45986e 100644 --- a/client/layout/head/index.jsx +++ b/client/layout/head/index.jsx @@ -35,6 +35,9 @@ Head.propTypes = { title: React.PropTypes.string, description: React.PropTypes.string, canonicalUrl: React.PropTypes.string, + type: React.PropTypes.string, + siteName: React.PropTypes.string, + image: React.PropTypes.string, children: React.PropTypes.node, }; From 715a8eb166aaefef385fdc723a1252c4555fc5d6 Mon Sep 17 00:00:00 2001 From: Bernhard Reiter Date: Mon, 1 Aug 2016 16:12:33 +0200 Subject: [PATCH 14/16] Revert "Themes: Pre-fill theme details on client side" This reverts commit 7ba1648928c732546e7e51cbc7ede8e62cbc6e4b. We don't really want to wait for data to be fetched before rendering. --- client/my-sites/theme/controller.jsx | 14 ++------------ client/my-sites/theme/main.jsx | 11 ++++++----- 2 files changed, 8 insertions(+), 17 deletions(-) diff --git a/client/my-sites/theme/controller.jsx b/client/my-sites/theme/controller.jsx index 95601c6a1ac23..66c570c05249e 100644 --- a/client/my-sites/theme/controller.jsx +++ b/client/my-sites/theme/controller.jsx @@ -4,7 +4,6 @@ import React from 'react'; import debugFactory from 'debug'; import startsWith from 'lodash/startsWith'; -import isEmpty from 'lodash/isEmpty'; /** * Internal Dependencies @@ -17,7 +16,6 @@ import { receiveThemeDetailsFailure, setBackPath } from 'state/themes/actions'; -import { getThemeDetails } from 'state/themes/theme-details/selectors'; import wpcom from 'lib/wp'; import config from 'config'; @@ -25,20 +23,12 @@ const debug = debugFactory( 'calypso:themes' ); const themeDetailsCache = new Map(); export function fetchThemeDetailsData( context, next ) { - if ( ! config.isEnabled( 'manage/themes/details' ) ) { + if ( ! config.isEnabled( 'manage/themes/details' ) || ! context.isServerSide ) { return next(); } const themeSlug = context.params.slug; - - // If theme details for the given slug are present in the Redux state, - // it has been filled earlier during this request, so we can re-use it. - let theme = getThemeDetails( context.store.getState(), themeSlug ); - if ( ! isEmpty( theme ) ) { - return next(); - } - - theme = themeDetailsCache.get( themeSlug ); + const theme = themeDetailsCache.get( themeSlug ); const HOUR_IN_MS = 3600000; if ( theme && ( theme.timestamp + HOUR_IN_MS > Date.now() ) ) { diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index 130b82aa7dbf9..0def001af6c95 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -347,17 +347,18 @@ const ThemeSheet = React.createClass( { const analyticsPath = `/theme/:slug${ section ? '/' + section : '' }${ siteID ? '/:site_id' : '' }`; const analyticsPageTitle = `Themes > Details Sheet${ section ? ' > ' + titlecase( section ) : '' }${ siteID ? ' > Site' : '' }`; - const title = decodeEntities( i18n.translate( '%(themeName)s Theme', { - args: { themeName: this.props.name } - } ) ) + ' — WordPress.com'; // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 + const themeName = this.props.name; + const title = i18n.translate( '%(themeName)s Theme', { + args: { themeName } + } ); // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 const canonicalUrl = `https://wordpress.com/theme/${ this.props.id }`; // TODO: use getDetailsUrl() When it becomes availavle return ( From 13c12859c2c3002e9df7393ac9e8c182d52408e8 Mon Sep 17 00:00:00 2001 From: Bernhard Reiter Date: Mon, 1 Aug 2016 16:20:31 +0200 Subject: [PATCH 15/16] Theme Sheet: Handle title and description fallbacks more gracefully --- client/my-sites/theme/main.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index 0def001af6c95..28bf7438bcbb2 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -347,7 +347,7 @@ const ThemeSheet = React.createClass( { const analyticsPath = `/theme/:slug${ section ? '/' + section : '' }${ siteID ? '/:site_id' : '' }`; const analyticsPageTitle = `Themes > Details Sheet${ section ? ' > ' + titlecase( section ) : '' }${ siteID ? ' > Site' : '' }`; - const themeName = this.props.name; + const { name: themeName, description } = this.props; const title = i18n.translate( '%(themeName)s Theme', { args: { themeName } } ); // TODO: Use lib/screen-title's buildTitle. Cf. https://github.com/Automattic/wp-calypso/issues/3796 @@ -357,8 +357,8 @@ const ThemeSheet = React.createClass( { return ( From ecc046a6493a16ed4da27cbff8b00a34b5e08935 Mon Sep 17 00:00:00 2001 From: Bernhard Reiter Date: Mon, 1 Aug 2016 16:29:51 +0200 Subject: [PATCH 16/16] Theme Sheet: Remove isRequired attr from defaultOption prop While it technically is required, this doesn't work with `ThemeMultiSiteSelector` (which clones its child element). --- client/my-sites/theme/main.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/my-sites/theme/main.jsx b/client/my-sites/theme/main.jsx index 28bf7438bcbb2..89621cec50db4 100644 --- a/client/my-sites/theme/main.jsx +++ b/client/my-sites/theme/main.jsx @@ -75,7 +75,7 @@ const ThemeSheet = React.createClass( { label: React.PropTypes.string.isRequired, action: React.PropTypes.func, getUrl: React.PropTypes.func, - } ).isRequired, + } ), secondaryOption: React.PropTypes.shape( { label: React.PropTypes.string.isRequired, action: React.PropTypes.func,