From 5138ea7bc18a4435c7a27e6190f016020b8dedeb Mon Sep 17 00:00:00 2001 From: Eric Binnion Date: Fri, 18 Dec 2015 13:00:40 -0600 Subject: [PATCH 1/6] Me: Use SitesDropdown instead of SelectSite in /me/account --- client/me/account/index.jsx | 19 +++++++++++-------- 1 file changed, 11 insertions(+), 8 deletions(-) diff --git a/client/me/account/index.jsx b/client/me/account/index.jsx index 06b10410a1f88..1e070be0412e4 100644 --- a/client/me/account/index.jsx +++ b/client/me/account/index.jsx @@ -18,7 +18,6 @@ import LanguageSelector from 'components/forms/language-selector'; import MeSidebarNavigation from 'me/sidebar-navigation'; import protectForm from 'lib/mixins/protect-form'; import formBase from 'me/form-base'; -import SelectSite from 'me/select-site'; import config from 'config'; import Card from 'components/card'; import FormTextInput from 'components/forms/form-text-input'; @@ -41,6 +40,7 @@ import observe from 'lib/mixins/data-observe'; import eventRecorder from 'me/event-recorder'; import Main from 'components/main'; import SectionHeader from 'components/section-header'; +import SitesDropdown from 'components/sites-dropdown'; import _sites from 'lib/sites-list'; import _user from 'lib/user'; @@ -210,6 +210,13 @@ module.exports = React.createClass( { } ); }, + onSiteSelect( siteSlug ) { + let selectedSite = sites.getSite( siteSlug ); + if ( sites.getSite( siteSlug ) ) { + this.props.userSettings.updateSetting( 'primary_site_ID', selectedSite.ID ); + } + }, + renderHolidaySnow() { // Note that years and months below are zero indexed const today = this.moment(); @@ -351,13 +358,9 @@ module.exports = React.createClass( { } return ( - + ); }, From 3cf4ad50a6c1452405d31345fb0bb7b9397b2377 Mon Sep 17 00:00:00 2001 From: Eric Binnion Date: Thu, 14 Jan 2016 14:59:19 -0600 Subject: [PATCH 2/6] Me: Set primary site for sites dropdown --- client/me/account/index.jsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/client/me/account/index.jsx b/client/me/account/index.jsx index 1e070be0412e4..76b9cc624a0c8 100644 --- a/client/me/account/index.jsx +++ b/client/me/account/index.jsx @@ -359,6 +359,8 @@ module.exports = React.createClass( { return ( ); From 59749fcd8b36c9f64d220a854c458ea6965008bf Mon Sep 17 00:00:00 2001 From: Eric Binnion Date: Thu, 14 Jan 2016 15:14:51 -0600 Subject: [PATCH 3/6] Framework: Adds placeholder prop to sites dropdown --- client/components/sites-dropdown/README.md | 1 + client/components/sites-dropdown/index.jsx | 23 ++++++++++++++-------- client/me/account/index.jsx | 5 ++++- 3 files changed, 20 insertions(+), 9 deletions(-) diff --git a/client/components/sites-dropdown/README.md b/client/components/sites-dropdown/README.md index e8e951d6a6c87..2316df9ba352f 100644 --- a/client/components/sites-dropdown/README.md +++ b/client/components/sites-dropdown/README.md @@ -25,5 +25,6 @@ render() { * `onClose` (`function`) — called on site selection * `onSiteSelect` (`function`) - called with the site `slug` on site selection * `filter` (`function`) - If present, passed to `sites.filter()` to display a subset of sites. Return `true` to display a site. +* `isPlaceholder` (`bool`) - `true` to display as a placeholder diff --git a/client/components/sites-dropdown/index.jsx b/client/components/sites-dropdown/index.jsx index bf7897b3f56c1..c0464a246070d 100644 --- a/client/components/sites-dropdown/index.jsx +++ b/client/components/sites-dropdown/index.jsx @@ -10,6 +10,7 @@ import noop from 'lodash/utility/noop'; * Internal dependencies */ import Site from 'my-sites/site'; +import SitePlaceholder from 'my-sites/site/placeholder'; import SiteSelector from 'components/site-selector'; import sitesList from 'lib/sites-list'; import Gridicon from 'components/gridicon'; @@ -30,14 +31,16 @@ export default React.createClass( { showAllSites: React.PropTypes.bool, onClose: React.PropTypes.func, onSiteSelect: React.PropTypes.func, - filter: React.PropTypes.func + filter: React.PropTypes.func, + isPlaceholder: React.PropTypes.bool }, getDefaultProps() { return { showAllSites: false, onClose: noop, - onSiteSelect: noop + onSiteSelect: noop, + isPlaceholder: false }; }, @@ -60,18 +63,22 @@ export default React.createClass( { } ); }, + toggleOpen() { + this.setState( { open: ! this.state.open } ); + }, + render() { return (
this.setState( { open: ! this.state.open } ) } - > - + onClick={ this.toggleOpen } > + { + this.props.isPlaceholder + ? + : + }
{ this.state.open && diff --git a/client/me/account/index.jsx b/client/me/account/index.jsx index 76b9cc624a0c8..21ff95e7770ba 100644 --- a/client/me/account/index.jsx +++ b/client/me/account/index.jsx @@ -357,9 +357,12 @@ module.exports = React.createClass( { ); } + let primarySiteId = this.props.userSettings.getSetting( 'primary_site_ID' ); + return ( From 917fd7862619a42628d269e54c43e2f3ea265d26 Mon Sep 17 00:00:00 2001 From: Eric Binnion Date: Thu, 14 Jan 2016 15:59:48 -0600 Subject: [PATCH 4/6] Framework: Fixes overlapping elements in sites dropdown --- client/components/sites-dropdown/style.scss | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/client/components/sites-dropdown/style.scss b/client/components/sites-dropdown/style.scss index 3f6a132c41b2e..4f17d5f3d6e91 100644 --- a/client/components/sites-dropdown/style.scss +++ b/client/components/sites-dropdown/style.scss @@ -7,10 +7,11 @@ } .gridicons-chevron-down { + align-self: center; color: lighten( $gray, 10% ); - position: absolute; - right: 16px; - top: 22px; + flex-grow: 0; + flex-shrink: 0; + margin-right: 16px; transition: transform 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275), color 0.2s ease-in; } } @@ -35,6 +36,7 @@ .sites-dropdown__selected { cursor: pointer; + display: flex; .is-open & { border-bottom: 1px solid lighten( $gray, 30% ); @@ -73,6 +75,8 @@ } .sites-dropdown .site-selector .site { + flex-grow: 1; + .notouch & { &:hover { background: $blue-medium; From a475546ca1cdf84e7369a438d120f8a4382ffe04 Mon Sep 17 00:00:00 2001 From: Eric Binnion Date: Thu, 14 Jan 2016 16:04:26 -0600 Subject: [PATCH 5/6] Me: Remove unused select-site component --- client/me/select-site.jsx | 37 ------------------------------------- 1 file changed, 37 deletions(-) delete mode 100644 client/me/select-site.jsx diff --git a/client/me/select-site.jsx b/client/me/select-site.jsx deleted file mode 100644 index bff601a1a7416..0000000000000 --- a/client/me/select-site.jsx +++ /dev/null @@ -1,37 +0,0 @@ -/** - * External dependencies - */ -var React = require( 'react' ), - omit = require( 'lodash/object/omit' ); - -/** - * Internal Dependencies - */ -var observe = require( 'lib/mixins/data-observe' ); - -module.exports = React.createClass( { - - displayName: 'SelectSite', - - mixins: [ observe( 'sites' ) ], - - render: function() { - var sites = this.props.sites.get(); - - if ( this.props.filter ) { - sites = sites.filter( this.props.filter ); - } - - return ( - - ); - } -} ); From 21572e976b09c38862bfdbe42c4d430bdd60b179 Mon Sep 17 00:00:00 2001 From: Eric Binnion Date: Fri, 15 Jan 2016 16:03:46 -0600 Subject: [PATCH 6/6] Me: Use selectedSite instead of retrieving site again --- client/me/account/index.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/me/account/index.jsx b/client/me/account/index.jsx index 21ff95e7770ba..fc0b3032248da 100644 --- a/client/me/account/index.jsx +++ b/client/me/account/index.jsx @@ -212,7 +212,7 @@ module.exports = React.createClass( { onSiteSelect( siteSlug ) { let selectedSite = sites.getSite( siteSlug ); - if ( sites.getSite( siteSlug ) ) { + if ( selectedSite ) { this.props.userSettings.updateSetting( 'primary_site_ID', selectedSite.ID ); } },