From b5eda1cdd262d238faf667f6d650226084ce8772 Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Tue, 7 Jun 2016 12:05:07 +0200 Subject: [PATCH] Inject isLoggedIn through withCurrentUser Makes checking for logged in status less error prone than always using `currentUser.email` or `currentUser.username`. --- js/components/ascribe_detail/edition.js | 42 ++++++++++++------- js/components/ascribe_detail/note.js | 21 +++++++--- .../ascribe_detail/piece_container.js | 14 +++---- .../form_copyright_association.js | 5 ++- .../ascribe_settings/settings_container.js | 10 ++--- js/components/header.js | 5 ++- js/components/header_notifications.js | 3 +- .../ascribe_detail/wallet_piece_container.js | 11 ++--- .../components/ikonotv/ikonotv_landing.js | 10 ++--- js/utils/react_utils.js | 7 ++-- 10 files changed, 76 insertions(+), 52 deletions(-) diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index e52434d8..2d7195c3 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -23,8 +23,6 @@ import Property from '../ascribe_forms/property'; import AclProxy from '../acl_proxy'; -import { currentUserShape } from '../prop_types'; - import ApiUrls from '../../constants/api_urls'; import AscribeSpinner from '../ascribe_spinner'; @@ -37,14 +35,16 @@ import { withCurrentUser } from '../../utils/react_utils'; */ const Edition = React.createClass({ propTypes: { - currentUser: currentUserShape.isRequired, edition: React.PropTypes.object.isRequired, whitelabel: React.PropTypes.object.isRequired, actionPanelButtonListType: React.PropTypes.func, coaError: React.PropTypes.object, furtherDetailsType: React.PropTypes.func, - loadEdition: React.PropTypes.func + loadEdition: React.PropTypes.func, + + // Injected through HOCs + isLoggedIn: React.PropTypes.bool.isRequired // eslint-disable-line react/sort-prop-types }, getDefaultProps() { @@ -54,13 +54,15 @@ const Edition = React.createClass({ }, render() { - const { actionPanelButtonListType, - coaError, - currentUser, - edition, - furtherDetailsType: FurtherDetailsType, - loadEdition, - whitelabel } = this.props; + const { + actionPanelButtonListType, + coaError, + edition, + isLoggedIn, + loadEdition, + whitelabel, + furtherDetailsType: FurtherDetailsType + } = this.props; return ( @@ -113,7 +115,7 @@ const Edition = React.createClass({ + show={!!(isLoggedIn || edition.acl.acl_edit || edition.public_note)}> {return {'bitcoin_id': edition.bitcoin_id}; }} label={getLangText('Personal note (private)')} @@ -154,12 +156,14 @@ const Edition = React.createClass({ let EditionSummary = withCurrentUser(React.createClass({ propTypes: { - currentUser: currentUserShape.isRequired, edition: React.PropTypes.object.isRequired, whitelabel: React.PropTypes.object.isRequired, actionPanelButtonListType: React.PropTypes.func, - handleSuccess: React.PropTypes.func + handleSuccess: React.PropTypes.func, + + // Injected through HOCs + isLoggedIn: React.PropTypes.bool.isRequired, // eslint-disable-line react/sort-prop-types }, getStatus() { @@ -173,7 +177,13 @@ let EditionSummary = withCurrentUser(React.createClass({ }, render() { - const { actionPanelButtonListType, currentUser, edition, handleSuccess, whitelabel } = this.props; + const { + actionPanelButtonListType, + edition, + handleSuccess, + isLoggedIn, + whitelabel + } = this.props; return (
@@ -197,7 +207,7 @@ let EditionSummary = withCurrentUser(React.createClass({ no more than 1 key, we're hiding the `DetailProperty` actions as otherwise `AclInformation` would show up */} - 1}> + 1}> diff --git a/js/components/ascribe_detail/note.js b/js/components/ascribe_detail/note.js index 2c3fe885..83d3a88f 100644 --- a/js/components/ascribe_detail/note.js +++ b/js/components/ascribe_detail/note.js @@ -9,14 +9,11 @@ import Form from '../ascribe_forms/form'; import Property from '../ascribe_forms/property'; import InputTextAreaToggable from '../ascribe_forms/input_textarea_toggable'; -import { currentUserShape } from '../prop_types'; - import { getLangText } from '../../utils/lang_utils'; import { withCurrentUser } from '../../utils/react_utils'; let Note = React.createClass({ propTypes: { - currentUser: currentUserShape.isRequired, id: React.PropTypes.func.isRequired, url: React.PropTypes.string.isRequired, @@ -25,7 +22,10 @@ let Note = React.createClass({ label: React.PropTypes.string, placeholder: React.PropTypes.string, show: React.PropTypes.bool, - successMessage: React.PropTypes.string + successMessage: React.PropTypes.string, + + // Injected through HOCs + isLoggedIn: React.PropTypes.bool.isRequired // eslint-disable-line react/sort-prop-types }, getDefaultProps() { @@ -43,9 +43,18 @@ let Note = React.createClass({ }, render() { - const { currentUser, defaultValue, editable, id, label, placeholder, show, url } = this.props; + const { + defaultValue, + editable, + id, + isLoggedIn, + label, + placeholder, + show, + url + } = this.props; - if ((currentUser.username && editable || !editable) && show) { + if ((isLoggedIn && editable || !editable) && show) { return (
0) { return ( @@ -224,7 +224,7 @@ const PieceContainer = React.createClass({ } else { return ( 1}> + show={isLoggedIn && Object.keys(piece.acl).length > 1}> {/* `acl_view` is always available in `edition.acl`, therefore if it has no more than 1 key, we're hiding the `DetailProperty` actions as otherwise @@ -260,7 +260,7 @@ const PieceContainer = React.createClass({ }, render() { - const { furtherDetailsType: FurtherDetailsType } = this.props; + const { isLoggedIn, furtherDetailsType: FurtherDetailsType } = this.props; const { piece } = this.state; if (piece.id) { @@ -299,7 +299,7 @@ const PieceContainer = React.createClass({ + show={!!(isLoggedIn || piece.acl.acl_edit || piece.public_note)}> + show={!!(isLoggedIn || piece.public_note)}> {return {'id': piece.id}; }} label={getLangText('Personal note (private)')} diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js index d85903df..8b12d9ad 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js @@ -6,8 +6,6 @@ import Button from 'react-bootstrap/lib/Button'; import LinkContainer from 'react-router-bootstrap/lib/LinkContainer'; -import { currentUserShape } from '../../../../prop_types'; - import { setDocumentTitle } from '../../../../../utils/dom_utils'; import { getLangText } from '../../../../../utils/lang_utils'; import { withCurrentUser } from '../../../../../utils/react_utils'; @@ -15,8 +13,10 @@ import { withCurrentUser } from '../../../../../utils/react_utils'; let IkonotvLanding = React.createClass({ propTypes: { + // Injected through HOCs + isLoggedIn: React.PropTypes.bool.isRequired, // eslint-disable-line react/sort-prop-types + // Provided from WalletApp - currentUser: currentUserShape.isRequired, whitelabel: React.PropTypes.object, // Provided from router @@ -24,10 +24,10 @@ let IkonotvLanding = React.createClass({ }, getEnterButton() { - const { currentUser, location } = this.props; + const { isLoggedIn, location } = this.props; let redirect = '/login'; - if (currentUser.email) { + if (isLoggedIn) { redirect = '/collection'; } else if (location.query.redirect) { redirect = '/' + location.query.redirect; diff --git a/js/utils/react_utils.js b/js/utils/react_utils.js index 58c52a8d..38a0d78a 100644 --- a/js/utils/react_utils.js +++ b/js/utils/react_utils.js @@ -12,9 +12,10 @@ export function getDisplayName(WrappedComponent) { /** * Similar to react-router's `withRouter`, this injects the `currentUser` from the Component's - * context into the Component as a prop. + * context into the Component as a prop. It also injects whether the user's logged in or not as + * `isLoggedIn`. * - * @param {Component} Component Component to inject `context.currentUser` into + * @param {Component} Component Component to inject `context.currentUser` and `isLoggedIn` into * @return {Component} Wrapped component */ export function withCurrentUser(Component) { @@ -23,7 +24,7 @@ export function withCurrentUser(Component) { }; const WithCurrentUser = (props, { currentUser }) => ( - + ); WithCurrentUser.displayName = `WithCurrentUser(${getDisplayName(Component)})`;